/* SuperOffice dropdown list — the popup half of public/js/so-select.js.
 * The closed control is the page's own <select>, styled where it lives.
 * Colours are BRAND.md's FINAL DESIGN, with the --so-* token names where a page
 * loads so-tokens.css and the same values as fallbacks where it does not (the
 * classic builder and v1 carry their own palettes). light-dark() follows the
 * `color-scheme` the script sets on the list from the page's theme.
 * Hover AND selected: solid navy, white text; selected carries a gold check. */
.so-sel-list{
  position:fixed;inset:auto;margin:0;z-index:2147483000;
  box-sizing:border-box;overflow-y:auto;overscroll-behavior:contain;
  padding:6px;min-width:180px;
  background:light-dark(#ffffff,#1a1f27);
  color:light-dark(#0e0e0e,#f3f1ec);
  border:1px solid light-dark(#e3ddd0,#3a4356);
  border-radius:14px;
  box-shadow:light-dark(0 12px 32px rgba(20,33,61,.16),0 12px 32px rgba(0,0,0,.55));
  font-family:var(--so-font,"Montserrat","Avenir Next","Segoe UI",system-ui,sans-serif);
  font-size:14px;line-height:1.35;font-weight:500;letter-spacing:0;text-align:left;
  animation:so-sel-in 140ms cubic-bezier(.2,.8,.25,1);
}
.so-sel-list.is-up{animation-name:so-sel-in-up}
@keyframes so-sel-in{from{opacity:0;transform:translateY(-4px)}to{opacity:1;transform:none}}
@keyframes so-sel-in-up{from{opacity:0;transform:translateY(4px)}to{opacity:1;transform:none}}
@media (prefers-reduced-motion:reduce){.so-sel-list{animation:none}}
.so-sel-list::-webkit-scrollbar{width:8px}
.so-sel-list::-webkit-scrollbar-thumb{background:light-dark(#d2c8b4,#3a4356);border-radius:6px}

.so-sel-opt{
  display:flex;align-items:center;gap:10px;
  min-height:38px;padding:8px 10px 8px 12px;border-radius:10px;
  cursor:pointer;user-select:none;-webkit-user-select:none;
  transition:background-color 140ms,color 140ms;
}
.so-sel-opt.in-group{padding-left:22px}
.so-sel-lbl{flex:1;min-width:0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.so-sel-check{flex:none;visibility:hidden;color:#c5a55a}
.so-sel-opt[aria-selected="true"] .so-sel-check{visibility:visible}
.so-sel-opt.is-active,.so-sel-opt[aria-selected="true"]{
  background:light-dark(#0b1d32,#2c4c7c);color:#ffffff;
}
.so-sel-opt[aria-disabled="true"]{opacity:.45;cursor:default}
.so-sel-opt[aria-disabled="true"].is-active{background:transparent;color:inherit}
.so-sel-group{
  padding:10px 12px 4px;font-size:11px;font-weight:700;letter-spacing:.06em;text-transform:uppercase;
  color:light-dark(#55606c,#98a0ad);
}
@media (max-width:600px){.so-sel-opt{min-height:44px}}
@media print{.so-sel-list{display:none!important}}