/* ===== NIGHT-MODE.CSS - Dark theme overrides for maximum contrast & accessibility ===== */

body.night-mode {
  --bg: #0f172a;
  --card-bg: #1e293b;
  --text: #f8fafc;
  --text-muted: #94a3b8;
  --border: #334155;
  --border-dark: #475569;
  background: #0f172a;
  color: #f8fafc;
}

body.night-mode .site-header { background: #1e293b; box-shadow: 0 4px 20px rgba(0,0,0,0.5); }
body.night-mode h1, body.night-mode h2, body.night-mode h3, body.night-mode h4 { color: #f8fafc; }
body.night-mode .panel { background: #1e293b; box-shadow: 0 4px 12px rgba(0,0,0,0.4); border-color: #334155; }

/* Filter Section & Inputs (Corrige contraste blanco del panel de filtros) */
body.night-mode .filter-section {
  background: #1e293b !important;
  border-color: #334155 !important;
  box-shadow: 0 4px 14px rgba(0,0,0,0.3) !important;
}
body.night-mode .filter-grid select, 
body.night-mode .filter-grid input,
body.night-mode .admin-filter-bar select,
body.night-mode .admin-filter-bar input {
  background: #0f172a !important;
  color: #f8fafc !important;
  border-color: #475569 !important;
}
body.night-mode .filter-grid label,
body.night-mode .admin-filter-bar label {
  color: #94a3b8 !important;
  font-weight: 600;
}

body.night-mode .site-footer { background: #0f172a; color: #94a3b8; border-top: 1px solid #1e293b; }
body.night-mode .toast { background: #1e293b; color: #f8fafc; border: 1px solid #3b82f6; }

/* Navegación y Encabezado */
body.night-mode .site-nav a {
  background: #1e293b;
  color: #f8fafc;
  border-color: #475569;
}
body.night-mode .site-nav a:hover {
  background: #2563eb;
  color: #fff;
  border-color: #2563eb;
}
body.night-mode .site-nav a.active {
  background: #2563eb;
  color: #ffffff;
  border-color: #2563eb;
}

/* Superponer Capa en Modo Noche (Alto Contraste) */
body.night-mode .btn-overlay-add,
body.night-mode button.btn-overlay-add {
  background: #1e3a8a !important;
  color: #ffffff !important;
  border: 1.5px solid #3b82f6 !important;
  box-shadow: 0 2px 10px rgba(37, 99, 235, 0.4) !important;
}
body.night-mode .btn-overlay-add:hover,
body.night-mode button.btn-overlay-add:hover {
  background: #2563eb !important;
  color: #ffffff !important;
  border-color: #60a5fa !important;
  box-shadow: 0 4px 16px rgba(37, 99, 235, 0.6) !important;
  transform: translateY(-1px);
}

/* Herramientas de Dibujo y Geocodificación */
body.night-mode .draw-mode-btn {
  background: #1e293b !important;
  color: #f8fafc !important;
  border-color: #475569 !important;
}
body.night-mode .draw-mode-btn:hover {
  background: #334155 !important;
}
body.night-mode .draw-mode-btn.active {
  background: #2563eb !important;
  color: #ffffff !important;
  border-color: #2563eb !important;
}
body.night-mode #btn-device-geolocation {
  background: #172554 !important;
  color: #60a5fa !important;
  border-color: #2563eb !important;
}
body.night-mode .search-container input,
body.night-mode .table-search-box input {
  background: #0f172a !important;
  color: #f8fafc !important;
  border-color: #475569 !important;
}
body.night-mode .suggestions-container {
  background: #1e293b !important;
  border-color: #334155 !important;
}
body.night-mode .suggestion-item {
  color: #f8fafc !important;
  border-bottom: 1px solid #334155 !important;
}
body.night-mode .suggestion-item:hover {
  background: #0f172a !important;
}
body.night-mode .suggestion-item small {
  color: #94a3b8 !important;
}

/* Controles de Capas del Mapa Leaflet */
body.night-mode .leaflet-control-layers {
  background: #1e293b !important;
  color: #f8fafc !important;
  border: 1px solid #334155 !important;
  box-shadow: 0 4px 14px rgba(0,0,0,0.5) !important;
}
body.night-mode .leaflet-control-layers label {
  color: #f8fafc !important;
}
body.night-mode .leaflet-control-layers-separator {
  border-top-color: #334155 !important;
}
body.night-mode .leaflet-bar a {
  background-color: #1e293b !important;
  color: #f8fafc !important;
  border-bottom: 1px solid #334155 !important;
}
body.night-mode .leaflet-bar a:hover {
  background-color: #2563eb !important;
  color: #ffffff !important;
}
body.night-mode #btn-toggle-layers svg {
  fill: #60a5fa !important;
}
body.night-mode .leaflet-popup-content-wrapper {
  background: #1e293b !important;
  color: #f8fafc !important;
  border: 1px solid #334155 !important;
}
body.night-mode .leaflet-popup-tip {
  background: #1e293b !important;
}

/* Panel de Referencias / Leyenda */
body.night-mode .legend-panel,
body.night-mode #legend-grid {
  background: #1e293b !important;
  color: #f8fafc !important;
  border-color: #334155 !important;
}

body.night-mode .legend-item {
  background: #0f172a !important;
  color: #e2e8f0 !important;
  border-color: #334155 !important;
}

body.night-mode .legend-item:hover {
  background: #1e293b !important;
  border-color: #475569 !important;
}

body.night-mode .legend-count {
  background: #334155 !important;
  color: #94a3b8 !important;
}

/* Dashboard Cards & Layout */
body.night-mode .dash-card { background: #1e293b; border-color: #334155; }
body.night-mode .dash-card .dash-num { color: #60a5fa; }
body.night-mode .dash-card .dash-label { color: #94a3b8; }
body.night-mode .dash-card.highlight { background: linear-gradient(135deg, #1e3a8a 0%, #1e40af 100%); border-color: #3b82f6; }
body.night-mode .dash-card.highlight .dash-num { color: #ffffff; }
body.night-mode .dash-card.highlight .dash-label { color: #bfdbfe; }

body.night-mode .dash-card.accent { background: linear-gradient(135deg, #78350f 0%, #92400e 100%); border-color: #f59e0b; }
body.night-mode .dash-card.accent .dash-num { color: #fef08a; }
body.night-mode .dash-card.accent .dash-label { color: #fde68a; }

body.night-mode .dash-chart-box { background: #1e293b; border-color: #334155; }
body.night-mode .dash-chart-box h4 { color: #60a5fa; }
body.night-mode .dash-chart-box svg text { fill: #f8fafc; }

/* Dashboard Tabs */
body.night-mode .dash-tabs { background: #0f172a; border-color: #334155; }
body.night-mode .dash-tab { color: #94a3b8; }
body.night-mode .dash-tab:hover { color: #f8fafc; background: rgba(255,255,255,0.05); }
body.night-mode .dash-tab.active { color: #ffffff; background: linear-gradient(135deg, #2563eb 0%, #3b82f6 100%); box-shadow: 0 4px 12px rgba(37, 99, 235, 0.4); }

/* Builder Cards & Badges */
body.night-mode .variable-selector-card { background: #0f172a; border-color: #334155; }
body.night-mode .variable-selector-card.active-target { border-color: #3b82f6; background: #1e3a8a; }
body.night-mode .variable-selector-card h4 { color: #60a5fa; }
body.night-mode .variable-item-badge { background: #1e293b; border-color: #475569; color: #f8fafc; }
body.night-mode .variable-item-badge:hover { border-color: #60a5fa; color: #60a5fa; }
body.night-mode .variable-item-badge.selected { background: #2563eb; color: #ffffff; border-color: #3b82f6; }

/* Buttons & Controls */
body.night-mode .btn-analysis-primary { background: linear-gradient(135deg, #2563eb 0%, #1d4ed8 100%); color: #ffffff; box-shadow: 0 4px 14px rgba(37, 99, 235, 0.4); }
body.night-mode .btn-analysis-primary:hover { background: linear-gradient(135deg, #1d4ed8 0%, #1e40af 100%); }
body.night-mode .btn-analysis-secondary { background: #1e293b; color: #60a5fa; border-color: #3b82f6; }
body.night-mode .btn-analysis-secondary:hover { background: #2563eb; color: #ffffff; }

/* Report Cards & Tables */
body.night-mode .nl-report-card { background: #1e293b; border-color: #334155; border-left-color: #3b82f6; }
body.night-mode .nl-report-card h3 { color: #60a5fa; }
body.night-mode .correlation-matrix-table th { background: #0f172a; color: #94a3b8; }
body.night-mode .correlation-matrix-table td { border-bottom-color: #334155; color: #f8fafc; }
body.night-mode .correlation-matrix-table tr.corr-row:hover { background: #1e3a8a !important; }
body.night-mode .correlation-matrix-table tr.active-row { background: #1d4ed8 !important; font-weight: 600; }

/* Select Options for Dark Mode */
body.night-mode select option {
  background-color: #1e293b !important;
  color: #f8fafc !important;
}

body.night-mode .btn-night-toggle-header {
  background: #0f172a;
  color: #fef08a;
  border-color: #f59e0b;
}
body.night-mode .btn-night-toggle-header:hover {
  background: #f59e0b;
  color: #0f172a;
}

body.night-mode .login-credits {
  border-top-color: #334155 !important;
  color: #94a3b8 !important;
}
body.night-mode .login-credits span {
  color: #64748b !important;
}