:root {
  --main-maroon: #2563eb; /* Blue-600 */
  --deep-maroon: #1e40af; /* Blue-800 */
  --accent-gold: #fbbf24; /* Amber-400 */
  --background: #f3f6fb; /* Soft blue-gray */
  --foreground: #22223b;
  --button-bg: var(--main-maroon);
  --button-hover-bg: var(--deep-maroon);
  --button-text: #fff;
  --card-bg: #fff;
  --border-color: #e0e7ef;
  --input-bg: #f1f5f9;
  --input-border: #cbd5e1;
  --input-focus: #2563eb;
  --shadow: 0 2px 8px rgba(37, 99, 235, 0.07);
}

/* Example dark mode */
[data-theme="dark"] {
  --background: #181a20;
  --foreground: #f3f6fb;
  --main-maroon: #60a5fa;
  --deep-maroon: #1e293b;
  --accent-gold: #fbbf24;
  --button-bg: var(--main-maroon);
  --button-hover-bg: var(--deep-maroon);
  --button-text: #fff;
  --card-bg: #23263a;
  --border-color: #334155;
  --input-bg: #23263a;
  --input-border: #334155;
  --input-focus: #60a5fa;
  --shadow: 0 2px 8px rgba(96, 165, 250, 0.1);
}

body {
  background: var(--background);
  color: var(--foreground);
}