/* Day deck: the game's light theme.
   Loaded after every other stylesheet; only active when the shared theme
   module puts data-theme="light" on <html>. Dark stays untouched. */

html[data-theme="light"] {
  color-scheme: light;
  --void: #eef0ea;
  --void-soft: #e6e9e3;
  --panel: rgba(255, 255, 255, 0.9);
  --panel-raised: rgba(255, 255, 255, 0.96);
  --panel-lift: rgba(245, 248, 243, 0.98);
  --line: rgba(23, 42, 48, 0.16);
  --line-strong: rgba(23, 42, 48, 0.3);
  --text: #16262c;
  --text-soft: #46585e;
  --text-dim: #6d8085;
  --shadow: 0 22px 50px rgba(31, 45, 50, 0.16);
}

html[data-theme="light"] body {
  background:
    radial-gradient(circle at 16% 0%, rgba(94, 223, 212, 0.16), transparent 34%),
    linear-gradient(145deg, #f4f6f0 0%, #ecefe8 55%, #e7ebe5 100%);
}

html[data-theme="light"] body::before {
  background:
    linear-gradient(rgba(23, 42, 48, 0.035) 1px, transparent 1px),
    linear-gradient(90deg, rgba(23, 42, 48, 0.035) 1px, transparent 1px);
}

html[data-theme="light"] .star-field {
  opacity: 0.16;
}

html[data-theme="light"] .orbital-grid {
  opacity: 0.3;
}

html[data-theme="light"] .scanline {
  opacity: 0.08;
}

/* ------------------------------------------------------------- chrome */

html[data-theme="light"] .topbar {
  background: linear-gradient(180deg, rgba(244, 246, 240, 0.96), rgba(244, 246, 240, 0.78));
}

html[data-theme="light"] .icon-button {
  background: rgba(255, 255, 255, 0.82);
}

html[data-theme="light"] .icon-button:hover {
  background: #ffffff;
}

html[data-theme="light"] .room-chip {
  background: rgba(255, 255, 255, 0.86);
}

html[data-theme="light"] .room-chip b,
html[data-theme="light"] .lobby-code {
  color: #8a6216;
  text-shadow: none;
}

/* -------------------------------------------------------------- lobby */

html[data-theme="light"] .online-lobby {
  color: var(--text);
}

html[data-theme="light"] .lobby-hero h1 {
  color: var(--text);
  text-shadow: none;
}

html[data-theme="light"] .lobby-hero > p,
html[data-theme="light"] .lobby-note {
  color: var(--text-soft);
}

html[data-theme="light"] .lobby-orbit {
  border-color: rgba(14, 111, 107, 0.16);
}

html[data-theme="light"] .lobby-card {
  border-color: rgba(23, 42, 48, 0.16);
  background:
    linear-gradient(135deg, rgba(255, 255, 255, 0.7), transparent 30%),
    linear-gradient(180deg, #ffffff, #f1f4ee);
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, 0.9),
    0 18px 40px rgba(31, 45, 50, 0.14);
}

html[data-theme="light"] .lobby-field input {
  border-color: rgba(23, 42, 48, 0.2);
  background: #ffffff;
  color: var(--text);
}

html[data-theme="light"] .lobby-field > span {
  color: var(--text-dim);
}

html[data-theme="light"] .landing-rules,
html[data-theme="light"] .limit-choice {
  border-color: rgba(23, 42, 48, 0.2);
  background: rgba(255, 255, 255, 0.86);
  color: var(--text-soft);
}

html[data-theme="light"] .landing-rules:hover,
html[data-theme="light"] .limit-choice:hover {
  border-color: rgba(23, 42, 48, 0.36);
  color: var(--text);
}

/* Solid gold command buttons stay readable on the pale lobby card. */
html[data-theme="light"] .launch-button {
  border-color: rgba(138, 98, 22, 0.5);
  background: linear-gradient(110deg, #e9c87e, #ddb45f);
  color: #2b1d05;
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, 0.55),
    0 10px 22px rgba(138, 98, 22, 0.18);
}

html[data-theme="light"] .launch-button:not(:disabled):hover {
  background: linear-gradient(110deg, #f0d391, #e5bf6d);
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, 0.6),
    0 12px 26px rgba(138, 98, 22, 0.24);
}

html[data-theme="light"] .launch-button:disabled {
  border-color: rgba(23, 42, 48, 0.14);
  background: rgba(23, 42, 48, 0.08);
  color: rgba(23, 42, 48, 0.42);
  box-shadow: none;
}

html[data-theme="light"] .ready-button {
  border-color: rgba(14, 111, 107, 0.45);
  background: rgba(14, 111, 107, 0.1);
  color: #0b4f4c;
  box-shadow: none;
}

html[data-theme="light"] .ready-button.is-ready {
  border-color: rgba(20, 128, 92, 0.6);
  background: linear-gradient(180deg, rgba(45, 178, 126, 0.2), rgba(45, 178, 126, 0.08));
  color: #0d5c40;
}

html[data-theme="light"] .mode-choice {
  border-color: rgba(23, 42, 48, 0.16);
  background: rgba(255, 255, 255, 0.72);
  color: var(--text-soft);
}

html[data-theme="light"] .mode-choice[aria-pressed="true"] {
  border-color: rgba(14, 111, 107, 0.6);
  background: rgba(94, 223, 212, 0.14);
  color: var(--text);
  box-shadow: inset 0 0 22px rgba(94, 223, 212, 0.12);
}

html[data-theme="light"] .mode-choice small,
html[data-theme="light"] .mode-choice span {
  color: var(--text-dim);
}

html[data-theme="light"] .limit-choice[aria-pressed="true"] {
  border-color: rgba(14, 111, 107, 0.62);
  background: linear-gradient(180deg, rgba(94, 223, 212, 0.22), rgba(94, 223, 212, 0.08));
  color: var(--text);
  box-shadow: none;
}

html[data-theme="light"] .limit-choice--infinite[aria-pressed="true"] {
  border-color: rgba(176, 125, 43, 0.6);
  background: linear-gradient(180deg, rgba(238, 200, 109, 0.26), rgba(238, 200, 109, 0.1));
  color: #6d4c12;
}

html[data-theme="light"] .lobby-seat {
  border-color: rgba(23, 42, 48, 0.14);
  background: rgba(255, 255, 255, 0.76);
  color: var(--text);
}

html[data-theme="light"] .lobby-seat--add,
html[data-theme="light"] .seat-tag {
  color: var(--text-soft);
  border-color: rgba(23, 42, 48, 0.2);
}

html[data-theme="light"] .seat-state {
  color: var(--text-dim);
}

html[data-theme="light"] .lobby-seat__index {
  color: var(--text-dim);
}

html[data-theme="light"] .lobby-link {
  color: var(--text-soft);
}

/* -------------------------------------------------------------- table */

html[data-theme="light"] .section-label h2,
html[data-theme="light"] .deck-header h2 {
  color: var(--text);
}

html[data-theme="light"] .section-line {
  background: rgba(23, 42, 48, 0.16);
}

html[data-theme="light"] .player-panel {
  border-color: rgba(23, 42, 48, 0.14);
  background:
    linear-gradient(135deg, rgba(255, 255, 255, 0.6), transparent 38%),
    linear-gradient(180deg, #ffffff, #f2f5ef);
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, 0.9),
    0 16px 32px rgba(31, 45, 50, 0.12);
}

html[data-theme="light"] .player-panel[data-status="busted"] {
  border-color: rgba(200, 50, 70, 0.34);
  background: linear-gradient(180deg, #fff3f4, #ffe4e7);
}

html[data-theme="light"] .player-panel[data-status="stayed"] {
  border-color: rgba(176, 125, 43, 0.34);
  background: linear-gradient(180deg, #fffaf0, #fdf0d9);
}

html[data-theme="light"] .player-panel.is-current {
  border-color: rgba(14, 111, 107, 0.5);
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, 0.9),
    0 0 0 1px rgba(94, 223, 212, 0.35),
    0 18px 36px rgba(31, 45, 50, 0.16);
}

html[data-theme="light"] .player-panel.is-current .player-nameplate h3 {
  color: var(--text);
  text-shadow: none;
}

html[data-theme="light"] .player-nameplate h3 {
  color: var(--text);
}

html[data-theme="light"] .player-nameplate p,
html[data-theme="light"] .player-status,
html[data-theme="light"] .card-rail:empty::after {
  color: var(--text-dim);
}

html[data-theme="light"] .score-lockup b {
  color: var(--text);
}

html[data-theme="light"] .score-lockup small {
  color: var(--text-dim);
}

html[data-theme="light"] .score-lockup .round-score b {
  color: var(--text);
}

html[data-theme="light"] .command-deck {
  background:
    linear-gradient(135deg, rgba(94, 223, 212, 0.12), transparent 22%),
    linear-gradient(315deg, rgba(238, 200, 109, 0.14), transparent 28%),
    rgba(255, 255, 255, 0.94);
  box-shadow: 0 18px 40px rgba(31, 45, 50, 0.14);
}

html[data-theme="light"] .turn-readout {
  background: rgba(23, 42, 48, 0.045);
}

html[data-theme="light"] .turn-readout strong,
html[data-theme="light"] .turn-readout p {
  color: var(--text);
}

html[data-theme="light"] .turn-readout p {
  color: var(--text-soft);
}

html[data-theme="light"] .probability-strip span,
html[data-theme="light"] .pile-label,
html[data-theme="light"] .monitor-item small,
html[data-theme="light"] #activeCountLabel {
  color: var(--text-dim);
}

html[data-theme="light"] .probability-strip b,
html[data-theme="light"] .pile-count,
html[data-theme="light"] .monitor-item b {
  color: var(--text);
}

html[data-theme="light"] .pile-zone {
  background: rgba(23, 42, 48, 0.04);
  border-color: rgba(23, 42, 48, 0.14);
}

html[data-theme="light"] .event-console {
  background: rgba(244, 246, 240, 0.94);
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.9);
}

html[data-theme="light"] .console-label,
html[data-theme="light"] .event-line--muted {
  color: var(--text-dim);
}

html[data-theme="light"] .event-line {
  color: var(--text-soft);
}

html[data-theme="light"] .primary-action {
  border-color: rgba(14, 111, 107, 0.55);
  background: linear-gradient(180deg, #17766f, #0f5d58);
  color: #f2fffc;
}

html[data-theme="light"] .secondary-action {
  border-color: rgba(23, 42, 48, 0.2);
  background: rgba(255, 255, 255, 0.86);
  color: var(--text);
}

html[data-theme="light"] .secondary-action:hover {
  border-color: rgba(23, 42, 48, 0.36);
  background: #ffffff;
}

/* ------------------------------------------------------------ dialogs */

html[data-theme="light"] .dialog-shell {
  background:
    linear-gradient(135deg, rgba(94, 223, 212, 0.1), transparent 23%),
    linear-gradient(315deg, rgba(238, 200, 109, 0.12), transparent 27%),
    #ffffff;
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, 0.9),
    0 30px 80px rgba(31, 45, 50, 0.24);
}

html[data-theme="light"] .rule-block {
  border-color: rgba(23, 42, 48, 0.14);
  background: rgba(23, 42, 48, 0.035);
}

html[data-theme="light"] .rule-block p,
html[data-theme="light"] .rules-heading p {
  color: var(--text-soft);
}

html[data-theme="light"] .dialog-close {
  border-color: rgba(23, 42, 48, 0.2);
  background: rgba(255, 255, 255, 0.86);
  color: var(--text);
}

html[data-theme="light"] .score-table,
html[data-theme="light"] .score-row {
  border-color: rgba(23, 42, 48, 0.12);
}

html[data-theme="light"] .score-row--head {
  color: var(--text-dim);
}

html[data-theme="light"] .exit-action {
  border-color: rgba(23, 42, 48, 0.18);
  background: rgba(255, 255, 255, 0.86);
  color: var(--text);
}

html[data-theme="light"] .exit-message {
  color: var(--text-soft);
}

html[data-theme="light"] .target-modal__card {
  border-color: rgba(176, 125, 43, 0.42);
  background:
    linear-gradient(135deg, rgba(94, 223, 212, 0.12), transparent 27%),
    linear-gradient(315deg, rgba(238, 200, 109, 0.14), transparent 32%),
    #ffffff;
  box-shadow: 0 26px 70px rgba(31, 45, 50, 0.26);
}

html[data-theme="light"] .target-copy p,
html[data-theme="light"] .target-modal__hint {
  color: var(--text-soft);
}

html[data-theme="light"] .target-option {
  border-color: rgba(23, 42, 48, 0.14);
  background: rgba(255, 255, 255, 0.78);
  color: var(--text);
}

html[data-theme="light"] .target-option small {
  color: var(--text-dim);
}

html[data-theme="light"] .target-option:hover {
  border-color: rgba(176, 125, 43, 0.55);
  background: rgba(238, 200, 109, 0.16);
  color: var(--text);
}

html[data-theme="light"] .offline-console {
  border-color: rgba(200, 50, 70, 0.3);
  background: rgba(255, 243, 244, 0.92);
  color: var(--text);
}

html[data-theme="light"] .online-toast {
  border-color: rgba(23, 42, 48, 0.2);
  background: linear-gradient(180deg, #ffffff, #f1f4ee);
  color: var(--text);
  box-shadow: 0 16px 36px rgba(31, 45, 50, 0.18);
}

/* The toggle shows the mode it switches to: sun while dark, moon while light. */
.theme-toggle-button .theme-icon--moon {
  display: none;
}

html[data-theme="light"] .theme-toggle-button .theme-icon--sun {
  display: none;
}

html[data-theme="light"] .theme-toggle-button .theme-icon--moon {
  display: inline;
}
