/* KeyRush Themes Engine */
:root {
  /* Default Midnight Theme (Purple & Cyan Neon) */
  --kr-bg-main: #090a10;
  --kr-bg-surface: #11131f;
  --kr-bg-surface-elevated: #171a2b;
  --kr-bg-subtle: rgba(255, 255, 255, 0.04);
  --kr-border: rgba(255, 255, 255, 0.08);
  --kr-border-highlight: rgba(168, 85, 247, 0.35);

  --kr-accent-primary: #a855f7;
  --kr-accent-secondary: #06b6d4;
  --kr-accent-glow: rgba(168, 85, 247, 0.25);

  --kr-text-main: #f1f5f9;
  --kr-text-muted: #64748b;
  --kr-text-subtle: #475569;

  --kr-char-pending: #475569;
  --kr-char-correct: #f1f5f9;
  --kr-char-incorrect: #ef4444;
  --kr-char-extra: #b91c1c;

  --kr-caret-color: #a855f7;
  --kr-success: #10b981;
  --kr-warning: #f59e0b;
  --kr-danger: #ef4444;

  --kr-font-typing: 'JetBrains Mono', monospace;
  --kr-font-ui: 'Inter', -apple-system, BlinkMacSystemFont, sans-serif;
  --kr-typing-font-size: 26px;
}

/* 1. Cyber Theme */
[data-theme="cyber"] {
  --kr-bg-main: #060809;
  --kr-bg-surface: #0e1215;
  --kr-bg-surface-elevated: #161c22;
  --kr-border: rgba(250, 204, 21, 0.15);
  --kr-border-highlight: #facc15;
  --kr-accent-primary: #facc15;
  --kr-accent-secondary: #00f2fe;
  --kr-accent-glow: rgba(250, 204, 21, 0.25);
  --kr-text-main: #fef08a;
  --kr-text-muted: #854d0e;
  --kr-char-pending: #713f12;
  --kr-char-correct: #fef08a;
  --kr-char-incorrect: #ef4444;
  --kr-caret-color: #facc15;
}

/* 2. Neon Theme */
[data-theme="neon"] {
  --kr-bg-main: #0c0814;
  --kr-bg-surface: #171026;
  --kr-bg-surface-elevated: #211738;
  --kr-border: rgba(236, 72, 153, 0.2);
  --kr-border-highlight: #ec4899;
  --kr-accent-primary: #ec4899;
  --kr-accent-secondary: #10b981;
  --kr-accent-glow: rgba(236, 72, 153, 0.3);
  --kr-text-main: #fdf2f8;
  --kr-text-muted: #9d174d;
  --kr-char-pending: #831843;
  --kr-char-correct: #fdf2f8;
  --kr-char-incorrect: #f43f5e;
  --kr-caret-color: #ec4899;
}

/* 3. Aurora Theme */
[data-theme="aurora"] {
  --kr-bg-main: #051412;
  --kr-bg-surface: #0a211e;
  --kr-bg-surface-elevated: #11312d;
  --kr-border: rgba(16, 185, 129, 0.2);
  --kr-border-highlight: #10b981;
  --kr-accent-primary: #10b981;
  --kr-accent-secondary: #06b6d4;
  --kr-accent-glow: rgba(16, 185, 129, 0.25);
  --kr-text-main: #ecfdf5;
  --kr-text-muted: #065f46;
  --kr-char-pending: #047857;
  --kr-char-correct: #a7f3d0;
  --kr-char-incorrect: #f43f5e;
  --kr-caret-color: #10b981;
}

/* 4. Crimson Theme */
[data-theme="crimson"] {
  --kr-bg-main: #12090b;
  --kr-bg-surface: #1e0e12;
  --kr-bg-surface-elevated: #2b141a;
  --kr-border: rgba(239, 68, 68, 0.2);
  --kr-border-highlight: #ef4444;
  --kr-accent-primary: #ef4444;
  --kr-accent-secondary: #f59e0b;
  --kr-accent-glow: rgba(239, 68, 68, 0.25);
  --kr-text-main: #fef2f2;
  --kr-text-muted: #991b1b;
  --kr-char-pending: #7f1d1d;
  --kr-char-correct: #fecaca;
  --kr-char-incorrect: #fbbf24;
  --kr-caret-color: #ef4444;
}

/* 5. Ocean Theme */
[data-theme="ocean"] {
  --kr-bg-main: #07131e;
  --kr-bg-surface: #0c1e2f;
  --kr-bg-surface-elevated: #122b42;
  --kr-border: rgba(6, 182, 212, 0.2);
  --kr-border-highlight: #06b6d4;
  --kr-accent-primary: #06b6d4;
  --kr-accent-secondary: #3b82f6;
  --kr-accent-glow: rgba(6, 182, 212, 0.25);
  --kr-text-main: #ecfeff;
  --kr-text-muted: #155e75;
  --kr-char-pending: #164e63;
  --kr-char-correct: #cffafe;
  --kr-char-incorrect: #f43f5e;
  --kr-caret-color: #06b6d4;
}

/* 6. AMOLED (Pure Black) Theme */
[data-theme="amoled"] {
  --kr-bg-main: #000000;
  --kr-bg-surface: #0a0a0a;
  --kr-bg-surface-elevated: #141414;
  --kr-border: rgba(255, 255, 255, 0.12);
  --kr-border-highlight: #ffffff;
  --kr-accent-primary: #ffffff;
  --kr-accent-secondary: #00f2fe;
  --kr-accent-glow: rgba(255, 255, 255, 0.15);
  --kr-text-main: #ffffff;
  --kr-text-muted: #525252;
  --kr-char-pending: #404040;
  --kr-char-correct: #ffffff;
  --kr-char-incorrect: #ff3333;
  --kr-caret-color: #ffffff;
}

/* 7. Minimal Theme */
[data-theme="minimal"] {
  --kr-bg-main: #131418;
  --kr-bg-surface: #1a1c23;
  --kr-bg-surface-elevated: #242731;
  --kr-border: rgba(255, 255, 255, 0.07);
  --kr-border-highlight: #94a3b8;
  --kr-accent-primary: #cbd5e1;
  --kr-accent-secondary: #94a3b8;
  --kr-accent-glow: rgba(203, 213, 225, 0.12);
  --kr-text-main: #f8fafc;
  --kr-text-muted: #64748b;
  --kr-char-pending: #475569;
  --kr-char-correct: #f8fafc;
  --kr-char-incorrect: #f87171;
  --kr-caret-color: #cbd5e1;
}

/* 8. Purple Royale */
[data-theme="purple"] {
  --kr-bg-main: #0f071a;
  --kr-bg-surface: #1a0f2e;
  --kr-bg-surface-elevated: #261742;
  --kr-border: rgba(192, 132, 252, 0.2);
  --kr-border-highlight: #c084fc;
  --kr-accent-primary: #c084fc;
  --kr-accent-secondary: #f472b6;
  --kr-accent-glow: rgba(192, 132, 252, 0.3);
  --kr-text-main: #faf5ff;
  --kr-text-muted: #7e22ce;
  --kr-char-pending: #6b21a8;
  --kr-char-correct: #faf5ff;
  --kr-char-incorrect: #f43f5e;
  --kr-caret-color: #c084fc;
}

/* Font Families */
[data-font="jetbrains"] {
  --kr-font-typing: 'JetBrains Mono', monospace;
}
[data-font="fira"] {
  --kr-font-typing: 'Fira Code', monospace;
}
[data-font="roboto"] {
  --kr-font-typing: 'Roboto Mono', monospace;
}
[data-font="inter"] {
  --kr-font-typing: 'Inter', sans-serif;
}
[data-font="space"] {
  --kr-font-typing: 'Space Mono', monospace;
}