/* ════════════ NOAK skin compartido — topnav + tipografía + fondo ════════════
   Se linkea DESPUÉS de app.css en las páginas sin reskin propio
   (proveedores, costeo, admin, alta-proveedores) para unificar el
   nav y la tipografía con los módulos ya rediseñados. El cuerpo de
   cada página sigue renderizando oscuro vía app.css. */

@font-face{font-family:'Rational';font-weight:300;font-display:swap;src:url('/fonts/Rational-Light.otf') format('opentype')}
@font-face{font-family:'Rational';font-weight:400 500;font-display:swap;src:url('/fonts/Rational-Medium.otf') format('opentype')}
@font-face{font-family:'Rational';font-weight:600;font-display:swap;src:url('/fonts/Rational-SemiBold.otf') format('opentype')}
@font-face{font-family:'Rational';font-weight:700 800;font-display:swap;src:url('/fonts/Rational-Bold.otf') format('opentype')}

:root{
  --noak-bg:#0C1422;--noak-card:#15233A;--noak-border:#26384F;--noak-border-soft:#1E2E44;
  --noak-fg:#EAEEF5;--noak-fg2:#9DACC2;--noak-fg3:#6B7B93;
  --noak-orange:#FF671F;--noak-slate:#5E7BA8;--noak-slate-soft:rgba(94,123,168,0.16);
}

html[data-theme-base="dark"] body{ background:linear-gradient(180deg,#0E1A2B 0%,#0B1320 60%) !important; }
body{ font-family:'Rational',system-ui,sans-serif; }

/* ===== TOP NAV ===== */
nav.topnav{ display:flex; align-items:center; gap:8px; padding:0 26px; height:60px; max-width:none; box-shadow:none;
  background:rgba(9,15,26,0.92); border-bottom:1px solid var(--noak-border-soft); position:sticky; top:0; z-index:40; backdrop-filter:blur(8px); }
html[data-theme-base] nav.topnav{ background:rgba(9,15,26,0.92) !important; border-bottom:1px solid var(--noak-border-soft); }
.topnav .brand{ display:flex; align-items:center; gap:12px; padding-right:18px; margin-right:8px; border-right:1px solid var(--noak-border-soft); }
.topnav .brand .wm{ font-weight:800; font-size:21px; letter-spacing:.04em; color:#fff; }
.topnav .brand .coresa{ display:flex; align-items:center; gap:6px; font-family:ui-monospace,monospace; font-size:9px; letter-spacing:.18em; color:var(--noak-fg3); text-transform:uppercase; }
.topnav .brand .coresa svg{ width:15px; height:15px; color:var(--noak-slate); }
.topnav .nav{ display:flex; align-items:center; gap:2px; flex:1; }
.topnav .nav a{ display:flex; align-items:center; gap:7px; padding:9px 13px; border-radius:9px; text-decoration:none;
  color:var(--noak-fg2); font-size:13.5px; font-weight:600; position:relative; background:none; transition:background .15s,color .15s; }
.topnav .nav a svg{ width:16px; height:16px; }
.topnav .nav a:hover{ background:rgba(255,255,255,0.05); color:var(--noak-fg); }
.topnav .nav a.on{ color:#fff; }
.topnav .nav a.on::after{ content:''; position:absolute; left:13px; right:13px; bottom:-1px; height:2.5px; background:var(--noak-orange); border-radius:2px; }
.topnav .nav-right{ display:flex; align-items:center; gap:10px; }
.topnav .who{ font-size:13px; color:var(--noak-fg2); font-weight:600; }
.topnav .pill-admin{ font-family:ui-monospace,monospace; font-size:10px; letter-spacing:.08em; text-transform:uppercase; font-weight:700; color:var(--noak-slate); background:var(--noak-slate-soft); padding:5px 10px; border-radius:999px; }
.topnav .nbtn{ display:inline-flex; align-items:center; gap:6px; font-size:12.5px; font-weight:600; color:var(--noak-fg2); background:rgba(255,255,255,0.04); border:1px solid var(--noak-border); border-radius:8px; padding:7px 12px; cursor:pointer; font-family:inherit; }
.topnav .nbtn svg{ width:14px; height:14px; }
.topnav .nbtn:hover{ color:#fff; border-color:var(--noak-slate); }
@media (max-width:640px){ nav.topnav{ padding:0 14px; } .topnav .brand .coresa{ display:none; } }