/* ============================================================
   Color tokens — single source of truth for every color used
   under dashboard/. See CLAUDE.md "Frontend Design System Rules".
   Extracted verbatim from styles.css's old :root block (no visual
   diff), plus new tokens for colors that were previously
   hardcoded/duplicated across JS files.
   ============================================================ */
:root{
  /* Ryven palette */
  --black:#030303;
  --white:#FEFEFE;
  --bg:#F5F5F9;
  --border:#E8E8ED;
  --border-light:#F0F0F4;

  /* Semantic — --accent/--success/--warning/--danger are remapped to
     Velzon's REAL brand colors (see dashboard/design-system/velzon/velzon-colors.css,
     the source of truth for these values) so every existing var(--token)
     call site keeps working, now resolving to the real Velzon palette.
     --primary/--primary-dark/--primary-light are NOT remapped — they're
     used as near-black ink/text throughout styles.css, not a brand color. */
  --primary:#030303;
  --primary-dark:#000;
  --primary-light:#F0F0F4;
  --accent:#5ea3cb;               /* Velzon --vz-primary */
  --accent-light:rgba(94,163,203,.12);
  /* Constant white text/glyphs sitting on a colored surface that itself
     doesn't invert (--accent, --tag-indigo, a status pill, a brand chip) —
     unlike --white (the app's surface color, which DOES invert), this
     stays #fff in both themes so that text stays legible. Intentionally
     NOT overridden in the dark block below. */
  --on-accent:#fff;
  --success:#6ada7d;              /* Velzon --vz-success */
  --success-bg:rgba(106,218,125,.15);
  --warning:#f7b84b;              /* Velzon --vz-warning */
  --warning-bg:rgba(247,184,75,.15);
  --danger:#fa896b;               /* Velzon --vz-danger */
  --danger-bg:rgba(250,137,107,.15);

  /* Gray scale */
  --gray-50:#F9FAFB;
  --gray-100:#F3F4F6;
  --gray-200:#E5E7EB;
  --gray-300:#D1D5DB;
  --gray-400:#9CA3AF;
  --gray-500:#6B7280;
  --gray-600:#4B5563;
  --gray-700:#374151;
  --gray-800:#1F2937;
  --gray-900:#111827;

  /* Strong success/danger — dedupe repeated #10B981/#EF4444 literals in JS */
  --success-strong:#10B981;
  --danger-strong:#EF4444;

  /* Recurring untokenized tag accent (lead_profile.css, discover.css) */
  --tag-indigo:#6366F1;
  --tag-purple:#8B5CF6;

  /* CRM board status colors — dedupe crm.js's inline _CRM_COLUMNS table */
  --status-pending-fg:#6B7280;            --status-pending-bg:#F3F4F6;
  --status-called-fg:#1E40AF;             --status-called-bg:#DBEAFE;
  --status-interested-fg:#065F46;         --status-interested-bg:#D1FAE5;
  --status-callback-fg:#92400E;           --status-callback-bg:#FEF3C7;
  --status-meeting-fg:#5B21B6;            --status-meeting-bg:#EDE9FE;
  --status-converted-fg:#14532D;          --status-converted-bg:#BBF7D0;
  --status-not-interested-fg:#991B1B;     --status-not-interested-bg:#FEE2E2;

  /* Third-party brand colors (credentials.js) — identity marks, stay
     constant across themes, see the note in the dark block below. */
  --brand-twilio:#F22F46;
  --brand-elevenlabs:#6C2BD9;
  --brand-claude:#D97706;
  --brand-xai:#111827;
  --brand-apollo:#7C3AED;
  --brand-lusha:#00C2A8;
  --brand-slack:#4A154B;
  --brand-gmail:#EA4335;
  --brand-google-calendar:#1A73E8;
  --brand-webhook:#7C3AED;
  --brand-linkedin:#0A66C2;
}

html[data-theme="dark"]{
  --black:#F5F5F7;
  --white:#0B0B0D;
  --bg:#0F1115;
  --border:#26262C;
  --border-light:#1C1C22;

  --primary:#F5F5F7;
  --primary-dark:#FFFFFF;
  --primary-light:#1C1C22;
  /* --accent/--success/--warning/--danger intentionally NOT overridden —
     matches Velzon's own real dark-mode behavior: brand/semantic colors
     stay constant across themes, only surfaces/text/borders invert. */
  --accent-light:rgba(94,163,203,.18);
  --success-bg:rgba(106,218,125,.18);
  --warning-bg:rgba(247,184,75,.18);
  --danger-bg:rgba(250,137,107,.18);

  --gray-50:#18181B;
  --gray-100:#1F1F23;
  --gray-200:#27272A;
  --gray-300:#3F3F46;
  --gray-400:#71717A;
  --gray-500:#A1A1AA;
  --gray-600:#D4D4D8;
  --gray-700:#E4E4E7;
  --gray-800:#F4F4F5;
  --gray-900:#FAFAFA;

  --success-strong:#34D399;
  --danger-strong:#F87171;

  --tag-indigo:#818CF8;
  --tag-purple:#A78BFA;

  --status-pending-fg:#A1A1AA;            --status-pending-bg:#27272A;
  --status-called-fg:#93C5FD;             --status-called-bg:#0F2247;
  --status-interested-fg:#6EE7B7;         --status-interested-bg:#0F2A1B;
  --status-callback-fg:#FBBF24;           --status-callback-bg:#2A2110;
  --status-meeting-fg:#C4B5FD;            --status-meeting-bg:#241B3D;
  --status-converted-fg:#86EFAC;          --status-converted-bg:#132A1B;
  --status-not-interested-fg:#FCA5A5;     --status-not-interested-bg:#2A1414;

  /* --brand-* intentionally NOT overridden — external identity marks
     (Twilio red, ElevenLabs purple, etc.) stay constant across themes.
     --on-accent intentionally NOT overridden either, same reasoning. */
}