/* Maverik design tokens. Keep this as the single source of truth. */

:root {
  color-scheme: dark;

  --bg-base: #0f1014;
  --bg-sidebar: #111216;
  --bg-card: #17181d;
  --bg-input: #111217;
  --bg-elevated: #202128;
  --bg-terminal: #08090c;

  --text-main: #f1f2f4;
  --text-dim: #a8abb3;
  --text-faint: #71747d;
  --text-inverse: #08090c;

  --border: #292b33;
  --border-strong: #3a3d47;
  --border-hover: var(--accent);

  --accent: #6f5ca1;
  --accent-2: #9a86cc;
  --accent-15: rgba(111, 92, 161, 0.15);
  --accent-soft: color-mix(in srgb, var(--accent) 12%, transparent);
  --accent-strong: color-mix(in srgb, var(--accent) 72%, white);

  --success: #34d399;
  --success-soft: rgba(52, 211, 153, 0.13);
  --danger: #fb7185;
  --danger-soft: rgba(251, 113, 133, 0.13);
  --warning: #fbbf24;
  --warning-soft: rgba(251, 191, 36, 0.13);
  --info: #60a5fa;
  --info-soft: rgba(96, 165, 250, 0.13);

  --chart-primary: #e5e7eb;
  --chart-secondary: #34d399;
  --chart-tertiary: #60a5fa;
  --chart-primary-fill-start: rgba(229, 231, 235, 0.12);
  --chart-primary-fill-end: rgba(229, 231, 235, 0);
  --chart-secondary-fill-start: rgba(52, 211, 153, 0.16);
  --chart-secondary-fill-end: rgba(52, 211, 153, 0);
  --chart-tertiary-fill-start: rgba(96, 165, 250, 0.18);
  --chart-tertiary-fill-end: rgba(96, 165, 250, 0);
  --chart-grid: rgba(255, 255, 255, 0.06);
  --chart-text: var(--text-dim);
  --chart-tick: var(--text-faint);
  --chart-tooltip-bg: var(--bg-elevated);
  --chart-tooltip-text: var(--text-main);

  --button-bg: var(--accent);
  --button-hover: color-mix(in srgb, var(--accent) 84%, white);
  --button-text: #ffffff;

  --space-1: 4px;
  --space-2: 8px;
  --space-3: 12px;
  --space-4: 16px;
  --space-5: 20px;
  --space-6: 24px;
  --space-8: 32px;
  --space-10: 40px;

  --radius-global: 0px;
  --radius-sm: calc(var(--radius-global) / 2);
  --radius-lg: var(--radius-global);

  --shadow-soft: 0 18px 44px rgba(0, 0, 0, 0.22);
  --shadow-modal: 0 20px 60px rgba(0, 0, 0, 0.42);

  --motion-fast: 140ms;
  --motion-med: 240ms;
  --motion-slow: 420ms;
  --ease-out: cubic-bezier(0.16, 1, 0.3, 1);
  --ease-smooth: cubic-bezier(0.22, 1, 0.36, 1);
}

html[data-theme="light"],
[data-theme="light"] {
  color-scheme: light;

  --bg-base: #f6f7f8;
  --bg-sidebar: #ffffff;
  --bg-card: #ffffff;
  --bg-input: #ffffff;
  --bg-elevated: #eef0f3;
  --bg-terminal: #111217;

  --text-main: #17181c;
  --text-dim: #5f636d;
  --text-faint: #8c9099;
  --text-inverse: #ffffff;

  --border: #dde0e5;
  --border-strong: #c5c9d1;

  --accent-soft: color-mix(in srgb, var(--accent) 10%, transparent);
  --success: #0f766e;
  --success-soft: #e4f3ef;
  --danger: #be123c;
  --danger-soft: #fae7ec;
  --warning: #a16207;
  --warning-soft: #f8efd6;
  --info: #2563eb;
  --info-soft: rgba(37, 99, 235, 0.1);

  --chart-primary: #17181c;
  --chart-secondary: #0f766e;
  --chart-tertiary: #2563eb;
  --chart-primary-fill-start: rgba(23, 24, 28, 0.08);
  --chart-primary-fill-end: rgba(23, 24, 28, 0);
  --chart-secondary-fill-start: rgba(15, 118, 110, 0.14);
  --chart-secondary-fill-end: rgba(15, 118, 110, 0);
  --chart-tertiary-fill-start: rgba(37, 99, 235, 0.14);
  --chart-tertiary-fill-end: rgba(37, 99, 235, 0);
  --chart-grid: rgba(23, 24, 28, 0.08);
}

[data-theme="purple"],
[data-accent="#6f5ca1"] {
  --accent: #6f5ca1;
  --accent-2: #9a86cc;
  --accent-15: rgba(111, 92, 161, 0.15);
}

[data-theme="red"],
[data-accent="#ef4444"] {
  --accent: #ef4444;
  --accent-2: #f87171;
  --accent-15: rgba(239, 68, 68, 0.15);
}

[data-theme="blue"],
[data-accent="#3b82f6"] {
  --accent: #3b82f6;
  --accent-2: #60a5fa;
  --accent-15: rgba(59, 130, 246, 0.15);
}

[data-accent="#f59e0b"] {
  --accent: #f59e0b;
  --accent-2: #fbbf24;
  --accent-15: rgba(245, 158, 11, 0.15);
}

[data-accent="#10b981"] {
  --accent: #10b981;
  --accent-2: #34d399;
  --accent-15: rgba(16, 185, 129, 0.15);
}