/* Hexes Security — colour tokens (v2, 2026-09-17)
   World: "Ice" — cyan on ink-blue (v1 was mint on teal-navy; moved away from the SUSE / NeuVector green family).
   The accent tokens keep their historical --hx-mint* names as aliases; prefer --hx-cyan* in new code. Dark-first; light theme derived.
   Use these names in web/ and hexessecurity/ — never hard-code the hex values. */

:root {
  /* brand */
  --hx-navy-950: #0A1220;   /* primary dark surface (mark tile, hero, app chrome) */
  --hx-navy-900: #101A2C;   /* cards on dark */
  --hx-navy-800: #17233A;   /* raised surfaces, hover on dark */
  --hx-line-dark: #1C2A40;  /* borders on dark */
  --hx-ice: #E6F1F5;        /* text + mark on dark */
  --hx-muted-dark: #8FA3B8; /* secondary text on dark, "SECURITY" on dark */
  --hx-cyan: #4CDFF0;       /* the accent: lit core, lit terminal, primary action on dark */
  --hx-cyan-deep: #0891B2;  /* accent for text/links/buttons on light (4.5:1+ on white) */
  --hx-cyan-soft: #CDF4FA;  /* accent tint: badges, selected rows on light */
  --hx-mint: var(--hx-cyan); --hx-mint-deep: var(--hx-cyan-deep); --hx-mint-soft: var(--hx-cyan-soft); /* legacy aliases */

  /* light theme */
  --hx-ink: #0B1626;        /* text + mark on light */
  --hx-surface: #F5F8FB;    /* page background, light */
  --hx-card: #FFFFFF;
  --hx-line: #E1E8F0;
  --hx-muted: #5B6B7E;      /* secondary text on light, "SECURITY" on light */

  /* status (product UI only — never in the logo) */
  --hx-amber: #F59E0B;
  --hx-danger: #F87171;
  --hx-info: #7C9CFF;

  /* semantic defaults = light */
  --hx-bg: var(--hx-surface);
  --hx-fg: var(--hx-ink);
  --hx-fg-muted: var(--hx-muted);
  --hx-border: var(--hx-line);
  --hx-accent: var(--hx-mint-deep);
  --hx-accent-strong: var(--hx-mint);
}

@media (prefers-color-scheme: dark) {
  :root:not([data-theme="light"]) {
    --hx-bg: var(--hx-navy-950);
    --hx-fg: var(--hx-ice);
    --hx-fg-muted: var(--hx-muted-dark);
    --hx-border: var(--hx-line-dark);
    --hx-accent: var(--hx-mint);
    --hx-accent-strong: var(--hx-mint);
  }
}
:root[data-theme="dark"] {
  --hx-bg: var(--hx-navy-950);
  --hx-fg: var(--hx-ice);
  --hx-fg-muted: var(--hx-muted-dark);
  --hx-border: var(--hx-line-dark);
  --hx-accent: var(--hx-mint);
  --hx-accent-strong: var(--hx-mint);
}