@use 'sass:map';
@use '../../scss/theming' as *;
@use '../../scss/core';

// stylelint-disable selector-class-pattern
@mixin daff-select-theme($theme) {
	$base: daff-get-base-color($theme, base);
	$base-contrast: daff-get-base-color($theme, base-contrast);
	$neutral: daff-get-palette($theme, neutral);
	$mode: daff-get-theme-mode($theme);
	$border-color-light: daff-color($neutral, 30);
	$border-color-dark: daff-color($neutral, 70);

	.daff-select {
		$root: '.daff-select';

		@include light($mode) {
			&.disabled {
				#{$root}__field {
					color: daff-color($neutral, 50);
				}
			}

			&__option {
				background-color: $base;
				border-bottom: 1px solid $border-color-light;
				border-left: 1px solid $border-color-light;
				border-right: 1px solid $border-color-light;
				color: $base-contrast;

				&:first-of-type {
					border-top: 1px solid $border-color-light;
				}

				@media (hover: hover) {
					&:hover {
						background-color: daff-color($neutral, 10);
					}
				}

				&.highlighted {
					background-color: daff-color($neutral, 10);
				}
			}
		}

		@include dark($mode) {
			&.disabled {
				#{$root}__field {
					color: daff-color($neutral, 70);
				}
			}

			&__option {
				background-color: $base;
				border-bottom: 1px solid $border-color-dark;
				border-left: 1px solid $border-color-dark;
				border-right: 1px solid $border-color-dark;
				color: $base-contrast;

				&:first-of-type {
					border-top: 1px solid $border-color-dark;
				}

				@media (hover: hover) {
					background-color: daff-color($neutral, 90);
				}

				&.highlighted {
					background-color: daff-color($neutral, 90);
				}
			}
		}

		&__field {
			color: $base-contrast;

			&::after {
				border-color: daff-color($neutral);
			}
		}
	}
}