/* ───────────────────────────────────────────────
   COLORS — Kraken-inspired palette
   Base values + semantic aliases.
   ─────────────────────────────────────────────── */
:root {
  /* ── Brand: Tooldox deep violet scale ── */
  --purple-500: #350279;      /* PRIMARY brand — CTA, links, accent */
  --purple-600: #2a0164;      /* darker — outlined borders, hover */
  --purple-700: #21004d;      /* deepest — dark surfaces */
  --purple-subtle: rgba(53, 2, 121, 0.10); /* 10% — subtle button bg */

  /* ── Brand: Tooldox Gold (identity accent, from logo) ── */
  --gold-300: #f8ec9e;        /* light — gradient end, tints */
  --gold-400: #e2c873;        /* mid */
  --gold-500: #d2b067;        /* core gold (logo) */
  --gold-600: #bf924f;        /* dark — gradient start, text on light */
  --gold-subtle: rgba(210, 176, 103, 0.18); /* 18% — gold fill */

  /* ── Deep brand surface (logo background) ── */
  --violet-900: #350279;      /* brand dark surface */

  /* ── Neutrals: near-black → cool blue-grays ── */
  --black: #101114;           /* primary text */
  --gray-700: #484b5e;        /* badge text, strong neutral */
  --gray-500: #686b82;        /* cool gray — borders, primary neutral */
  --gray-400: #9497a9;        /* silver blue — secondary/muted text */
  --gray-200: #dedee5;        /* divider / border gray */
  --white: #ffffff;           /* primary surface */

  /* Neutral tints (derived, for fills) */
  --gray-fill: rgba(148, 151, 169, 0.08);  /* secondary gray button bg */
  --gray-border: rgba(104, 107, 130, 0.24);/* hairline border @ 24% */

  /* ── Semantic: success / positive ── */
  --green-500: #149e61;       /* success accent */
  --green-700: #026b3f;       /* success badge text */
  --green-subtle: rgba(20, 158, 97, 0.16); /* success badge bg */

  /* ── Semantic: warning (amber — complements the violet brand) ── */
  --amber-500: #c9881a;       /* warning accent */
  --amber-700: #875400;       /* warning badge text */
  --amber-subtle: rgba(201, 136, 26, 0.16); /* warning badge bg */

  /* ── Semantic: error / negative ── */
  --red-500: #d23b3b;         /* error accent */
  --red-700: #9a1f1f;         /* error badge text */
  --red-subtle: rgba(210, 59, 59, 0.14); /* error badge bg */

  /* ─────────── Semantic aliases ─────────── */
  --brand: var(--purple-500);
  --brand-dark: var(--purple-600);
  --brand-deep: var(--purple-700);
  --brand-gold: var(--gold-500);       /* identity accent — logo, highlights */
  --brand-gold-deep: var(--gold-600);
  --brand-violet: var(--violet-900);   /* deep pairing violet */

  --text-primary: var(--black);
  --text-secondary: var(--gray-400);
  --text-muted: var(--gray-500);
  --text-on-brand: var(--white);
  --text-link: var(--purple-500);

  --surface: var(--white);
  --surface-subtle: var(--gray-fill);

  --border: var(--gray-200);
  --border-hairline: var(--gray-border);

  --success-bg: var(--green-subtle);
  --success-text: var(--green-700);
  --warning-bg: var(--amber-subtle);
  --warning-text: var(--amber-700);
  --error-bg: var(--red-subtle);
  --error-text: var(--red-700);
}