/* Root tokens; CSSOM preference selection preserves server hydration markup. */
:root {
  /* shadcn HSL tokens — mapped to ZincAnalytics "Clarity" light palette */
  --zx-theme: light;
  --theme-toggle-track: hsl(var(--muted));
  --theme-toggle-offset: 0.125rem;
  color-scheme: light;
  --glass-rgb: 255 255 255;
  --glass-border: #8a8f99;
  --chart-series-1: #2358b8;
  --chart-series-2: #3575c8;
  --chart-series-3: #694aa5;
  --chart-series-4: #8a5da9;
  --chart-series-5: #176c73;
  --chart-series-6: #447677;
  --chart-series-outline: #ffffff;
  --background: 240 11% 98%; /* #FAFAFB */
  --foreground: 223 12% 12%; /* #1B1D22 */
  --card: 0 0% 100%; /* #FFFFFF */
  --card-foreground: 223 12% 12%;
  --popover: 0 0% 100%;
  --popover-foreground: 223 12% 12%;
  --primary: 221 100% 56%; /* ~#1F66FF — the ZincAnalytics blue, nudged 3% darker than the
                                design's #2F6BFF so white button text clears WCAG AA (≈4.8:1) */
  --primary-foreground: 0 0% 100%;
  --secondary: 220 14% 96%; /* #F3F4F6 */
  --secondary-foreground: 223 12% 12%;
  --muted: 220 14% 96%; /* #F3F4F6 */
  --muted-foreground: 220 6% 38%; /* #5B5E66 */
  --accent: 220 14% 96%;
  --accent-foreground: 223 12% 12%;
  --destructive: 0 72% 51%; /* #DC2626 — white text ≈4.8:1 (AA) */
  --destructive-foreground: 0 0% 100%;
  --border: 240 8% 91%; /* #E7E7EB */
  --input: 220 5% 53%;
  --ring: 221 100% 56%;
  --radius: 0.5rem;

  /* net-new ZincAnalytics design tokens (raw hex) */
  --surface: #ffffff;
  --subtle: #f3f4f6;
  --border-strong: #d6d7dc;
  --faint: #6b6e75; /* darker than the design's #8C8F97 so tertiary text clears WCAG AA (~5:1) */
  --primary-strong: #1f57e6;
  --primary-muted: #eef3ff;
  --success: #157b3b; /* 4.79:1 on success-muted for small status labels. */
  --success-muted: #e7f6ee;
  --warn: #9a5b04;
  --warn-muted: #fbf1e1;
  --warn-strong: #92400e; /* readable warn text on warn-muted (WCAG AA) */
  --destructive-muted: #fbeaea;
  --shadow-card: 0 1px 2px rgba(20, 22, 30, 0.05), 0 10px 26px -14px rgba(20, 22, 30, 0.14);

  /* Exact login brand-panel colours, not the admin dark-console theme. */
  --brand-panel: #12141a;
  --brand-panel-accent: #82a9ff;
  --brand-panel-muted: #a6abb5;
  --brand-panel-border: #2e3644;
  --brand-panel-gradient:
    radial-gradient(120% 90% at 12% 8%, rgba(47, 107, 255, 0.22), transparent 55%),
    radial-gradient(90% 80% at 100% 100%, rgba(47, 107, 255, 0.1), transparent 50%);
  /* Labelled chart series: blue sales, amber credits; exact values remain available. */
  --chart-sales: var(--chart-series-1);
  --chart-sales-strong: var(--primary-strong);
  --chart-credits: var(--warn);
}

@media (prefers-color-scheme: dark) {
  :root {
    /* Shared root dark palette. The bootstrap selects this CSSOM media rule. */
    --zx-theme: dark;
    --theme-toggle-track: hsl(var(--primary));
    --theme-toggle-offset: 0.875rem;
    color-scheme: dark;
    --glass-rgb: 23 27 33;
    --glass-border: #657286;
    --chart-series-1: #81aaff;
    --chart-series-2: #5f91e4;
    --chart-series-3: #b49be8;
    --chart-series-4: #957bd0;
    --chart-series-5: #7bbec4;
    --chart-series-6: #58a1aa;
    --chart-series-outline: #10151d;
    --background: 218 22% 7%; /* #0E1116 */
    --foreground: 220 9% 91%; /* #E6E8EB */
    --card: 216 18% 11%; /* #171B21 */
    --card-foreground: 220 9% 91%;
    --popover: 216 18% 11%;
    --popover-foreground: 220 9% 91%;
    --primary: 220 100% 68%; /* #5B93FF */
    --primary-foreground: 218 30% 9%; /* dark text on the bright dark-mode blue (white was 2.99:1) */
    --secondary: 214 18% 14%; /* #1E242B */
    --secondary-foreground: 220 9% 91%;
    --muted: 214 18% 14%;
    --muted-foreground: 216 7% 64%; /* #9BA0AA */
    --accent: 214 18% 14%;
    --accent-foreground: 220 9% 91%;
    --destructive: 0 84% 69%; /* #F26D6D */
    --destructive-foreground: 218 30% 9%;
    --border: 214 16% 18%; /* #262C34 */
    --input: 214 12% 45%;
    --ring: 220 100% 68%;

    --surface: #171b21;
    --subtle: #1e242b;
    --border-strong: #39414b;
    --faint: #8a919c; /* lighter than the design's #6B727C so tertiary text clears AA on dark surfaces */
    --primary-strong: #6699ff; /* lighter so accent-chip text clears AA on the dark primary-muted */
    --primary-muted: #17233a;
    --success: #34c77b;
    --success-muted: #12281d;
    --warn: #e0a23b;
    --warn-muted: #2a2113;
    --warn-strong: #e0a23b; /* on the dark warn-muted, the light amber already meets AA */
    --destructive-muted: #2a1616;
    --shadow-card: 0 1px 2px rgba(0, 0, 0, 0.4), 0 12px 30px -14px rgba(0, 0, 0, 0.6);
  }
}