/* =====================================================================
   TRANXACT design tokens — LIFTED VERBATIM from client/src/styles.css
   by tools/theme.mjs. GENERATED: the next extraction overwrites it, so
   a correction belongs in styles.css, where the product reads it too.

   5 blocks: :root plus 4 themes (dark, midnight, contrast, sepia).

   Every colour, radius, font and spacing step the documentation draws
   resolves to one of these, exactly as the console does — so the two
   cannot drift apart on how the product looks.
   ===================================================================== */

:root {
  /* ---- the surfaces -------------------------------------------------
     Every color in the console resolves to one of the tokens below, and
     a theme is nothing more than a different set of values for them. That
     is the whole mechanism: there is no second stylesheet per theme and
     no color written anywhere but here.
     ------------------------------------------------------------------ */
  --ink: #0f1a7a;          /* TRANXACT.AI navy — headings, brand */
  --ink-soft: #f3f5f9;     /* subtle wash for selected nav rows */
  --paper: #ffffff;        /* the page behind everything */
  --card: #ffffff;         /* panels, tables, drawers */
  --wash: #f8fafc;         /* a surface one step back from a card */
  --wash-2: #eef0f3;       /* two steps back: table heads, inert chips */
  --line: #e2e5ea;
  --line-soft: #eef0f3;    /* the rule between two table rows */
  --line-strong: #cfd5dd;
  --text: #22293a;
  --text-dim: #6a7284;
  /* Text that sits ON a filled brand color. Constant across every theme,
     because the fill is dark in all of them. */
  --on-brand: #ffffff;
  --brand-red: #e5232b;
  --petrol: #0f1a7a;
  --petrol-dark: #0b1358;

  /* The accent. Falls back to the house navy; a personal or company
     accent overrides it from JavaScript, and everything that used to name
     var(--petrol) as its fallback now names this. */
  --accent: #0f1a7a;

  /* ---- state, and the washes that carry it -------------------------- */
  --ok: #15803d;
  --warn: #b45309;
  --bad: #b91c1c;
  --info: #1d4ed8;
  --ok-wash: #e5f4ea;
  --ok-line: #86efac;
  --warn-wash: #fdf1e0;
  --warn-line: #fcd9a5;
  --bad-wash: #fdeaea;
  --bad-line: #f5c9c9;
  --info-wash: #e8edfc;
  --info-line: #cfe0f7;

  /* ---- depth --------------------------------------------------------
     Shadows are written as rgba(var(--shadow-rgb), a) so a dark theme can
     deepen them instead of glowing. */
  --shadow-rgb: 16, 27, 45;
  --brand-rgb: 15, 26, 122;
  --overlay: rgba(16, 27, 45, 0.45);

  /* ---- the module spine --------------------------------------------- */
  --mod-dashboard: #0f1a7a;
  --mod-accounting: #0f1a7a;
  --mod-crm: #4338ca;
  --mod-hrms: #86198f;
  --mod-scm: #92610f;
  --mod-mfg: #0f5c8c;
  --mod-ehr: #0f7a4d;
  --mod-slcm: #7a2f8f;
  --mod-platform: #0e6f7a;
  --mod-admin: #475569;
  --mod-help: #b4530e;

  --radius: 10px;
  --font-display: 'Space Grotesk', sans-serif;
  --font-body: 'IBM Plex Sans', system-ui, sans-serif;
  --font-mono: 'IBM Plex Mono', ui-monospace, monospace;

  /* ---- density and scale --------------------------------------------
     Set from personalization. The paddings a person actually feels are
     expressed as a multiple of --pad, and the console's own font size is
     multiplied by --ui-scale. */
  --ui-scale: 1;
  --pad: 1;
  --row-pad: 9px;

  /* The spacing ramp. Written as a multiple of --pad like every other
     padding here, so a screen built out of these follows the density
     setting for free — which is the point: finance.css asked for
     --space-3 and --space-4 before they existed, fell through to its own
     hardcoded rem, and was the one part of the console that ignored
     Compact and Spacious entirely. */
  --space-1: calc(4px * var(--pad));
  --space-2: calc(8px * var(--pad));
  --space-3: calc(12px * var(--pad));
  --space-4: calc(16px * var(--pad));
  --space-5: calc(20px * var(--pad));
  --space-6: calc(28px * var(--pad));
}

[data-theme='dark'] {
  --ink: #c7d2fe;
  --ink-soft: #1e2536;
  --paper: #0e1220;
  --card: #161b2b;
  --wash: #1b2133;
  --wash-2: #222a3e;
  --line: #2b3348;
  --line-soft: #232a3c;
  --line-strong: #3a4459;
  --text: #e4e8f1;
  --text-dim: #98a2b8;
  --accent: #7d8cf8;
  --petrol: #7d8cf8;
  --petrol-dark: #5b6ce0;
  --brand-red: #ff6b6b;

  --ok: #4ade80;
  --warn: #fbbf24;
  --bad: #f87171;
  --info: #7dabff;
  --ok-wash: #14301f;
  --ok-line: #1e5b35;
  --warn-wash: #33260c;
  --warn-line: #6b5214;
  --bad-wash: #3a1a1c;
  --bad-line: #6e2a2e;
  --info-wash: #172542;
  --info-line: #2d4a7a;

  --shadow-rgb: 0, 0, 0;
  --brand-rgb: 125, 140, 248;
  --overlay: rgba(0, 0, 0, 0.62);

  --mod-dashboard: #8ea2ff;
  --mod-accounting: #8ea2ff;
  --mod-crm: #a5a0ff;
  --mod-hrms: #e07bd8;
  --mod-scm: #d9a441;
  --mod-mfg: #56b0e0;
  --mod-ehr: #4fc48c;
  --mod-slcm: #c78ae0;
  --mod-platform: #4fc2cf;
  --mod-admin: #94a3b8;
  --mod-help: #f0955a;
}

[data-theme='midnight'] {
  --ink: #d4d4d8;
  --ink-soft: #1c1c1f;
  --paper: #0a0a0b;
  --card: #141416;
  --wash: #1a1a1d;
  --wash-2: #232326;
  --line: #2c2c31;
  --line-soft: #232326;
  --line-strong: #3d3d44;
  --text: #e8e8ea;
  --text-dim: #9a9aa2;
  --accent: #a9b4ff;
  --petrol: #a9b4ff;
  --petrol-dark: #8590e8;
  --brand-red: #ff7a7a;

  --ok: #5ee08a;
  --warn: #f2c14e;
  --bad: #ff8080;
  --info: #8fb8ff;
  --ok-wash: #16281c;
  --ok-line: #245c37;
  --warn-wash: #2e2510;
  --warn-line: #63501a;
  --bad-wash: #2f1a1b;
  --bad-line: #63302f;
  --info-wash: #171d2c;
  --info-line: #2d3b58;

  --shadow-rgb: 0, 0, 0;
  --brand-rgb: 169, 180, 255;
  --overlay: rgba(0, 0, 0, 0.7);

  --mod-dashboard: #a9b4ff;
  --mod-accounting: #a9b4ff;
  --mod-crm: #b3a6ff;
  --mod-hrms: #e88fdd;
  --mod-scm: #dcae5c;
  --mod-mfg: #6cbce6;
  --mod-ehr: #63cd97;
  --mod-slcm: #cf9ce6;
  --mod-platform: #63cbd6;
  --mod-admin: #a1a1aa;
  --mod-help: #f3a271;
}

[data-theme='contrast'] {
  --ink: #000000;
  --ink-soft: #e8e8e8;
  --paper: #ffffff;
  --card: #ffffff;
  --wash: #f2f2f2;
  --wash-2: #e4e4e4;
  --line: #000000;
  --line-soft: #767676;
  --line-strong: #000000;
  --text: #000000;
  --text-dim: #3a3a3a;
  --accent: #00007a;
  --petrol: #00007a;
  --petrol-dark: #000050;

  --ok: #005c1f;
  --warn: #7a4200;
  --bad: #9b0000;
  --info: #00308f;
  --ok-wash: #d9f2e0;
  --ok-line: #005c1f;
  --warn-wash: #fdeed3;
  --warn-line: #7a4200;
  --bad-wash: #fbdcdc;
  --bad-line: #9b0000;
  --info-wash: #dce6fb;
  --info-line: #00308f;

  --shadow-rgb: 0, 0, 0;
  --brand-rgb: 0, 0, 122;
  --overlay: rgba(0, 0, 0, 0.6);

  --mod-dashboard: #00007a;
  --mod-accounting: #00007a;
  --mod-crm: #3a0080;
  --mod-hrms: #6b0060;
  --mod-scm: #6b3d00;
  --mod-mfg: #003a5c;
  --mod-ehr: #00502e;
  --mod-slcm: #4d0066;
  --mod-platform: #004a52;
  --mod-admin: #2b2b2b;
  --mod-help: #7a3200;
}

[data-theme='sepia'] {
  --ink: #4a3418;
  --ink-soft: #f2e9d8;
  --paper: #fbf5e9;
  --card: #fffaf0;
  --wash: #f6eedd;
  --wash-2: #efe3cd;
  --line: #ddcfb4;
  --line-soft: #ebe0ca;
  --line-strong: #c8b795;
  --text: #3a2f22;
  --text-dim: #7a6a55;
  --accent: #7a4a12;
  --petrol: #7a4a12;
  --petrol-dark: #5c3708;
  --brand-red: #a8321f;

  --ok: #3f6b21;
  --warn: #96590a;
  --bad: #9c2a20;
  --info: #2a5480;
  --ok-wash: #e6efd9;
  --ok-line: #b8cfa0;
  --warn-wash: #f8ecd2;
  --warn-line: #dcc08a;
  --bad-wash: #f6e0dc;
  --bad-line: #dfb2ab;
  --info-wash: #e2ebf4;
  --info-line: #b6c9dd;

  --shadow-rgb: 74, 52, 24;
  --brand-rgb: 122, 74, 18;
  --overlay: rgba(58, 47, 34, 0.42);

  --mod-dashboard: #7a4a12;
  --mod-accounting: #7a4a12;
  --mod-crm: #5a4899;
  --mod-hrms: #8a3170;
  --mod-scm: #8a6212;
  --mod-mfg: #26607f;
  --mod-ehr: #2c6b48;
  --mod-slcm: #6f3a80;
  --mod-platform: #2a6a70;
  --mod-admin: #6b6153;
  --mod-help: #a05a1a;
}

:root { --mod-ats: #8a4b1f; --mod-agentic: #5b3fa8; }
[data-theme='dark'] { --mod-ats: #e0a15a; --mod-agentic: #a48ae8; }
[data-theme='midnight'] { --mod-ats: #eab278; --mod-agentic: #b49cee; }
[data-theme='contrast'] { --mod-ats: #6b3d00; --mod-agentic: #3a0080; }
[data-theme='sepia'] { --mod-ats: #8a4b1f; --mod-agentic: #5b3fa8; }