/*
 * Night mode — applied via html.night-mode class.
 * Overrides CSS custom properties used across all pages.
 * Two naming conventions are covered:
 *   --paper / --ink  (index, profile, game, stats, wowy, compare, preview, builder)
 *   --bg / --ink-2   (reviews)
 */

html.night-mode {
  /* ── Backgrounds ─────────────────────────── */
  --paper:     #18181b;
  --paper2:    #222228;
  --paper3:    #2c2c34;
  --bg:        #18181b;
  --bg-card:   #222228;

  /* ── Borders ────────────────────────────── */
  --rule:      #3a3a46;

  /* ── Text ───────────────────────────────── */
  --ink:       #ededf0;
  --ink2:      #c0c0cc;
  --ink3:      #8080a0;
  --ink4:      #4a4a68;
  --ink-2:     #c0c0cc;
  --ink-3:     #8080a0;

  /* ── Accent tints ───────────────────────── */
  --orange-lt: #2a1508;

  /* ── Status colors stay readable on dark ── */
  --green:     #22c55e;
  --red:       #f87171;

  color-scheme: dark;
}

/* ── Scoreboard game cards (index.html) ─────────────────────── */
html.night-mode .game-card {
  background: #222228;
}

/* ── Stats page: filter inputs, mode buttons, table ─────────── */
html.night-mode .stat-filter-field input,
html.night-mode .stat-filter-field select,
html.night-mode .search-input,
html.night-mode .filter-select {
  background: #222228;
  color: #ededf0;
  border-color: #3a3a46;
}
html.night-mode .stat-mode-btn.active {
  background: #ededf0;
  color: #18181b;
}
html.night-mode .stat-mode-btn:hover:not(.active) {
  background: #2c2c34;
  color: #ededf0;
}
html.night-mode .filters-toggle:hover {
  background: #2c2c34;
}

/* ── Profile page: modals, search input, toggle knob ────────── */
html.night-mode .modal input,
html.night-mode .modal-box,
html.night-mode .modal-inner {
  background: #222228;
  color: #ededf0;
  border-color: #3a3a46;
}
html.night-mode .night-toggle-track::after {
  background: #ededf0;
}

/* ── General: all inputs / selects / textareas ──────────────── */
html.night-mode input:not([type="range"]):not([type="checkbox"]),
html.night-mode textarea,
html.night-mode select {
  background: #222228;
  color: #ededf0;
  border-color: #3a3a46;
}