/* ninjaturtles.tv shared forum nav styling. A faithful, pop-only copy of the
   site header (src/components/Header.astro) + network bar (NetworkTopBar.astro),
   so the injected forum nav is a pixel match for the global nav. Loaded by the
   forums.ninjaturtles.tv Discourse theme head_tag (and the master cold-login). */

.nt-shellnav {
  --bg:#1FA9E0; --bg-alt:#F5E6C8; --surface:#FFFFFF; --surface-card:#FFFFFF;
  --ink:#111111; --red:#E62027; --green:#A4D03A; --green-deep:#5C8B1F; --yellow:#F4C842;
  --fg-2:#292929; --fg-3:#5b5b5b; --border:#111111; --border-w:3px;
  --shadow-pop:6px 6px 0 #111111; --radius:2px;
  --font-display:'Bangers','Impact',system-ui,sans-serif;
  --font-heading:'Archivo Black',system-ui,sans-serif;
  --font-body:'Plus Jakarta Sans',system-ui,sans-serif;
  --font-mono:'VT323','Courier New',monospace;
  font-family:var(--font-body);
}

/* network top bar (exact) */
.nt-shellnav .hero80-topbar {
  background:#000; border-bottom:1px solid rgba(255,255,255,0.06);
  padding:8px 24px; font-family:-apple-system,BlinkMacSystemFont,"Segoe UI",system-ui,sans-serif;
  font-size:11px; font-weight:600; letter-spacing:0.10em; text-transform:uppercase;
  display:flex; align-items:center; gap:24px; flex-wrap:wrap; line-height:1;
}
.nt-shellnav .hero80-topbar__label { color:#d8d3c4; opacity:0.85; white-space:nowrap; }
.nt-shellnav .hero80-topbar__links { display:flex; align-items:center; gap:22px; flex-wrap:wrap; }
.nt-shellnav .hero80-topbar__link { color:#807b6c; text-decoration:none; transition:color .15s; }
.nt-shellnav .hero80-topbar__link:hover { color:#fff; }
.nt-shellnav .hero80-topbar__link.is-current { color:#A4D03A; pointer-events:none; }

/* header (exact: black bar, 96px, logo + centered nav + actions) */
.nt-shellnav .t-header {
  position:sticky; top:0; z-index:1000; height:96px; padding:0 40px;
  display:flex; align-items:center; gap:32px;
  background:var(--ink); color:#fff; border-bottom:var(--border-w) solid var(--border);
}
.nt-shellnav .t-logo-link { display:block; flex-shrink:0; }
.nt-shellnav .t-logo { height:64px; width:auto; display:block; }
.nt-shellnav .t-nav { display:flex; gap:4px; flex:1; justify-content:center; font-family:var(--font-heading); }
.nt-shellnav .t-nav a {
  font-size:13px; letter-spacing:0.12em; text-transform:uppercase; padding:8px 14px;
  border-radius:var(--radius); white-space:nowrap; color:#fff; text-decoration:none; transition:all 120ms ease;
}
.nt-shellnav .t-nav a:hover { color:var(--green); }
.nt-shellnav .t-nav a.on { color:var(--ink); background:var(--green); }
.nt-shellnav .t-actions { display:flex; align-items:center; gap:10px; flex-shrink:0; position:relative; }
.nt-shellnav .t-icon-btn {
  width:40px; height:40px; display:inline-flex; align-items:center; justify-content:center;
  border:var(--border-w) solid var(--green); background:transparent; color:#fff; border-radius:var(--radius);
  cursor:pointer; text-decoration:none;
}
.nt-shellnav .t-icon-btn:hover { background:var(--green); color:var(--ink); }
.nt-shellnav .btn {
  display:inline-flex; align-items:center; gap:10px; font-family:var(--font-heading);
  font-size:13px; letter-spacing:0.10em; text-transform:uppercase; padding:14px 22px;
  border:var(--border-w) solid var(--border); border-radius:var(--radius);
  background:var(--red); color:#fff; text-decoration:none; box-shadow:var(--shadow-pop); transition:all 140ms ease;
}
.nt-shellnav .btn:hover { transform:translate(-2px,-2px); box-shadow:8px 8px 0 #111; }
.nt-shellnav .btn.ghost { background:var(--surface); color:var(--ink); }

/* logged-in avatar + dropdown */
.nt-shellnav .nt-avatar { width:40px; height:40px; border-radius:var(--radius); border:var(--border-w) solid var(--green); object-fit:cover; cursor:pointer; display:block; }
.nt-shellnav .nt-menu {
  position:absolute; right:0; top:52px; min-width:190px; background:#fff; color:var(--ink);
  border:var(--border-w) solid var(--ink); border-radius:4px; box-shadow:var(--shadow-pop); display:none; z-index:1001; overflow:hidden;
}
.nt-shellnav .nt-menu.open { display:block; }
.nt-shellnav .nt-menu a, .nt-shellnav .nt-menu button {
  display:block; width:100%; text-align:left; padding:11px 14px; font-family:var(--font-body); font-size:14px;
  color:var(--ink); background:none; border:0; border-bottom:1px solid #eee; cursor:pointer; text-decoration:none;
}
.nt-shellnav .nt-menu a:hover, .nt-shellnav .nt-menu button:hover { background:var(--green); }

@media (max-width:860px){
  .nt-shellnav .t-nav { display:none; }
  .nt-shellnav .t-header { height:68px; padding:0 16px; gap:14px; }
  .nt-shellnav .t-logo { height:46px; }
}
@media (max-width:640px){
  .nt-shellnav .hero80-topbar { padding:8px 16px; gap:12px; }
  .nt-shellnav .hero80-topbar__links { gap:14px; }
  .nt-shellnav .btn.ghost { display:none; }
}


/* ---- mobile: hamburger + slide-in drawer (mirrors the site header) ---- */
.nt-shellnav .t-menu-toggle{ display:none; width:40px; height:40px; flex-direction:column; align-items:center; justify-content:center;
  background:transparent; border:3px solid var(--green); border-radius:2px; color:#fff; cursor:pointer; flex-shrink:0; -webkit-tap-highlight-color:transparent; }
.nt-shellnav .t-menu-toggle:hover{ background:var(--green); color:var(--ink); }
.nt-shellnav .t-menu-toggle .bar{ display:block; width:18px; height:2.5px; background:currentColor; margin:2px 0; border-radius:2px; }
@media(max-width:900px){
  .nt-shellnav .t-nav{ display:none; }
  .nt-shellnav .t-actions .btn.ghost{ display:none; }
  .nt-shellnav .t-menu-toggle{ display:inline-flex; }
  .nt-shellnav .t-header{ height:68px; padding:0 14px; gap:12px; }
  .nt-shellnav .t-header img.nt-logo, .nt-shellnav .t-logo{ height:44px; }
}
.t-drawer-backdrop{ position:fixed; inset:0; z-index:10050; background:rgba(10,8,6,0.6); backdrop-filter:blur(3px);
  -webkit-backdrop-filter:blur(3px); opacity:0; transition:opacity 220ms ease; pointer-events:none; }
.t-drawer-backdrop.open{ opacity:1; pointer-events:auto; }
.t-mobile-drawer{ position:fixed; top:0; right:0; z-index:10051; height:100dvh; width:min(86vw,340px);
  background:#111; color:#fff; border-left:3px solid #A4D03A; transform:translateX(100%);
  transition:transform 260ms cubic-bezier(0.2,0.8,0.2,1); display:flex; flex-direction:column; overflow-y:auto;
  -webkit-overflow-scrolling:touch; padding:18px 18px calc(28px + env(safe-area-inset-bottom,0px));
  font-family:"Plus Jakarta Sans",system-ui,sans-serif; }
.t-mobile-drawer.open{ transform:translateX(0); }
.t-mobile-drawer .t-drawer-head{ display:flex; align-items:center; justify-content:space-between; margin-bottom:14px; }
.t-mobile-drawer .t-drawer-close{ width:44px; height:44px; background:#E62027; color:#fff; border:3px solid #fff; border-radius:2px; font-size:26px; line-height:1; cursor:pointer; }
.t-mobile-drawer a.t-drawer-link{ display:block; font-family:"Archivo Black",system-ui,sans-serif; font-size:18px; letter-spacing:0.06em;
  text-transform:uppercase; color:#fff; text-decoration:none; padding:14px 8px; border-bottom:2px solid rgba(255,255,255,0.12); min-height:44px; }
.t-mobile-drawer a.t-drawer-link:hover, .t-mobile-drawer a.t-drawer-link.on{ color:#A4D03A; }
.t-mobile-drawer .t-drawer-sub{ font-family:"VT323",monospace; font-size:16px; letter-spacing:0.14em; text-transform:uppercase; color:#A4D03A; margin:18px 8px 6px; }
.t-mobile-drawer a.t-drawer-net{ display:inline-block; font-family:"VT323",monospace; font-size:15px; color:#cfcfcf; text-decoration:none; padding:8px 10px 8px 0; margin-right:6px; }
.t-mobile-drawer a.t-drawer-net:hover{ color:#A4D03A; }
body.t-drawer-lock{ overflow:hidden; touch-action:none; }