/* ==========================================================
   ADDON: vw_section_nav — CSS frontend (migrado desde css() de site.php)
   Estatico, scope body.autoplaza-vw, tokens VW, px->rem.
   Breakpoints en rem exacto (propios del addon). Borrar la
   carpeta del addon elimina este CSS.
   ========================================================== */

/* Sticky encadenado por JS: el wrapper de SPB (column .clearfix) mide
   exactamente lo que el addon, asi que position:sticky no tiene recorrido.
   En su lugar, custom.js le agrega .is-stuck (position:fixed) al cruzar el
   header y fija nav.style.top = header.offsetHeight en vivo (maneja las
   distintas alturas del header desktop/movil y sus estados). z-index < 1000
   del header para que este quede por encima durante la transicion. */
body.autoplaza-vw .vw-section-nav {
    position:relative;
    z-index:999; /* bajo el header (1000), sobre el contenido/imagenes de SPB */
    background:var(--vw-corporate);
    width:100vw;
    margin-left:calc(-50vw + 50%);
    box-shadow:0 2px 8px rgba(0,0,0,0.12)
}
body.autoplaza-vw .vw-section-nav.is-stuck {
    position:fixed;
    top:0; /* JS lo sobreescribe con la altura real del header */
    left:0;
    right:0;
    width:auto;
    margin-left:0
}
body.autoplaza-vw .vw-section-nav__inner {
    display:flex;
    align-items:center;
    gap:0;
    max-width:87.5rem;
    margin:0 auto;
    padding:0 5rem;
    overflow-x:auto;
    scrollbar-width:none;
    -webkit-overflow-scrolling:touch;
    scroll-snap-type:x proximity
}
body.autoplaza-vw .vw-section-nav__inner::-webkit-scrollbar {
    display:none
}
body.autoplaza-vw .vw-section-nav__link {
    display:flex;
    align-items:center;
    padding:1rem 1.25rem;
    font-family:var(--vw-font-text);
    font-size:0.875rem;
    font-weight:400;
    color:rgba(255,255,255,0.7);
    text-decoration:none;
    white-space:nowrap;
    border-bottom:2px solid transparent;
    scroll-snap-align:center;
    transition:color 0.2s,border-color 0.2s
}
body.autoplaza-vw .vw-section-nav__link:hover {
    color:var(--vw-white)
}
body.autoplaza-vw .vw-section-nav__link.is-active {
    color:var(--vw-white);
    border-bottom-color:var(--vw-accent);
    font-weight:700
}

/* --- Movil: tabs horizontales refinados --- */
@media (max-width: 47.98rem) {
    body.autoplaza-vw .vw-section-nav__inner {
        padding:0 1rem
    }
    body.autoplaza-vw .vw-section-nav__link {
        padding:0.5rem 1rem;
        min-height:2.75rem; /* touch target >= 44px */
        font-size:0.8125rem
    }
    /* Mascaras de degradado en los bordes: senalizan que hay mas tabs
       scrolleables. pointer-events:none para no bloquear el scroll/tap.
       El gradiente arranca del color del nav (--vw-corporate) y se
       desvanece a transparente. */
    body.autoplaza-vw .vw-section-nav::before,
    body.autoplaza-vw .vw-section-nav::after {
        content:"";
        position:absolute;
        top:0;
        bottom:0;
        width:1.5rem;
        pointer-events:none;
        z-index:1
    }
    body.autoplaza-vw .vw-section-nav::before {
        left:0;
        background:linear-gradient(to right, var(--vw-corporate), transparent)
    }
    body.autoplaza-vw .vw-section-nav::after {
        right:0;
        background:linear-gradient(to left, var(--vw-corporate), transparent)
    }
}
