/* PORTADA - AJUSTES MOVILES DE CONTROLES (primera fase)
   Cargado despues de visor_portada.css y visor_portada_extra.css.
   No modifica la distribucion de escritorio. */
@media (max-width: 768px) {
    /* Los controles de la esquina izquierda pasan a la columna derecha.
       El primero queda por encima del selector de capas. */
    #map .leaflet-top.leaflet-left {
        top: 102px;
        left: auto;
        right: 12px;
        width: auto;
        z-index: 1100;
    }
    #map .leaflet-top.leaflet-left > .leaflet-control {
        float: right;
        clear: both;
        margin-left: 0;
        margin-right: 0;
    }

    #map .leaflet-top.leaflet-right {
        top: 62px;
        right: 12px;
        z-index: 1400;
    }
    #map .leaflet-top.leaflet-right .leaflet-control-layers {
        margin-top: 0 !important;
        margin-right: 0 !important;
        max-width: calc(100vw - 30px);
    }
    /* El listado desplegado debe mostrarse por delante del resumen.
       Ajustamos su altura en pantallas cortas. */
    #map .leaflet-control-layers-expanded {
        position: relative;
        z-index: 1401;
        max-height: min(65vh, 520px);
        overflow-y: auto;
        overflow-x: hidden;
    }
    /* En movil ocultamos la franja lateral hasta pulsar la pestana.
       Su contenido abierto mantiene solo iconos, no textos de escritorio. */
    #map .saih-side-menu {
        width: 64px;
        transform: translateX(-64px);
        transition: transform .22s ease;
        z-index: 1200;
    }
    #map .saih-side-menu.is-expanded {
        width: 64px;
        transform: translateX(0);
    }
    #map .saih-side-menu .side-menu-link,
    #map .saih-side-menu.is-expanded .side-menu-link {
        width: 64px;
        max-width: 64px;
        overflow: hidden;
    }
    #map .saih-side-menu .side-menu-label,
    #map .saih-side-menu .side-menu-submenu-caret {
        display: none;
    }
    #map .saih-side-menu .side-menu-expand {
        right: -30px;
        width: 30px;
        height: 56px;
    }
    /* Redes y Aplicaciones siguen disponibles en un submenu flotante
       accesible desde la barra de iconos, sin ensanchar todo el menu. */
    #map .saih-side-menu.is-expanded .side-submenu.is-open {
        position: absolute;
        top: 0;
        left: 64px;
        width: 190px;
        max-width: calc(100vw - 85px);
        margin: 0;
        padding: 5px;
        background: #26363d;
        border: 1px solid rgba(255,255,255,.15);
        border-radius: 0 8px 8px 0;
        box-shadow: 2px 5px 14px rgba(0,0,0,.2);
        overflow: visible;
        z-index: 1202;
    }
    /* Evitar que el resumen permanezca desplazado 247 px cuando el
       menu solo tiene 64 px de ancho en movil. */
    #map .leaflet-bottom.leaflet-left {
        left: 12px;
    }
    #map.side-menu-expanded .leaflet-bottom.leaflet-left {
        left: 76px;
    }
}
