@use 'sass:map';
@use 'sass:string';
@use '../base/maps/tokens' as *;

@each $device-key, $device-map in $brandui-device-breakpoints-new {
	$device-value: map.get($device-map, 'value');
	$device-prefix: map.get($device-map, 'prefix');

	@media (max-width: string.unquote('#{$device-value}px')) {
		// Device Breakpoints Start

		.#{$device-prefix}pointer-events-none {
			pointer-events: none;
		}

		.#{$device-prefix}pointer-events-initial {
			pointer-events: initial;
		}

		.#{$device-prefix}cursor-pointer {
			cursor: pointer;
		}

		.#{$device-prefix}cursor-default {
			cursor: default;
		}

		.#{$device-prefix}cursor-not-allowed {
			cursor: not-allowed;
		}

		.#{$device-prefix}cursor-initial {
			cursor: initial;
		}

		.#{$device-prefix}no-scrollbar {
			scrollbar-width: none;

			&::-webkit-scrollbar {
				display: none;
			}
		}

		.#{$device-prefix}overscroll-contain {
			overscroll-behavior: contain;
		}

		// Device Breakpoints End
	}
}