/* stylelint-disable selector-no-qualifying-type */

$select-color: $text !default;
$select-background-color: $body-background !default;
$select-border-color: $control-border !default;
$select-border-bottom-color: $control-border-bottom !default;
$select-placeholder-color: $text-subtle !default;

$select-hover-color: $text !default;
$select-hover-border-color: $default-hover !default;
$select-focus-border-color: $primary !default;

$select-disabled-color: $text-subtle !default;
$select-disabled-background-color: $body-background-medium !default;
$select-disabled-border-color: $table-border-dark !default;

$select-danger-border-color: $danger !default;
$select-success-border-color: $success !default;

$select-focus-box-shadow-size: 0 0.0625rem 0 0 !default;

.select {
	position: relative;
	font-size: $control-font-size;

	select {
		@include control;

		width: 100%;
		max-width: 100%;
		border-color: $select-border-color;
		border-block-end-color: $select-border-bottom-color;
		background-color: $select-background-color;
		color: $select-color;
		font-size: 1em;
		cursor: pointer;

		&[multiple] {
			padding: 0;
			overflow-y: auto;

			option {
				padding: $control-padding-vertical $control-padding-horizontal;
			}
		}

		&:hover {
			border-color: $select-hover-border-color;
			border-block-end-color: $select-border-bottom-color;
		}

		&[disabled] {
			border-color: $select-disabled-border-color;
			background-color: $select-disabled-background-color;
			color: $select-disabled-color;
		}

		@include focus-visible {
			@extend %focus;

			border-block-end-color: $select-focus-border-color;
			outline-color: transparent;
			outline-offset: 0;
			outline-style: solid;
			box-shadow: $select-focus-box-shadow-size $select-focus-border-color;
		}
	}

	&:not(.select-multiple) {
		select {
			padding-inline-end: calc($control-padding-horizontal + $chevron-arrow-actual-width);
		}

		&::after {
			@include chevron-down;

			display: block;
			position: absolute;
			inset-block-start: calc(50% - $chevron-arrow-actual-width / 2);
		}

		&.select-disabled::after {
			border-color: $select-disabled-border-color;
		}
	}

	&.select-sm {
		font-size: $control-sm-font-size;
	}

	&.select-lg {
		font-size: $control-lg-font-size;
	}

	&.select-danger select {
		border-color: $select-danger-border-color;

		@include focus-visible() {
			border-color: $select-border-color;
			border-block-end-color: $select-danger-border-color;
			box-shadow: $select-focus-box-shadow-size $select-danger-border-color;
		}
	}

	&.select-success select {
		border-color: $select-success-border-color;

		@include focus-visible() {
			border-color: $select-border-color;
			border-block-end-color: $select-success-border-color;
			box-shadow: $select-focus-box-shadow-size $select-success-border-color;
		}
	}
}