/**
 * Light mode — classic professional typography & widget colours
 * Surfaces: apc-glass-system.css · Tokens: style.css html.light
 */

/* ── Base text hierarchy ── */
html.light #app-shell,
html.light #main-content,
html.light #modal-root {
  color: var(--apc-text-primary);
}

html.light #main-content h1,
html.light #main-content h2,
html.light #main-content h3,
html.light #main-content .font-heading {
  color: var(--apc-text-primary) !important;
}

html.light #main-content p,
html.light #main-content li,
html.light #main-content td,
html.light #main-content th {
  color: var(--apc-text-secondary);
}

/* Muted / caption text (Tailwind slate utilities) */
html.light #main-content .text-slate-600,
html.light #main-content .text-slate-500,
html.light #main-content .text-slate-400 {
  color: var(--apc-text-muted) !important;
}

html.light #main-content .text-slate-900,
html.light #main-content .text-slate-800 {
  color: var(--apc-text-primary) !important;
}

/* Legacy dark-mode white text → tiered light palette */
html.light #main-content [class*="text-white/90"],
html.light #main-content [class*="text-white/80"],
html.light #view-command [class*="text-white/90"],
html.light #view-command [class*="text-white/80"],
html.light .ec-cmd-warroom [class*="text-white/90"],
html.light .ec-cmd-warroom [class*="text-white/80"],
html.light .ec-com-warroom [class*="text-white/90"],
html.light .ec-com-warroom [class*="text-white/80"],
html.light .ec-msg-warroom [class*="text-white/90"],
html.light .ec-msg-warroom [class*="text-white/80"],
html.light .ec-appt-warroom [class*="text-white/90"],
html.light .ec-appt-warroom [class*="text-white/80"],
html.light .ec-cmp-warroom [class*="text-white/90"],
html.light .ec-cmp-warroom [class*="text-white/80"] {
  color: var(--apc-text-secondary) !important;
}

html.light #main-content [class*="text-white/70"],
html.light #main-content [class*="text-white/65"],
html.light #view-command [class*="text-white/70"],
html.light #view-community [class*="text-white/70"],
html.light #view-messaging [class*="text-white/70"],
html.light #view-appointments [class*="text-white/70"],
html.light #view-complaints [class*="text-white/70"],
html.light .ec-cmd-warroom [class*="text-white/70"],
html.light .ec-com-warroom [class*="text-white/70"],
html.light .ec-msg-warroom [class*="text-white/70"],
html.light .ec-appt-warroom [class*="text-white/70"],
html.light .ec-cmp-warroom [class*="text-white/70"] {
  color: var(--apc-text-label) !important;
}

html.light #main-content [class*="text-white/60"],
html.light #main-content [class*="text-white/50"],
html.light #main-content [class*="text-white/45"],
html.light #main-content [class*="text-white/40"],
html.light #view-command [class*="text-white/60"],
html.light #view-command [class*="text-white/50"],
html.light #view-community [class*="text-white/60"],
html.light #view-community [class*="text-white/50"],
html.light #view-messaging [class*="text-white/60"],
html.light #view-messaging [class*="text-white/50"],
html.light #view-appointments [class*="text-white/60"],
html.light #view-appointments [class*="text-white/50"],
html.light #view-complaints [class*="text-white/60"],
html.light #view-complaints [class*="text-white/50"],
html.light .ec-cmd-warroom [class*="text-white/60"],
html.light .ec-cmd-warroom [class*="text-white/50"],
html.light .ec-com-warroom [class*="text-white/60"],
html.light .ec-com-warroom [class*="text-white/50"],
html.light .ec-msg-warroom [class*="text-white/60"],
html.light .ec-msg-warroom [class*="text-white/50"],
html.light .ec-appt-warroom [class*="text-white/60"],
html.light .ec-appt-warroom [class*="text-white/50"],
html.light .ec-cmp-warroom [class*="text-white/60"],
html.light .ec-cmp-warroom [class*="text-white/50"] {
  color: var(--apc-text-muted) !important;
}

/* Solid white text → primary (exclude buttons/badges) */
html.light #main-content .text-white,
html.light #main-content [class~="text-white"],
html.light #view-command .text-white,
html.light #view-community .text-white,
html.light #view-messaging .text-white,
html.light #view-appointments .text-white,
html.light #view-complaints .text-white {
  color: var(--apc-text-primary) !important;
}

/* Glass cards inherit readable body colour */
html.light .ec-glass-premium,
html.light .apc-glass-card,
html.light [class*="ec-polls-command-panel"],
html.light [class*="ec-blog-card"] {
  color: var(--apc-text-primary);
}

/* Keep white on solid brand / alert controls */
html.light #main-content button[class*="bg-apc-green"]:not([class*="bg-apc-green/"]),
html.light #main-content .ec-auth-submit,
html.light #main-content .ec-sit-live-badge,
html.light #main-content .ec-ana-live-badge,
html.light #main-content .ec-cmd-live-badge,
html.light #main-content [class*="bg-red-600"],
html.light #main-content [class*="bg-red-600/"],
html.light [class*="ec-cmd-tier-"],
html.light [class*="ec-sit-tier-"],
html.light [class*="ec-ana-tier-"],
html.light .ec-msg-live-badge,
html.light .ec-com-live-badge,
html.light .ec-appt-live-badge,
html.light .ec-cmp-live-badge {
  color: #ffffff !important;
}

html.light #main-content [class*="bg-apc-green/"][class*="text-white"] {
  color: var(--apc-text-primary) !important;
}

/* Brand hierarchy — blue chrome · red CTAs only */
html.light #main-content .text-apc-green:not(.text-white):not(button):not(button *) {
  color: #0284c7 !important;
}

html.light #main-content .text-apc-gold,
html.light #main-content .text-apc-blue {
  color: #0284c7 !important;
}

html.light #main-content .text-apc-flagGreen,
html.light #main-content .text-apc-accent {
  color: #15803d !important;
}

html.light #main-content .text-emerald-300,
html.light #main-content .text-emerald-400 {
  color: #047857 !important;
}

html.light #main-content .text-amber-200,
html.light #main-content .text-amber-300 {
  color: #b45309 !important;
}

html.light #main-content .text-sky-300 {
  color: #0369a1 !important;
}

html.light #main-content .text-red-300,
html.light #main-content .text-red-400 {
  color: #dc2626 !important;
}

/* ── Sidebar ── */
html.light #app-shell .text-apc-white,
html.light #app-shell [class*="text-apc-white"] {
  color: var(--apc-text-primary) !important;
}

html.light #app-shell .ec-nav-item:not([class*="border-apc-blue"]) {
  color: var(--apc-text-label) !important;
}

html.light #app-shell .ec-nav-item[class*="border-apc-blue"] {
  color: var(--apc-text-primary) !important;
  background: rgba(110, 198, 232, 0.12) !important;
  border-color: rgba(110, 198, 232, 0.35) !important;
}

/* ── War rooms ── */
html.light .ec-sit-warroom,
html.light .ec-ana-warroom,
html.light .ec-msg-warroom,
html.light .ec-appt-warroom,
html.light .ec-com-warroom,
html.light .ec-cmp-warroom,
html.light .ec-cmd-warroom {
  color: var(--apc-text-primary);
}

html.light .ec-sit-command-panel,
html.light .ec-ana-command-panel,
html.light .ec-msg-command-panel,
html.light .ec-appt-command-panel,
html.light .ec-com-command-panel,
html.light .ec-cmp-command-panel,
html.light .ec-cmd-command-panel {
  background: var(--glass-bg-strong) !important;
  border-color: var(--apc-widget-border) !important;
  color: var(--apc-text-primary) !important;
  box-shadow:
    0 1px 0 rgba(255, 255, 255, 0.95) inset,
    0 1px 3px rgba(15, 23, 42, 0.06) !important;
}

html.light .ec-sit-warroom input,
html.light .ec-ana-warroom input,
html.light .ec-msg-warroom input,
html.light .ec-appt-warroom input,
html.light .ec-com-warroom input,
html.light .ec-cmp-warroom input,
html.light .ec-cmd-warroom input,
html.light .ec-sit-warroom select,
html.light .ec-ana-warroom select,
html.light .ec-sit-warroom textarea,
html.light .ec-ana-warroom textarea,
html.light .ec-msg-warroom textarea,
html.light .ec-appt-warroom textarea,
html.light .ec-com-warroom textarea,
html.light .ec-cmp-warroom textarea,
html.light .ec-cmd-warroom textarea {
  background: var(--apc-input-bg) !important;
  color: var(--apc-text-primary) !important;
  border: 1px solid var(--apc-input-border) !important;
}

/* Module views */
html.light #view-command,
html.light #view-community,
html.light #view-messaging,
html.light #view-appointments,
html.light #view-complaints {
  color: var(--apc-text-primary);
}

html.light #view-command textarea,
html.light #view-community textarea,
html.light #view-messaging textarea,
html.light #view-appointments textarea,
html.light #view-complaints textarea,
html.light #view-command input:not([type="checkbox"]):not([type="radio"]),
html.light #view-community input:not([type="checkbox"]):not([type="radio"]),
html.light #view-messaging input:not([type="checkbox"]):not([type="radio"]),
html.light #view-appointments input:not([type="checkbox"]):not([type="radio"]),
html.light #view-complaints input:not([type="checkbox"]):not([type="radio"]),
html.light #view-command select,
html.light #view-community select,
html.light #view-messaging select,
html.light #view-appointments select,
html.light #view-complaints select {
  background: var(--apc-input-bg) !important;
  color: var(--apc-text-primary) !important;
  border: 1px solid var(--apc-input-border) !important;
}

html.light #view-command table,
html.light #view-community table,
html.light #view-messaging table,
html.light #view-appointments table,
html.light #view-complaints table {
  color: var(--apc-text-primary);
}

html.light #view-command th,
html.light #view-community th,
html.light #view-messaging th,
html.light #view-appointments th,
html.light #view-complaints th {
  color: var(--apc-text-label) !important;
  background: var(--glass-bg-muted) !important;
}

html.light #view-command td,
html.light #view-community td,
html.light #view-messaging td,
html.light #view-appointments td,
html.light #view-complaints td {
  color: var(--apc-text-secondary) !important;
  border-color: rgba(15, 23, 42, 0.08) !important;
}

html.light #view-command tr:hover td,
html.light #view-community tr:hover td,
html.light #view-messaging tr:hover td,
html.light #view-appointments tr:hover td,
html.light #view-complaints tr:hover td {
  background: var(--glass-bg-inset) !important;
}

/* Module glass widgets */
html.light .ec-cmd-glass,
html.light .ec-com-glass,
html.light .ec-msg-glass,
html.light .ec-appt-glass,
html.light .ec-cmp-glass,
html.light .ec-cmd-chart-panel,
html.light .ec-com-chart-panel,
html.light .ec-msg-chart-panel,
html.light .ec-appt-chart-panel,
html.light .ec-cmp-chart-panel {
  color: var(--apc-text-primary);
}

/* Module nav */
html.light .ec-cmd-nav-btn,
html.light .ec-com-nav-btn,
html.light .ec-msg-nav-btn,
html.light .ec-appt-nav-btn,
html.light .ec-cmp-nav-btn {
  color: var(--apc-text-label) !important;
  background: transparent !important;
}

html.light .ec-cmd-nav-active,
html.light .ec-com-nav-active,
html.light .ec-msg-nav-active,
html.light .ec-appt-nav-active,
html.light .ec-cmp-nav-active {
  color: var(--apc-text-primary) !important;
  background: rgba(110, 198, 232, 0.1) !important;
  border-color: rgba(110, 198, 232, 0.25) !important;
}

html.light .ec-cmd-nav-btn:hover,
html.light .ec-com-nav-btn:hover,
html.light .ec-msg-nav-btn:hover,
html.light .ec-appt-nav-btn:hover,
html.light .ec-cmp-nav-btn:hover {
  color: var(--apc-text-primary) !important;
  background: var(--glass-bg-inset) !important;
}

html.light #view-command .border-white\/15,
html.light #view-community .border-white\/15,
html.light #view-messaging .border-white\/15,
html.light #view-appointments .border-white\/15,
html.light #view-complaints .border-white\/15 {
  border-color: var(--apc-widget-border) !important;
}

/* Voter education (public) — professional shell */
html.light #voter-education-root .ec-edu-pro,
html.light #voter-education-root .ec-edu-pro .ec-edu-glass {
  color: var(--apc-text-primary);
}

html.light #voter-education-root .ec-edu-pro .ec-edu-glass > * {
  position: relative;
  z-index: 1;
}

html.light #voter-education-root .ec-edu-pro-header {
  background: var(--glass-bg-strong) !important;
}

html.light .ec-edu-warroom.ec-edu-pro .ec-edu-nav-active {
  background: #fff !important;
  border-color: rgba(110, 198, 232, 0.4) !important;
  color: var(--apc-text-primary) !important;
}

html.light .ec-edu-warroom,
html.light #voter-education-root .ec-edu-blog {
  color: var(--apc-text-primary);
}

html.light #voter-education-root [class*="text-white/70"],
html.light #voter-education-root [class*="text-white/65"],
html.light #voter-education-root [class*="text-white/60"] {
  color: var(--apc-text-label) !important;
}

html.light #voter-education-root [class*="border-white/10"],
html.light #voter-education-root [class*="border-white/15"] {
  border-color: var(--apc-widget-border) !important;
}

html.light #voter-education-root [class*="bg-white/5"],
html.light #voter-education-root [class*="bg-white/80"] {
  background: #ffffff !important;
}

/* Community network — professional shell */
html.light #view-community .ec-com-pro,
html.light #view-community .ec-com-pro .ec-com-glass {
  color: var(--apc-text-primary);
}

html.light #view-community .ec-com-pro .ec-com-glass > * {
  position: relative;
  z-index: 1;
}

html.light #view-community .ec-com-pro-header {
  background: var(--glass-bg-strong) !important;
}

html.light .ec-com-warroom.ec-com-pro .ec-com-nav-active {
  background: #fff !important;
  border-color: rgba(110, 198, 232, 0.4) !important;
  color: var(--apc-text-primary) !important;
}

/* Command intelligence — professional shell */
html.light #view-command .ec-cmd-pro,
html.light #view-command .ec-cmd-pro .ec-cmd-glass {
  color: var(--apc-text-primary);
}

html.light #view-command .ec-cmd-pro .ec-cmd-glass > * {
  position: relative;
  z-index: 1;
}

html.light #view-command .ec-cmd-pro-header {
  background: var(--glass-bg-strong) !important;
}

html.light .ec-cmd-warroom.ec-cmd-pro .ec-cmd-nav-active {
  background: #fff !important;
  border-color: rgba(110, 198, 232, 0.4) !important;
  color: var(--apc-text-primary) !important;
}

/* Campaign messaging — professional shell */
html.light #view-messaging .ec-msg-pro,
html.light #view-messaging .ec-msg-pro .ec-msg-glass {
  color: var(--apc-text-primary);
}

html.light #view-messaging .ec-msg-pro .ec-msg-glass > * {
  position: relative;
  z-index: 1;
}

html.light #view-messaging .ec-msg-pro-header {
  background: var(--glass-bg-strong) !important;
}

/* ── Topbar controls ── */
html.light #topbar {
  color: var(--apc-text-primary);
}

html.light #topbar button {
  color: var(--apc-text-secondary) !important;
  background: var(--glass-bg-inset) !important;
  border: 1px solid var(--apc-widget-border) !important;
}

html.light #topbar button:hover {
  background: #ffffff !important;
  color: var(--apc-text-primary) !important;
  border-color: rgba(15, 23, 42, 0.16) !important;
}

/* Login → apc-auth-text-light.css (loads after Tailwind on login.html) */

/* Landing typography → apc-landing-text-light.css (loads after Tailwind on landing.html) */

/* ── Modals ── */
html.light .ec-modal-dialog {
  color: var(--apc-text-primary);
}

html.light .ec-modal-dialog:not(.ec-sit-call-modal) h2 {
  color: var(--apc-text-primary) !important;
}

html.light .ec-modal-dialog [class*="text-white/"] {
  color: var(--apc-text-muted) !important;
}

html.light .ec-modal-dialog .text-white {
  color: var(--apc-text-primary) !important;
}

/* ── Globe panels ── */
html.light .ec-globe-left,
html.light .ec-globe-right {
  background: var(--glass-bg-strong) !important;
  border-color: var(--apc-widget-border) !important;
  color: var(--apc-text-primary);
}

html.light .ec-globe-left [class*="text-white/80"],
html.light .ec-globe-right [class*="text-white/80"],
html.light .ec-globe-left [class*="text-white/70"],
html.light .ec-globe-right [class*="text-white/70"] {
  color: var(--apc-text-label) !important;
}

html.light .ec-globe-left .text-white,
html.light .ec-globe-right .text-white {
  color: var(--apc-text-primary) !important;
}

html.light [class*="ec-globe"] input {
  background: var(--apc-input-bg) !important;
  border: 1px solid var(--apc-input-border) !important;
  color: var(--apc-text-primary) !important;
}

/* ── Dashboard incident feed & tables ── */
html.light .ec-dash-incident-feed {
  background: var(--glass-bg-inset) !important;
  border-color: var(--apc-widget-border) !important;
  color: var(--apc-text-secondary) !important;
}

html.light #main-content table {
  color: var(--apc-text-primary);
}

html.light #main-content thead th {
  color: var(--apc-text-label) !important;
  background: var(--glass-bg-muted) !important;
}

html.light #main-content tbody td {
  color: var(--apc-text-secondary) !important;
}

html.light #main-content tbody tr:hover {
  background: var(--glass-bg-inset) !important;
}

/* ── Dashboard — Situation room live simulation ── */
html.light #view-dashboard .ec-glass-premium {
  color: var(--apc-text-primary);
}

html.light #view-dashboard .ec-glass-premium > * {
  position: relative;
  z-index: 1;
}

html.light #view-dashboard .ec-glass-premium h2 {
  color: var(--apc-text-primary) !important;
}

html.light #view-dashboard .ec-glass-premium > p,
html.light #view-dashboard .ec-glass-premium .text-slate-600 {
  color: var(--apc-text-label) !important;
}

html.light #view-dashboard .ec-dash-incident-feed {
  background: var(--glass-bg-inset) !important;
  border-color: var(--apc-widget-border) !important;
  color: var(--apc-text-secondary) !important;
}

html.light #view-dashboard .ec-dash-incident-feed [class*="text-slate-"] {
  color: var(--apc-text-secondary) !important;
}

html.light #view-dashboard .bg-red-50.text-red-800,
html.light #view-dashboard .border-red-300.text-red-800 {
  color: #991b1b !important;
}

html.light #view-dashboard .bg-amber-50.text-amber-900,
html.light #view-dashboard .border-amber-300.text-amber-900 {
  color: #92400e !important;
}

html.light #view-dashboard .bg-emerald-50.text-emerald-900,
html.light #view-dashboard .border-emerald-300.text-emerald-900 {
  color: #065f46 !important;
}

html.light #view-dashboard [class*="border-slate-200/80"].rounded-xl {
  background: var(--glass-bg-inset) !important;
}

html.light #view-dashboard [class*="border-slate-200/80"].rounded-xl .text-slate-900,
html.light #view-dashboard #dash-ag-online,
html.light #view-dashboard #dash-ag-off,
html.light #view-dashboard #dash-ag-inac {
  color: var(--apc-text-primary) !important;
}

html.light #view-dashboard [class*="border-slate-200/80"].rounded-xl .text-red-700 {
  color: #b91c1c !important;
}

html.light #view-dashboard [class*="border-slate-200/80"].rounded-xl .text-slate-500 {
  color: var(--apc-text-muted) !important;
}

/* Legacy alert classes if still present */
html.light #view-dashboard [class*="text-red-100"],
html.light #view-dashboard [class*="text-amber-50"],
html.light #view-dashboard [class*="text-emerald-50"] {
  color: var(--apc-text-primary) !important;
}