/* =====================================================
   Astronomía — modo nocturno (rojo/granate)
   Todas las reglas van bajo html[data-tema="noche"], atributo que
   solo astronomia.php puede llegar a poner — nunca se activa en
   ninguna otra página, aunque targetee selectores compartidos como
   .site-header o .site-footer.
   ===================================================== */

/* ---- Interruptor (estado base, visible también en modo día) ---- */
.toggle-modo-noche {
    margin-top: 1rem;
    display: inline-flex; align-items: center; gap: .5rem;
    background: rgba(255,255,255,.15); border: 1px solid rgba(255,255,255,.3);
    color: var(--blanco); border-radius: 999px; padding: .5rem 1.1rem;
    font-family: var(--fuente-ui); font-size: .85rem; font-weight: 600;
    cursor: pointer;
}
html[data-tema="noche"] .toggle-modo-noche {
    background: #2b0a0a; border-color: #4d1414; color: #ff8a75;
}

/* ---- Página y cabecera/menú/pie compartidos ---- */
html[data-tema="noche"] body { background: #1a0505; color: #ffab91; }
html[data-tema="noche"] .site-header { background: rgba(26,5,5,.92); border-bottom-color: #4d1414; }
html[data-tema="noche"] .logo-nombre { color: #ff8a75; }
html[data-tema="noche"] .logo-sub { color: #b3695c; }
html[data-tema="noche"] .tiempo-widget { color: #ffab91; background: #2b0a0a; }
html[data-tema="noche"] .site-nav a { color: #ffab91; }
html[data-tema="noche"] .site-nav a:hover,
html[data-tema="noche"] .site-nav a.active { color: #ff8a75; }
html[data-tema="noche"] .nav-toggle span { background: #ff8a75; }
html[data-tema="noche"] .site-footer { background: #150404; }
html[data-tema="noche"] .site-footer nav a { color: #b3695c; }
html[data-tema="noche"] .site-footer nav a:hover { color: #ff8a75; }

/* ---- Hero ---- */
html[data-tema="noche"] .page-hero { background: #1a0505; color: #ff8a75; }

/* ---- Bloques de contenido (Sol/Luna/Planetas, Calidad, Destacados, Efemérides, ClearOutside) ---- */
html[data-tema="noche"] .meteo-bloque--astronomia { background: #1a0505; color: #ffab91; }
html[data-tema="noche"] .meteo-bloque--astronomia .meteo-card { background: #2b0a0a; color: #ffab91; }
html[data-tema="noche"] .meteo-bloque--astronomia .visibilidad-card { background: #0c0c0b; }
html[data-tema="noche"] .meteo-bloque--astronomia .meteo-card i { color: #ff8a75; }
html[data-tema="noche"] .meteo-bloque--astronomia .meteo-card .meteo-detalle { color: #b3695c; }
html[data-tema="noche"] .meteo-bloque--astronomia .meteo-card .meteo-cargando,
html[data-tema="noche"] .meteo-bloque--astronomia .meteo-card .meteo-error { color: #b3695c; }
html[data-tema="noche"] .meteo-bloque--astronomia a { color: #ff6b4a; }

/* ---- Gráfica de sol (SVG) ---- */
html[data-tema="noche"] .sol-area-dia { fill: rgba(255,107,74,.22); }
html[data-tema="noche"] .sol-area-noche { fill: rgba(0,0,0,.45); }
html[data-tema="noche"] .sol-franja-luna { fill: rgba(255,138,117,.18); }
html[data-tema="noche"] .sol-linea { stroke: #ff6b4a; }
html[data-tema="noche"] .sol-horizonte { stroke: rgba(255,171,145,.25); }
html[data-tema="noche"] .sol-etiqueta { fill: #ff8a75; }
html[data-tema="noche"] .sol-hora-tick { fill: #b3695c; }
html[data-tema="noche"] .sol-ahora { stroke: #ff8a75; }

/* ---- Telescopius (planetas, calidad del cielo, destacados) ---- */
html[data-tema="noche"] .telescopius-planetas th { color: #b3695c; border-bottom-color: #4d1414; }
html[data-tema="noche"] .telescopius-planetas td { border-bottom-color: #33100f; }
html[data-tema="noche"] .telescopius-categoria-titulo { color: #ff8a75; }
html[data-tema="noche"] .telescopius-destacado { background: #2b0a0a; }
html[data-tema="noche"] .telescopius-destacado-nombre { color: #ff8a75; }