/* ── Colorblind mode overrides ──
   Applied via body[data-colorblind="<mode>"]
   Covers: cell correct/wrong states, autocheck, chat-guess easy/hard,
           ranked safe/danger indicators, selected cells, word highlights.
*/

/* ──────────────────────────────────────────────────────
   DEUTERANOPIA  (green weakness — can't distinguish red from green)
   Fix: correct → teal, wrong → orange
   ────────────────────────────────────────────────────── */
body[data-colorblind="deuteranopia"] .game-cell.correct {
  background: #b3e5e0 !important;
  border-color: #4db6ac !important;
}
body[data-colorblind="deuteranopia"] .game-cell.wrong {
  background: #ffe0b2 !important;
  border-color: #ffa726 !important;
}
body[data-colorblind="deuteranopia"] .autocheck-pill.on {
  background: rgba(0,119,204,0.13) !important;
  border-color: #0077cc !important;
  color: #0077cc !important;
}
body[data-colorblind="deuteranopia"] .autocheck-pill.on .pill-dot {
  background: #0077cc !important;
}
body[data-colorblind="deuteranopia"] .chat-guess-btn.active {
  background: rgba(0,119,204,0.12) !important;
  border-color: #0077cc !important;
  color: #0077cc !important;
}
body[data-colorblind="deuteranopia"] .chat-guess-btn.active.hard-active {
  background: rgba(230,159,0,0.12) !important;
  border-color: #e69f00 !important;
  color: #e69f00 !important;
}

/* ──────────────────────────────────────────────────────
   PROTANOPIA  (red weakness — red appears very dark)
   Fix: correct → blue, wrong → yellow-amber
   ────────────────────────────────────────────────────── */
body[data-colorblind="protanopia"] .game-cell.correct {
  background: #cce0ff !important;
  border-color: #5b9bd5 !important;
}
body[data-colorblind="protanopia"] .game-cell.wrong {
  background: #fff0cc !important;
  border-color: #d4a017 !important;
}
body[data-colorblind="protanopia"] .autocheck-pill.on {
  background: rgba(0,100,200,0.13) !important;
  border-color: #0064c8 !important;
  color: #0064c8 !important;
}
body[data-colorblind="protanopia"] .autocheck-pill.on .pill-dot {
  background: #0064c8 !important;
}
body[data-colorblind="protanopia"] .chat-guess-btn.active {
  background: rgba(0,100,200,0.12) !important;
  border-color: #0064c8 !important;
  color: #0064c8 !important;
}
body[data-colorblind="protanopia"] .chat-guess-btn.active.hard-active {
  background: rgba(212,160,23,0.12) !important;
  border-color: #d4a017 !important;
  color: #d4a017 !important;
}

/* ──────────────────────────────────────────────────────
   TRITANOPIA  (blue-yellow weakness)
   Fix: blue selections/highlights → pink/magenta
   ────────────────────────────────────────────────────── */
body[data-colorblind="tritanopia"] .game-cell.selected {
  background: #f2b8e8 !important;
  border-color: #cc79a7 !important;
  outline-color: #aa3380 !important;
}
body[data-colorblind="tritanopia"] .game-cell.word-highlight {
  background: #fce8f9 !important;
}
body[data-colorblind="tritanopia"] .chat-guess-mode .game-cell.selected {
  outline-color: #aa3380 !important;
}

/* ──────────────────────────────────────────────────────
   HIGH CONTRAST  (boost all feedback colors)
   ────────────────────────────────────────────────────── */
body[data-high-contrast="true"] .game-cell {
  border-width: 2px !important;
}
body[data-high-contrast="true"] .game-cell.correct {
  background: #b9f6b9 !important;
  border-color: #007700 !important;
}
body[data-high-contrast="true"] .game-cell.wrong {
  background: #ffc0c0 !important;
  border-color: #cc0000 !important;
}
body[data-high-contrast="true"] .game-cell.selected {
  background: #ffffc0 !important;
  border-color: #998800 !important;
  outline-color: #998800 !important;
}
body[data-high-contrast="true"] .game-cell.word-highlight {
  background: #e8e8ff !important;
}
body[data-high-contrast="true"] .game-cell-letter {
  color: #000000 !important;
  font-weight: 900 !important;
}
body[data-high-contrast="true"] .autocheck-pill.on {
  background: rgba(0,150,0,0.2) !important;
  border-color: #009900 !important;
  color: #009900 !important;
}
body[data-high-contrast="true"] .autocheck-pill.on .pill-dot {
  background: #009900 !important;
}
body[data-high-contrast="true"] .chat-guess-btn.active {
  background: rgba(0,150,0,0.2) !important;
  border-color: #009900 !important;
  color: #009900 !important;
}
body[data-high-contrast="true"] .chat-guess-btn.active.hard-active {
  background: rgba(200,0,0,0.2) !important;
  border-color: #cc0000 !important;
  color: #cc0000 !important;
}

/* ──────────────────────────────────────────────────────
   DEUTERANOPIA — additional fixes
   ────────────────────────────────────────────────────── */

/* Toggle switch: red/green → amber/blue */
body[data-colorblind="deuteranopia"] .toggle-track { background: #e69f00 !important; }
body[data-colorblind="deuteranopia"] .toggle-input:checked + .toggle-track { background: #0077cc !important; }

/* Versus mode mini-grid correct cells */
body[data-colorblind="deuteranopia"] .versus-mini-cell.correct { background: #4db6ac !important; }

/* Game timer danger warning */
body[data-colorblind="deuteranopia"] .game-timer.warn { color: #e69f00 !important; }

/* Game-over elimination round label */
body[data-colorblind="deuteranopia"] .game-over-elim-round { color: #e69f00 !important; }

/* Lobby browser status pill (green "In Lobby") */
body[data-colorblind="deuteranopia"] .status-pill.in-lobby {
  color: #4db6ac !important;
  background: rgba(77,182,172,0.12) !important;
  border-color: rgba(77,182,172,0.3) !important;
}

/* Friends online dot */
body[data-colorblind="deuteranopia"] .friend-status-dot.online { background: #0077cc !important; }

/* Ranked danger pulse → amber */
body[data-colorblind="deuteranopia"] .ranked-danger-active { animation-name: ranked-danger-pulse-amber !important; }

/* ──────────────────────────────────────────────────────
   PROTANOPIA — additional fixes
   ────────────────────────────────────────────────────── */

/* Toggle switch: red/green → amber/blue */
body[data-colorblind="protanopia"] .toggle-track { background: #d4a017 !important; }
body[data-colorblind="protanopia"] .toggle-input:checked + .toggle-track { background: #0064c8 !important; }

/* Versus mode mini-grid correct cells */
body[data-colorblind="protanopia"] .versus-mini-cell.correct { background: #5b9bd5 !important; }

/* Game timer danger warning */
body[data-colorblind="protanopia"] .game-timer.warn { color: #d4a017 !important; }

/* Game-over elimination round label */
body[data-colorblind="protanopia"] .game-over-elim-round { color: #d4a017 !important; }

/* Lobby browser status pill */
body[data-colorblind="protanopia"] .status-pill.in-lobby {
  color: #5b9bd5 !important;
  background: rgba(91,155,213,0.12) !important;
  border-color: rgba(91,155,213,0.3) !important;
}

/* Friends online dot */
body[data-colorblind="protanopia"] .friend-status-dot.online { background: #0064c8 !important; }

/* Ranked danger pulse → amber */
body[data-colorblind="protanopia"] .ranked-danger-active { animation-name: ranked-danger-pulse-amber !important; }

/* ── Amber danger-pulse keyframe (shared by deuteranopia + protanopia) ── */
@keyframes ranked-danger-pulse-amber {
  0%, 100% { box-shadow: 0 0 0 2.5px rgba(230,159,0,0.85), 0 0 18px rgba(230,159,0,0.22); }
  50%       { box-shadow: 0 0 0 2.5px rgba(230,159,0,0.15), 0 0 4px  rgba(230,159,0,0.04); }
}

/* ──────────────────────────────────────────────────────
   HIGH CONTRAST — additional fixes
   ────────────────────────────────────────────────────── */

/* Toggle switch: boost saturation */
body[data-high-contrast="true"] .toggle-track { background: #cc0000 !important; }
body[data-high-contrast="true"] .toggle-input:checked + .toggle-track { background: #009900 !important; }

/* Versus mode mini-grid correct cells */
body[data-high-contrast="true"] .versus-mini-cell.correct { background: #007700 !important; }

/* Game timer danger warning */
body[data-high-contrast="true"] .game-timer.warn { color: #ff0000 !important; font-weight: 700 !important; }

/* Game-over elimination round label */
body[data-high-contrast="true"] .game-over-elim-round { color: #cc0000 !important; }

/* Lobby browser status pill */
body[data-high-contrast="true"] .status-pill.in-lobby {
  color: #22ff44 !important;
  background: rgba(34,255,68,0.15) !important;
  border-color: rgba(34,255,68,0.5) !important;
}

/* Friends online dot */
body[data-high-contrast="true"] .friend-status-dot.online {
  background: #00cc00 !important;
  border-width: 2px !important;
}

/* Ranked danger pulse → full-brightness red */
body[data-high-contrast="true"] .ranked-danger-active { animation-name: ranked-danger-pulse-hc !important; }
@keyframes ranked-danger-pulse-hc {
  0%, 100% { box-shadow: 0 0 0 3px rgba(255,0,0,1), 0 0 20px rgba(255,0,0,0.5); }
  50%       { box-shadow: 0 0 0 3px rgba(255,0,0,0.2), 0 0 5px  rgba(255,0,0,0.08); }
}

/* ══════════════════════════════════════════════════════
   COMBINED: COLOR BLIND + HIGH CONTRAST
   Overrides plain high-contrast green/red with boosted
   colorblind-safe colors.
   ══════════════════════════════════════════════════════ */

/* ── Deuteranopia + High Contrast ── */
body[data-colorblind="deuteranopia"][data-high-contrast="true"] .game-cell { border-width: 2px !important; }
body[data-colorblind="deuteranopia"][data-high-contrast="true"] .game-cell.correct { background: #80cbc4 !important; border-color: #00897b !important; }
body[data-colorblind="deuteranopia"][data-high-contrast="true"] .game-cell.wrong   { background: #ffcc80 !important; border-color: #e65100 !important; }
body[data-colorblind="deuteranopia"][data-high-contrast="true"] .game-cell-letter  { color: #000 !important; font-weight: 900 !important; }
body[data-colorblind="deuteranopia"][data-high-contrast="true"] .autocheck-pill.on { background: rgba(0,93,170,0.2) !important; border-color: #005daa !important; color: #005daa !important; }
body[data-colorblind="deuteranopia"][data-high-contrast="true"] .autocheck-pill.on .pill-dot { background: #005daa !important; }
body[data-colorblind="deuteranopia"][data-high-contrast="true"] .chat-guess-btn.active { background: rgba(0,93,170,0.2) !important; border-color: #005daa !important; color: #005daa !important; }
body[data-colorblind="deuteranopia"][data-high-contrast="true"] .chat-guess-btn.active.hard-active { background: rgba(230,81,0,0.2) !important; border-color: #e65100 !important; color: #e65100 !important; }
body[data-colorblind="deuteranopia"][data-high-contrast="true"] .toggle-track { background: #cc7700 !important; }
body[data-colorblind="deuteranopia"][data-high-contrast="true"] .toggle-input:checked + .toggle-track { background: #005daa !important; }
body[data-colorblind="deuteranopia"][data-high-contrast="true"] .versus-mini-cell.correct { background: #00897b !important; }
body[data-colorblind="deuteranopia"][data-high-contrast="true"] .game-timer.warn { color: #e65100 !important; font-weight: 700 !important; }
body[data-colorblind="deuteranopia"][data-high-contrast="true"] .game-over-elim-round { color: #e65100 !important; }
body[data-colorblind="deuteranopia"][data-high-contrast="true"] .status-pill.in-lobby { color: #00897b !important; background: rgba(0,137,123,0.18) !important; border-color: rgba(0,137,123,0.55) !important; }
body[data-colorblind="deuteranopia"][data-high-contrast="true"] .friend-status-dot.online { background: #005daa !important; border-width: 2px !important; }
body[data-colorblind="deuteranopia"][data-high-contrast="true"] .ranked-danger-active { animation-name: ranked-danger-pulse-amber !important; }

/* ── Protanopia + High Contrast ── */
body[data-colorblind="protanopia"][data-high-contrast="true"] .game-cell { border-width: 2px !important; }
body[data-colorblind="protanopia"][data-high-contrast="true"] .game-cell.correct { background: #90caf9 !important; border-color: #1565c0 !important; }
body[data-colorblind="protanopia"][data-high-contrast="true"] .game-cell.wrong   { background: #ffe082 !important; border-color: #f57f17 !important; }
body[data-colorblind="protanopia"][data-high-contrast="true"] .game-cell-letter  { color: #000 !important; font-weight: 900 !important; }
body[data-colorblind="protanopia"][data-high-contrast="true"] .autocheck-pill.on { background: rgba(21,101,192,0.2) !important; border-color: #1565c0 !important; color: #1565c0 !important; }
body[data-colorblind="protanopia"][data-high-contrast="true"] .autocheck-pill.on .pill-dot { background: #1565c0 !important; }
body[data-colorblind="protanopia"][data-high-contrast="true"] .chat-guess-btn.active { background: rgba(21,101,192,0.2) !important; border-color: #1565c0 !important; color: #1565c0 !important; }
body[data-colorblind="protanopia"][data-high-contrast="true"] .chat-guess-btn.active.hard-active { background: rgba(245,127,23,0.2) !important; border-color: #f57f17 !important; color: #f57f17 !important; }
body[data-colorblind="protanopia"][data-high-contrast="true"] .toggle-track { background: #cc7700 !important; }
body[data-colorblind="protanopia"][data-high-contrast="true"] .toggle-input:checked + .toggle-track { background: #1565c0 !important; }
body[data-colorblind="protanopia"][data-high-contrast="true"] .versus-mini-cell.correct { background: #1565c0 !important; }
body[data-colorblind="protanopia"][data-high-contrast="true"] .game-timer.warn { color: #f57f17 !important; font-weight: 700 !important; }
body[data-colorblind="protanopia"][data-high-contrast="true"] .game-over-elim-round { color: #f57f17 !important; }
body[data-colorblind="protanopia"][data-high-contrast="true"] .status-pill.in-lobby { color: #1565c0 !important; background: rgba(21,101,192,0.18) !important; border-color: rgba(21,101,192,0.55) !important; }
body[data-colorblind="protanopia"][data-high-contrast="true"] .friend-status-dot.online { background: #1565c0 !important; border-width: 2px !important; }
body[data-colorblind="protanopia"][data-high-contrast="true"] .ranked-danger-active { animation-name: ranked-danger-pulse-amber !important; }

/* ── Tritanopia + High Contrast ── */
body[data-colorblind="tritanopia"][data-high-contrast="true"] .game-cell.selected { background: #f48fb1 !important; border-color: #880e4f !important; outline-color: #880e4f !important; }
body[data-colorblind="tritanopia"][data-high-contrast="true"] .game-cell.word-highlight { background: #fce4ec !important; }
body[data-colorblind="tritanopia"][data-high-contrast="true"] .chat-guess-mode .game-cell.selected { outline-color: #880e4f !important; }

/* ══════════════════════════════════════════════════════
   SITE-WIDE COLORBLIND OVERRIDES
   Covers: ranked HUD safe/danger pill, player status badges,
           leaderboard medals, lobby status pills, color swatch labels
   ══════════════════════════════════════════════════════ */

/* ──────────────────────────────────────────────────────
   RANKED HUD STATUS PILL
   safe = green → teal/blue; danger = red → amber/blue
   ────────────────────────────────────────────────────── */

/* Deuteranopia: safe → teal, danger → amber */
body[data-colorblind="deuteranopia"] .ranked-hud-safe   { color: #0077cc !important; background: rgba(0,119,204,0.15) !important; border-color: rgba(0,119,204,0.45) !important; }
body[data-colorblind="deuteranopia"] .ranked-hud-danger { color: #e69f00 !important; background: rgba(230,159,0,0.15)  !important; border-color: rgba(230,159,0,0.45)  !important; }
body[data-colorblind="deuteranopia"] .ranked-all-safe-text { color: #0077cc !important; }

/* Protanopia: safe → blue, danger → amber */
body[data-colorblind="protanopia"] .ranked-hud-safe   { color: #0064c8 !important; background: rgba(0,100,200,0.15) !important; border-color: rgba(0,100,200,0.45) !important; }
body[data-colorblind="protanopia"] .ranked-hud-danger { color: #d4a017 !important; background: rgba(212,160,23,0.15) !important; border-color: rgba(212,160,23,0.45) !important; }
body[data-colorblind="protanopia"] .ranked-all-safe-text { color: #0064c8 !important; }

/* Tritanopia: no red/green issue — safe stays green, danger stays red; both are fine */

/* High Contrast: boost saturation */
body[data-high-contrast="true"] .ranked-hud-safe   { color: #007700 !important; background: rgba(0,150,0,0.2)   !important; border-color: rgba(0,150,0,0.6)   !important; font-weight: 900 !important; }
body[data-high-contrast="true"] .ranked-hud-danger { color: #cc0000 !important; background: rgba(200,0,0,0.18)  !important; border-color: rgba(200,0,0,0.55)  !important; font-weight: 900 !important; }
body[data-high-contrast="true"] .ranked-all-safe-text { color: #007700 !important; font-weight: 900 !important; }

/* Deuteranopia + High Contrast */
body[data-colorblind="deuteranopia"][data-high-contrast="true"] .ranked-hud-safe   { color: #005daa !important; background: rgba(0,93,170,0.2)   !important; border-color: rgba(0,93,170,0.6)   !important; font-weight: 900 !important; }
body[data-colorblind="deuteranopia"][data-high-contrast="true"] .ranked-hud-danger { color: #cc7700 !important; background: rgba(204,119,0,0.18)  !important; border-color: rgba(204,119,0,0.55)  !important; font-weight: 900 !important; }
body[data-colorblind="deuteranopia"][data-high-contrast="true"] .ranked-all-safe-text { color: #005daa !important; font-weight: 900 !important; }

/* Protanopia + High Contrast */
body[data-colorblind="protanopia"][data-high-contrast="true"] .ranked-hud-safe   { color: #1565c0 !important; background: rgba(21,101,192,0.2)  !important; border-color: rgba(21,101,192,0.6)  !important; font-weight: 900 !important; }
body[data-colorblind="protanopia"][data-high-contrast="true"] .ranked-hud-danger { color: #f57f17 !important; background: rgba(245,127,23,0.18) !important; border-color: rgba(245,127,23,0.55) !important; font-weight: 900 !important; }
body[data-colorblind="protanopia"][data-high-contrast="true"] .ranked-all-safe-text { color: #1565c0 !important; font-weight: 900 !important; }

/* ──────────────────────────────────────────────────────
   PLAYER STATUS BADGES (out / spectating)
   Compound selectors match game.css specificity and win over
   the base .player-badge rule in lobby.css (loaded after game.css).
   ────────────────────────────────────────────────────── */

/* Deuteranopia: "out" red → amber */
body[data-colorblind="deuteranopia"] .player-badge.player-badge-out { color: #e69f00 !important; background: rgba(230,159,0,0.18) !important; border-color: rgba(230,159,0,0.45) !important; }

/* Protanopia: "out" red → amber */
body[data-colorblind="protanopia"] .player-badge.player-badge-out { color: #d4a017 !important; background: rgba(212,160,23,0.18) !important; border-color: rgba(212,160,23,0.45) !important; }

/* High Contrast: boost both badges */
body[data-high-contrast="true"] .player-badge.player-badge-out        { color: #cc0000 !important; background: rgba(200,0,0,0.2)   !important; border-color: rgba(200,0,0,0.55)   !important; font-weight: 700 !important; }
body[data-high-contrast="true"] .player-badge.player-badge-spectating { color: #4455ee !important; background: rgba(68,85,238,0.22) !important; border-color: rgba(68,85,238,0.5)  !important; font-weight: 700 !important; }

/* Deuteranopia + High Contrast */
body[data-colorblind="deuteranopia"][data-high-contrast="true"] .player-badge.player-badge-out { color: #cc7700 !important; background: rgba(204,119,0,0.22) !important; border-color: rgba(204,119,0,0.55) !important; font-weight: 700 !important; }

/* Protanopia + High Contrast */
body[data-colorblind="protanopia"][data-high-contrast="true"] .player-badge.player-badge-out { color: #f57f17 !important; background: rgba(245,127,23,0.22) !important; border-color: rgba(245,127,23,0.55) !important; font-weight: 700 !important; }

/* ──────────────────────────────────────────────────────
   LEADERBOARD MEDAL RANKS
   Handled in JS (_lbPodiumColHtml) since the podium uses
   inline styles. No CSS selectors needed here.
   ────────────────────────────────────────────────────── */

/* ──────────────────────────────────────────────────────
   AMBER "IN GAME" INDICATORS
   Covers both .status-pill.in-game (lobby browser on home page)
   and .player-badge.in-game (player list inside the lobby).
   Tritanopia (blue-yellow weakness): amber/yellow → red-pink
   ────────────────────────────────────────────────────── */
body[data-colorblind="tritanopia"] .status-pill.in-game,
body[data-colorblind="tritanopia"] .player-badge.in-game {
  color: #e0407a !important;
  background: rgba(224,64,122,0.12) !important;
  border-color: rgba(224,64,122,0.35) !important;
}
body[data-colorblind="tritanopia"][data-high-contrast="true"] .status-pill.in-game,
body[data-colorblind="tritanopia"][data-high-contrast="true"] .player-badge.in-game {
  color: #c0185a !important;
  background: rgba(192,24,90,0.18) !important;
  border-color: rgba(192,24,90,0.55) !important;
}

