/* === Fondo general satelital === */
body {
    margin: 0;
    padding: 0;
    background: url('satelite.jpg') no-repeat center center fixed;
    background-size: cover;
    font-family: 'Segoe UI', Roboto, sans-serif;
    color: #e8e8e8;
    overflow: hidden;
}

/* Oscurecer ligeramente el fondo para mejorar legibilidad */
body::before {
    content: '';
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: rgba(0, 0, 0, 0.45);
    z-index: -1;
}


/* === Scrolls personalizados === */
::-webkit-scrollbar {
    width: 8px;
    background: #f0691a;
}
::-webkit-scrollbar-thumb {
    background: #4dfa90;
    border-radius: 4px;
}

/* === Ajustes del mapa === */
.leaflet-container {
    background: transparent !important;
}
.traccar-map {
    box-shadow: 0 0 20px rgba(0, 0, 0, 0.3);
}








/* === Vehículos siempre verdes en el mapa === */

/* Íconos del mapa (Leaflet markers) */
.leaflet-marker-icon,
.leaflet-marker-shadow {
    filter: hue-rotate(75deg) brightness(1.2) !important;  /* ajusta tono verde */
}

/* Íconos SVG internos del marcador (por si usas vectoriales) */
.leaflet-marker-icon svg *,
.leaflet-marker-icon path,
.leaflet-marker-icon circle {
    fill: #4dfa90 !important;
    stroke: #4dfa90 !important;
}

/* Texto o tooltip de estado sobre el mapa */
.leaflet-tooltip,
.leaflet-popup-content {
    color: #4dfa90 !important;
}