/* tokens.css — unified design tokens. ONE vocabulary, three skins.
 * Loaded AFTER style.css / client.css so these values win.
 * Canonical palette: single BLUE accent, dark theme is the default.
 * Owns the TYPOGRAPHY SCALE too (--fs-* / --fw-*): a literal font-size
 * or font-weight anywhere else is a bug, same rule as the palette.
 * The client panel (.cp-app) keeps its own legacy --acc/--bd/... defined in
 * client.css; this file just ADDS the canonical names there too. */

/* ---- typeface -------------------------------------------------------
 * IBM Plex Sans, self-hosted variable (400-600 in one file). Humanist,
 * high x-height, readable at 13px in regular weight — chosen over the
 * previous Avenir Next, a geometric display face whose low x-height and
 * heavy Demi made dense UI read "small and thick".
 * The version lives IN THE FILENAME: a different cut is a new file, never
 * the same name with new bytes (asset() cannot cache-bust an @font-face). */
@font-face {
  font-family: "IBM Plex Sans";
  src: url("../fonts/ibm-plex-sans-400-600-v1.woff2") format("woff2");
  font-weight: 400 600;
  font-style: normal;
  font-display: swap;
}

/* ---- typography scale (shared by every skin) ------------------------
 * Hard floor 12px, hard weight ceiling 600. Nothing below --fs-2xs and
 * nothing above --fw-semibold may exist in any component. */
:root {
  --fs-2xs:.75rem;    /* 12px — pills, badges, inline code */
  --fs-xs:.8125rem;   /* 13px — micro-labels, table headers */
  --fs-sm:.875rem;    /* 14px — secondary text, help, nav */
  --fs-md:.9375rem;   /* 15px — body, inputs, table cells */
  --fs-lg:1.0625rem;  /* 17px — h4, subtitles */
  --fs-xl:1.25rem;    /* 20px — h3, section heads */
  --fs-2xl:1.5rem;    /* 24px — h2 */
  --fs-3xl:1.75rem;   /* 28px — h1 */

  --fw-normal:400;    /* all running text */
  --fw-medium:500;    /* labels, emphasis, active nav */
  --fw-semibold:600;  /* ABSOLUTE CEILING: headings and totals only */

  /* sidebar geometry — expanded vs collapsed rail (operator shell) */
  --sidebar-w:15.625rem;      /* 250px */
  --sidebar-w-rail:4.5rem;    /* 72px  */
}

/* ---- operator dark (default) ---- */
:root,
[data-theme="dark"] {
  --bg:#0f1216; --panel:#161b22; --panel2:#1e242e;
  --border:#2e3644; --border-subtle:#232a35;
  --text:#eef1f5; --text2:#c9d0da; --muted:#9aa4b4; --faint:#6b7689;
  --accent:#58a6ff; --accent-fg:#071120; --accent-hover:#74b6ff;
  --accent-soft:rgba(88,166,255,.15); --accent-border:rgba(88,166,255,.45);
  --ok:#4cd07d; --ok-soft:rgba(76,208,125,.14); --ok-border:rgba(76,208,125,.5);
  --warn:#f2c14a; --warn-soft:rgba(242,193,74,.14); --warn-border:rgba(242,193,74,.5);
  --err:#ff8a80; --err-soft:rgba(255,138,128,.14); --err-border:rgba(255,138,128,.5);
  --r-sm:6px; --r:8px; --r-lg:11px; --r-pill:999px; --r-md:var(--r);
  --shadow-sm:0 1px 2px rgba(0,0,0,.3); --shadow:0 8px 24px rgba(0,0,0,.35);
  --font:"IBM Plex Sans","Helvetica Neue",Arial,sans-serif;
  --font-display:var(--font);   /* one family: headings differ by size+weight */
  --font-mono:ui-monospace,"SF Mono",Menlo,Consolas,monospace;
  --font-body:var(--font);
  --danger:var(--err); --danger-soft:var(--err-soft);
  /* sidebar (nav shell) */
  --sidebar-bg:#131820; --sidebar-text:#cbd3de; --sidebar-text-muted:#8792a3;
  --sidebar-heading:#f2f5f9; --sidebar-border:rgba(255,255,255,.07);
}

/* ---- operator light (theme toggle) ---- */
[data-theme="light"] {
  --bg:#f1f4f8; --panel:#ffffff; --panel2:#e9edf3;
  --border:#cfd7e3; --border-subtle:#e1e7ef;
  --text:#1b2434; --text2:#3d4a5f; --muted:#5c6a81; --faint:#8794a8;
  --accent:#0b63ce; --accent-fg:#ffffff; --accent-hover:#0a56b3;
  --accent-soft:#e3effc; --accent-border:#a9cdf2;
  --ok:#157347; --ok-soft:rgba(21,115,71,.12); --ok-border:rgba(21,115,71,.38);
  --warn:#8f5f00; --warn-soft:rgba(143,95,0,.12); --warn-border:rgba(143,95,0,.38);
  --err:#c92a2a; --err-soft:rgba(201,42,42,.1); --err-border:rgba(201,42,42,.4);
  --shadow-sm:0 1px 2px rgba(15,23,42,.06); --shadow:0 8px 24px rgba(15,23,42,.12);
  --danger:var(--err); --danger-soft:var(--err-soft);
  /* sidebar (nav shell) */
  --sidebar-bg:#f8fafc; --sidebar-text:#3a4557; --sidebar-text-muted:#64738c;
  --sidebar-heading:#16202f; --sidebar-border:#dde4ec;
}

/* ---- client light (.cp-app) — canonical names alongside legacy --acc/--bd ---- */
.cp-app {
  --bg:#ffffff; --panel:#f8fafc; --panel2:#f1f5f9;
  --border:#cbd5e1; --border-subtle:#e2e8f0;
  --text:#0f172a; --text2:#334155; --muted:#64748b; --faint:#94a3b8;
  --accent:#0b63ce; --accent-fg:#ffffff; --accent-hover:#0a56b3;
  --accent-soft:#e3effc; --accent-border:#a9cdf2;
  --ok:#157347; --ok-soft:rgba(21,115,71,.12); --ok-border:rgba(21,115,71,.38);
  --warn:#8f5f00; --warn-soft:rgba(143,95,0,.12); --warn-border:rgba(143,95,0,.38);
  --err:#c92a2a; --err-soft:rgba(201,42,42,.1); --err-border:rgba(201,42,42,.4);
  --r-sm:4px; --r:6px; --r-lg:12px; --r-pill:999px; --r-md:var(--r);
  --shadow-sm:0 1px 2px rgba(15,23,42,.06); --shadow:0 8px 24px rgba(15,23,42,.16);
  --font-body:var(--font);
  --danger:var(--err); --danger-soft:var(--err-soft);
}

/* ---- nav icons ------------------------------------------------------
 * Stroke SVGs applied as a MASK, so the glyph inherits currentColor and
 * the active/hover states keep working with zero extra rules. Replaces
 * the unicode glyphs (⌂ ▦ ♙ ≋ …), which rendered from fallback fonts at
 * 14px and were illegible once the sidebar collapsed to a rail. */
:root {
  --ic-home:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.7' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M3.5 10.6 12 3.6l8.5 7'/%3E%3Cpath d='M5.8 9.6V20h12.4V9.6'/%3E%3Cpath d='M9.8 20v-5.2h4.4V20'/%3E%3C/svg%3E");
  --ic-fines:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.7' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='2.4' y='6' width='19.2' height='12' rx='2.2'/%3E%3Ccircle cx='12' cy='12' r='2.6'/%3E%3Cpath d='M6 10.4v.02M18 13.6v.02'/%3E%3C/svg%3E");
  --ic-plates:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.7' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='2.6' y='5.6' width='18.8' height='12.8' rx='2.2'/%3E%3Cpath d='M6.4 10.6h3.2M12.4 10.6h5.2M6.4 14.2h11.2'/%3E%3C/svg%3E");
  --ic-runs:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.7' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M20.4 12a8.4 8.4 0 1 1-2.5-6'/%3E%3Cpath d='M20.4 4v4.4H16'/%3E%3C/svg%3E");
  --ic-queue:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.7' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M4 6.2h16M4 12h11.5M4 17.8h7'/%3E%3C/svg%3E");
  --ic-download:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.7' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M12 3.4v11.4'/%3E%3Cpath d='M7.6 10.6 12 15l4.4-4.4'/%3E%3Cpath d='M4.2 19.8h15.6'/%3E%3C/svg%3E");
  --ic-upload:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.7' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M12 15V3.6'/%3E%3Cpath d='M7.6 8 12 3.6 16.4 8'/%3E%3Cpath d='M4.2 19.8h15.6'/%3E%3C/svg%3E");
  --ic-settings:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.7' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M12.22 2h-.44a2 2 0 0 0-2 2v.18a2 2 0 0 1-1 1.73l-.43.25a2 2 0 0 1-2 0l-.15-.08a2 2 0 0 0-2.73.73l-.22.38a2 2 0 0 0 .73 2.73l.15.1a2 2 0 0 1 1 1.72v.51a2 2 0 0 1-1 1.74l-.15.09a2 2 0 0 0-.73 2.73l.22.38a2 2 0 0 0 2.73.73l.15-.08a2 2 0 0 1 2 0l.43.25a2 2 0 0 1 1 1.73V20a2 2 0 0 0 2 2h.44a2 2 0 0 0 2-2v-.18a2 2 0 0 1 1-1.73l.43-.25a2 2 0 0 1 2 0l.15.08a2 2 0 0 0 2.73-.73l.22-.39a2 2 0 0 0-.73-2.73l-.15-.08a2 2 0 0 1-1-1.74v-.5a2 2 0 0 1 1-1.74l.15-.09a2 2 0 0 0 .73-2.73l-.22-.38a2 2 0 0 0-2.73-.73l-.15.08a2 2 0 0 1-2 0l-.43-.25a2 2 0 0 1-1-1.73V4a2 2 0 0 0-2-2z'/%3E%3Ccircle cx='12' cy='12' r='3'/%3E%3C/svg%3E");
  --ic-users:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.7' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='9.2' cy='8' r='3.3'/%3E%3Cpath d='M2.8 19.6c0-3.4 2.9-5.6 6.4-5.6s6.4 2.2 6.4 5.6'/%3E%3Cpath d='M16.4 5.2a3.3 3.3 0 0 1 0 5.6'/%3E%3Cpath d='M17.6 14.4c2.3.6 3.6 2.5 3.6 5.2'/%3E%3C/svg%3E");
  --ic-test:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.7' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='12' cy='12' r='8.8'/%3E%3Cpath d='m7.8 12.3 2.9 2.9 5.5-5.7'/%3E%3C/svg%3E");
  --ic-tenants:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.7' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='3.2' y='3.2' width='7.4' height='7.4' rx='1.7'/%3E%3Crect x='13.4' y='3.2' width='7.4' height='7.4' rx='1.7'/%3E%3Crect x='3.2' y='13.4' width='7.4' height='7.4' rx='1.7'/%3E%3Crect x='13.4' y='13.4' width='7.4' height='7.4' rx='1.7'/%3E%3C/svg%3E");
  --ic-sites:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.7' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='12' cy='12' r='8.8'/%3E%3Cpath d='M3.2 12h17.6'/%3E%3Cpath d='M12 3.2a13.6 13.6 0 0 1 0 17.6 13.6 13.6 0 0 1 0-17.6'/%3E%3C/svg%3E");
  --ic-alerts:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.7' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M12 3.6 21.4 19.9H2.6z'/%3E%3Cpath d='M12 9.8v4.6M12 17.5v.02'/%3E%3C/svg%3E");
  --ic-health:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.7' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M2.8 12.2h4.1l2.4-5.8 4 12.2 2.3-6.4h5.6'/%3E%3C/svg%3E");
  --ic-logs:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.7' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M4.4 6.4h.02M8.4 6.4h11.2M4.4 12h.02M8.4 12h11.2M4.4 17.6h.02M8.4 17.6h7.6'/%3E%3C/svg%3E");
  --ic-ai:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.7' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M13.6 2.8 15.5 8l5.2 1.9-5.2 1.9-1.9 5.2-1.9-5.2L6.5 9.9 11.7 8z'/%3E%3Cpath d='M6 15.2l.85 2.3 2.3.85-2.3.85L6 21.5l-.85-2.3-2.3-.85 2.3-.85z'/%3E%3C/svg%3E");
}
