/*
 * AGB Cargo V75 - Recuperar logo en móvil
 * Corrige el problema causado por V74: el logo desaparecía en Android/móvil.
 * Regla final: en móvil se muestra SIEMPRE el logo principal/inicial.
 * El logo de scroll se oculta en móvil.
 */

@media (max-width: 991px) {
    html body .site-header .brand,
    html body .brand {
        display: inline-flex !important;
        align-items: center !important;
        justify-content: center !important;
        position: relative !important;
        opacity: 1 !important;
        visibility: visible !important;
        pointer-events: auto !important;
        min-width: 96px !important;
        min-height: 44px !important;
    }

    /*
     * Mostrar el logo inicial/principal.
     * Este debe ser el logo blanco configurado en Admin > Diseño.
     */
    html body .site-header .brand img.brand-logo--main,
    html body .site-header.is-scrolled .brand img.brand-logo--main,
    html body.inner-page .site-header .brand img.brand-logo--main,
    html body .brand img.brand-logo--main {
        display: block !important;
        position: static !important;
        left: auto !important;
        top: auto !important;
        right: auto !important;
        bottom: auto !important;
        transform: none !important;
        width: var(--site-logo-mobile-width, 125px) !important;
        max-width: var(--site-logo-mobile-width, 125px) !important;
        height: auto !important;
        max-height: 58px !important;
        object-fit: contain !important;
        opacity: 1 !important;
        visibility: visible !important;
        pointer-events: auto !important;
        filter: none !important;
        -webkit-filter: none !important;
        box-shadow: none !important;
        text-shadow: none !important;
        mix-blend-mode: normal !important;
    }

    /*
     * Ocultar el logo de scroll/azul en móvil para que no se pierda.
     */
    html body .site-header .brand img.brand-logo--scrolled,
    html body .site-header.is-scrolled .brand img.brand-logo--scrolled,
    html body.inner-page .site-header .brand img.brand-logo--scrolled,
    html body .brand img.brand-logo--scrolled,
    html body .site-header .brand img.brand-logo--mobile,
    html body .site-header.is-scrolled .brand img.brand-logo--mobile,
    html body.inner-page .site-header .brand img.brand-logo--mobile,
    html body .brand img.brand-logo--mobile {
        display: none !important;
        position: absolute !important;
        opacity: 0 !important;
        visibility: hidden !important;
        pointer-events: none !important;
    }

    /*
     * Mantener header móvil azul oscuro para que el logo blanco resalte.
     */
    html body .site-header,
    html body .site-header.is-scrolled,
    html body.inner-page .site-header,
    html body .site-header .nav-wrap,
    html body .site-header.is-scrolled .nav-wrap,
    html body.inner-page .site-header .nav-wrap {
        background: var(--blue-dark, #08283f) !important;
    }

    html body .site-header .nav-toggle,
    html body .site-header.is-scrolled .nav-toggle,
    html body.inner-page .site-header .nav-toggle {
        display: flex !important;
        background: #ffffff !important;
        border-color: #ffffff !important;
        color: var(--blue-dark, #08283f) !important;
    }

    html body .site-header .nav-toggle span,
    html body .site-header.is-scrolled .nav-toggle span,
    html body.inner-page .site-header .nav-toggle span {
        background: var(--blue-dark, #08283f) !important;
    }
}

/*
 * Escritorio: se mantiene el comportamiento normal de 2 logos.
 * Principal arriba, scroll al bajar.
 */
@media (min-width: 992px) {
    html body .site-header:not(.is-scrolled) .brand img.brand-logo--main {
        display: block !important;
        opacity: 1 !important;
        visibility: visible !important;
    }

    html body .site-header:not(.is-scrolled) .brand img.brand-logo--scrolled {
        opacity: 0 !important;
        visibility: hidden !important;
        pointer-events: none !important;
    }

    html body .site-header.is-scrolled .brand img.brand-logo--main,
    html body.inner-page .site-header .brand img.brand-logo--main {
        opacity: 0 !important;
        visibility: hidden !important;
        pointer-events: none !important;
    }

    html body .site-header.is-scrolled .brand img.brand-logo--scrolled,
    html body.inner-page .site-header .brand img.brand-logo--scrolled {
        opacity: 1 !important;
        visibility: visible !important;
        pointer-events: auto !important;
    }
}