/* ================================================================
   HeyPilas — Dark Mode para controles Leaflet (mapa)
   ================================================================ */

/* ── Zoom buttons ── */
body.dark-mode-active .leaflet-control-zoom a {
    background: rgba(15, 28, 47, 0.9) !important;
    color: #cbd5e1 !important;
    border-color: #1B283B !important;
}
body.dark-mode-active .leaflet-control-zoom a:hover {
    background: rgba(30, 42, 58, 0.95) !important;
    color: #fff !important;
}

/* ── Attribution ── */
body.dark-mode-active .leaflet-control-attribution {
    background: rgba(15, 28, 47, 0.85) !important;
    color: #8899aa !important;
}
body.dark-mode-active .leaflet-control-attribution a {
    color: #4a8fd4 !important;
}

/* ── Popups ── */
body.dark-mode-active .leaflet-popup-content-wrapper {
    background: #0F1C2F !important;
    color: #e2e8f0 !important;
    box-shadow: 0 3px 14px rgba(0,0,0,.6) !important;
}
body.dark-mode-active .leaflet-popup-tip {
    background: #0F1C2F !important;
}
body.dark-mode-active .leaflet-popup-close-button {
    color: #8899aa !important;
}

/* ── Dot markers (origen/destino/paradas) ── */
body.dark-mode-active .hp-dot {
    border-color: rgba(255,255,255,0.25) !important;
    box-shadow: 0 0 14px currentColor, 0 2px 6px rgba(0,0,0,.6) !important;
}

/* ── Route/polyline colors para dark map ── */
/* Se ajustan vía JS inline, aquí solo fallback */