/* =========================================================
   AegisGate — base.css
   Design tokens, theming, reset, typography.
   ========================================================= */

:root {
  /* Brand / signal palette (original — inspired by, not copied from, vendor UI) */
  --topbar-bg: #0d86c6;       /* azure header, ZIA-family feel */
  --topbar-bg-2: #21a0dc;
  --topbar-ink: #ffffff;
  --sidebar-bg: #ffffff;      /* light settings-style sidebar */
  --sidebar-bg-2: #f5f8fc;
  --sidebar-ink: #4a5872;
  --sidebar-ink-strong: #16202f;
  --sidebar-line: #e3e8f1;
  --accent: #0b7fc4;          /* azure blue — primary actions & links */
  --accent-ink: #ffffff;
  --accent-soft: rgba(11,127,196,.12);
  --allow: #1d9e6f;
  --block: #d64545;
  --warn:  #de9c1c;
  --info:  #3b6fd4;
  --quarantine: #8a5cd6;

  /* Workspace (light theme) */
  --bg: #f4f6fa;
  --surface: #ffffff;
  --surface-2: #f8fafd;
  --ink: #1b2334;
  --ink-2: #56617a;
  --ink-3: #8b95ab;
  --line: #e3e8f1;
  --line-strong: #cdd6e4;
  --shadow: 0 1px 2px rgba(20,28,48,.06), 0 4px 14px rgba(20,28,48,.05);
  --shadow-lg: 0 8px 32px rgba(15,22,40,.18);

  --radius: 10px;
  --radius-sm: 6px;
  --font: -apple-system, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
  --mono: ui-monospace, "SF Mono", "Cascadia Code", Consolas, Menlo, monospace;
}

[data-theme="dark"] {
  --bg: #0f1420;
  --surface: #171e2e;
  --surface-2: #1c2436;
  --ink: #e8edf6;
  --ink-2: #a6b1c7;
  --ink-3: #6f7b94;
  --line: #263048;
  --line-strong: #34405c;
  --shadow: 0 1px 2px rgba(0,0,0,.35), 0 4px 14px rgba(0,0,0,.25);
  --shadow-lg: 0 8px 32px rgba(0,0,0,.5);
  --topbar-bg: #0a5d8d;
  --topbar-bg-2: #0d7ab5;
  --sidebar-bg: #141b2c;
  --sidebar-bg-2: #101725;
  --sidebar-ink: #a8b3c9;
  --sidebar-ink-strong: #eef2f9;
  --sidebar-line: #232d44;
  --accent: #2b9fe0;
  --accent-soft: rgba(43,159,224,.18);
}

/* ---- Reset ---- */
*, *::before, *::after { box-sizing: border-box; }
html, body { margin: 0; padding: 0; }
body {
  font-family: var(--font);
  font-size: 13.5px;
  line-height: 1.5;
  color: var(--ink);
  background: var(--bg);
  -webkit-font-smoothing: antialiased;
}
img, svg { display: block; }
button { font: inherit; color: inherit; background: none; border: 0; cursor: pointer; }
input, select, textarea { font: inherit; color: var(--ink); }
a { color: var(--accent); text-decoration: none; }
::selection { background: var(--accent-soft); }

h1, h2, h3, h4 { margin: 0; font-weight: 600; }
.page-title { font-size: 19px; letter-spacing: -.01em; }
.page-desc { color: var(--ink-2); margin: 2px 0 0; font-size: 13px; }

/* Eyebrow labels — structural voice of the console */
.eyebrow {
  font-size: 10.5px;
  font-weight: 700;
  letter-spacing: .12em;
  text-transform: uppercase;
  color: var(--ink-3);
}

/* Numbers in data contexts read in tabular figures */
.num, .mono, td.num { font-family: var(--mono); font-variant-numeric: tabular-nums; font-size: 12.5px; }

/* Scrollbars */
* { scrollbar-width: thin; scrollbar-color: var(--line-strong) transparent; }
*::-webkit-scrollbar { width: 9px; height: 9px; }
*::-webkit-scrollbar-thumb { background: var(--line-strong); border-radius: 6px; }
*::-webkit-scrollbar-track { background: transparent; }

/* Motion discipline */
@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { animation: none !important; transition: none !important; }
}

/* Focus visibility */
:focus-visible { outline: 2px solid var(--accent); outline-offset: 1px; border-radius: 4px; }