/* ==========================================================================
   XUI DESIGN SYSTEM — AI OS
   The interface of an operating system, not a web page. Grounded in the
   iPadOS references in hub/standards_for_ui: blurred color-field light,
   frosted translucent surfaces, continuous rounded corners, soft wide
   depth, one confident blue. Surfaces carry alpha so the light behind
   them shines through; the frost rules at the end blur what is beneath.
   ========================================================================== */

[data-theme="aios"] {
  --radius: 1.05rem;

  --background: oklch(0.965 0.006 255);
  --foreground: oklch(0.18 0.012 260);
  --card: oklch(1 0 0 / 0.78);
  --card-foreground: oklch(0.18 0.012 260);
  --popover: oklch(1 0 0 / 0.88);
  --popover-foreground: oklch(0.18 0.012 260);
  --primary: oklch(0.605 0.19 257.8);              /* iOS system blue #007AFF */
  --primary-foreground: oklch(0.995 0 0);
  --secondary: oklch(0.94 0.01 255 / 0.85);
  --secondary-foreground: oklch(0.24 0.015 260);
  --muted: oklch(0.94 0.008 255);
  --muted-foreground: oklch(0.51 0.015 260);        /* iOS secondary label */
  --accent: oklch(0.93 0.02 256 / 0.9);
  --accent-foreground: oklch(0.24 0.015 260);
  --destructive: oklch(0.628 0.222 27.3);           /* #FF3B30 */
  --destructive-foreground: oklch(0.995 0 0);
  --border: oklch(0.2 0.012 260 / 0.10);
  --input: oklch(0.2 0.012 260 / 0.13);
  --ring: oklch(0.605 0.19 257.8 / 0.5);

  --success: oklch(0.72 0.185 149);                 /* #34C759 */
  --success-foreground: oklch(0.995 0 0);
  --warning: oklch(0.77 0.155 66);                  /* #FF9F0A */
  --warning-foreground: oklch(0.24 0.05 66);
  --info: oklch(0.72 0.13 230);                     /* #5AC8FA family */
  --info-foreground: oklch(0.16 0.03 230);

  --chart-1: #0071e3;
  --chart-2: #1d8a3e;
  --chart-3: #c25e00;
  --chart-4: #8944ab;
  --chart-5: #d31b5b;

  /* categorical series, stepped for the light surface */
  --series-1: #0071e3;
  --series-2: #1d8a3e;
  --series-3: #c25e00;
  --series-4: #8944ab;
  --series-5: #d31b5b;

  --sidebar: oklch(1 0 0 / 0.65);
  --sidebar-foreground: oklch(0.18 0.012 260);
  --sidebar-primary: oklch(0.605 0.19 257.8);
  --sidebar-primary-foreground: oklch(0.995 0 0);
  --sidebar-accent: oklch(0.93 0.02 256 / 0.9);
  --sidebar-accent-foreground: oklch(0.24 0.015 260);
  --sidebar-border: oklch(0.2 0.012 260 / 0.08);
  --sidebar-ring: oklch(0.605 0.19 257.8 / 0.5);

  /* typography — the system face, like the system it imitates */
  --font-sans: -apple-system, BlinkMacSystemFont, "SF Pro Text", "Inter",
               "Segoe UI Variable", "Segoe UI", system-ui, sans-serif;
  --font-display: var(--font-sans);
  --font-mono: "SF Mono", ui-monospace, "JetBrains Mono", SFMono-Regular,
               Menlo, Consolas, monospace;
  --tracking-display: -0.022em;
  --tracking-tight: -0.012em;
  --tracking-normal: 0;
  --tracking-caps: 0.05em;
  --weight-normal: 400;
  --weight-medium: 500;
  --weight-semibold: 600;
  --weight-bold: 700;
  --weight-display: 700;
  --case-label: none;

  /* elevation — soft, wide, never harsh */
  --shadow-xs: 0 1px 3px 0 rgb(20 25 45 / 0.06);
  --shadow-sm: 0 2px 8px -1px rgb(20 25 45 / 0.08);
  --shadow-md: 0 6px 18px -4px rgb(20 25 45 / 0.12);
  --shadow-lg: 0 18px 40px -12px rgb(20 25 45 / 0.18);
  --shadow-xl: 0 30px 70px -18px rgb(20 25 45 / 0.24);

  /* motion — floaty, springy, an OS not a document */
  --ease-out: cubic-bezier(0.22, 0.61, 0.36, 1);
  --ease-in-out: cubic-bezier(0.65, 0, 0.35, 1);
  --ease-spring: cubic-bezier(0.34, 1.4, 0.64, 1);
  --dur-fast: 140ms;
  --dur-base: 240ms;
  --dur-slow: 420ms;
}

[data-theme="aios"][data-mode="dark"] {
  --background: oklch(0.135 0.012 262);
  --foreground: oklch(0.97 0.005 255);
  --card: oklch(0.245 0.015 262 / 0.72);
  --card-foreground: oklch(0.97 0.005 255);
  --popover: oklch(0.26 0.016 262 / 0.85);
  --popover-foreground: oklch(0.97 0.005 255);
  --primary: oklch(0.635 0.185 256);                /* iOS dark blue #0A84FF */
  --primary-foreground: oklch(0.995 0 0);
  --secondary: oklch(0.30 0.016 262 / 0.85);
  --secondary-foreground: oklch(0.97 0.005 255);
  --muted: oklch(0.28 0.012 262);
  --muted-foreground: oklch(0.72 0.01 258);
  --accent: oklch(0.33 0.03 258 / 0.9);
  --accent-foreground: oklch(0.97 0.005 255);
  --destructive: oklch(0.655 0.21 25);              /* #FF453A */
  --destructive-foreground: oklch(0.995 0 0);
  --border: oklch(1 0 0 / 0.12);
  --input: oklch(1 0 0 / 0.16);
  --ring: oklch(0.635 0.185 256 / 0.55);

  --success: oklch(0.76 0.2 150);                   /* #30D158 */
  --success-foreground: oklch(0.17 0.04 150);
  --warning: oklch(0.78 0.155 68);                  /* #FF9F0A */
  --warning-foreground: oklch(0.2 0.05 68);
  --info: oklch(0.78 0.115 225);                    /* #64D2FF */
  --info-foreground: oklch(0.16 0.03 225);

  --chart-1: #409cff;
  --chart-2: #30d158;
  --chart-3: #ffb340;
  --chart-4: #bf5af2;
  --chart-5: #ff6482;

  /* re-stepped for the dark surface, not flipped */
  --series-1: #409cff;
  --series-2: #30d158;
  --series-3: #ffb340;
  --series-4: #bf5af2;
  --series-5: #ff6482;

  --sidebar: oklch(0.22 0.014 262 / 0.65);
  --sidebar-foreground: oklch(0.97 0.005 255);
  --sidebar-primary: oklch(0.635 0.185 256);
  --sidebar-primary-foreground: oklch(0.995 0 0);
  --sidebar-accent: oklch(0.33 0.03 258 / 0.9);
  --sidebar-accent-foreground: oklch(0.97 0.005 255);
  --sidebar-border: oklch(1 0 0 / 0.10);
  --sidebar-ring: oklch(0.635 0.185 256 / 0.55);

  --shadow-xs: 0 1px 3px 0 rgb(0 0 0 / 0.45);
  --shadow-sm: 0 2px 8px -1px rgb(0 0 0 / 0.5);
  --shadow-md: 0 6px 18px -4px rgb(0 0 0 / 0.55);
  --shadow-lg: 0 18px 40px -12px rgb(0 0 0 / 0.6);
  --shadow-xl: 0 30px 70px -18px rgb(0 0 0 / 0.65);
}

/* ---- the frost -----------------------------------------------------------
   Surfaces carry alpha, so what sits behind them must blur through.
   Scoped to aios only; every other design system is untouched. */
[data-theme="aios"] .xui-card,
[data-theme="aios"] .xui-popover,
[data-theme="aios"] .xui-dialog,
[data-theme="aios"] .xui-sheet,
[data-theme="aios"] .xui-dropdown-menu,
[data-theme="aios"] .xui-sidebar {
  backdrop-filter: blur(24px) saturate(1.5);
  -webkit-backdrop-filter: blur(24px) saturate(1.5);
}


/* ==========================================================================
   XUI DESIGN SYSTEM — SHADCN UI
   The reference system. Tokens copied verbatim from ui.shadcn.com/docs/theming
   (new-york / oklch), extended with the extra semantic slots xui needs
   (success / warning / info, typography, motion, elevation).
   ========================================================================== */

[data-theme="shadcn"] {
  --radius: 0.625rem;

  --background: oklch(1 0 0);
  --foreground: oklch(0.145 0 0);
  --card: oklch(1 0 0);
  --card-foreground: oklch(0.145 0 0);
  --popover: oklch(1 0 0);
  --popover-foreground: oklch(0.145 0 0);
  --primary: oklch(0.205 0 0);
  --primary-foreground: oklch(0.985 0 0);
  --secondary: oklch(0.97 0 0);
  --secondary-foreground: oklch(0.205 0 0);
  --muted: oklch(0.97 0 0);
  --muted-foreground: oklch(0.556 0 0);
  --accent: oklch(0.97 0 0);
  --accent-foreground: oklch(0.205 0 0);
  --destructive: oklch(0.577 0.245 27.325);
  --destructive-foreground: oklch(0.985 0 0);
  --border: oklch(0.922 0 0);
  --input: oklch(0.922 0 0);
  --ring: oklch(0.708 0 0);

  --success: oklch(0.596 0.145 163.225);
  --success-foreground: oklch(0.985 0 0);
  --warning: oklch(0.769 0.153 70.08);
  --warning-foreground: oklch(0.216 0.04 70);
  --info: oklch(0.588 0.158 254.624);
  --info-foreground: oklch(0.985 0 0);

  --chart-1: oklch(0.646 0.222 41.116);
  --chart-2: oklch(0.6 0.118 184.704);
  --chart-3: oklch(0.398 0.07 227.392);
  --chart-4: oklch(0.828 0.189 84.429);
  --chart-5: oklch(0.769 0.188 70.08);

  /* Categorical series ramp for Chart.
     --chart-* above are shadcn's tokens verbatim; they are a warm ramp, not a
     categorical set (chart-4 and chart-5 are ~7 ΔE apart, indistinguishable).
     --series-* is the validated categorical order used by the Chart component:
     fixed assignment, never cycled, passes the lightness / chroma / CVD /
     normal-vision / contrast checks against this surface. */
  --series-1: #2563eb;
  --series-2: #0d9488;
  --series-3: #d97706;
  --series-4: #7c3aed;
  --series-5: #be123c;

  --sidebar: oklch(0.985 0 0);
  --sidebar-foreground: oklch(0.145 0 0);
  --sidebar-primary: oklch(0.205 0 0);
  --sidebar-primary-foreground: oklch(0.985 0 0);
  --sidebar-accent: oklch(0.97 0 0);
  --sidebar-accent-foreground: oklch(0.205 0 0);
  --sidebar-border: oklch(0.922 0 0);
  --sidebar-ring: oklch(0.708 0 0);

  /* typography */
  --font-sans: "Inter", ui-sans-serif, system-ui, -apple-system, "Segoe UI", sans-serif;
  --font-display: var(--font-sans);
  --font-mono: "JetBrains Mono", ui-monospace, SFMono-Regular, Menlo, monospace;
  --tracking-display: -0.025em;
  --tracking-tight: -0.015em;
  --tracking-normal: 0;
  --tracking-caps: 0.06em;
  --weight-normal: 400;
  --weight-medium: 500;
  --weight-semibold: 600;
  --weight-bold: 700;
  --weight-display: 700;
  --case-label: none;

  /* elevation */
  --shadow-xs: 0 1px 2px 0 rgb(0 0 0 / 0.05);
  --shadow-sm: 0 1px 3px 0 rgb(0 0 0 / 0.08), 0 1px 2px -1px rgb(0 0 0 / 0.08);
  --shadow-md: 0 4px 6px -1px rgb(0 0 0 / 0.09), 0 2px 4px -2px rgb(0 0 0 / 0.07);
  --shadow-lg: 0 10px 15px -3px rgb(0 0 0 / 0.1), 0 4px 6px -4px rgb(0 0 0 / 0.08);
  --shadow-xl: 0 20px 25px -5px rgb(0 0 0 / 0.1), 0 8px 10px -6px rgb(0 0 0 / 0.08);

  /* motion */
  --ease-out: cubic-bezier(0.22, 0.61, 0.36, 1);
  --ease-in-out: cubic-bezier(0.65, 0, 0.35, 1);
  --ease-spring: cubic-bezier(0.34, 1.56, 0.64, 1);
  --dur-fast: 120ms;
  --dur-base: 200ms;
  --dur-slow: 400ms;
}

[data-theme="shadcn"][data-mode="dark"] {
  --background: oklch(0.145 0 0);
  --foreground: oklch(0.985 0 0);
  --card: oklch(0.205 0 0);
  --card-foreground: oklch(0.985 0 0);
  --popover: oklch(0.205 0 0);
  --popover-foreground: oklch(0.985 0 0);
  --primary: oklch(0.922 0 0);
  --primary-foreground: oklch(0.205 0 0);
  --secondary: oklch(0.269 0 0);
  --secondary-foreground: oklch(0.985 0 0);
  --muted: oklch(0.269 0 0);
  --muted-foreground: oklch(0.708 0 0);
  --accent: oklch(0.269 0 0);
  --accent-foreground: oklch(0.985 0 0);
  --destructive: oklch(0.704 0.191 22.216);
  --destructive-foreground: oklch(0.985 0 0);
  --border: oklch(1 0 0 / 10%);
  --input: oklch(1 0 0 / 15%);
  --ring: oklch(0.556 0 0);

  --success: oklch(0.696 0.17 162.48);
  --success-foreground: oklch(0.18 0.02 162);
  --warning: oklch(0.828 0.189 84.429);
  --warning-foreground: oklch(0.2 0.04 84);
  --info: oklch(0.685 0.169 254.624);
  --info-foreground: oklch(0.18 0.03 254);

  --chart-1: oklch(0.488 0.243 264.376);
  --chart-2: oklch(0.696 0.17 162.48);
  --chart-3: oklch(0.769 0.188 70.08);
  --chart-4: oklch(0.627 0.265 303.9);
  --chart-5: oklch(0.645 0.246 16.439);

  /* re-stepped for the dark surface, not flipped — validated separately */
  --series-1: #4385e4;
  --series-2: #00a076;
  --series-3: #c96900;
  --series-4: #a564d1;
  --series-5: #d9515e;

  --sidebar: oklch(0.205 0 0);
  --sidebar-foreground: oklch(0.985 0 0);
  --sidebar-primary: oklch(0.488 0.243 264.376);
  --sidebar-primary-foreground: oklch(0.985 0 0);
  --sidebar-accent: oklch(0.269 0 0);
  --sidebar-accent-foreground: oklch(0.985 0 0);
  --sidebar-border: oklch(1 0 0 / 10%);
  --sidebar-ring: oklch(0.556 0 0);

  --shadow-xs: 0 1px 2px 0 rgb(0 0 0 / 0.4);
  --shadow-sm: 0 1px 3px 0 rgb(0 0 0 / 0.5), 0 1px 2px -1px rgb(0 0 0 / 0.5);
  --shadow-md: 0 4px 6px -1px rgb(0 0 0 / 0.5), 0 2px 4px -2px rgb(0 0 0 / 0.4);
  --shadow-lg: 0 10px 15px -3px rgb(0 0 0 / 0.55), 0 4px 6px -4px rgb(0 0 0 / 0.45);
  --shadow-xl: 0 20px 25px -5px rgb(0 0 0 / 0.6), 0 8px 10px -6px rgb(0 0 0 / 0.5);
}


/* ==========================================================================
   XUI DESIGN SYSTEM — XTORY
   Source of truth: design_systems/Xtory/tokens.css (namespace --xt-*).
   Editorial, high-contrast, warm paper + signal red. Space Grotesk / Space Mono.
   Radii stay small (3-12px) — Xtory is a sharp system, not a soft one.
   ========================================================================== */

[data-theme="xtory"] {
  --radius: 0.375rem;              /* --xt-radius-md 6px */

  --background: #fafaf7;           /* --xt-paper */
  --foreground: #1a1a1a;           /* --xt-ink */
  --card: #ffffff;
  --card-foreground: #1a1a1a;
  --popover: #ffffff;
  --popover-foreground: #1a1a1a;
  --primary: #8b1a1a;              /* --xt-signal */
  --primary-foreground: #fafaf7;
  --secondary: #f4f3ed;            /* --xt-paper-warm */
  --secondary-foreground: #1a1a1a;
  --muted: #f0efeb;                /* --xt-code-bg */
  --muted-foreground: #6a6a6a;     /* --xt-ink-faint */
  --accent: #f6ecec;               /* --xt-signal-100 */
  --accent-foreground: #701414;    /* --xt-signal-800 */
  --destructive: #a33030;          /* --xt-signal-600 */
  --destructive-foreground: #fafaf7;
  --border: #d4d4d0;               /* --xt-rule */
  --input: #d4d4d0;
  --ring: #8b1a1a;

  --success: #2e7d32;
  --success-foreground: #ffffff;
  --warning: #b88a1a;
  --warning-foreground: #1a1a1a;
  --info: #1e56b8;
  --info-foreground: #ffffff;

  --chart-1: #8b1a1a;
  --chart-2: #4a6fa5;
  --chart-3: #b88a1a;
  --chart-4: #2e7d32;
  --chart-5: #6a6a6a;

  /* validated categorical series ramp (see shadcn.css for why this is separate
     from --chart-*): signal red, editorial blue, gold, green, plum */
  --series-1: #a83232;
  --series-2: #3d6fb8;
  --series-3: #c99418;
  --series-4: #2f8a52;
  --series-5: #7d4f9c;

  --sidebar: #f4f3ed;
  --sidebar-foreground: #1a1a1a;
  --sidebar-primary: #8b1a1a;
  --sidebar-primary-foreground: #fafaf7;
  --sidebar-accent: #e8e8e4;
  --sidebar-accent-foreground: #1a1a1a;
  --sidebar-border: #d4d4d0;
  --sidebar-ring: #8b1a1a;

  --font-sans: "Space Grotesk", -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  --font-display: "Space Grotesk", -apple-system, "Segoe UI", sans-serif;
  --font-mono: "Space Mono", ui-monospace, Menlo, monospace;
  --tracking-display: -0.02em;
  --tracking-tight: -0.02em;
  --tracking-normal: 0;
  --tracking-caps: 0.15em;         /* --xt-tracking-caps */
  --weight-normal: 400;
  --weight-medium: 500;
  --weight-semibold: 600;
  --weight-bold: 700;
  --weight-display: 700;
  --case-label: uppercase;         /* Xtory labels are set in caps */

  --shadow-xs: 0 1px 2px rgba(26, 26, 26, 0.06);
  --shadow-sm: 0 1px 2px rgba(26, 26, 26, 0.06);
  --shadow-md: 0 2px 8px rgba(26, 26, 26, 0.08);
  --shadow-lg: 0 6px 18px rgba(26, 26, 26, 0.10);
  --shadow-xl: 0 14px 34px rgba(26, 26, 26, 0.14);

  --ease-out: cubic-bezier(0.22, 0.61, 0.36, 1);
  --ease-in-out: cubic-bezier(0.65, 0, 0.35, 1);
  --ease-spring: cubic-bezier(0.34, 1.4, 0.64, 1);
  --dur-fast: 150ms;
  --dur-base: 280ms;
  --dur-slow: 600ms;
}

[data-theme="xtory"][data-mode="dark"] {
  --background: #131312;
  --foreground: #f4f3ed;
  --card: #1b1b19;
  --card-foreground: #f4f3ed;
  --popover: #1f1f1d;
  --popover-foreground: #f4f3ed;
  --primary: #d2342f;              /* signal opens up on dark paper */
  --primary-foreground: #fafaf7;
  --secondary: #262623;
  --secondary-foreground: #f4f3ed;
  --muted: #262623;
  --muted-foreground: #9a9a96;     /* --xt-ink-mute */
  --accent: #3a2020;
  --accent-foreground: #f2d9d9;
  --destructive: #e05650;
  --destructive-foreground: #131312;
  --border: #33332f;
  --input: #3c3c37;
  --ring: #d2342f;

  --success: #5fbf63;
  --success-foreground: #10210f;
  --warning: #e0b143;
  --warning-foreground: #1f1a08;
  --info: #6b95e8;
  --info-foreground: #0d1730;

  --chart-1: #d2342f;
  --chart-2: #6b95e8;
  --chart-3: #e0b143;
  --chart-4: #5fbf63;
  --chart-5: #9a9a96;

  --series-1: #da534f;
  --series-2: #4087de;
  --series-3: #ac7d00;
  --series-4: #a366cd;
  --series-5: #2e9e52;

  --sidebar: #1b1b19;
  --sidebar-foreground: #f4f3ed;
  --sidebar-primary: #d2342f;
  --sidebar-primary-foreground: #fafaf7;
  --sidebar-accent: #262623;
  --sidebar-accent-foreground: #f4f3ed;
  --sidebar-border: #33332f;
  --sidebar-ring: #d2342f;

  --shadow-xs: 0 1px 2px rgba(0, 0, 0, 0.5);
  --shadow-sm: 0 1px 3px rgba(0, 0, 0, 0.55);
  --shadow-md: 0 2px 10px rgba(0, 0, 0, 0.6);
  --shadow-lg: 0 8px 24px rgba(0, 0, 0, 0.65);
  --shadow-xl: 0 16px 40px rgba(0, 0, 0, 0.7);
}


/* ==========================================================================
   XUI DESIGN SYSTEM — CLINIX
   Source of truth: design_systems/cliniX/tokens.css (namespace --cx-*).
   Território "Confiança Calorosa": teal is the base, coral is ACTION ONLY,
   background is never pure white. Plus Jakarta Sans, generous radii.

   Mapping note — cliniX reserves coral for the single primary action per
   screen, so --primary is coral and teal lives in --accent / --ring /
   --sidebar-primary, which is exactly how the brand guide uses them.
   ========================================================================== */

[data-theme="clinix"] {
  --radius: 0.75rem;               /* --cx-radius-md 12px */

  --background: #fbfaf7;           /* --cx-paper (off-white morno) */
  --foreground: #13211d;           /* --cx-ink */
  --card: #ffffff;                 /* --cx-card */
  --card-foreground: #13211d;
  --popover: #ffffff;
  --popover-foreground: #13211d;
  --primary: #ff6f5e;              /* --cx-coral — AÇÃO apenas */
  --primary-foreground: #ffffff;
  --secondary: #e4f3ef;            /* --cx-teal-100 */
  --secondary-foreground: #0a5d50; /* --cx-teal-700 */
  --muted: #f1eee8;                /* --cx-rule-soft */
  --muted-foreground: #8a938e;     /* --cx-ink-faint */
  --accent: #e4f3ef;
  --accent-foreground: #0a5d50;
  --destructive: #c4302b;          /* --cx-danger (estado, não marca) */
  --destructive-foreground: #ffffff;
  --border: #ece8e0;               /* --cx-rule */
  --input: #ece8e0;
  --ring: #0e7c6c;                 /* --cx-teal */

  --success: #1f8a4c;
  --success-foreground: #ffffff;
  --warning: #b8841a;
  --warning-foreground: #ffffff;
  --info: #0e7c6c;
  --info-foreground: #ffffff;

  --brand: #0e7c6c;                /* teal, exposto para uso direto */
  --brand-foreground: #ffffff;

  --chart-1: #0e7c6c;
  --chart-2: #ff6f5e;
  --chart-3: #0a5d50;
  --chart-4: #b8841a;
  --chart-5: #4a5752;

  /* validated categorical series ramp — teal and coral lead, so a cliniX chart
     still reads as cliniX, but the five slots are actually distinguishable */
  --series-1: #0f9c86;
  --series-2: #ef5b48;
  --series-3: #7d4f9c;
  --series-4: #c99418;
  --series-5: #2f6fb8;

  --sidebar: #ffffff;
  --sidebar-foreground: #13211d;
  --sidebar-primary: #0e7c6c;
  --sidebar-primary-foreground: #ffffff;
  --sidebar-accent: #e4f3ef;
  --sidebar-accent-foreground: #0a5d50;
  --sidebar-border: #ece8e0;
  --sidebar-ring: #0e7c6c;

  --font-sans: "Plus Jakarta Sans", system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;
  --font-display: "Plus Jakarta Sans", system-ui, sans-serif;
  --font-mono: "JetBrains Mono", ui-monospace, Menlo, monospace;
  --tracking-display: -0.04em;     /* --cx-tracking-tight */
  --tracking-tight: -0.02em;       /* --cx-tracking-snug */
  --tracking-normal: 0;
  --tracking-caps: 0.18em;         /* --cx-tracking-caps */
  --weight-normal: 400;
  --weight-medium: 500;
  --weight-semibold: 600;
  --weight-bold: 700;
  --weight-display: 800;           /* --cx-weight-black */
  --case-label: uppercase;

  --shadow-xs: 0 1px 2px rgba(19, 33, 29, 0.04);
  --shadow-sm: 0 2px 8px rgba(19, 33, 29, 0.05);
  --shadow-md: 0 4px 14px rgba(19, 33, 29, 0.06);   /* --cx-shadow-card */
  --shadow-lg: 0 12px 34px rgba(19, 33, 29, 0.09);  /* --cx-shadow-float */
  --shadow-xl: 0 20px 48px rgba(19, 33, 29, 0.12);
  --shadow-action: 0 6px 16px rgba(255, 111, 94, 0.30); /* --cx-shadow-coral */

  --ease-out: cubic-bezier(0.22, 0.61, 0.36, 1);
  --ease-in-out: cubic-bezier(0.65, 0, 0.35, 1);
  --ease-spring: cubic-bezier(0.34, 1.5, 0.64, 1);
  --dur-fast: 150ms;
  --dur-base: 280ms;
  --dur-slow: 600ms;
}

[data-theme="clinix"][data-mode="dark"] {
  --background: #0d1a17;
  --foreground: #eaf3ef;
  --card: #142320;
  --card-foreground: #eaf3ef;
  --popover: #172a26;
  --popover-foreground: #eaf3ef;
  --primary: #ff7f6f;
  --primary-foreground: #2a0f0a;
  --secondary: #1c332d;
  --secondary-foreground: #8fded0;
  --muted: #1c332d;
  --muted-foreground: #9db3ac;
  --accent: #1c332d;
  --accent-foreground: #8fded0;
  --destructive: #e8564f;
  --destructive-foreground: #ffffff;
  --border: #23392f;
  --input: #2b4239;
  --ring: #2fb39c;

  --success: #3fb26b;
  --success-foreground: #06210f;
  --warning: #d8a53c;
  --warning-foreground: #201704;
  --info: #2fb39c;
  --info-foreground: #04211c;

  --brand: #2fb39c;
  --brand-foreground: #04211c;

  --chart-1: #2fb39c;
  --chart-2: #ff7f6f;
  --chart-3: #8fded0;
  --chart-4: #d8a53c;
  --chart-5: #9db3ac;

  --series-1: #009f7a;
  --series-2: #d95544;
  --series-3: #9d69d2;
  --series-4: #a78100;
  --series-5: #2f8adc;

  --sidebar: #142320;
  --sidebar-foreground: #eaf3ef;
  --sidebar-primary: #2fb39c;
  --sidebar-primary-foreground: #04211c;
  --sidebar-accent: #1c332d;
  --sidebar-accent-foreground: #8fded0;
  --sidebar-border: #23392f;
  --sidebar-ring: #2fb39c;

  --shadow-xs: 0 1px 2px rgba(0, 0, 0, 0.45);
  --shadow-sm: 0 2px 8px rgba(0, 0, 0, 0.5);
  --shadow-md: 0 4px 14px rgba(0, 0, 0, 0.55);
  --shadow-lg: 0 12px 34px rgba(0, 0, 0, 0.6);
  --shadow-xl: 0 20px 48px rgba(0, 0, 0, 0.68);
  --shadow-action: 0 6px 16px rgba(255, 127, 111, 0.28);
}


/* ==========================================================================
   XUI DESIGN SYSTEM — MATERIAL
   Material Design 3 baseline palette (primary #6750A4 / #D0BCFF), Roboto,
   large radii and MD3's tonal elevation. Mapped onto the xui token contract.
   ========================================================================== */

[data-theme="material"] {
  --radius: 0.75rem;               /* MD3 corner.medium */

  --background: #fffbfe;           /* surface */
  --foreground: #1c1b1f;           /* on-surface */
  --card: #ffffff;
  --card-foreground: #1c1b1f;
  --popover: #f7f2fa;              /* surface-container */
  --popover-foreground: #1c1b1f;
  --primary: #6750a4;
  --primary-foreground: #ffffff;
  --secondary: #e8def8;            /* secondary-container */
  --secondary-foreground: #1d192b; /* on-secondary-container */
  --muted: #f4eff4;                /* surface-container-high */
  --muted-foreground: #49454f;     /* on-surface-variant */
  --accent: #eaddff;               /* primary-container */
  --accent-foreground: #21005d;    /* on-primary-container */
  --destructive: #b3261e;          /* error */
  --destructive-foreground: #ffffff;
  --border: #cac4d0;               /* outline-variant */
  --input: #79747e;                /* outline */
  --ring: #6750a4;

  --success: #146c2e;
  --success-foreground: #ffffff;
  --warning: #7d5260;
  --warning-foreground: #ffffff;
  --info: #0061a4;
  --info-foreground: #ffffff;

  --chart-1: #6750a4;
  --chart-2: #0061a4;
  --chart-3: #146c2e;
  --chart-4: #7d5260;
  --chart-5: #b3261e;

  /* validated categorical series ramp, led by the MD3 primary */
  --series-1: #6750a4;
  --series-2: #00a884;
  --series-3: #b3261e;
  --series-4: #2f6fd0;
  --series-5: #8a6d00;

  --sidebar: #f7f2fa;
  --sidebar-foreground: #1c1b1f;
  --sidebar-primary: #6750a4;
  --sidebar-primary-foreground: #ffffff;
  --sidebar-accent: #eaddff;
  --sidebar-accent-foreground: #21005d;
  --sidebar-border: #cac4d0;
  --sidebar-ring: #6750a4;

  --font-sans: "Roboto", system-ui, -apple-system, "Segoe UI", sans-serif;
  --font-display: "Roboto", system-ui, sans-serif;
  --font-mono: "JetBrains Mono", ui-monospace, "Roboto Mono", monospace;
  --tracking-display: -0.015em;
  --tracking-tight: 0;
  --tracking-normal: 0.005em;      /* MD3 body has positive tracking */
  --tracking-caps: 0.1em;
  --weight-normal: 400;
  --weight-medium: 500;
  --weight-semibold: 500;          /* MD3 tops out at medium for labels */
  --weight-bold: 700;
  --weight-display: 400;           /* display styles are light in MD3 */
  --case-label: none;

  /* MD3 elevation levels 1-5 */
  --shadow-xs: 0 1px 2px rgba(0, 0, 0, 0.30), 0 1px 3px 1px rgba(0, 0, 0, 0.15);
  --shadow-sm: 0 1px 2px rgba(0, 0, 0, 0.30), 0 2px 6px 2px rgba(0, 0, 0, 0.15);
  --shadow-md: 0 1px 3px rgba(0, 0, 0, 0.30), 0 4px 8px 3px rgba(0, 0, 0, 0.15);
  --shadow-lg: 0 2px 3px rgba(0, 0, 0, 0.30), 0 6px 10px 4px rgba(0, 0, 0, 0.15);
  --shadow-xl: 0 4px 4px rgba(0, 0, 0, 0.30), 0 8px 12px 6px rgba(0, 0, 0, 0.15);

  --ease-out: cubic-bezier(0.05, 0.7, 0.1, 1);       /* MD3 emphasized decelerate */
  --ease-in-out: cubic-bezier(0.2, 0, 0, 1);         /* MD3 emphasized */
  --ease-spring: cubic-bezier(0.3, 1.4, 0.5, 1);
  --dur-fast: 100ms;
  --dur-base: 250ms;
  --dur-slow: 500ms;
}

[data-theme="material"][data-mode="dark"] {
  --background: #1c1b1f;
  --foreground: #e6e1e5;
  --card: #211f26;
  --card-foreground: #e6e1e5;
  --popover: #2b2930;
  --popover-foreground: #e6e1e5;
  --primary: #d0bcff;
  --primary-foreground: #381e72;
  --secondary: #4a4458;
  --secondary-foreground: #e8def8;
  --muted: #2b2930;
  --muted-foreground: #cac4d0;
  --accent: #4f378b;
  --accent-foreground: #eaddff;
  --destructive: #f2b8b5;
  --destructive-foreground: #601410;
  --border: #49454f;
  --input: #938f99;
  --ring: #d0bcff;

  --success: #7ddc93;
  --success-foreground: #003912;
  --warning: #efb8c8;
  --warning-foreground: #492532;
  --info: #9ecaff;
  --info-foreground: #003258;

  --chart-1: #d0bcff;
  --chart-2: #9ecaff;
  --chart-3: #7ddc93;
  --chart-4: #efb8c8;
  --chart-5: #f2b8b5;

  --series-1: #00a071;
  --series-2: #8f6ce0;
  --series-3: #da534f;
  --series-4: #4087de;
  --series-5: #9f8400;

  --sidebar: #211f26;
  --sidebar-foreground: #e6e1e5;
  --sidebar-primary: #d0bcff;
  --sidebar-primary-foreground: #381e72;
  --sidebar-accent: #4f378b;
  --sidebar-accent-foreground: #eaddff;
  --sidebar-border: #49454f;
  --sidebar-ring: #d0bcff;
}


/* ==========================================================================
   XUI DESIGN SYSTEM — VISUAL STUDIO CODE
   The editor itself: Light+ and Dark+, the shipped VS Code defaults.

   Values are taken from the VS Code default themes: the workbench colours from
   light_plus / dark_plus, the syntax colours from the same. This is the theme to
   use when an interface has to sit next to the editor and not look foreign —
   the xBrain extension webviews are the reason it exists. */

[data-theme="vscode"] {
  --radius: 0.25rem;                /* VS Code is square: 2-4px everywhere */

  --background: #ffffff;            /* editor.background */
  --foreground: #3b3b3b;            /* foreground */
  --card: #f8f8f8;                  /* editorWidget.background */
  --card-foreground: #3b3b3b;
  --popover: #f3f3f3;               /* menu.background / sideBar.background */
  --popover-foreground: #3b3b3b;
  --primary: #005fb8;               /* button.background */
  --primary-foreground: #ffffff;    /* button.foreground */
  --secondary: #e5e5e5;             /* button.secondaryBackground */
  --secondary-foreground: #3b3b3b;
  --muted: #f3f3f3;                 /* sideBar.background */
  --muted-foreground: #616161;      /* descriptionForeground */
  --accent: #e8e8e8;                /* list.hoverBackground */
  --accent-foreground: #3b3b3b;
  --destructive: #a1260d;           /* errorForeground */
  --destructive-foreground: #ffffff;
  --border: #e5e5e5;                /* panel.border */
  --input: #cecece;                 /* input.border */
  --ring: #0090f1;                  /* focusBorder */

  --success: #1a7f37;               /* testing.iconPassed */
  --success-foreground: #ffffff;
  --warning: #bf8803;               /* editorWarning.foreground */
  --warning-foreground: #ffffff;
  --info: #1a85ff;                  /* editorInfo.foreground */
  --info-foreground: #ffffff;

  /* the terminal ANSI palette — VS Code's own categorical set */
  --chart-1: #005fb8;
  --chart-2: #0598bc;               /* terminal.ansiCyan */
  --chart-3: #00bc00;               /* terminal.ansiGreen */
  --chart-4: #949800;               /* terminal.ansiYellow */
  --chart-5: #bc05bc;               /* terminal.ansiMagenta */

  --series-1: #005fb8;
  --series-2: #00a884;
  --series-3: #cd3131;              /* terminal.ansiRed */
  --series-4: #bc05bc;
  --series-5: #949800;

  --sidebar: #f3f3f3;               /* sideBar.background */
  --sidebar-foreground: #3b3b3b;
  --sidebar-primary: #005fb8;
  --sidebar-primary-foreground: #ffffff;
  --sidebar-accent: #e4e6f1;        /* list.activeSelectionBackground (light) */
  --sidebar-accent-foreground: #000000;
  --sidebar-border: #e5e5e5;
  --sidebar-ring: #0090f1;

  --font-sans: "Segoe WPC", "Segoe UI", system-ui, -apple-system, sans-serif;
  --font-display: "Segoe WPC", "Segoe UI", system-ui, sans-serif;
  --font-mono: "Cascadia Code", Consolas, "Courier New", ui-monospace, monospace;
  --tracking-display: 0;
  --tracking-tight: 0;
  --tracking-normal: 0;             /* the editor sets no tracking at all */
  --tracking-caps: 0.06em;
  --weight-normal: 400;
  --weight-medium: 600;             /* VS Code jumps straight to semibold */
  --weight-semibold: 600;
  --weight-bold: 700;
  --weight-display: 600;
  --case-label: none;

  /* widget shadows: VS Code uses one soft shadow and a lot of hairlines */
  --shadow-xs: 0 1px 0 rgba(0, 0, 0, 0.05);
  --shadow-sm: 0 1px 2px rgba(0, 0, 0, 0.08);
  --shadow-md: 0 2px 8px rgba(0, 0, 0, 0.16);
  --shadow-lg: 0 4px 12px rgba(0, 0, 0, 0.20);
  --shadow-xl: 0 8px 24px rgba(0, 0, 0, 0.24);

  --ease-out: cubic-bezier(0.16, 1, 0.3, 1);
  --ease-in-out: cubic-bezier(0.4, 0, 0.2, 1);
  --ease-spring: cubic-bezier(0.3, 1.3, 0.5, 1);
  --dur-fast: 70ms;                 /* the editor is fast and unanimated */
  --dur-base: 130ms;
  --dur-slow: 250ms;

  /* syntax, Light+ — used by .xui-code and by any editor-like surface */
  --code-keyword: #0000ff;
  --code-string: #a31515;
  --code-comment: #008000;
  --code-number: #098658;
  --code-function: #795e26;
  --code-type: #267f99;
  --code-variable: #001080;
}

[data-theme="vscode"][data-mode="dark"] {
  --background: #1e1e1e;            /* editor.background */
  --foreground: #d4d4d4;            /* editor.foreground */
  --card: #252526;                  /* editorWidget.background */
  --card-foreground: #d4d4d4;
  --popover: #252526;               /* menu.background */
  --popover-foreground: #cccccc;
  --primary: #0e639c;               /* button.background */
  --primary-foreground: #ffffff;
  --secondary: #3a3d41;             /* button.secondaryBackground */
  --secondary-foreground: #ffffff;
  --muted: #252526;                 /* sideBar.background */
  --muted-foreground: #9d9d9d;      /* descriptionForeground */
  --accent: #2a2d2e;                /* list.hoverBackground */
  --accent-foreground: #d4d4d4;
  --destructive: #f48771;           /* errorForeground */
  --destructive-foreground: #1e1e1e;
  --border: #3c3c3c;                /* panel.border */
  --input: #3c3c3c;                 /* input.background & border */
  --ring: #007fd4;                  /* focusBorder */

  --success: #89d185;               /* testing.iconPassed */
  --success-foreground: #1e1e1e;
  --warning: #cca700;               /* editorWarning.foreground */
  --warning-foreground: #1e1e1e;
  --info: #3794ff;                  /* editorInfo.foreground */
  --info-foreground: #1e1e1e;

  --chart-1: #3794ff;
  --chart-2: #11a8cd;               /* terminal.ansiCyan */
  --chart-3: #0dbc79;               /* terminal.ansiGreen */
  --chart-4: #e5e510;               /* terminal.ansiYellow */
  --chart-5: #bc3fbc;               /* terminal.ansiMagenta */

  --series-1: #3794ff;
  --series-2: #0dbc79;
  --series-3: #cd3131;              /* terminal.ansiRed */
  --series-4: #bc3fbc;
  --series-5: #e5e510;

  --sidebar: #252526;
  --sidebar-foreground: #cccccc;
  --sidebar-primary: #0e639c;
  --sidebar-primary-foreground: #ffffff;
  --sidebar-accent: #094771;        /* list.activeSelectionBackground */
  --sidebar-accent-foreground: #ffffff;
  --sidebar-border: #3c3c3c;
  --sidebar-ring: #007fd4;

  --shadow-xs: 0 1px 0 rgba(0, 0, 0, 0.25);
  --shadow-sm: 0 1px 2px rgba(0, 0, 0, 0.36);
  --shadow-md: 0 2px 8px rgba(0, 0, 0, 0.48);
  --shadow-lg: 0 4px 12px rgba(0, 0, 0, 0.56);
  --shadow-xl: 0 8px 24px rgba(0, 0, 0, 0.64);

  /* syntax, Dark+ */
  --code-keyword: #569cd6;
  --code-string: #ce9178;
  --code-comment: #6a9955;
  --code-number: #b5cea8;
  --code-function: #dcdcaa;
  --code-type: #4ec9b0;
  --code-variable: #9cdcfe;
}