/* ============================================================
   Mass Tort Model — Light Theme Overrides
   Applied when <body class="light"> is set by _theme.js.
   Dark mode is the default (styled inline per-page).

   Uses !important on color properties because the page's
   own <style> block loads after this file and uses equal
   or lower specificity selectors with dark-mode colours.
   ============================================================ */

/* ── Broad element resets ────────────────────────────────── */
body.light                { background: #f0f4f8 !important; color: #1a202c !important; }
body.light h1             { color: #1a202c !important; }
body.light h2             { color: #1a202c !important; }
body.light h3             { color: #2d3748 !important; }
body.light h4             { color: #2d3748 !important; }
body.light p              { color: #2d3748 !important; }
body.light span           { color: inherit; }
body.light li             { color: #2d3748 !important; }
body.light a              { color: #2b6cb0 !important; }
body.light strong         { color: #1a202c !important; }
body.light b              { color: #1a202c !important; }
body.light code           { color: #2b6cb0 !important; }

/* ── Nav bar ─────────────────────────────────────────────── */
body.light .nav           { color: #4a5568 !important; }
body.light .nav a         { color: #2b6cb0 !important; }

/* ── Page header ─────────────────────────────────────────── */
body.light .header h1     { color: #1a202c !important; }
body.light .header p      { color: #4a5568 !important; }
body.light .subtitle      { color: #4a5568 !important; }
body.light .section-title { color: #718096 !important; border-color: #e2e8f0 !important; }

/* ── KPI cards — all variants ────────────────────────────── */
body.light .kpi              { background: #ffffff !important; border-color: #e2e8f0 !important; }
body.light .kpi .label       { color: #718096 !important; }
body.light .kpi .value       { color: #1a202c !important; }
body.light .kpi .sub         { color: #718096 !important; }
body.light .kpi .s           { color: #718096 !important; }
body.light .kpi .l           { color: #718096 !important; }
body.light .kpi .v           { color: #2b6cb0 !important; }

/* Coloured value variants */
body.light .kpi.positive .value  { color: #276749 !important; }
body.light .kpi.negative .value  { color: #c53030 !important; }
body.light .kpi.warning  .value  { color: #c05621 !important; }
body.light .kpi.blue     .value  { color: #2b6cb0 !important; }
body.light .kpi.pos .v           { color: #276749 !important; }
body.light .kpi.neg .v           { color: #c53030 !important; }

/* ── Chart wrapper boxes ─────────────────────────────────── */
body.light .chart-box         { background: #ffffff !important; border-color: #e2e8f0 !important; }
body.light .chart-box h3      { color: #4a5568 !important; }
body.light .chart-box p       { color: #718096 !important; }

/* ── Index page cards ────────────────────────────────────── */
body.light .card              { background: #ffffff !important; border-color: #e2e8f0 !important; }
body.light .card:hover        { border-color: #4299e1 !important; }
body.light .card h3           { color: #1a202c !important; }
body.light .card p            { color: #4a5568 !important; }
body.light .card-tag          { color: #2b6cb0 !important; }

/* ── Insight / disclaimer boxes ─────────────────────────── */
body.light .insight-box           { background: #ffffff !important; border-color: #e2e8f0 !important; color: #2d3748 !important; }
body.light .insight-box strong    { color: #1a202c !important; }
body.light .insight-box b         { color: #1a202c !important; }
body.light .disclaimer            { background: #fffbeb !important; border-color: #f6ad55 !important; color: #7b341e !important; }
body.light .disclaimer strong     { color: #7b341e !important; }

/* ── Quadrant boxes ──────────────────────────────────────── */
body.light .q               { background: #ffffff !important; border-color: #e2e8f0 !important; }
body.light .q-title         { color: #1a202c !important; }
body.light .q-desc          { color: #4a5568 !important; }
body.light .q-names         { color: #2b6cb0 !important; }

/* ── Legend / metric items ───────────────────────────────── */
body.light .legend-item         { color: #4a5568 !important; }
body.light .legend-box          { color: #718096 !important; }
body.light .legend-box strong   { color: #2d3748 !important; }

/* ── Source radar metrics panel ──────────────────────────── */
body.light .metrics-box         { background: #ffffff !important; border-color: #e2e8f0 !important; }
body.light .metrics-box h3      { color: #4a5568 !important; }
body.light #panel-title         { color: #4a5568 !important; }
body.light .metric-row          { color: #2d3748 !important; }
body.light .metric-label        { color: #718096 !important; }
body.light .metric-value        { color: #1a202c !important; }
body.light .metric-bar          { background: #e2e8f0 !important; }

/* ── Interactive buttons (source radar) ──────────────────── */
body.light .btn                 { background: #ffffff !important; border-color: #e2e8f0 !important; color: #4a5568 !important; }
body.light .btn:hover,
body.light .btn.active          { background: #ebf4ff !important; border-color: #4299e1 !important; color: #2b6cb0 !important; }

/* ── Data tables ─────────────────────────────────────────── */
body.light table                { color: #1a202c !important; }
body.light th                   { background: #edf2f7 !important; color: #2d3748 !important; }
body.light td                   { border-color: #e2e8f0 !important; color: #1a202c !important; }
body.light td:first-child       { color: #1a202c !important; }
body.light tr:last-child td     { background: #f7fafc !important; color: #1a202c !important; }
body.light tr:last-child td:first-child { color: #1a202c !important; }

/* Coloured table value classes */
body.light .pos    { color: #276749 !important; }
body.light .neg    { color: #c53030 !important; }
body.light .ok     { color: #276749 !important; }
body.light .warn   { color: #c53030 !important; }
body.light .mid    { color: #c05621 !important; }
body.light .best   { color: #276749 !important; }
body.light .worst  { color: #c53030 !important; }
body.light .gap    { color: #c05621 !important; }

/* ── kpi-row (j_curve, moic_progress, irr_bullet) ───────── */
body.light .kpi-row .kpi  { background: #ffffff !important; border-color: #e2e8f0 !important; }

/* ── Two-column grid containers ──────────────────────────── */
body.light .two-col .chart-box { background: #ffffff !important; }

/* ── Inline bar-track indicators (capital_donut table) ──────
   The .bar track is #2d3748 in dark mode — switch to
   light grey so only the coloured fill is visible.       */
body.light .bar        { background: #e2e8f0 !important; }

/* ── Divider lines ───────────────────────────────────────── */
body.light .divider    { border-color: #e2e8f0 !important; }
body.light hr          { border-color: #e2e8f0 !important; }

/* ── Badge pills (index page) ────────────────────────────── */
body.light .badge-html        { background: #ebf4ff; color: #2b6cb0; }
body.light .badge-interactive { background: #f0fff4; color: #276749; }
body.light .badge-funder      { background: #faf5ff; color: #553c9a; }
body.light .badge-ops         { background: #fffaf0; color: #c05621; }

/* ── Index footer text ───────────────────────────────────── */
body.light [style*="color:#2d3748"]  { color: #718096 !important; }

/* ── Theme toggle button (injected by _theme.js) ─────────── */
.mtm-theme-btn {
  background: transparent;
  border: 1px solid #4a5568;
  color: #718096;
  padding: 4px 11px;
  border-radius: 5px;
  cursor: pointer;
  font-size: 11px;
  font-family: inherit;
  margin-left: 14px;
  white-space: nowrap;
  transition: opacity 0.15s;
  flex-shrink: 0;
}
body.light .mtm-theme-btn { border-color: #cbd5e0 !important; color: #4a5568 !important; }
.mtm-theme-btn:hover { opacity: 0.75; }
