
.leaflet-control-layers-toggle {
    background-repeat: no-repeat;
    background-image:  url("/assets/stacks_24dp_E3E3E3_FILL0_wght400_GRAD0_opsz24.svg") !important; 
}

/* Container geral */
.leaflet-control-layers {
    background: #1e293b;
    color: #e5e7eb;
    border-radius: 10px;
    border-color: #1e293b !important;
    box-shadow: 0 8px 20px rgba(0,0,0,.35);
}

/* Quando expandido */
.leaflet-control-layers.leaflet-control-layers-expanded {
    backdrop-filter: blur(6px);
    min-width: 220px;
}

/* Lista interna */
.leaflet-control-layers-list {
    max-height: 210px;
    overflow-y: auto;
}

/* Texto das opções */
.leaflet-control-layers label {
    font-size: 14px;
    padding: 6px 4px;
    display: flex;
    align-items: center;
    gap: 8px;
    cursor: pointer;
}

/* Hover */
.leaflet-control-layers label:hover {
    background-color: rgba(255,255,255,0.08);
    border-radius: 6px;
}

/* Radios e checkboxes */
.leaflet-control-layers input[type="radio"],
.leaflet-control-layers input[type="checkbox"] {
    accent-color: #3b82f6;   /* azul moderno */
    transform: scale(1.1);
}

/* Separador entre BaseLayer e Overlays */
.leaflet-control-layers-separator {
    border-top: 1px solid rgba(255,255,255,.2);
    margin: 8px 0;
}

@media  screen and (max-width: 770px) {

    .leaflet-control-layers{
        top: 50px !important
    }

}