/* Page styles for base/templates/base/_page_switcher.html.
   Moved out of the template unchanged and linked from the same point in the
   page, so these rules resolve in exactly the order they always did. */

.page-switcher { display:flex; align-items:center; gap:8px; flex-wrap:wrap; margin:0 0 12px; }
.page-switcher label { font-size:0.78rem; font-weight:700; text-transform:uppercase;
  letter-spacing:0.04em; color:var(--ink-3); }
.page-switcher__select { font:inherit; font-size:0.9rem; padding:6px 10px;
  border:1px solid var(--line-strong); border-radius:var(--r-sm); background:var(--surface); color:var(--ink);
  max-width:min(340px, 100%); }
.page-switcher__select:focus { outline:2px solid var(--accent-ring); outline-offset:1px; }
.page-switcher__hint { font-size:0.78rem; color:var(--ink-3); }
body.dark-mode .page-switcher__select { background:var(--field); color:var(--ink); border-color:var(--line); }
body.dark-mode .page-switcher label { color:var(--ink-3); }

/* The platform-wide open map, in a list of the group's own maps.

   A native <option> honours colour and weight in every current browser and
   almost nothing else — no gradient, no animation, no pseudo-element. So the
   "this one is different" signal is the label (it carries a wave and says what
   it is) plus this: brand blue, bold. Anything livelier would mean replacing
   the <select> with a custom listbox, which would cost the keyboard behaviour
   and the no-JS fallback the partial deliberately keeps. */
.page-switcher__option--open { color: var(--brand-blue-deep, #1f6d8f); font-weight: 700; }
body.dark-mode .page-switcher__option--open { color: var(--brand-blue-light, #5fb3d9); }