/*
  Shared native-select treatment.

  Browser-native disclosure arrows sit too close to the right edge and vary
  between browsers. Use one OTL chevron with a consistent inset everywhere.
  Keep multiple/listbox selects and the visually-hidden Get Started anatomy
  select on their native/custom rendering paths.
*/

select:not([multiple]):not(.otl-get-started-native-select) {
  -webkit-appearance: none !important;
  appearance: none !important;

  padding-right: 40px !important;

  /*
    Keep selects on the same neutral control surface as adjacent text
    inputs while layering the shared chevron above that surface.
  */
  background-color:
    #0b1220 !important;

  background-image:
    url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 20 20'%3E%3Cpath d='M4.5 7.25 10 12.75l5.5-5.5' fill='none' stroke='%23cbd5e1' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") !important;

  background-repeat:
    no-repeat !important;

  background-position:
    right 12px center !important;

  background-size:
    14px 14px !important;
}