/* ═══════════════════════════════════════════════════════════════════════════
   nav-v2.css — header dropdowns (desktop) and the mobile menu drawer.
   Loaded last on every page (includes/header.php), so it wins over older rules.
   Look: calm, GitHub-like — one column, icon + title + one quiet line, even spacing.
   ═══════════════════════════════════════════════════════════════════════════ */

/* ── Desktop dropdowns (GitHub-style: plain icon + label, thin dividers, quiet group headings) ── */
html .ft-header-v2 .ft-primary-nav .nav-dd__menu{
  display:flex!important;flex-direction:column!important;gap:0!important;
  width:260px!important;min-width:0!important;max-width:calc(100vw - 32px)!important;
  padding:8px 0!important;left:-8px!important;right:auto!important;
  border:1px solid var(--border)!important;border-radius:12px!important;background:var(--bg-card)!important;
  box-shadow:0 1px 3px rgba(0,0,0,.08),0 8px 24px rgba(0,0,0,.14)!important;
  max-height:calc(100vh - 90px);overflow-y:auto
}
html .ft-header-v2 .ft-primary-nav .nav-dd__menu > a{
  display:flex!important;align-items:center!important;gap:12px!important;
  min-height:36px!important;margin:0 8px!important;padding:6px 10px!important;border-radius:6px!important;
  white-space:nowrap!important;line-height:1.2!important;text-decoration:none!important
}
html .ft-header-v2 .ft-primary-nav .nav-dd__menu > a > i{
  flex:0 0 18px!important;width:18px!important;height:auto!important;display:inline-block!important;text-align:center!important;
  margin:0!important;border:0!important;background:none!important;font-size:15px!important;opacity:1!important
}
html .ft-header-v2 .ft-primary-nav .nav-dd__menu > a > span{display:block;min-width:0}
html .ft-header-v2 .ft-primary-nav .nav-dd__menu > a small{display:none!important}
html[data-theme] .ft-header-v2 .ft-primary-nav .nav-dd__menu > a b{font-size:14px!important;font-weight:400!important;color:var(--text)!important}
html[data-theme] .ft-header-v2 .ft-primary-nav .nav-dd__menu > a > i{color:var(--muted)!important}
html[data-theme] .ft-header-v2 .ft-primary-nav .nav-dd__menu > a:hover,
html[data-theme] .ft-header-v2 .ft-primary-nav .nav-dd__menu > a:focus-visible{background:var(--bg-hover)!important}
html[data-theme] .ft-header-v2 .ft-primary-nav .nav-dd__menu > a:hover > i{color:var(--text)!important}
html[data-theme] .ft-header-v2 .ft-primary-nav .nav-dd__menu .nav-dd__label{
  display:block;margin:8px 0 2px;padding:12px 18px 4px;border-top:1px solid var(--border);
  font-size:12px!important;font-weight:600!important;color:var(--muted)!important
}
/* the dropdown under the last item ("More") opens toward the left so it never runs off screen */
html .ft-header-v2 .ft-primary-nav .nav-dd:last-of-type .nav-dd__menu{left:auto!important;right:-8px!important}

/* ── Mobile drawer (GitHub-style) ─────────────────────────────────────────── */
.ft-drawer-backdrop{position:fixed;inset:0;z-index:2990;background:rgba(1,4,9,.5);animation:ftFade .18s ease-out}
.ft-drawer-backdrop[hidden]{display:none}
html .ft-drawer{
  position:fixed!important;top:0!important;bottom:0!important;left:0!important;right:auto!important;z-index:3000!important;
  display:flex!important;flex-direction:column!important;gap:0!important;
  width:min(86vw,340px)!important;max-width:none!important;padding:0 0 calc(16px + env(safe-area-inset-bottom))!important;margin:0!important;
  background:var(--bg-card)!important;border:0!important;border-radius:0 16px 16px 0!important;
  box-shadow:0 16px 48px rgba(0,0,0,.28)!important;overflow-y:auto!important;overscroll-behavior:contain;
  transform:translateX(-104%);visibility:hidden;transition:transform .22s ease,visibility 0s linear .22s
}
html .ft-drawer.open{transform:none;visibility:visible;transition:transform .22s ease,visibility 0s}
@media (prefers-reduced-motion:reduce){html .ft-drawer,html .ft-drawer.open{transition:none}}
.ft-drawer__head{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:18px 14px 14px 18px}
.ft-drawer__brand{display:inline-flex;align-items:center;min-height:36px;text-decoration:none!important}
.ft-drawer__brand img{display:block;max-height:34px;width:auto}
html[data-theme="dark"] .ft-drawer__brand .site-logo-light:not(:only-of-type){display:none}
html[data-theme="light"] .ft-drawer__brand .site-logo-dark{display:none}
html .ft-drawer .ft-drawer__close{
  display:grid!important;place-items:center!important;width:36px!important;height:36px!important;margin:0!important;padding:0!important;
  border:0!important;border-radius:8px!important;background:transparent!important;color:var(--text-2)!important;font-size:18px!important;cursor:pointer
}
html .ft-drawer .ft-drawer__close:hover{background:var(--bg-hover)!important;color:var(--text)!important}
.ft-drawer__group{display:flex;flex-direction:column;padding:6px 8px}
html[data-theme] .ft-drawer .ft-drawer__group > a{
  display:flex!important;align-items:center!important;gap:14px!important;min-height:44px!important;padding:0 12px!important;
  border-radius:8px!important;background:none!important;color:var(--text)!important;
  font-size:16px!important;font-weight:400!important;line-height:1.2!important;text-decoration:none!important
}
html[data-theme] .ft-drawer .ft-drawer__group > a > i{width:20px!important;text-align:center!important;font-size:17px!important;color:var(--text-2)!important}
html[data-theme] .ft-drawer .ft-drawer__group > a:hover,html[data-theme] .ft-drawer .ft-drawer__group > a:focus-visible{background:var(--bg-hover)!important}
html[data-theme] .ft-drawer .ft-drawer__group > a.active{background:var(--bg-hover)!important;font-weight:600!important;box-shadow:inset 3px 0 0 var(--primary)}
html[data-theme] .ft-drawer .ft-drawer__group > a.active > i{color:var(--primary)!important}
html[data-theme] .ft-drawer .ft-drawer__label{padding:10px 12px 6px;font-size:13px;font-weight:600;color:var(--muted)!important}
.ft-drawer hr{margin:6px 16px;border:0;border-top:1px solid var(--border);opacity:1}
.ft-drawer__foot{display:flex;flex-direction:column;gap:8px;margin-top:auto;padding:14px 18px 4px}
html[data-theme] .ft-drawer .ft-drawer__cta,html[data-theme] .ft-drawer .ft-drawer__ghost{
  display:flex!important;align-items:center!important;justify-content:center!important;gap:8px;min-height:44px;padding:0 16px;border-radius:10px;
  font-size:15px!important;font-weight:600!important;text-decoration:none!important
}
html[data-theme] .ft-drawer .ft-drawer__cta{background:var(--primary)!important;color:var(--on-primary,#fff)!important;border:1px solid var(--primary)}
html[data-theme] .ft-drawer .ft-drawer__ghost{background:var(--bg-alt)!important;color:var(--text)!important;border:1px solid var(--border)}
html[data-theme="dark"] .ft-drawer .ft-drawer__cta{background:#2563eb!important;border-color:#2563eb}
@media (min-width:1024px){.ft-drawer,.ft-drawer-backdrop{display:none!important}}
@keyframes ftFade{from{opacity:0}to{opacity:1}}