/* Jazz design-system tokens — mirrored from webapp/appv2 (style-dictionary output). */


:root {
  --radius: 0.625rem;
  /* The product's page width ceiling (@theme --container-page), read by .page-container. */
  --container-page: 1900px;
  /* shadcn base tokens the product defines in styles.css and the token export does not.
     `--sidebar` is the one the theme maps to `bg-sidebar` — `--sidebar-background` below is
     exported but unused by the product, so matching it would tint the rail one step too dark. */
  --sidebar: oklch(0.985 0 0);
  --card-foreground: oklch(0.141 0.005 285.823);
  --popover-foreground: oklch(0.141 0.005 285.823);
  --secondary-foreground: oklch(0.21 0.006 285.885);
  --accent-foreground: oklch(0.21 0.006 285.885);
  --destructive: oklch(0.577 0.245 27.325);
  --destructive-foreground: oklch(0.577 0.245 27.325);
  --funnel-1: #9be6fe;
  --funnel-2: #76c7fc;
  --funnel-3: #38a4df;
  --funnel-4: #2190c8;
  --foreground: #18181b; /** Primary text color on the background , body */
  --muted-foreground: #71717a; /** De-emphasized text (captions, labels) secondary */
  --link: #4f46e5;
  --inverted-foreground: #fafafa;
  --primary-foreground: #241e12; /** Text and icons on primary-colored elements */
  --background: #ffffff; /** Main application background */
  --muted: #f9f9f9; /** Subdued background for less important elements */
  --accent: #f8f0e1; /** Highlight color for active, hover or focused elements */
  --secondary: #faf9f7; /** Less prominent action, hover, focus color */
  --primary: #ecd093; /** Brand color for primary actions (buttons, highlights) */
  --control: #241e12; /** Color for interactive controls (checkboxes, radios, switches) */
  --card: #ffffff; /** Card component background */
  --background-canvas: #fafafa; /** Card component background */
  --popover: #ffffff; /** Background for dropdown menus and popovers */
  --inverted-background: #27272a;
  --background-strong: #e4e4e7; /** darker background for smaller elements that need emphasis */
  --overlay-background: rgba(0, 0, 0, 0.4); /** Blanket overlay for modals */
  --border: #e4e4e7; /** Default border color */
  --border-strong: #a1a1aa;
  --input: #e4e4e7; /** Form inputs and button borders */
  --ring: #241e12; /** Focus indicator color */
  --ring-offset: #ffffff; /** The color of the space between a focused element and its ring outline */
  --positive: #059669;
  --positive-subtle: #ecfdf5;
  --negative: #dc2626;
  --negative-subtle: #fef2f2;
  --warning: #fbbf24;
  --warning-subtle: #fffbeb;
  --attention: #f97316;
  --attention-subtle: #ffedd5;
  --pending: #71717a;
  --pending-subtle: #fafafa;
  --info: #3b82f6;
  --info-subtle: #eff6ff;
  --insight: #8b5cf6;
  --insight-subtle: #f5f3ff;
  --sidebar-primary-foreground: #fafafa; /** Text on sidebar primary elements */
  --sidebar-primary: #ecd093; /** Primary actions within sidebar */
  --sidebar-foreground: #18181b; /** Text and icons within sidebar */
  --sidebar-background: #f9f9f9; /** Sidebar background */
  --sidebar-accent: #ecd093; /** Highlighted elements within sidebar */
  --sidebar-accent-foreground: #423925; /** Text on sidebar accent elements */
  --sidebar-border: #faf9f7; /** Sidebar divider lines or borders */
  --sidebar-ring: #241e12; /** Focus indicators within sidebar */
  --data-01: #f6e6ca;
  --data-02: #2ba4af;
  --data-03: #bd3b4b;
  --data-04: #efc06e;
  --data-05: #6600ff;
  --data-06: #641120;
  --data-07: #7acfad;
  --data-08: #30007a;
  --data-09: #963d7a;
  --data-10: #380610;
  --data-11: #a970ff;
  --data-12: #7f560f;
  --data-13: #c29afd;
  --data-14: #e5a432;
  --data-15: #f59ad8;
  --data-16: #d86674;
}


.dark {
  --sidebar: oklch(0.21 0.006 285.885);
  --card-foreground: oklch(0.985 0 0);
  --popover-foreground: oklch(0.985 0 0);
  --secondary-foreground: oklch(0.985 0 0);
  --accent-foreground: oklch(0.985 0 0);
  --destructive: color-mix(in oklab, oklch(0.577 0.245 27.325) 85%, transparent);
  --destructive-foreground: oklch(0.637 0.237 25.331);
  --funnel-1: color-mix(in oklab, #9be6fe 80%, black);
  --funnel-2: color-mix(in oklab, #76c7fc 80%, black);
  --funnel-3: color-mix(in oklab, #38a4df 80%, black);
  --funnel-4: color-mix(in oklab, #2190c8 80%, black);
  --foreground: #fafafa; /** Primary text color on the background , body */
  --muted-foreground: #d4d4d8; /** De-emphasized text (captions, labels) secondary */
  --link: #818cf8;
  --inverted-foreground: #18181b;
  --primary-foreground: #18181b; /** Text and icons on primary-colored elements */
  --background: #0a0a0a; /** Main application background */
  --muted: rgba(63, 63, 70, 0.5); /** Subdued background for less important elements */
  --accent: rgba(236, 208, 147, 0.12); /** Highlight color for active, hover or focused elements */
  --secondary: rgba(248, 240, 225, 0.12); /** Less prominent action, hover, focus color */
  --primary: #e3c073; /** Brand color for primary actions (buttons, highlights) */
  --control: #faf9f7; /** Color for interactive controls (checkboxes, radios, switches) */
  --card: #171717; /** Card component background */
  --background-canvas: #d4d4d8; /** Card component background */
  --popover: #262626; /** Background for dropdown menus and popovers */
  --inverted-background: #f5f5f5;
  --background-strong: #71717a; /** darker background for smaller elements that need emphasis */
  --overlay-background: rgba(0, 0, 0, 0.4); /** Blanket overlay for modals */
  --border: rgba(255, 255, 255, 0.12); /** Default border color */
  --border-strong: #d4d4d8;
  --input: rgba(255, 255, 255, 0.16); /** Form inputs and button borders */
  --ring: #faf9f7; /** Focus indicator color */
  --ring-offset: #0a0a0a; /** The color of the space between a focused element and its ring outline */
  --positive: #34d399;
  --positive-subtle: #022c22;
  --negative: #f87171;
  --negative-subtle: #450a0a;
  --warning: #fde68a;
  --warning-subtle: #451a03;
  --attention: #fdba74;
  --attention-subtle: #431407;
  --pending: #d4d4d8;
  --pending-subtle: #3f3f46;
  --info: #93c5fd;
  --info-subtle: #172554;
  --insight: #ddd6fe;
  --insight-subtle: #2e1065;
  --sidebar-primary-foreground: #09090b; /** Text on sidebar primary elements */
  --sidebar-primary: #f3e3c5; /** Primary actions within sidebar */
  --sidebar-foreground: #e4e4e7; /** Text and icons within sidebar */
  --sidebar-background: #1a1a1a; /** Sidebar background */
  --sidebar-accent: #ecd093; /** Highlighted elements within sidebar */
  --sidebar-accent-foreground: #241e12; /** Text on sidebar accent elements */
  --sidebar-border: rgba(255, 255, 255, 0.05); /** Sidebar divider lines or borders */
  --sidebar-ring: #faf9f7; /** Focus indicators within sidebar */
  --data-01: #f6e6ca;
  --data-02: #2ba4af;
  --data-03: #bd3b4b;
  --data-04: #efc06e;
  --data-05: #6600ff;
  --data-06: #99763a;
  --data-07: #7acfad;
  --data-08: #9047ff;
  --data-09: #963d7a;
  --data-10: #20676d;
  --data-11: #a970ff;
  --data-12: #7f560f;
  --data-13: #c29afd;
  --data-14: #e5a432;
  --data-15: #f59ad8;
  --data-16: #979fa8;
}
