/* Shared colour theme for every question-bank page. */
:root {
  color-scheme: light;
}

html[data-theme="dark"] {
  color-scheme: dark;
  --ink: #edf2ff;
  --muted: #aab6cf;
  --line: #34415a;
  --paper: #182235;
  --wash: #101827;
  --accent: #8ba8ff;
}

html[data-theme="dark"] body {
  background: #0d1421 !important;
  color: #edf2ff !important;
}

html[data-theme="dark"] .panel,
html[data-theme="dark"] .legend,
html[data-theme="dark"] .module-header,
html[data-theme="dark"] .questions-list,
html[data-theme="dark"] .toc,
html[data-theme="dark"] .stat-pill {
  background: #182235 !important;
  border-color: #34415a !important;
  color: #edf2ff;
}

html[data-theme="dark"] .page-header {
  background: #0a101b !important;
  color: #f4f7ff !important;
}

html[data-theme="dark"] .q-item,
html[data-theme="dark"] .section-divider,
html[data-theme="dark"] .module-header,
html[data-theme="dark"] .legend,
html[data-theme="dark"] .answer-panel,
html[data-theme="dark"] .ans-rule {
  border-color: #34415a !important;
}

html[data-theme="dark"] .section-divider,
html[data-theme="dark"] .answer-panel,
html[data-theme="dark"] .answer,
html[data-theme="dark"] .ans-note,
html[data-theme="dark"] .diagram-wrap,
html[data-theme="dark"] .diagram-box,
html[data-theme="dark"] .code-block,
html[data-theme="dark"] .compare-table th,
html[data-theme="dark"] .answer-panel th,
html[data-theme="dark"] .slot-tag {
  background: #111a2a !important;
  color: #dbe5fb !important;
}

html[data-theme="dark"] .q-header:hover,
html[data-theme="dark"] .q-item:hover,
html[data-theme="dark"] .toc-item:hover,
html[data-theme="dark"] .compare-table tr:nth-child(even) td {
  background: #202d44 !important;
}

html[data-theme="dark"] .q-text,
html[data-theme="dark"] .answer,
html[data-theme="dark"] .answer p,
html[data-theme="dark"] .answer li,
html[data-theme="dark"] .answer h4,
html[data-theme="dark"] h2.ans-title,
html[data-theme="dark"] h3.sub,
html[data-theme="dark"] .answer-panel p,
html[data-theme="dark"] .answer-panel li,
html[data-theme="dark"] .ans-h3,
html[data-theme="dark"] .ans-h4,
html[data-theme="dark"] .ans-p,
html[data-theme="dark"] .ans-ul li,
html[data-theme="dark"] .ans-ol li,
html[data-theme="dark"] .toc-item,
html[data-theme="dark"] .stat-pill strong,
html[data-theme="dark"] .insight-item,
html[data-theme="dark"] .subject {
  color: #edf2ff !important;
}

html[data-theme="dark"] .subject,
html[data-theme="dark"] .exam-option label {
  background: #182235 !important;
  border-color: #34415a !important;
}

html[data-theme="dark"] .compare-table td,
html[data-theme="dark"] .data-table td,
html[data-theme="dark"] .data-table th,
html[data-theme="dark"] .q-table td,
html[data-theme="dark"] .q-table th,
html[data-theme="dark"] .answer-panel td,
html[data-theme="dark"] .answer-panel th,
html[data-theme="dark"] .diagram-box {
  border-color: #34415a !important;
}

html[data-theme="dark"] .answer-panel tr:nth-child(even) td,
html[data-theme="dark"] .data-table th,
html[data-theme="dark"] .schema-list,
html[data-theme="dark"] .q-table td.lbl {
  background: #202d44 !important;
  color: #edf2ff !important;
}

html[data-theme="dark"] .highlight {
  background: #3a3014 !important;
  border-color: #e0a000 !important;
  color: #fff2b8 !important;
}

html[data-theme="dark"] .formula {
  background: #182847 !important;
  border-color: #6688d8 !important;
  color: #e4ecff !important;
}

html[data-theme="dark"] .result-box {
  background: #173526 !important;
  border-color: #4b9a68 !important;
  color: #dbffe7 !important;
}

html[data-theme="dark"] .exhibit svg {
  background: #111a2a;
}

html[data-theme="dark"] .exhibit-caption {
  color: #9aa8c7 !important;
}

.theme-toggle {
  position: fixed;
  right: 1rem;
  bottom: 1rem;
  z-index: 1000;
  border: 1px solid #8ba8ff;
  border-radius: 999px;
  padding: .6rem .85rem;
  background: #172033;
  color: #fff;
  font: 600 14px/1 system-ui, sans-serif;
  cursor: pointer;
  box-shadow: 0 5px 18px rgba(0, 0, 0, .25);
}

.theme-toggle:hover { background: #315eea; }
.theme-toggle:focus-visible { outline: 3px solid #8ba8ff; outline-offset: 3px; }

html[data-theme="dark"] .theme-toggle { background: #edf2ff; color: #101827; }
html[data-theme="dark"] .theme-toggle:hover { background: #cbd8ff; }