/* ============================================================
   Thaum CRM Base Theme — Design Tokens v1.0 (2026-07-14)
   ============================================================
   SOURCE OF TRUTH for every CRM build produced from the Thaum
   CRM Stack Recipe. Do not fork this file per customer — import
   it and override ONLY the three --tl-accent-* tokens (plus the
   customer logo). See DESIGN-SYSTEM.md §Theming contract.

   Derivation: Salesforce Lightning structure and neutrals,
   Thaum.dev brand hues (thaum.dev CSS, captured 2026-07-14).
   All text/background pairs below were WCAG-checked; the two
   deliberate exceptions are documented inline.
   ============================================================ */

:root {
  /* ---- Brand core (Thaum) ------------------------------- */
  --tl-navy-900: #171F31;  /* Thaum navy — global nav, headings, primary text */
  --tl-navy-700: #2A3654;  /* nav hover, secondary dark surfaces */
  --tl-blue-700: #054F9E;  /* pressed/active state of primary actions */
  --tl-blue-600: #0563C4;  /* PRIMARY ACTION + LINKS (white text = 5.9:1) */
  --tl-blue-500: #077BEE;  /* Thaum brand blue — icons, focus, highlights.
                              NOT for button fills with small text (white = 4.1:1) */
  --tl-blue-300: #7DBCFB;  /* decorative, chart tints */
  --tl-blue-200: #B8D4FA;  /* borders on info surfaces */
  --tl-blue-100: #E8EEF8;  /* selected rows, active tab tint, hover tint */
  --tl-blue-50:  #F0F7FE;  /* info tint background */

  /* ---- Customer accent slot (THE ONLY PER-CUSTOMER TOKENS) */
  --tl-accent:          #2D62EC; /* default = Thaum indigo */
  --tl-accent-contrast: #FFFFFF; /* text/icon on accent (verify ≥4.5:1 on swap) */
  --tl-accent-tint:     #EAF0FE; /* pale wash of the accent for chips/rings */

  /* ---- Neutrals ------------------------------------------ */
  --tl-ink-900: #171F31;   /* text: primary (16.5:1 on white) */
  --tl-ink-600: #4A5568;   /* text: secondary (7.5:1) */
  --tl-ink-400: #949494;   /* text: placeholder/disabled ONLY (3.0:1 — never body copy) */
  --tl-line-300: #D8DDE6;  /* standard borders, table rules */
  --tl-line-200: #E5E9F0;  /* hairlines, card dividers */
  --tl-surface-0: #FFFFFF; /* cards, panels, inputs */
  --tl-surface-1: #F7F9FC; /* zebra rows, wells */
  --tl-surface-2: #F4F6F9; /* PAGE BACKGROUND (Salesforce neutral) */

  /* ---- Status (reserved — never reuse as chart series) ---- */
  --tl-success:      #15C212; /* mark/icon only (Thaum green) */
  --tl-success-text: #0B7A0A; /* on tint = 5.0:1 */
  --tl-success-tint: #E8F9E7;
  --tl-warning:      #FEB029; /* mark/icon only (Thaum amber) */
  --tl-warning-text: #8A5A00; /* on tint = 5.4:1 */
  --tl-warning-tint: #FFF4DE;
  --tl-error:        #E01A1A; /* destructive buttons (white text = 4.9:1) */
  --tl-error-text:   #B00E0E; /* on tint = 6.3:1 */
  --tl-error-tint:   #FDECEC;
  --tl-info:         #077BEE;
  --tl-info-text:    #0563C4; /* on tint = 5.4:1 */
  --tl-info-tint:    #F0F7FE;

  /* ---- Charts: categorical, FIXED ORDER, never cycled ----
     Validated 2026-07-14 (dataviz six-checks, light surface):
     lightness band PASS, chroma PASS, CVD worst-pair ΔE 21.6 PASS.
     Slot 2 (#DD7A01) is 2.98:1 vs surface → charts using it must
     direct-label or offer a table view. 7th+ series = "Other". */
  --tl-chart-1: #077BEE;  /* blue   (Thaum) */
  --tl-chart-2: #DD7A01;  /* amber  */
  --tl-chart-3: #8B5CF6;  /* violet */
  --tl-chart-4: #0D9488;  /* teal   */
  --tl-chart-5: #D45B3A;  /* rust   (from thaum.dev css) */
  --tl-chart-6: #B03A83;  /* plum   */

  /* ---- Typography ----------------------------------------- */
  --tl-font: "Inter", -apple-system, "Segoe UI", system-ui, sans-serif;
  --tl-text-body: 0.875rem;      /* 14px — default UI text */
  --tl-text-table: 0.8125rem;    /* 13px — data tables, dense lists */
  --tl-text-label: 0.6875rem;    /* 11px — form labels, section labels:
                                    uppercase, letter-spacing 0.06em, ink-600 */
  --tl-text-title: 1.25rem;      /* 20px/700 — page & record titles */
  --tl-text-section: 1rem;       /* 16px/600 — card & section headings */
  --tl-text-hero: 3rem;          /* 48px — hero figure, one per dashboard view */
  --tl-leading: 1.5;

  /* ---- Geometry ------------------------------------------- */
  --tl-radius-control: 4px;      /* buttons, inputs, badges */
  --tl-radius-card: 8px;         /* cards, panels, modals */
  --tl-space: 4px;               /* base unit; spacing = multiples of 4 */
  --tl-control-h: 32px;          /* button/input height (Salesforce-dense) */
  --tl-shadow-1: 0 1px 2px rgba(23, 31, 49, 0.06);
  --tl-shadow-2: 0 2px 6px rgba(23, 31, 49, 0.10);
  --tl-focus-ring: 0 0 0 3px rgba(7, 123, 238, 0.35); /* blue-500 @35% */
}