/* Light mode for every page (see theme.js). Pages define their dark colors as
   :root variables; this file only overrides them when <html data-theme="light">,
   plus the few places that hard-code a dark color. Board overlays (tokens, HP
   badges on the board art) stay dark in both modes on purpose. */

:root[data-theme="dark"] { color-scheme: dark; }
:root[data-theme="light"] {
  color-scheme: light;

  /* tools pages, map editor (tools/board.css), ability editor */
  --bg-dark: #eef0f4;
  --bg-panel: #ffffff;
  --bg-card: #f5f6f9;
  --bg-hover: #e6e9f0;
  --border: #d6dbe5;
  --border-light: #bcc4d4;
  --text-primary: #1b2030;
  --text-secondary: #4e5a72;
  --text-muted: #828ca0;
  --team-a: #1f6fd6;
  --team-a-dark: #cfe0f8;
  --team-a-glow: rgba(31, 111, 214, 0.25);
  --team-b: #d23c3c;
  --team-b-dark: #f6d2d2;
  --team-b-glow: rgba(210, 60, 60, 0.25);
  --gold: #a97800;
  --gold-dark: #f6e7bd;
  --green: #1d8a55;
  --purple: #8445c4;
  --orange: #bd6a00;
  --red: #d23c3c;
  --nexus-hp: #1d8a55;
  --damage: #d83030;
  --heal: #18a35a;

  /* the game: lobby, game, admin (play.css) */
  --bg: #eef0f4;
  --panel: #ffffff;
  --card: #f5f6f9;
  --hover: #e6e9f0;
  --text: #1b2030;
  --text-2: #4e5a72;
  --muted: #828ca0;
  --light: #a97800;
  --shadow: #7444d0;
  --move: #1d8a55;
  --target: #d83030;
}

/* ── Toggle button ───────────────────────────────────────── */
.theme-toggle {
  font: 15px/1 system-ui, sans-serif; width: 30px; height: 30px; padding: 0; flex: none;
  display: inline-flex; align-items: center; justify-content: center; margin-left: 8px;
  border-radius: 50%; cursor: pointer;
  background: var(--bg-card, var(--card, #1e2330)); color: var(--text-primary, var(--text, #e8ecf5));
  border: 1px solid var(--border-light, #3a4560);
}
.theme-toggle:hover { border-color: var(--gold, #f0c040); }
.theme-toggle.floating { position: fixed; left: 12px; bottom: 12px; z-index: 1000; margin: 0; opacity: 0.75; }
.theme-toggle.floating:hover { opacity: 1; }

/* ── Light-mode fixes for hard-coded dark colors ────────── */

/* Buttons with a gold background keep dark text; white is more legible on the darker gold. */
[data-theme="light"] button.primary,
[data-theme="light"] .btn-gold { color: #fff; }
[data-theme="light"] button.primary:hover:not(:disabled) { background: #8f6600; }

/* Map editor board (tools/board.css, formerly the old game's game.css) */
[data-theme="light"] #setup-screen,
[data-theme="light"] #card-draw-screen,
[data-theme="light"] #hero-select-screen { background: radial-gradient(ellipse at center, #ffffff 0%, #e4e8ef 100%); }
[data-theme="light"] #board-container { background: #dfe3ea; }
[data-theme="light"] #phase-overlay { background: rgba(238, 240, 244, 0.88); }
[data-theme="light"] .btn-onward:hover:not(:disabled) { background: #eed99a; }
[data-theme="light"] .range-btn.active { background: #4e5a72; border-color: #4e5a72; }
[data-theme="light"] .monster-token { background: #f7f1d9; border-color: #c9b25a; }
[data-theme="light"] .outsider-token { background: #f1e6fb; }
[data-theme="light"] .status-poison { background: #f1e6fb; color: #7a3cb8; border-color: #b78ce0; }
[data-theme="light"] .status-immobilized { background: #e3eefc; color: #1f6fd6; border-color: #93b8ea; }
[data-theme="light"] .status-marked { background: #fbe4e4; color: #c03030; border-color: #e7a0a0; }
[data-theme="light"] .status-untargetable,
[data-theme="light"] .status-ap-boost { background: #faf1d6; color: #8a6200; border-color: #d9be6a; }
[data-theme="light"] .status-retaliate,
[data-theme="light"] .status-counter { background: #fbecd9; color: #a85a00; border-color: #e3b178; }
[data-theme="light"] .status-armor-buff { background: #e3eefc; color: #1f6fd6; border-color: #93b8ea; }
[data-theme="light"] .item-red    { background: #fbe4e4; color: #b52a2a; border-color: #e7a0a0; }
[data-theme="light"] .item-blue   { background: #e5e8fb; color: #3438c0; border-color: #a3a8ea; }
[data-theme="light"] .item-green  { background: #e2f5e6; color: #1d7a35; border-color: #92d0a2; }
[data-theme="light"] .item-yellow { background: #faf3d2; color: #7d6a00; border-color: #d8c66a; }
[data-theme="light"] .item-purple { background: #f1e6fb; color: #7a3cb8; border-color: #b78ce0; }
[data-theme="light"] .log-entry.log-nexus { color: #c02020; }
[data-theme="light"] #mpap-subtitle { color: var(--text-secondary) !important; }

/* Map editor: the page around the board and its side panel */
[data-theme="light"] body:has(#poly-overlay) { background: #dfe3ea; }
[data-theme="light"] #panel { background: rgba(255, 255, 255, 0.96); color: #1b2030; border-color: #bcc4d4; }
[data-theme="light"] #panel button, [data-theme="light"] #panel select { background: #f5f6f9; color: #1b2030; border-color: #bcc4d4; }
[data-theme="light"] #panel button:hover { background: #e6e9f0; }
[data-theme="light"] #panel button.active { background: #dcf3e4; border-color: #1d8a55; }
[data-theme="light"] #panel a { color: #4e5a72 !important; }
[data-theme="light"] #panel textarea { background: #f5f6f9; color: #1b2030; border-color: #bcc4d4; }
[data-theme="light"] #twrInfo .blocked { color: #c03030; }
[data-theme="light"] #twrInfo .allowed { color: #1d8a55; }

/* Docs */
[data-theme="light"] .error { color: #c03030; }

/* ── Bug report footer + dialog (bug-report.js) ─────────── */
.bug-footer { display: flex; justify-content: center; padding: 18px 16px 24px; }
.bug-footer button {
  font: 13px system-ui, sans-serif; cursor: pointer; border-radius: 999px; padding: 6px 14px;
  background: transparent; color: var(--text-secondary, var(--text-2, #8090b0));
  border: 1px solid var(--border-light, #3a4560);
}
.bug-footer button:hover { color: var(--text-primary, var(--text, #e8ecf5)); border-color: var(--gold, #f0c040); }
.bug-dialog {
  width: min(520px, calc(100% - 32px)); padding: 20px; border-radius: 10px;
  background: var(--bg-panel, var(--panel, #161a23)); color: var(--text-primary, var(--text, #e8ecf5));
  border: 1px solid var(--border-light, #3a4560); font: 14px system-ui, sans-serif;
}
.bug-dialog::backdrop { background: rgba(0, 0, 0, 0.55); }
.bug-dialog h2 { margin: 0 0 14px; font-size: 17px; }
.bug-dialog label { display: flex; flex-direction: column; gap: 5px; margin-bottom: 12px; font-weight: 600; font-size: 13px; }
.bug-dialog select, .bug-dialog textarea {
  font: 14px system-ui, sans-serif; font-weight: 400; padding: 8px; border-radius: 6px; width: 100%;
  background: var(--bg-card, var(--card, #1e2330)); color: inherit; border: 1px solid var(--border-light, #3a4560);
}
.bug-dialog textarea { resize: vertical; min-height: 110px; }
.bug-note, .bug-msg { margin: 0 0 8px; font-size: 12.5px; color: var(--text-secondary, var(--text-2, #8090b0)); }
.bug-msg:empty { display: none; }
.bug-buttons { display: flex; justify-content: flex-end; gap: 8px; margin-top: 6px; }
.bug-buttons button {
  font: 14px system-ui, sans-serif; cursor: pointer; padding: 7px 14px; border-radius: 6px;
  background: var(--bg-card, var(--card, #1e2330)); color: inherit; border: 1px solid var(--border-light, #3a4560);
}
.bug-buttons .bug-send { background: var(--gold, #f0c040); border-color: var(--gold, #f0c040); color: #1a1400; font-weight: 600; }
[data-theme="light"] .bug-buttons .bug-send { color: #fff; }
.bug-buttons button:disabled { opacity: 0.5; cursor: default; }
