/* ──────────────────────────────────────────────────────────────────────────
   SmartMuseum — Canonical site header (M2-A3)
   Single source of truth for the header on EVERY front-end view
   (home, page, archive, category, search, 404, single post).
   Enqueued globally; self-contained (does NOT depend on smartmuseum-premium.css,
   which only loads on single posts). Own token namespace: --smh-*.
   RTL via dir="rtl" (set by WordPress/Polylang) + logical properties.
   ────────────────────────────────────────────────────────────────────────── */

/* ─── Tokens (intl default; palette variants keyed on body class) ─────────── */
:root{
  --smh-bg:          #FFFDF8;
  --smh-paper:       #F7F2EA;
  --smh-ink:         #111111;
  --smh-ink-2:       #241C18;
  --smh-ink-3:       #5C504A;
  --smh-gold:        #B99A5B;
  --smh-rule:        #E7DFD2;
  --smh-accent-soft: rgba(185,154,91,.16);
  --smh-sans:        "Inter", ui-sans-serif, system-ui, -apple-system, "Segoe UI", sans-serif;
}
.sm-palette-asia{
  --smh-bg:#FFF6EC; --smh-paper:#F6EBD9; --smh-ink:#1C0F0C; --smh-ink-2:#2A1410;
  --smh-ink-3:#6A4B3A; --smh-gold:#C8A24A; --smh-rule:#EBD9BF; --smh-accent-soft:rgba(200,162,74,.18);
}
.sm-palette-ar{
  --smh-bg:#FFF9F0; --smh-paper:#F6EEDD; --smh-ink:#071E26; --smh-ink-2:#0A2A33;
  --smh-ink-3:#3E5A63; --smh-gold:#C9A45C; --smh-rule:#E6DBC4; --smh-accent-soft:rgba(201,164,92,.18);
}

/* M2-A3D — no global Polylang masking. The legacy switcher is neutralised AT THE
   SOURCE (the Astra header is removed and the N0-C2 .sm-langdd injection was
   deleted), so there is no stray .lang-item in the header to hide. A site-wide
   `li.lang-item{display:none}` would also hide legitimate Polylang lists in the
   footer / widgets / future components, so it is intentionally NOT used here. */

/* ─── Header shell — compact, centered, single bar ───────────────────────── */
.sm-article-header{
  position:sticky; top:0; z-index:60;
  background:color-mix(in oklab, var(--smh-bg) 92%, transparent);
  -webkit-backdrop-filter:saturate(1.4) blur(14px);
  backdrop-filter:saturate(1.4) blur(14px);
  border-bottom:1px solid var(--smh-rule);
}
/* Progressive-enhancement fallback where color-mix is unsupported */
@supports not (background:color-mix(in oklab, #000 50%, transparent)){
  .sm-article-header{ background:var(--smh-bg) }
}
.sm-article-header__inner{
  display:flex; align-items:center; gap:clamp(18px,2.4vw,40px);
  max-width:1240px; margin-inline:auto;
  padding:14px clamp(20px,4vw,32px);
  min-height:64px;            /* visual header height lands ~80–96px with logo */
  box-sizing:border-box;
}

/* ─── Brand / logo (transparent, fluid, readable) ────────────────────────── */
.sm-brand{ display:flex; align-items:center; line-height:0; margin-inline-end:auto; min-width:0 }
.sm-site-logo,
.sm-site-logo-wrap{ background:transparent; box-shadow:none; border:0 }
.sm-site-logo{ display:inline-flex; align-items:center; text-decoration:none; line-height:0; padding:0 }
.sm-site-logo__img{
  display:block;
  width:clamp(200px,16vw,290px);   /* trimmed asset → glyph ~44–64px tall */
  max-width:100%; height:auto;
  object-fit:contain; background:transparent;
}
.sm-site-logo__text{
  font-family:"Cormorant Garamond",Georgia,serif; font-weight:600;
  font-size:clamp(22px,2.6vw,30px); color:var(--smh-ink); line-height:1.1; white-space:nowrap;
}
.sm-site-logo:focus-visible{ outline:2px solid var(--smh-gold); outline-offset:3px; border-radius:2px }

/* ─── Navigation — evenly spaced, never concatenated ─────────────────────── */
.sm-nav{
  display:flex; align-items:center;
  gap:clamp(18px,2vw,32px);
  margin:0; padding:0; list-style:none;
}
.sm-nav a{
  display:inline-block;
  font:500 13px/1 var(--smh-sans);
  color:var(--smh-ink-3); padding:6px 0; position:relative; white-space:nowrap;
}
.sm-nav a:hover{ color:var(--smh-ink) }
.sm-nav a[aria-current]{ color:var(--smh-ink) }
.sm-nav a:focus-visible{ outline:2px solid var(--smh-gold); outline-offset:3px; border-radius:2px }

/* ─── Language switcher — anchored under its own button ───────────────────── */
.sm-language-switcher{ position:relative }
.sm-language-switcher__btn{
  display:inline-flex; align-items:center; gap:8px;
  min-height:36px;
  font:500 12px/1 var(--smh-sans); letter-spacing:.06em; text-transform:uppercase;
  color:var(--smh-ink-3); padding:8px 10px;
  background:transparent; border:1px solid transparent; border-radius:2px; cursor:pointer;
}
.sm-language-switcher__btn:hover{ color:var(--smh-ink); border-color:var(--smh-rule) }
.sm-language-switcher__btn:focus-visible{ outline:2px solid var(--smh-gold); outline-offset:2px }
.sm-language-switcher .sm-arr{ transition:transform .15s ease }
.sm-language-switcher.is-open .sm-arr,
.sm-language-switcher[aria-expanded="true"] .sm-arr{ transform:rotate(180deg) }
.sm-language-switcher__menu{
  position:absolute; top:calc(100% + 8px); inset-inline-end:0;
  min-width:200px; max-height:70vh; overflow:auto;
  background:var(--smh-bg); border:1px solid var(--smh-rule); border-radius:4px;
  padding:6px; margin:0; list-style:none;
  box-shadow:0 12px 30px -10px rgba(0,0,0,.18);
  display:none; z-index:9999;
}
.sm-language-switcher.is-open .sm-language-switcher__menu,
.sm-language-switcher[aria-expanded="true"] .sm-language-switcher__menu{ display:block }
.sm-language-switcher__menu li{ list-style:none; margin:0 }
.sm-language-switcher__menu a{
  display:flex; justify-content:space-between; align-items:center; gap:14px;
  font:400 13px/1.2 var(--smh-sans); color:var(--smh-ink-2); padding:9px 12px; border-radius:2px;
}
.sm-language-switcher__menu a:hover{ background:var(--smh-paper) }
.sm-language-switcher__menu li[aria-selected="true"] a,
.sm-language-switcher__menu a[aria-current="true"]{ color:var(--smh-ink); background:var(--smh-accent-soft); font-weight:600 }
.sm-language-switcher__code{ font-size:10px; letter-spacing:.16em; color:var(--smh-ink-3); text-transform:uppercase }

/* ─── Header CTA (self-contained so it styles on non-article pages too) ───── */
.sm-article-header .sm-btn{
  display:inline-flex; align-items:center; justify-content:center; gap:10px;
  min-height:40px; padding:9px 18px; white-space:nowrap;
  font:500 13px/1 var(--smh-sans); letter-spacing:.01em;
  border-radius:2px; border:1px solid var(--smh-ink-2); color:var(--smh-ink-2);
  background:transparent; cursor:pointer;
  transition:background .2s ease, color .2s ease, border-color .2s ease;
}
.sm-article-header .sm-btn--ghost:hover{ background:var(--smh-ink-2); color:var(--smh-bg) }
.sm-article-header .sm-btn:focus-visible{ outline:2px solid var(--smh-gold); outline-offset:2px }

/* ─── RTL ────────────────────────────────────────────────────────────────── */
[dir="rtl"] .sm-language-switcher__menu{ inset-inline-end:0 }
[dir="rtl"] .sm-language-switcher__menu a{ direction:rtl }

/* ─── Responsive ─────────────────────────────────────────────────────────── */
@media (max-width:959px){
  .sm-article-header__inner{ gap:12px; padding:10px clamp(14px,4vw,20px); min-height:56px }
  .sm-nav{ display:none }                         /* nav collapses; logo + switcher remain */
  .sm-site-logo__img{ width:clamp(150px,42vw,210px) }
  .sm-article-header .sm-btn{ padding:8px 14px; min-height:38px }
}
@media (max-width:420px){
  .sm-article-header .sm-btn{ display:none }      /* keep logo + switcher only; no overflow */
  .sm-site-logo__img{ width:clamp(140px,46vw,190px) }
}

@media print{
  .sm-article-header{ position:static; border-bottom:0 }
  .sm-language-switcher{ display:none }
}
