/* Shared dropdown spacing: keep the arrow comfortably inside the field. */
select:not([multiple]):not([size]),
select[size="1"]:not([multiple]) {
  -webkit-appearance: none;
  appearance: none;
  padding-inline-end: 2.75rem;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 16 16'%3E%3Cpath d='m4 6 4 4 4-4' fill='none' stroke='%23102e3d' stroke-width='1.7' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
  background-repeat: no-repeat;
  background-position: right 1rem center;
  background-size: 1rem 1rem;
  background-origin: border-box;
}

select:not([multiple]):not([size]):dir(rtl),
select[size="1"]:not([multiple]):dir(rtl) {
  background-position: left 1rem center;
}

/* Let the platform draw the control in high-contrast accessibility modes. */
@media (forced-colors: active) {
  select:not([multiple]):not([size]),
  select[size="1"]:not([multiple]) {
    -webkit-appearance: auto;
    appearance: auto;
    background-image: none;
  }
}