/* ══ legacy-skin.css — the hub look, laid over the ~95 legacy screens (Sep 2 2026) ═══════════
   Sean, 8:50, on the portal: "most of the pages aren't looking like the home screen that we
   made yesterday". The seven hubs and the pages built for the brief carry the new look; every
   older screen still draws inside the shell with its own finish — gold gradients, coloured top
   bars on cards, mono uppercase buttons, tabs in a grey pill. Page-by-page would take days.
   This sheet lands the look on all of them at once.

   HOW IT WORKS, AND WHY IT CANNOT BREAK BEHAVIOUR. It contains no markup and no JS. It restyles
   only the SHARED LEGACY CLASSES the old screens use (.dashboard-header, .page-header, .card,
   .cc-card, .stat-card, .action-btn, .btn, .tabs/.tab, table, inputs, .badge, .modal) to the
   brief's palette: navy #0d1b2a, body #f6f8fa, white cards with a 14px radius and a hairline
   #e6eaee, Inter body, Newsreader titles, blue #007abb secondary, green #0e7c66, amber #8a6d2f,
   red #b42318. Widths, grids and positions are left alone so nothing reflows.

   IT IS AN OVERLAY WITH A SWITCH. Every rule is scoped to body.cw-hubs.cw-skin — the hub shell
   on (cwlg_hubs.js sets cw-hubs) AND the skin on (the gate script beside the <link> in
   portal.html sets cw-skin unless localStorage cw_skin === 'off', and never on the clients door).
   Delete the one <link> and nothing has changed. Same doctrine as theme-refresh.css and hubs.css.

   WHAT IT MUST NOT TOUCH. The hub pages built Sep 1–2 carry their own class prefixes and their
   own inline <style> (.cwmh .cwwh .cwst .cwnt .cwpy .cwmc .cwpb .cwcp .cwct .cwpw .cwpr .cwpp
   .cwcal, #cwNumbers, #cwHome) and the shell itself (#cwHubHeader, #cwHubRail, #cwHubPhoneBar).
   No selector here names any of them — scripts/test-legacy-skin.mjs refuses the file if one
   appears. Dark mode (body.cw-sb-dark) is left alone on purpose: the skin is a light-surface
   finish and a dark station keeps its current look.

   SPECIFICITY RULE (from theme-refresh.css): module styles are injected at runtime and land after
   this file, so source order cannot be relied on. The two-class body prefix plus .main-content
   wins by specificity; !important appears only where an older sheet already used it.        */

/* ── 1 · GROUND + TYPE ──────────────────────────────────────────────────────────────────── */
body.cw-hubs.cw-skin .main-content{ color:#0d1b2a; font-family:'Inter',-apple-system,sans-serif; }
body.cw-hubs.cw-skin .main-content .v2-view{ color:#0d1b2a; }

/* titles: one serif voice, no top line, no italic deck */
body.cw-hubs.cw-skin .main-content h1,
body.cw-hubs.cw-skin .main-content .dashboard-header h1,
body.cw-hubs.cw-skin .main-content .client-header h1,
body.cw-hubs.cw-skin .main-content .page-header h1,
body.cw-hubs.cw-skin .main-content .v2-view .page-header h1{
  font-family:'Newsreader',Georgia,serif !important; font-weight:700 !important; font-size:26px !important;
  letter-spacing:-.015em !important; line-height:1.15 !important; color:#0d1b2a !important; margin-top:0;
}
body.cw-hubs.cw-skin .main-content h2,
body.cw-hubs.cw-skin .main-content .v2-view h2{
  font-family:'Newsreader',Georgia,serif !important; font-weight:700 !important; font-size:20px !important;
  letter-spacing:-.012em !important; color:#0d1b2a !important;
}
body.cw-hubs.cw-skin .main-content .dashboard-header p,
body.cw-hubs.cw-skin .main-content .page-header .ph-sub,
body.cw-hubs.cw-skin .main-content .v2-view .page-header .ph-sub,
body.cw-hubs.cw-skin .main-content .client-header .client-meta{
  font-family:'Inter',sans-serif !important; font-style:normal !important; font-size:13px !important;
  color:#5f7184 !important; line-height:1.5;
}
body.cw-hubs.cw-skin .main-content .v2-view .page-header{ border-bottom:1px solid #e6eaee; padding:4px 0 16px; margin-bottom:18px; }
body.cw-hubs.cw-skin .main-content .v2-view .page-header::before{ display:none; }
body.cw-hubs.cw-skin .main-content .dashboard-header{ margin-bottom:18px; }

/* kickers: the hub's small Inter caps, not the mono dash */
body.cw-hubs.cw-skin .main-content .v2-view h3,
body.cw-hubs.cw-skin .main-content .recent-activity h3,
body.cw-hubs.cw-skin .main-content .v2-view .kpi .label{
  font-family:'Inter',sans-serif !important; font-size:10.5px !important; font-weight:700 !important;
  letter-spacing:.14em !important; text-transform:uppercase !important; color:#8a98a8 !important;
  border-bottom:none !important; padding-bottom:0; margin:0 0 8px;
}
body.cw-hubs.cw-skin .main-content .v2-view h3::before{ display:none !important; }

/* ── 2 · CARDS: white, hairline, 14px, one soft shadow, no coloured top bar, no lift ───── */
body.cw-hubs.cw-skin .main-content .card,
body.cw-hubs.cw-skin .main-content .v2-view .card,
body.cw-hubs.cw-skin .main-content .cc-card,
body.cw-hubs.cw-skin .main-content .stat-card,
body.cw-hubs.cw-skin .main-content .recent-activity,
body.cw-hubs.cw-skin .main-content .meeting-card,
body.cw-hubs.cw-skin .main-content .note-card,
body.cw-hubs.cw-skin .main-content .quarterly-card{
  background:#fff !important; border:1px solid #e6eaee !important; border-radius:14px !important;
  box-shadow:0 1px 2px rgba(13,27,42,.05) !important; background-image:none !important;
}
body.cw-hubs.cw-skin .main-content .card:hover,
body.cw-hubs.cw-skin .main-content .v2-view .card:hover,
body.cw-hubs.cw-skin .main-content .cc-card:hover,
body.cw-hubs.cw-skin .main-content .stat-card:hover,
body.cw-hubs.cw-skin .main-content .meeting-card:hover{
  border-color:#cfd9e2 !important; box-shadow:0 1px 2px rgba(13,27,42,.05) !important; transform:none !important;
}
body.cw-hubs.cw-skin .main-content .stat-card::before,
body.cw-hubs.cw-skin .main-content .meeting-card::before{ display:none !important; }
/* the three tinted states keep their meaning as a left edge, not a coloured lid */
body.cw-hubs.cw-skin .main-content .v2-view .card.warn{ background:#fff !important; border-left:4px solid #8a6d2f !important; }
body.cw-hubs.cw-skin .main-content .v2-view .card.bad,
body.cw-hubs.cw-skin .main-content .v2-view .card.urgent{ background:#fff !important; border-left:4px solid #b42318 !important; }
body.cw-hubs.cw-skin .main-content .v2-view .card.good{ background:#fff !important; border-left:4px solid #0e7c66 !important; }

/* the number and its label, the way every hub tile reads */
body.cw-hubs.cw-skin .main-content .stat-card .stat-val,
body.cw-hubs.cw-skin .main-content .v2-view .kpi .val{
  font-family:'Newsreader',Georgia,serif !important; font-weight:800 !important; font-size:30px !important;
  letter-spacing:-.02em !important; color:#0d1b2a !important; line-height:1;
}
body.cw-hubs.cw-skin .main-content .stat-card .stat-label{ font:600 11px 'Inter',sans-serif !important; color:#8a98a8 !important; margin-top:6px; }
body.cw-hubs.cw-skin .main-content .client-header-avatar{ border-radius:12px; background:#0d1b2a !important; }

/* ── 3 · BUTTONS: sentence case, 10px radius, navy primary, blue-outline secondary ─────── */
body.cw-hubs.cw-skin .main-content .action-btn,
body.cw-hubs.cw-skin .main-content .btn{
  font-family:'Inter',sans-serif !important; font-size:12px !important; font-weight:800 !important;
  letter-spacing:0 !important; text-transform:none !important; border-radius:10px !important;
  padding:9px 15px !important; transition:background .15s, border-color .15s, color .15s !important;
  box-shadow:none !important; transform:none !important; background-image:none !important;
}
body.cw-hubs.cw-skin .main-content .action-btn.primary,
body.cw-hubs.cw-skin .main-content .btn.primary{ background:#0d1b2a !important; color:#fff !important; border:1px solid #0d1b2a !important; }
body.cw-hubs.cw-skin .main-content .action-btn.primary:hover,
body.cw-hubs.cw-skin .main-content .btn.primary:hover{ background:#000 !important; box-shadow:none !important; transform:none !important; }
body.cw-hubs.cw-skin .main-content .action-btn.secondary,
body.cw-hubs.cw-skin .main-content .btn.secondary,
body.cw-hubs.cw-skin .main-content .btn.ghost{ background:#fff !important; border:1px solid #cfe3f0 !important; color:#007abb !important; }
body.cw-hubs.cw-skin .main-content .action-btn.secondary:hover,
body.cw-hubs.cw-skin .main-content .btn.secondary:hover,
body.cw-hubs.cw-skin .main-content .btn.ghost:hover{ border-color:#007abb !important; color:#005a8a !important; background:#f2f8fc !important; }
body.cw-hubs.cw-skin .main-content .action-btn.danger,
body.cw-hubs.cw-skin .main-content .btn.danger{ background:#fff !important; border:1px solid #f1c9c5 !important; color:#b42318 !important; }
body.cw-hubs.cw-skin .main-content .action-btn.danger:hover,
body.cw-hubs.cw-skin .main-content .btn.danger:hover{ background:#fdf3f1 !important; }
body.cw-hubs.cw-skin .main-content .action-btn.sm,
body.cw-hubs.cw-skin .main-content .btn.sm{ padding:6px 11px !important; font-size:11px !important; border-radius:8px !important; }

/* ── 4 · TABS inside a screen: the hub's underline, not a grey pill ────────────────────── */
body.cw-hubs.cw-skin .main-content .tabs{
  background:transparent !important; border:none !important; border-bottom:1px solid #e6eaee !important;
  border-radius:0 !important; padding:0 !important; gap:18px !important; margin-bottom:18px;
}
body.cw-hubs.cw-skin .main-content .tab{
  font-family:'Inter',sans-serif !important; font-size:12.5px !important; font-weight:700 !important;
  letter-spacing:0 !important; text-transform:none !important; color:#5f7184 !important;
  background:transparent !important; border:none !important; border-bottom:2px solid transparent !important;
  border-radius:0 !important; padding:10px 2px !important; margin-bottom:-1px;
}
body.cw-hubs.cw-skin .main-content .tabs{ scrollbar-width:none; }
body.cw-hubs.cw-skin .main-content .tabs::-webkit-scrollbar{ display:none; }
body.cw-hubs.cw-skin .main-content .tab:hover{ color:#0d1b2a !important; }
body.cw-hubs.cw-skin .main-content .tab.active{ color:#0d1b2a !important; border-bottom-color:#0d1b2a !important; background:transparent !important; }

/* ── 5 · TABLES: caps header, hairline rows, quiet hover ───────────────────────────────── */
body.cw-hubs.cw-skin .main-content table th,
body.cw-hubs.cw-skin .main-content .cc-tbl th,
body.cw-hubs.cw-skin .main-content table.pw-tbl th{
  font-family:'Inter',sans-serif !important; font-size:10.5px !important; font-weight:700 !important;
  letter-spacing:.12em !important; text-transform:uppercase !important; color:#8a98a8 !important;
  background:transparent !important; border-bottom:1px solid #e6eaee !important; padding:8px 10px !important;
}
body.cw-hubs.cw-skin .main-content table td,
body.cw-hubs.cw-skin .main-content .cc-tbl td{
  font-family:'Inter',sans-serif !important; font-size:13px !important; color:#0d1b2a !important;
  border-bottom:1px solid #f0f3f6 !important; padding:9px 10px !important;
}
body.cw-hubs.cw-skin .main-content table tbody tr:hover td{ background:#f6f8fa !important; }

/* ── 6 · INPUTS: hairline, 10px radius, navy focus, no glow ────────────────────────────── */
body.cw-hubs.cw-skin .main-content input[type="text"],
body.cw-hubs.cw-skin .main-content input[type="search"],
body.cw-hubs.cw-skin .main-content input[type="email"],
body.cw-hubs.cw-skin .main-content input[type="tel"],
body.cw-hubs.cw-skin .main-content input[type="number"],
body.cw-hubs.cw-skin .main-content input[type="date"],
body.cw-hubs.cw-skin .main-content input:not([type]),
body.cw-hubs.cw-skin .main-content select,
body.cw-hubs.cw-skin .main-content textarea{
  font-family:'Inter',sans-serif !important; font-size:13px !important; color:#0d1b2a !important;
  background:#fff !important; border:1px solid #dfe6ec !important; border-radius:10px !important;
  padding:9px 12px !important; box-shadow:none !important;
}
body.cw-hubs.cw-skin .main-content input:focus,
body.cw-hubs.cw-skin .main-content select:focus,
body.cw-hubs.cw-skin .main-content textarea:focus{ border-color:#0d1b2a !important; outline:none !important; box-shadow:none !important; }
body.cw-hubs.cw-skin .main-content .form-group label{
  font-family:'Inter',sans-serif !important; font-size:10.5px !important; font-weight:700 !important;
  letter-spacing:.1em !important; text-transform:uppercase !important; color:#8a98a8 !important; margin-bottom:4px;
}

/* ── 7 · BADGES + MODALS ───────────────────────────────────────────────────────────────── */
body.cw-hubs.cw-skin .main-content .badge,
body.cw-hubs.cw-skin .main-content .pill,
body.cw-hubs.cw-skin .main-content .tag{
  font-family:'Inter',sans-serif !important; font-size:10px !important; font-weight:800 !important;
  letter-spacing:.06em; border-radius:6px !important; padding:2px 7px !important;
  background:#eef2f6 !important; color:#0d1b2a !important; background-image:none !important; border:none !important;
}
body.cw-hubs.cw-skin .modal{ border-radius:14px !important; border:1px solid #e6eaee !important; box-shadow:0 30px 80px rgba(13,27,42,.18) !important; }
body.cw-hubs.cw-skin .modal-overlay{ background:rgba(13,27,42,.42) !important; backdrop-filter:none !important; }
body.cw-hubs.cw-skin .modal h2,
body.cw-hubs.cw-skin .modal h3{ font-family:'Newsreader',Georgia,serif !important; font-weight:700 !important; color:#0d1b2a !important; }
