:root {
  color-scheme: light;

  --simbo-primary-blue: #0b6bff;
  --simbo-primary-violet: #6d35f5;
  --simbo-deep-navy: #020a33;
  --simbo-slate: #667085;
  --simbo-white: #ffffff;
  --simbo-electric-blue: #1e8bff;
  --simbo-indigo: #3448f0;
  --simbo-purple: #7c3aed;
  --simbo-soft-blue: #eaf2ff;
  --simbo-soft-violet: #f1ecff;
  --simbo-success: #12b76a;
  --simbo-warning: #f79009;
  --simbo-danger: #f04438;
  --simbo-info: #2e90fa;

  --color-bg: #ffffff;
  --color-bg-muted: #f7f9fc;
  --color-surface: #ffffff;
  --color-surface-alt: #f1f5f9;
  --color-border: #d9e2ef;
  --color-text: #020a33;
  --color-text-muted: #667085;
  --color-heading: #020a33;
  --color-muted: var(--color-text-muted);

  --color-primary: #0b6bff;
  --color-primary-hover: #095de0;
  --color-primary-dark: var(--color-primary-hover);
  --color-primary-soft: #eaf2ff;
  --color-secondary: #6d35f5;
  --color-secondary-hover: #5b2bd6;
  --color-secondary-soft: #f1ecff;
  --color-link: #0b6bff;
  --color-focus-ring: rgba(11, 107, 255, 0.28);

  --color-success: var(--simbo-success);
  --color-warning: var(--simbo-warning);
  --color-danger: var(--simbo-danger);
  --color-info: var(--simbo-info);
  --color-info-bg: var(--color-primary-soft);
  --color-success-bg: #ecfdf3;
  --color-warning-bg: #fff7ed;
  --color-danger-bg: #fef3f2;

  --gradient-brand: linear-gradient(135deg, #0b6bff 0%, #3448f0 48%, #6d35f5 100%);
  --shadow-soft: 0 12px 30px rgba(2, 10, 51, 0.08);
  --shadow-card: 0 8px 24px rgba(2, 10, 51, 0.10);
  --shadow-sm: var(--shadow-soft);
  --shadow-md: var(--shadow-card);
}

[data-theme="dark"] {
  color-scheme: dark;

  --color-bg: #050816;
  --color-bg-muted: #090f24;
  --color-surface: #0d132b;
  --color-surface-alt: #111936;
  --color-border: #26314f;
  --color-text: #f8fafc;
  --color-text-muted: #aab3c5;
  --color-heading: #ffffff;
  --color-muted: var(--color-text-muted);

  --color-primary: #4c9bff;
  --color-primary-hover: #77b6ff;
  --color-primary-dark: var(--color-primary-hover);
  --color-primary-soft: #10294f;
  --color-secondary: #8b5cf6;
  --color-secondary-hover: #a78bfa;
  --color-secondary-soft: #261a4f;
  --color-link: #77b6ff;
  --color-focus-ring: rgba(119, 182, 255, 0.35);
  --color-info-bg: #10294f;
  --color-success-bg: rgba(18, 183, 106, 0.14);
  --color-warning-bg: rgba(247, 144, 9, 0.14);
  --color-danger-bg: rgba(240, 68, 56, 0.14);
  --gradient-brand: linear-gradient(135deg, #1e8bff 0%, #5865f2 48%, #8b5cf6 100%);
  --shadow-soft: 0 12px 30px rgba(0, 0, 0, 0.28);
  --shadow-card: 0 8px 24px rgba(0, 0, 0, 0.36);
  --shadow-sm: var(--shadow-soft);
  --shadow-md: var(--shadow-card);
}