/* ==========================================================================
   The Alternatives — Color tokens
   AUTHORITATIVE source: unified Next.js web codebase [web].

   DARK THEME ONLY. Light mode is deliberately not shipped: the web codebase
   uses `text-white` / `text-white/60` as its documented muted-text convention
   across hundreds of call sites, and no current user needs a second theme.

   Naming: theme-neutral ROLE names are canonical
   (--surface-*, --border-*, --accent-*, --text-*, --state-*).
   The older theme-specific names (--dark-bg, --neon-cyan-glow, …) are kept as
   back-compat aliases so nothing in either codebase breaks; new code should
   use the role names. Keeping the architecture theme-neutral is what leaves
   the door open to a light theme later without a token rewrite.
   --ink / --navy stay LITERAL brand swatches: they name the paint, not a role.
   ========================================================================== */

:root {
  color-scheme: dark;

  /* --- Brand swatches (literal — not roles) ----------------------------- */
  --ink: #2B1E32;    /* deep ink-plum */
  --navy: #1E2355;   /* deep navy     */

  /* --- Surfaces --------------------------------------------------------- */
  --surface-page: #2B1E32;    /* page background                           */
  --surface-card: #1E2355;    /* cards, panels                             */
  --surface-raised: #262B62;  /* ABOVE the card: menus, popovers, active
                                 rows [ex-mobile surfaceElevated]          */
  --border-default: #3A2F4A;
  --border-strong: rgba(255, 255, 255, 0.18);

  /* Form fields sit RECESSED below the card that contains them, so they use
     --surface-page, never --surface-raised. Legacy #1a1a2e maps here.      */
  --surface-input: var(--surface-page);

  /* --- Accents ---------------------------------------------------------- */
  --accent-primary: #18A5CB;         /* PRIMARY accent / interactive       */
  --accent-primary-bright: #65D5E6;  /* hover / highlight                  */
  --accent-primary-deep: #0E7A99;    /* pressed / active [ex-mobile
                                        primaryDark]                       */
  --accent-secondary: #981793;       /* magenta                            */
  --accent-tertiary: #5C1D8F;        /* deep purple / depth                */

  /* --- Text ------------------------------------------------------------- */
  --text-primary: #FFFFFF;
  --text-muted: rgba(255, 255, 255, 0.6);
  --text-faint: rgba(255, 255, 255, 0.4);
  --text-faintest: rgba(255, 255, 255, 0.3);
  --text-on-accent: #2B1E32;   /* ink text on bright cyan / the neon ramp  */

  /* --- Semantic state --------------------------------------------------- */
  /* Brand-shifted: pulled off the stock utility palette toward the neon ramp
     — error leans magenta, success leans cyan, warning warms.
     Mapping table from the old Tailwind classes: handoff/migration.md      */
  --state-error: #E8558B;
  --state-error-strong: #D6336C;
  --state-success: #3ECFA0;
  --state-success-strong: #23A87E;
  --state-warning: #E8C34A;
  --state-warning-strong: #C99A21;

  /* Tinted state surfaces (banners) */
  --state-error-surface: rgba(214, 51, 108, 0.10);
  --state-error-border: rgba(214, 51, 108, 0.50);
  --state-warning-surface: rgba(201, 154, 33, 0.10);
  --state-warning-border: rgba(201, 154, 33, 0.30);
  --state-success-surface: rgba(35, 168, 126, 0.10);
  --state-success-border: rgba(35, 168, 126, 0.40);
  --state-danger-surface: rgba(214, 51, 108, 0.05);
  --state-danger-border: rgba(214, 51, 108, 0.30);

  /* --- Content status (draft / published / coming soon) ------------------ */
  --status-published: var(--accent-primary);
  --status-draft: var(--text-faint);
  --status-soon: var(--accent-secondary);
  --status-review: var(--state-warning-strong);

  /* --- Hairlines & tints ------------------------------------------------ */
  --tint-hairline-weak: rgba(255, 255, 255, 0.06);
  --tint-hairline: rgba(255, 255, 255, 0.08);
  --tint-hairline-strong: rgba(255, 255, 255, 0.12);
  --tint-cyan-12: rgba(24, 165, 203, 0.12);
  --tint-cyan-15: rgba(24, 165, 203, 0.15);
  --tint-magenta-12: rgba(152, 23, 147, 0.12);
  --texture-line: rgba(255, 255, 255, 0.01);   /* body cross-hatch         */

  /* --- Data-visualization palette --------------------------------------- */
  /* Official functional scale. Categorical, six steps, for map markers and
     qualitative series. Deliberately NOT brand: never use these for UI
     chrome, and never use brand accents for a series.
     Fills and strokes only — pair with --text-primary for labels.         */
  --dataviz-1: #18A5CB;
  --dataviz-2: #A855F7;
  --dataviz-3: #F59E0B;
  --dataviz-4: #10B981;
  --dataviz-5: #F43F5E;
  --dataviz-6: #3B82F6;

  /* --- Back-compat aliases (existing web + RN code) --------------------- */
  --dark-bg: var(--surface-page);
  --dark-surface: var(--surface-card);
  --dark-border: var(--border-default);
  --neon-cyan-glow: var(--accent-primary);
  --neon-cyan-bright: var(--accent-primary-bright);
  --neon-magenta-glow: var(--accent-secondary);
  --neon-purple-deep: var(--accent-tertiary);
  --tint-white-06: var(--tint-hairline-weak);
  --tint-white-08: var(--tint-hairline);
  --tint-white-12: var(--tint-hairline-strong);
}
