/* ═══════════════════════════════════════
   AcrossWord™ — Global Theme System
   Controls dark/light mode across all pages
   ═══════════════════════════════════════ */

/* ── DARK MODE (default) ── */
:root {
  --gold: #ffd700;
  --red: #ff5252;
  --green: #a5d6a7;
  --correct-green: #a5d6a7;
  --diamond: #b9f2ff;

  --bg: #050505;
  --bg-alt: #0a0a0a;
  --card: #111111;
  --panel: #1a1a1a;
  --surface: #222222;

  --border: #2a2a2a;
  --border-gold: rgba(180, 140, 0, 0.25);

  --text: #ffffff;
  --text-secondary: #cccccc;
  --text-muted: #888888;
  --text-dim: #555555;

  --input-bg: #1a1a1a;
  --input-border: #2a2a2a;
  --input-text: #ffffff;

  --nav-bg: #050505;
  --nav-border: #1a1a1a;
  --nav-text: #aaaaaa;
  --nav-text-hover: #ffffff;
  --logo-text: #ffffff;

  --grid-bg: #000000;
  --grid-border: #000000;
  --grid-title-bg: #000000;
  --grid-title-text: #ffffff;
  --grid-clue-bg: #000000;
  --grid-clue-text: #ffffff;
  --grid-cell-bg: #ffffff;
  --grid-cell-text: #000000;
  --grid-cell-border: #000000;
  --grid-clue-solved: #81c784;
  --grid-hint-num: #000000;

  --cell-focus: #e3f2fd;
  --cell-error: #ff5252;

  --menu-bg: #111111;
  --menu-border: #222222;
  --menu-text: #ffffff;
  --menu-hover: #1a1a1a;

  --modal-bg: #1a1a1a;
  --modal-text: #ffffff;
  --modal-body: #cccccc;

  --footer-text: #555555;
  --footer-border: #1a1a1a;

  --btn-ghost-bg: transparent;
  --btn-ghost-border: #2a2a2a;
  --btn-ghost-text: #888888;

  --badge-active-bg: #1a3a1a;
  --badge-active-text: #a5d6a7;
  --badge-banned-bg: #3a1a1a;
  --badge-banned-text: #ff5252;

  --oauth-bg: #1a1a1a;
  --oauth-border: #2a2a2a;
  --oauth-text: #ffffff;

  --divider-text: #555555;
  --divider-line: #2a2a2a;

  --stat-card-bg: #111111;
  --stat-card-border: #2a2a2a;

  --results-bg: #111111;
  --results-border: #333333;
}

/* ── LIGHT MODE ── */
body.light {
  --bg: #f0ede6;
  --bg-alt: #e8e5de;
  --card: #ffffff;
  --panel: #f5f2eb;
  --surface: #edeae3;

  --border: #d0cdc6;
  --border-gold: rgba(180, 140, 0, 0.3);

  --text: #111111;
  --text-secondary: #333333;
  --text-muted: #666666;
  --text-dim: #999999;

  --input-bg: #ffffff;
  --input-border: #cccccc;
  --input-text: #111111;

  --nav-bg: #f0ede6;
  --nav-border: #d0cdc6;
  --nav-text: #444444;
  --nav-text-hover: #111111;
  --logo-text: #111111;

  --grid-bg: #f0ede6;
  --grid-border: transparent;
  --grid-title-bg: #f0ede6;
  --grid-title-text: #111111;
  --grid-clue-bg: #f0ede6;
  --grid-clue-text: #111111;
  --grid-cell-bg: #ffffff;
  --grid-cell-text: #111111;
  --grid-cell-border: #999999;
  --grid-clue-solved: #2e7d32;
  --grid-hint-num: #333333;

  --cell-focus: #d6eaff;
  --cell-error: #ffcdd2;

  --menu-bg: #f0ede6;
  --menu-border: #dddddd;
  --menu-text: #111111;
  --menu-hover: #e5e2da;

  --modal-bg: #f0ede6;
  --modal-text: #111111;
  --modal-body: #333333;

  --footer-text: #888888;
  --footer-border: #dddddd;

  --btn-ghost-bg: #ffffff;
  --btn-ghost-border: #cccccc;
  --btn-ghost-text: #444444;

  --badge-active-bg: #e8f5e9;
  --badge-active-text: #2e7d32;
  --badge-banned-bg: #ffebee;
  --badge-banned-text: #c62828;

  --oauth-bg: #ffffff;
  --oauth-border: #dddddd;
  --oauth-text: #111111;

  --divider-text: #999999;
  --divider-line: #dddddd;

  --stat-card-bg: #ffffff;
  --stat-card-border: #dddddd;

  --results-bg: #ffffff;
  --results-border: #dddddd;
}

/* ═══════════════════════════════════════
   BASE ELEMENT STYLES (using tokens)
   ═══════════════════════════════════════ */

body {
  background: var(--bg);
  color: var(--text);
  transition: background 0.2s, color 0.2s;
}