/* Light theme overrides when data-theme="light" */
html[data-theme="light"] {
  --bg: #f4f6f9;
  --bg-elevated: #ffffff;
  --bg-soft: #eef1f6;
  --border: #d8dee8;
  --border-strong: #c2cad8;
  --text: #1a2030;
  --text-muted: #5c667a;
  --text-faint: #8a93a5;
  --accent: #4a6f94;
  --accent-soft: rgba(74, 111, 148, 0.12);
  --success: #4f7d5f;
  --warning: #9a7a30;
  --danger: #a85a5a;
  --shadow: 0 8px 24px rgba(26, 32, 48, 0.08);
}

html[data-theme="light"] .topbar {
  background: linear-gradient(180deg, rgba(255, 255, 255, 0.95), rgba(244, 246, 249, 0.6));
}

html[data-theme="light"] .data-table tr:hover td {
  background: rgba(26, 32, 48, 0.03);
}

html[data-theme="light"] .data-table tr:hover td.is-live-col {
  background: color-mix(in srgb, var(--accent-soft) 80%, #1a2030 6%);
}

html[data-theme="light"] .data-table tr.is-active-row td,
html[data-theme="light"] .data-table tr.is-active-row:hover td {
  background: var(--accent-soft);
}

html[data-theme="light"] .data-table tr.is-active-row td.is-live-col,
html[data-theme="light"] .data-table tr.is-active-row:hover td.is-live-col {
  background: color-mix(in srgb, var(--accent-soft) 70%, var(--accent) 12%);
}