/*
 * Unified dropdown affordance for OMS form controls.
 * The visual baseline is the existing personnel/customer searchable combobox.
 */

:root {
  --oms-dropdown-arrow-width: 35px;
}

/* Native single-value selects use the same boxed arrow area as searchable comboboxes. */
select:not([multiple]):not([size]),
select[size="1"]:not([multiple]) {
  -webkit-appearance: none !important;
  appearance: none !important;
  padding-right: calc(var(--oms-dropdown-arrow-width) + 10px) !important;
  background-image:
    url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='18' height='18' viewBox='0 0 18 18'%3E%3Cpath d='M4 6.5 9 11.5 14 6.5' fill='none' stroke='%2366758d' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E"),
    linear-gradient(var(--border, #dfe7f2), var(--border, #dfe7f2)),
    linear-gradient(var(--card-soft, #f8fbff), var(--card-soft, #f8fbff)) !important;
  background-position:
    right 8px center,
    right var(--oms-dropdown-arrow-width) center,
    right top !important;
  background-size:
    18px 18px,
    1px 100%,
    var(--oms-dropdown-arrow-width) 100% !important;
  background-repeat: no-repeat !important;
  cursor: pointer;
}

body.theme-dark select:not([multiple]):not([size]),
body.theme-dark select[size="1"]:not([multiple]) {
  background-image:
    url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='18' height='18' viewBox='0 0 18 18'%3E%3Cpath d='M4 6.5 9 11.5 14 6.5' fill='none' stroke='%23aebbd0' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E"),
    linear-gradient(var(--border, #334155), var(--border, #334155)),
    linear-gradient(var(--card-soft, #172033), var(--card-soft, #172033)) !important;
}

/* Keep searchable personnel/customer controls identical across create and maintenance pages. */
.oms-personnel-combobox > [data-personnel-toggle],
.oms-entrust-combobox > [data-entrust-toggle] {
  width: var(--oms-dropdown-arrow-width) !important;
  border-left: 1px solid var(--border) !important;
  border-radius: 0 7px 7px 0 !important;
  background: var(--card-soft) !important;
  color: var(--muted) !important;
}

.oms-personnel-combobox > [data-personnel-toggle]::before,
.oms-entrust-combobox > [data-entrust-toggle]::before {
  box-sizing: border-box;
  width: 8px !important;
  height: 8px !important;
  margin-top: -4px !important;
  border: 0 !important;
  border-right: 2px solid currentColor !important;
  border-bottom: 2px solid currentColor !important;
  content: "" !important;
  transform: rotate(45deg) !important;
}

select:not([multiple]):not([size]):disabled,
select[size="1"]:not([multiple]):disabled,
.oms-personnel-combobox > [data-personnel-toggle]:disabled,
.oms-entrust-combobox > [data-entrust-toggle]:disabled {
  cursor: not-allowed;
}

@media (forced-colors: active) {
  select:not([multiple]):not([size]),
  select[size="1"]:not([multiple]) {
    -webkit-appearance: auto !important;
    appearance: auto !important;
    padding-right: inherit !important;
    background-image: none !important;
  }
}