1/* Select — native <select> only. The Basecoat combobox-style custom
 2   select (with [role="listbox"], search input, etc.) was vendored along
 3   with select.js but never wired up; we standardize on the browser's
 4   own select for everything in the admin. */
 5@layer components {
 6  :is(.form, .admin-field) select,
 7  select.admin-select {
 8    @apply focus-control appearance-none border-admin-input dark:bg-admin-input/30 dark:hover:bg-admin-input/50 flex w-fit items-center justify-between gap-2 border bg-transparent pl-3 pr-9 py-2 text-sm whitespace-nowrap shadow-xs transition-[color,box-shadow] outline-none disabled:cursor-not-allowed disabled:opacity-50 h-9;
 9    border-radius: var(--radius-select);
10    @apply bg-[image:var(--chevron-down-icon-50)] bg-no-repeat bg-position-[center_right_0.75rem] bg-size-[1rem];
11
12    option,
13    optgroup {
14      @apply bg-admin-popover text-admin-popover-foreground;
15    }
16  }
17
18  /* Small variant. Pair with `.admin-select`: `class="select select-sm"`. */
19  select.admin-select-sm {
20    @apply h-8 py-0 pr-7;
21    @apply bg-position-[center_right_0.5rem];
22  }
23}