/* stylelint-disable selector-no-qualifying-type */
@use '@talend/design-tokens/lib/tokens' as tokens;

select.form-control {
	border-color: tokens.$coral-color-neutral-border;
	overflow: auto;
	cursor: pointer;
	border-radius: $input-border-radius;

	&[multiple] {
		padding-top: $padding-small;
		padding-bottom: $padding-small;
	}

	&:hover {
		&:not(:disabled) {
			border: 1px solid tokens.$coral-color-neutral-border;
		}
	}

	&:not([multiple]) {
		appearance: none;
		background-color: tokens.$coral-color-neutral-background;
		background-repeat: no-repeat;
		background-size: $svg-xs-size;
		background-position-x: calc(100% - 0.625rem);
		background-position-y: center;
		background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Cpath d='M8 13.6l-8-8L2.6 3 8 8.4 13.4 3 16 5.6z'%3E%3C/path%3E%3C/svg%3E");

		&:disabled {
			border: 1px solid tokens.$coral-color-neutral-border;
			opacity: 0.54;
			cursor: not-allowed;
		}
	}
}