/* ============================================================
 * Hana Brain — Design Tokens
 * Single source of truth for color, surface, and accent values.
 * Override these on :root for theming.
 * ============================================================ */

:root {
  color-scheme: light;

  /* --- Hana brand core --- */
  --hana-ink:   #0a0a0a;
  --hana-paper: #ece8e1;
  --hana-fuji:  #a78bc9;
  --hana-fuji-vivid: #c2a8e8;
  --hana-fuji-soft:  #e2d8f0;

  /* --- surfaces (background, in order of visual weight) --- */
  --bg-outer: #ebe7df;   /* page */
  --bg-main:  #f4f1eb;   /* inset (table headers, hover, code) */
  --bg-side:  #fafaf6;   /* sidebar */
  --bg-card:  #ffffff;   /* floating layer (cards, modals) */
  --bg: var(--bg-outer);
  --surface: var(--bg-card);
  --surface-strong: var(--bg-side);

  /* --- borders --- */
  --border:        #e6e2d6;
  --border-strong: #d6d1c2;

  /* --- text --- */
  --text:     #1a1a1a;
  --text-mid: #5e5b54;
  --muted:    #5e5b54;

  /* --- accent (use sparingly; lavender is the only brand chroma) --- */
  --accent:      var(--hana-fuji);
  --accent-soft: var(--hana-fuji-soft);
  --accent-vivid: var(--hana-fuji-vivid);
  --primary: var(--hana-ink);
  --primary-strong: var(--hana-ink);

  /* --- status pairs (bg + tx always together) --- */
  --pending-bg: #fef0e0;  --pending-tx: #c97411;
  --running-bg: #e2ebf7;  --running-tx: #3868a3;
  --done-bg:    #dff5e5;  --done-tx:    #2d7a45;
  --fail-bg:    #fce0e0;  --fail-tx:    #b8393c;
  --skip-bg:    #ebe8e0;  --skip-tx:    #6b675f;
  --success-bg: var(--done-bg);
  --success: var(--done-tx);
  --warning-bg: var(--running-bg);
  --warning: var(--running-tx);
  --error-bg: var(--fail-bg);
  --error: var(--fail-tx);

  /* --- elevation --- */
  --focus-ring: 0 0 0 3px rgba(167, 139, 201, 0.28);
  --shadow-card:    0 1px 2px rgba(10,10,10,0.03);
  --shadow-hover:   0 4px 14px rgba(10,10,10,0.06);
  --shadow-popover: 0 12px 36px rgba(10,10,10,0.18);
  --shadow-toast:   0 6px 20px rgba(10,10,10,0.15);
  --shadow-modal:   0 20px 60px rgba(10,10,10,0.5);
}