/* =============================================================================
   SuperFile sub-nav — THE single source of truth for every localbar's design.
   Loaded by the marketing shell (RealShell) AND every self-contained console page.
   Behavior comes from localnav.js (adds .lb, the chevron, the dropdown).
   No page should hardcode its own .localbar styles.

   Layers:
     .localbar            base bar (pre-enhancement / fallback)
     .localbar.lb         Apple "localnav": 48px bar, 21px title, 12px links, dropdown
     .localbar.lb[data-adminnav]  admin console-switcher tweaks (compact, badges, active pill)
   ============================================================================= */

/* ---- base bar (applies before localnav.js enhances, and as a fallback) ---- */
.localbar{border-bottom:1px solid var(--hair,#e8e8ed);background:#fff}
.localbar .in{max-width:1024px;margin:0 auto;padding:0 22px;height:52px;display:flex;align-items:center;justify-content:space-between}
.localbar .t{font-size:19px;font-weight:600;color:var(--ink,#1d1d1f)}
.localbar .r{display:flex;gap:26px;font-size:13px}
.localbar .r a{color:var(--ink,#1d1d1f)}
.localbar .r a.act{color:var(--grey-l,#86868b);pointer-events:none}

/* ---- Apple "localnav" (added by localnav.js via .lb) ----
   Frosted background lives on ::before, NOT on .localbar.lb — iOS Safari clips
   absolutely-positioned descendants of a backdrop-filter element, which hid the dropdown. */
.localbar.lb{position:sticky;top:0;z-index:31;background:transparent;backdrop-filter:none;-webkit-backdrop-filter:none}
.localbar.lb::before{content:"";position:absolute;inset:0;z-index:-1;background:rgba(255,255,255,.82);backdrop-filter:saturate(180%) blur(20px);-webkit-backdrop-filter:saturate(180%) blur(20px);pointer-events:none}
.localbar.lb .in{height:52px;overflow:visible}   /* matches Apple discussions localnav */
.localbar.lb .t{font-size:21px;font-weight:600;letter-spacing:-.012em;line-height:1.10;color:var(--ink,#1d1d1f);cursor:default;touch-action:manipulation}
.lb-right{display:flex;align-items:center;gap:16px;flex:none}
.localbar.lb .r{margin-left:auto;gap:30px;font-size:12px}
.localbar.lb .r a{font-weight:400;letter-spacing:-.01em;color:rgba(29,29,31,.86);transition:color .1s ease}
.localbar.lb .r a:hover{color:var(--ink,#1d1d1f);text-decoration:none}
.localbar.lb .r a.act{color:var(--ink,#1d1d1f);font-weight:400;pointer-events:auto}
.localbar.lb .r a.lb-btn,.lb-right .lb-act{display:inline-flex;align-items:center;justify-content:center;background:var(--blue,#0071e3);color:#fff!important;font-size:12px;font-weight:400;line-height:1;letter-spacing:-.01em;padding:5px 12px;border-radius:980px;text-decoration:none;white-space:nowrap;pointer-events:auto!important;border:0;transition:background .12s ease}
.localbar.lb .r a.lb-btn:hover,.lb-right .lb-act:hover{background:var(--blue-h,#0077ed);color:#fff!important;text-decoration:none}
/* chevron toggle — hidden on desktop, shown on mobile */
.lb-tog{display:none;align-items:center;justify-content:center;width:28px;height:40px;margin:0;padding:0;background:transparent;border:0;color:var(--ink,#1d1d1f);cursor:pointer;flex:none;-webkit-tap-highlight-color:transparent;touch-action:manipulation}
.lb-tog svg{width:11px;height:7px;fill:none;stroke:currentColor;stroke-width:1.6;stroke-linecap:round;stroke-linejoin:round;transition:transform .28s cubic-bezier(.4,0,.6,1)}
.localbar.lb.open .lb-tog svg{transform:rotate(180deg)}
.lb-scrim{position:fixed;inset:0;z-index:20;background:rgba(17,19,24,.24);backdrop-filter:blur(6px) saturate(.92);-webkit-backdrop-filter:blur(6px) saturate(.92);opacity:0;visibility:hidden;pointer-events:none;transition:opacity .3s cubic-bezier(.4,0,.6,1),visibility 0s .3s}
.lb-scrim.on{opacity:1;visibility:visible;pointer-events:auto;transition-delay:0s}

/* ---- admin console switcher (data-adminnav): compact many-item bar + badges ---- */
/* smaller title than the marketing localnav so all 15 consoles fit without cropping */
.localbar.lb[data-adminnav] .t{font-size:16px;letter-spacing:-.01em}
.localbar.lb[data-adminnav] .anav-badge{display:none;align-items:center;justify-content:center;min-width:16px;height:16px;padding:0 4px;margin-left:6px;border-radius:999px;background:#FF3B30;color:#fff;font-size:10.5px;font-weight:700;line-height:1;vertical-align:1px}
.localbar.lb[data-adminnav] .anav-badge.on{display:inline-flex}

@media (min-width:834px){
  .lb-scrim{display:none!important}
  /* admin: title left, then a compact, scrollable strip of all consoles */
  .localbar.lb[data-adminnav] .r{margin-left:16px;gap:2px;font-size:13px;flex:1;min-width:0;justify-content:flex-start;overflow-x:auto;overflow-y:hidden;scrollbar-width:none;-webkit-overflow-scrolling:touch}
  .localbar.lb[data-adminnav] .r::-webkit-scrollbar{display:none}
  .localbar.lb[data-adminnav] .r a{padding:6px 11px;border-radius:8px;font-size:13px;color:#6E6E73;white-space:nowrap;transition:background .12s,color .12s}
  .localbar.lb[data-adminnav] .r a:hover{background:#F2F2F4;color:#1D1D1F}
  .localbar.lb[data-adminnav] .r a.act{background:#1D1D1F;color:#fff;font-weight:500}
  .localbar.lb[data-adminnav] .r a#out{color:#B0392A;margin-left:4px}
  .localbar.lb[data-adminnav] .r a#out:hover{background:#FBEDEB;color:#B0392A}
}

@media (max-width:833px){
  /* on mobile the sub-nav carries sign-in, so drop the duplicate from the top nav
     (avatar still shows when signed in). On desktop the top-nav "Sign in" stays. */
  #navAuth.sipill{display:none!important}
  .localbar.lb .t{font-size:19px;cursor:pointer}
  .lb-tog{display:inline-flex}
  .lb-right{gap:12px;margin-left:auto}
  /* collapse the link row into a full-bleed dropdown below the bar */
  .localbar.lb .r{position:absolute;left:0;right:0;top:100%;display:block;flex-direction:column;gap:0!important;margin:0;padding:8px 0 max(10px,env(safe-area-inset-bottom))!important;overflow:visible!important;background:#fff;border-bottom:1px solid rgba(0,0,0,.08);box-shadow:0 26px 40px -28px rgba(0,0,0,.26);transform:translateY(-10px);opacity:0;visibility:hidden;pointer-events:none;transition:opacity .26s cubic-bezier(.4,0,.6,1),transform .28s cubic-bezier(.4,0,.6,1),visibility 0s .28s;max-height:76vh;overflow-y:auto}
  .localbar.lb.open .r{transform:none;opacity:1;visibility:visible;pointer-events:auto;transition-delay:0s}
  .localbar.lb .r a{display:block;padding:11px 22px!important;font-size:16px!important;font-weight:400;line-height:1.35;letter-spacing:-.01em;color:var(--ink,#1d1d1f)!important;white-space:normal;border:0!important;background:none!important}
  .localbar.lb .r a.act{font-weight:600;color:var(--ink,#1d1d1f)!important;pointer-events:auto}
  .localbar.lb .r a.lb-btn{display:block;margin:12px 22px 6px;padding:13px 18px!important;text-align:center;background:var(--blue,#0071e3)!important;color:#fff!important;border-radius:12px;font-size:16px!important;font-weight:500}
  /* admin: active console highlighted, sign-out separated */
  .localbar.lb[data-adminnav] .r a.act{background:#1D1D1F;color:#fff!important;border-radius:10px;margin:0 12px;padding:11px 14px!important}
  .localbar.lb[data-adminnav] .r a#out{color:#B0392A!important;margin-top:4px;border-top:1px solid #F0F0F2}
}