@use '@angular/material' as mat;
@use 'sass:map';
@use 'sass:meta';

@mixin color($theme, $options...) {
	bui-selection-panel-item {
		$option-map: meta.keywords($options);
		$color-variant: map.get($option-map, color-variant);

		border-color: mat.get-theme-color($theme, outline-variant);

		.bui-selection-checkbox {
			@if $color-variant {
				@include mat.checkbox-color($theme, $color-variant: $color-variant);
			}
		}

		&.bui-selection-checked,
		&.bui-selection-checked:not(.bui-disabled:hover, .bui-unselectable) {
			border-color: mat.get-theme-color($theme, $color-variant or primary);
		}

		&:not(.bui-disabled, .bui-unselectable) {
			&:hover {
				border-color: mat.get-theme-color($theme, outline);
			}
		}
	}
}

@mixin theme($theme, $options...) {
	@include color($theme, $options...);
}
