/**
 * Zerø Lingua — frontend language switcher.
 *
 * A MINIMAL default layout — horizontal, no bullets, quiet current marker —
 * so the switcher looks placed the moment it lands. Loaded into the theme (a
 * host we don't control): deliberately low-specificity own-namespace class
 * rules with no !important, so any theme rule of equal or higher specificity
 * wins.
 *
 * The theming API is TWO-LAYERED — set VARIABLES for the common knobs (on
 * :root or any ancestor, no specificity fight at all), override the CLASSES
 * for everything else:
 *
 *   --zl-switcher-gap             gap between languages   (.25em 1em)
 *   --zl-switcher-item-gap        gap between flag & name (.4em)
 *   --zl-switcher-color           link color              (inherit)
 *   --zl-switcher-current-color   current-language color  (inherit)
 *   --zl-switcher-current-weight  current-language weight (600)
 *   --zl-flag-width               flag width              (1.25em — scales with the text beside it)
 *   --zl-flag-radius              flag corner radius      (2px)
 *
 * Classes: .zl-switcher, .zl-switcher__item, .is-current, .zl-flag.
 */
.zl-switcher { display: flex; flex-wrap: wrap; align-items: center; gap: var(--zl-switcher-gap, .25em 1em); list-style: none; margin: 0; padding: 0; }
.zl-switcher__item { margin: 0; }
/* The anchor is a flex row so flag + name stay on ONE line even under theme
   resets that make every <img> display:block (the same family that zeroed the
   panel's svgs — see panel-mount.css). */
.zl-switcher__item a { text-decoration: none; display: inline-flex; align-items: center; gap: var(--zl-switcher-item-gap, .4em); color: var(--zl-switcher-color, inherit); }
.zl-switcher__item.is-current a { font-weight: var(--zl-switcher-current-weight, 600); text-decoration: underline; text-underline-offset: .2em; color: var(--zl-switcher-current-color, inherit); }
/* 1.25em fallback (≈20px at 16px text), NOT auto: any author declaration
   beats the img's width attribute (a presentational hint), and auto would
   fall through to the SVG flag's intrinsic size. Relative on purpose — a flag
   beside 28px header text scales with it instead of shrinking into a speck. */
.zl-flag { display: inline-block; inline-size: var(--zl-flag-width, 1.25em); block-size: auto; border-radius: var(--zl-flag-radius, 2px); vertical-align: middle; object-fit: cover; }
