/* ---------------------------------------------------------------------------
   Genesis — Color tokens
   Indigo is reserved for interactive elements only. Never decoration.
   --------------------------------------------------------------------------- */

:root {
  /* ---- Brand / interactive ---------------------------------------------- */
  --color-primary: #6366f1;          /* CTAs, active states, links, focus rings */
  --color-primary-hover: #4f46e5;    /* hover on primary elements */
  --color-primary-ring: rgba(99, 102, 241, 0.12);  /* 3px focus ring */
  --color-primary-glow: rgba(99, 102, 241, 0.35);   /* primary btn hover glow */
  --color-secondary: #20970b;        /* RESERVED: DESIGN.md brand highlight only */

  /* ---- Neutrals --------------------------------------------------------- */
  --color-bg: #fafafa;               /* page background, warm light gray */
  --color-surface: #ffffff;          /* cards, panels, modals, nav */
  --color-text-primary: #0a0a0a;     /* headings, body, primary labels */
  --color-text-secondary: #6b6b6b;   /* descriptions, metadata */
  --color-text-muted: #9c9c9c;       /* placeholders, timestamps, disabled */
  --color-border: #e8e8ec;           /* card borders, dividers, inputs */

  /* surface stops used for chips / hover fills */
  --color-bg-alt: #f4f4f5;           /* nav-link hover, list-row hover */
  --color-gray-100: #f1f1f3;         /* tag chip background */
  --color-gray-600: #525257;         /* tag chip text */
  --color-gray-200: #e4e4e7;         /* unchecked toggle */

  /* ---- Semantic --------------------------------------------------------- */
  --color-success: #10b981;          /* published, confirmations */
  --color-warning: #f59e0b;          /* pending, caution */
  --color-error: #ef4444;            /* destructive, validation, rejected */

  --color-success-soft: rgba(16, 185, 129, 0.12);
  --color-warning-soft: rgba(245, 158, 11, 0.14);
  --color-error-soft: rgba(239, 68, 68, 0.12);

  /* ---- Semantic aliases ------------------------------------------------- */
  --surface-page: var(--color-bg);
  --surface-card: var(--color-surface);
  --surface-sunken: var(--color-bg-alt);
  --text-heading: var(--color-text-primary);
  --text-body: var(--color-text-primary);
  --text-meta: var(--color-text-secondary);
  --text-placeholder: var(--color-text-muted);
  --border-default: var(--color-border);
  --link: var(--color-primary);
  --focus-ring: var(--color-primary-ring);
}
