@kortix/ui 0.0.0-bootstrap.0 → 0.14.3

package/dist/styles/tokens.css

@@ -0,0 +1,146 @@
+/* GENERATED from visual-system.json by .agents/skills/kortix-brand/scripts/generate-tokens.ts. Do not edit.
+   @kortix/ui design tokens: light on :root, dark on .dark (class on <html>).
+   A white-label host overrides any of these variables in its own :root / .dark. */
+
+:root {
+  color-scheme: light;
+  --background: oklch(1 0 0); /* canvas #ffffff */
+  --pane: oklch(1 0 0); /* base #ffffff */
+  --surface: oklch(0.9911 0 0); /* surface #fcfcfc */
+  --foreground: oklch(0.2393 0 0); /* ink #1f1f1f */
+  --foreground-strong: var(--foreground);
+  --foreground-weak: var(--muted-foreground);
+  --card: oklch(0.9672 0 0); /* surface-1 #f4f4f4 */
+  --card-foreground: oklch(0.2393 0 0); /* ink #1f1f1f */
+  --popover: oklch(1 0 0); /* canvas / surface-1 #ffffff */
+  --popover-foreground: oklch(0.2393 0 0); /* ink #1f1f1f */
+  --primary: oklch(0.2393 0 0); /* ink #1f1f1f */
+  --primary-foreground: oklch(1 0 0); /* #ffffff */
+  --secondary: oklch(0.9461 0 0); /* surface-2 #ededed */
+  --secondary-foreground: oklch(0.2393 0 0); /* ink #1f1f1f */
+  --muted: oklch(0.9461 0 0); /* surface-2 #ededed */
+  --muted-foreground: oklch(0.5103 0 0); /* ink-muted #666666 */
+  --accent: oklch(0.9672 0 0); /* surface-1 #f4f4f4 */
+  --accent-foreground: oklch(0.2393 0 0); /* ink #1f1f1f */
+  --destructive: oklch(0.583 0.2387 28.4765); /* #e7000b */
+  --destructive-foreground: oklch(0.9851 0 0); /* #fafafa */
+  --border: oklch(0.9128 0 0); /* hairline #e2e2e2 */
+  --input: oklch(0.9461 0 0); /* surface-2 #ededed */
+  --ring: oklch(0.669 0.1837 248.8066); /* accent-blue #0099ff */
+  --hover: oklch(0 0 0 / 0.045);
+  --active: oklch(0 0 0 / 0.075);
+  --focus-ring: var(--ring);
+  --sidebar: oklch(0.9672 0 0); /* surface-1 #f4f4f4 */
+  --sidebar-foreground: oklch(0.2393 0 0); /* ink #1f1f1f */
+  --sidebar-primary: var(--ring);
+  --sidebar-primary-foreground: oklch(1 0 0); /* #ffffff */
+  --sidebar-accent: oklch(0.9461 0 0); /* surface-2 #ededed */
+  --sidebar-accent-foreground: oklch(0.2393 0 0); /* ink #1f1f1f */
+  --sidebar-row: var(--card);
+  --sidebar-row-control: var(--sidebar-accent);
+  --sidebar-border: oklch(0.9128 0 0); /* hairline / hairline-soft #e2e2e2 */
+  --sidebar-ring: var(--ring);
+  --kortix-base: var(--color-ring); /* #0099ff */
+  --kortix-green: oklch(0.581 0.165 146.619); /* #199338 */
+  --kortix-red: oklch(0.648 0.202 24.745); /* #f14b4c */
+  --kortix-orange: oklch(0.691 0.142 71.784); /* #d18b19 */
+  --kortix-yellow: oklch(0.732 0.15 90.688); /* #cca300 */
+  --kortix-blue: oklch(0.652 0.177 252.624); /* #2b91f7 */
+  --kortix-purple: oklch(0.675 0.131 306.212); /* #ab80d6 */
+  --chart-1: oklch(0.8781 0.1688 91.8567); /* #ffd230 */
+  --chart-2: oklch(0.7724 0.1728 65.367); /* #fe9a00 */
+  --chart-3: oklch(0.6671 0.1685 53.3814); /* #e17100 */
+  --chart-4: oklch(0.557 0.1583 45.3594); /* #bb4d00 */
+  --chart-5: oklch(0.4747 0.1358 44.9806); /* #973c00 */
+  --terminal-surface: #0f0f0f;
+  --terminal-fg: #e5e5e5;
+  --terminal-border: rgb(255 255 255 / 0.1);
+  --radius: 0.625rem;
+  --tracking-normal: 0em;
+  --spacing: 0.23rem;
+  --duration-fast: 100ms;
+  --duration-normal: 150ms;
+  --duration-moderate: 200ms;
+  --duration-slow: 300ms;
+  --duration-slower: 500ms;
+  --ease-default: cubic-bezier(0.2, 0, 0, 1);
+  --ease-out: cubic-bezier(0, 0, 0.2, 1);
+  --ease-in-out: cubic-bezier(0.4, 0, 0.2, 1);
+  --ease-in: cubic-bezier(0.4, 0, 1, 1);
+  --liquid-glass-bg: color-mix(in oklch, var(--secondary) 45%, transparent);
+  --liquid-glass-bg-hover: color-mix(in oklch, var(--secondary) 62%, transparent);
+  --liquid-glass-blur: 20px;
+  --liquid-glass-saturate: 1.8;
+  --liquid-glass-shadow: 0 20px 48px -16px oklch(0 0 0 / 0.65), inset 0 1.5px 0 oklch(1 0 0 / 0.35), inset 0 -1px 0 oklch(1 0 0 / 0.08);
+  --liquid-glass-highlight: radial-gradient(circle at 30% 20%, oklch(1 0 0 / 0.28), transparent 55%);
+  --font-sans-system: ui-sans-serif, -apple-system, 'Segoe UI', 'Helvetica Neue', 'Noto Sans', sans-serif;
+  --font-mono-system: ui-monospace, SFMono-Regular, 'SF Mono', Menlo, Monaco, Consolas, 'Liberation Mono', 'Courier New', monospace;
+  --text-xs: 0.8125rem;
+  --text-xs--line-height: calc(1 / 0.8125);
+  --text-sm: 0.875rem;
+  --text-sm--line-height: calc(1.25 / 0.875);
+  --text-md: 0.9rem;
+  --text-md--line-height: calc(1.375 / 0.9375);
+  --text-base: 1rem;
+  --text-base--line-height: calc(1.5 / 1);
+  --text-lg: 1.125rem;
+  --text-lg--line-height: calc(1.75 / 1.125);
+  --text-xl: 1.25rem;
+  --text-xl--line-height: calc(1.75 / 1.25);
+  --text-2xl: 1.5rem;
+  --text-2xl--line-height: calc(2 / 1.5);
+  --text-3xl: 1.875rem;
+  --text-3xl--line-height: calc(2.25 / 1.875);
+  --text-4xl: 2.25rem;
+  --text-4xl--line-height: calc(2.5 / 2.25);
+  --text-5xl: 3rem;
+  --text-5xl--line-height: 1;
+  --text-6xl: 3.75rem;
+  --text-6xl--line-height: 1;
+  --text-7xl: 4.5rem;
+  --text-7xl--line-height: 1;
+  --text-8xl: 6rem;
+  --text-8xl--line-height: 1;
+}
+
+.dark {
+  color-scheme: dark;
+  --background: oklch(15% 0 0); /* canvas #0b0b0b */
+  --pane: oklch(0.1543 0 0); /* base #0c0c0c */
+  --surface: oklch(0.1913 0 0); /* surface #141414 */
+  --foreground: oklch(1 0 0); /* ink #ffffff */
+  --foreground-strong: var(--foreground);
+  --foreground-weak: var(--muted-foreground);
+  --card: oklch(0.1913 0 0); /* surface-1 #141414 */
+  --card-foreground: oklch(1 0 0); /* ink #ffffff */
+  --popover: oklch(0.1913 0 0); /* canvas / surface-1 #141414 */
+  --popover-foreground: oklch(1 0 0); /* ink #ffffff */
+  --primary: oklch(1 0 0); /* ink #ffffff */
+  --primary-foreground: oklch(0.1398 0 0); /* #090909 */
+  --secondary: oklch(0.2264 0 0); /* surface-2 #1c1c1c */
+  --secondary-foreground: oklch(1 0 0); /* ink #ffffff */
+  --muted: oklch(0.2264 0 0); /* surface-2 #1c1c1c */
+  --muted-foreground: oklch(0.683 0 0); /* ink-muted #999999 */
+  --accent: oklch(0.1913 0 0); /* surface-1 #141414 */
+  --accent-foreground: oklch(1 0 0); /* ink #ffffff */
+  --destructive: oklch(0.7022 0.1892 22.2279); /* #ff6467 */
+  --border: oklch(0.2686 0 0); /* hairline #262626 */
+  --input: oklch(0.2264 0 0); /* surface-2 #1c1c1c */
+  --hover: oklch(1 0 0 / 0.06);
+  --active: oklch(1 0 0 / 0.1);
+  --focus-ring: var(--ring);
+  --sidebar: oklch(0.1913 0 0); /* surface-1 #141414 */
+  --sidebar-foreground: oklch(1 0 0); /* ink #ffffff */
+  --sidebar-primary: var(--ring);
+  --sidebar-accent: oklch(0.2264 0 0); /* surface-2 #1c1c1c */
+  --sidebar-accent-foreground: oklch(1 0 0); /* ink #ffffff */
+  --sidebar-row: var(--sidebar-accent);
+  --sidebar-row-control: oklch(0.2686 0 0); /* #262626 */
+  --sidebar-border: oklch(0.2178 0 0); /* hairline / hairline-soft #1a1a1a */
+  --sidebar-ring: var(--ring);
+  --kortix-base: var(--color-ring); /* #0099ff */
+  --liquid-glass-bg: color-mix(in oklch, var(--secondary) 38%, transparent);
+  --liquid-glass-bg-hover: color-mix(in oklch, var(--secondary) 52%, transparent);
+  --liquid-glass-shadow: inset 0 0 0 1px oklch(1 0 0 / 0.1);
+  --liquid-glass-highlight: radial-gradient(circle at 30% 20%, oklch(1 0 0 / 0.12), transparent 55%);
+}