/*
 * Copyright (c) 2026, Salesforce, Inc.,
 * All rights reserved.
 * For full license text, see the LICENSE.txt file
 */

/*! Lightning Design System 2.23.0-alpha.1 */

.slds-select {
  height: calc(1.875rem + (1px * 2));
  width: 100%;
  border: var(--slds-s-input-sizing-border, var(--slds-g-sizing-border-1)) solid
    var(--slds-c-select-color-border, var(--slds-s-input-color-border, var(--slds-g-color-border-1)));
  border-radius: var(
    --slds-c-select-radius-border,
    var(--slds-s-input-radius-border, var(--slds-g-radius-border-2))
  );
  background-color: var(
    --slds-c-select-color-background,
    var(--slds-s-input-color-background, var(--slds-g-color-surface-container-1))
  );
  color: var(--slds-c-select-text-color, var(--slds-s-input-color));
  box-shadow: var(--slds-c-select-shadow, var(--slds-s-input-shadow));
  transition: background-color 0.1s linear;
}

.slds-select:required {
  box-shadow: none;
}

.slds-select:focus-visible {
  border-color: var(--slds-c-select-color-border-focus, transparent);
  background-color: var(--slds-c-select-color-background-focus, var(--slds-g-color-surface-container-1));
  color: var(--slds-s-input-color-focus, var(--slds-c-select-text-color-focus));
  outline: 0;
  box-shadow: var(--slds-g-shadow-outline-focus-1);
}

.slds-select[disabled],
.slds-select.slds-is-disabled {
  background-color: var(--slds-g-color-disabled-container-1);
  border-color: var(--slds-g-color-border-disabled-1);
  color: var(--slds-g-color-on-disabled-1);
  cursor: not-allowed;
  user-select: none;
  opacity: 1;
}

.slds-select[disabled]:focus,
.slds-select[disabled]:active,
.slds-select.slds-is-disabled:focus,
.slds-select.slds-is-disabled:active {
  box-shadow: none;
}

.slds-select[size],
.slds-select[multiple] {
  appearance: base-select;
  min-height: calc(1.875rem + (1px * 2));
  height: inherit;
}

.slds-select[size] option,
.slds-select[multiple] option {
  padding: var(--slds-g-spacing-2);
  color: var(--slds-g-color-on-surface-3);
}

.slds-select[size] option:hover,
.slds-select[multiple] option:hover {
  background: var(--slds-s-menu-item-color-background-active, var(--slds-g-color-surface-container-2));
}

.slds-select_container {
  position: relative;
  color: var(--slds-c-select-text-color, var(--slds-s-input-color));
}

.slds-select_container .slds-select {
  appearance: none;
  padding-inline-start: var(--slds-s-input-spacing, var(--slds-g-spacing-2));
  padding-inline-end: var(--slds-s-input-spacing, var(--slds-g-spacing-5));
}

.slds-select_container::before,
.slds-select_container::after {
  position: absolute;
  content: '';
  display: block;
  inset-inline-end: var(--slds-g-spacing-2);
  width: 0;
  height: 0;
  border-inline-start: var(--slds-g-sizing-border-3) solid transparent;
  border-inline-end: var(--slds-g-sizing-border-3) solid transparent;
  pointer-events: none;
}

.slds-select_container::before {
  border-block-end: 5px solid currentColor;
  inset-block-start: calc((var(--slds-g-sizing-8) / 2) - 6px);
}

.slds-select_container::after {
  border-block-start: 5px solid currentColor;
  inset-block-end: calc((var(--slds-g-sizing-8) / 2) - 6px);
}

.slds-has-error .slds-select {
  border-color: var(--slds-s-input-color-border-invalid, var(--slds-g-color-error-1));
  box-shadow: var(--slds-s-input-shadow-invalid, var(--slds-g-color-error-1) 0 0 0 1px inset);
  background-clip: padding-box;
  background-color: var(--slds-s-input-color-background-invalid);
  color: var(--slds-s-input-color-invalid);
}

.slds-has-error .slds-select:focus-visible,
.slds-has-error .slds-select:active {
  box-shadow:
    var(--slds-g-color-error-1) 0 0 0 1px inset,
    0 0 3px var(--slds-g-color-border-accent-2);
  box-shadow: var(--slds-g-shadow-outline-focus-1);
  border-color: transparent;
}