/*
 * Netzerd — mismo diseño PC en móvil/tablet (responsive).
 * Oculta layouts móviles alternativos (LuxeStay, bottom nav, etc.)
 * y muestra la estructura desktop con reflow.
 */

/* ── Cabecera OTA unificada (layout/header.php) ── */
.ota-shell-header .ota-shell-nav-row {
    padding: 0 0 0.35rem;
}

@media (min-width: 768px) {
    .ota-shell-header .ota-shell-nav-row {
        display: none !important;
        padding: 0;
        border: none;
    }

    /* Cabecera site: visible en desktop (Tailwind hidden md:block) */
    header.hidden.md\:block,
    header.ota-shell-header {
        display: block !important;
    }

    header.md\:hidden:not(.ota-shell-header) {
        display: none !important;
    }

    header.hidden.md\:block nav.hidden.md\:flex,
    header.fixed.top-0 nav.hidden.md\:flex {
        display: flex !important;
    }

    header.hidden.md\:block .hidden.md\:flex,
    header.fixed.top-0 .hidden.md\:flex {
        display: flex !important;
    }
}

.ota-shell-nav {
    display: flex;
    align-items: center;
    gap: 0.85rem;
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
    scrollbar-width: none;
    max-width: 100%;
    padding: 0.35rem 0;
}

.ota-shell-nav::-webkit-scrollbar {
    display: none;
}

.ota-shell-nav a {
    white-space: nowrap;
    flex-shrink: 0;
    font-size: 11px;
}

@media (min-width: 768px) {
    .ota-shell-nav {
        gap: 1.5rem;
        overflow: visible;
        padding: 0;
    }

    .ota-shell-nav a {
        font-size: 0.875rem;
    }
}

/* ── Móvil/tablet: portal usuario usa tabbar inferior (no forzar nav superior) ── */
@media (max-width: 767.98px) {
    body:not(.nz-user-portal) .md\:hidden,
    .rs-mobile-nav,
    #rs-mobile-nav,
    .mobile-sheet-overlay,
    footer.block.md\:hidden {
        display: none !important;
    }

    /* Portal: cabecera completa en móvil; ocultar cabeceras simplificadas duplicadas */
    body.nz-user-portal header.md\:hidden {
        display: none !important;
    }

    body.nz-user-portal header.hidden.md\:block,
    body.nz-user-portal header.nz-index-header,
    body.nz-user-portal header.ota-shell-header,
    body.page-index.nz-user-portal #nzIndexMain,
    body.page-index.nz-user-portal main.nz-index-main {
        display: block !important;
    }

    body.nz-user-portal:not(.page-index) header.hidden.md\:block,
    body.nz-user-portal:not(.page-index) header.fixed.top-0:not(.md\:hidden) {
        display: block !important;
    }

    /* Portal (excepto index): contenido móvil nativo de cada vista */
    body.nz-user-portal:not(.page-index) main.hidden.md\:block {
        display: none !important;
    }

    body.nz-user-portal:not(.page-index) main.md\:hidden {
        display: block !important;
    }

    /* Bottom nav legacy (Explore/Saved/Trips) — sustituido por .nz-user-tabbar */
    body.nz-user-portal nav.md\:hidden.fixed.bottom-0,
    body.nz-user-portal nav.md\:hidden[class*="bottom-0"] {
        display: none !important;
    }

    body:not(.nz-user-portal) .hidden.md\:block,
    body:not(.nz-user-portal) main.hidden.md\:block {
        display: block !important;
    }

    body:not(.nz-user-portal) .hidden.md\:flex,
    body:not(.nz-user-portal) nav.hidden.md\:flex {
        display: flex !important;
    }

    body:not(.nz-user-portal) .hidden.sm\:flex {
        display: flex !important;
    }

    /* Coins en cabecera móvil — estilos en user_portal_coins.css */

    /* Index: cabecera propia (no duplicar reglas de header.hidden.md:block) */
    body.page-index header.nz-index-header {
        display: block !important;
    }

    /* Cabecera duplicada legacy (otras páginas con Tailwind hidden md:block) */
    body:not(.nz-user-portal) header.hidden.md\:block:not(.ota-shell-header) {
        display: block !important;
    }

    body:not(.nz-user-portal) header.hidden.md\:block:not(.ota-shell-header) > div,
    body:not(.nz-user-portal) header.hidden.md\:block:not(.ota-shell-header) .max-w-\[1600px\],
    body:not(.nz-user-portal) header.hidden.md\:block:not(.ota-shell-header) .max-w-7xl {
        flex-wrap: wrap;
        height: auto !important;
        min-height: 4.5rem;
        padding-top: 0.5rem;
        padding-bottom: 0.5rem;
        gap: 0.5rem;
    }

    body:not(.nz-user-portal) header.hidden.md\:block nav.hidden.md\:flex,
    body:not(.nz-user-portal) header.hidden.md\:block nav.hidden.md\\:flex {
        order: 3;
        width: 100%;
        overflow-x: auto;
        -webkit-overflow-scrolling: touch;
        scrollbar-width: none;
        gap: 0.75rem;
        padding: 0.25rem 0 0.35rem;
        border-top: 1px solid #f1f5f9;
    }

    body:not(.nz-user-portal) header.hidden.md\:block:not(.ota-shell-header) nav.hidden.md\:flex a,
    body:not(.nz-user-portal) header.hidden.md\:block:not(.ota-shell-header) nav.hidden.md\\:flex a {
        white-space: nowrap;
        font-size: 0.75rem;
        flex-shrink: 0;
    }

    /* OTA shell + index: fila superior compacta */
    body:not(.nz-user-portal).page-index main.hidden.md\:block.pt-20,
    body:not(.nz-user-portal).page-index main.hidden.md\:block {
        padding-top: 4.75rem !important;
    }

    body:not(.nz-user-portal) .ota-shell-header .flex.justify-between.items-center,
    body:not(.nz-user-portal) .nz-index-header .nz-index-header__top {
        min-height: 3.5rem;
    }

    body:not(.nz-user-portal) .ota-shell-header .ota-shell-nav a {
        font-size: 0.8125rem;
        padding: 0.2rem 0;
    }

    body:not(.nz-user-portal) .ota-shell-header #coinsPill {
        display: inline-flex !important;
        padding: 0.35rem 0.65rem;
        gap: 0.35rem;
        max-width: 8.75rem;
    }

    body:not(.nz-user-portal) .ota-shell-header #coinsPill span:nth-child(2) {
        font-size: 0.6875rem;
        overflow: hidden;
        text-overflow: ellipsis;
        white-space: nowrap;
    }

    /* Contenido principal desktop en pantallas pequeñas (sin portal tabbar) */
    body:not(.nz-user-portal) main.hidden.md\:block,
    body:not(.nz-user-portal) main.max-w-7xl.hidden.md\:block {
        padding-left: 1rem !important;
        padding-right: 1rem !important;
        padding-top: 6.5rem !important;
        padding-bottom: 2rem !important;
    }

    body:not(.nz-user-portal) main.hidden.md\:block.pt-20 {
        padding-top: 6.5rem !important;
    }

    /* Grids desktop → 1 columna donde haga falta */
    .grid-cols-12 {
        grid-template-columns: 1fr !important;
    }

    .lg\:col-span-3,
    .lg\:col-span-9,
    .lg\:col-span-8,
    .lg\:col-span-4 {
        grid-column: 1 / -1 !important;
    }

    /* Perfil: misma tabla/cards que PC, apilado */
    .hidden.md\:block table {
        display: block;
        overflow-x: auto;
        max-width: 100%;
    }

    /* Red social: el padding inferior lo define .nz-user-tabbar en body.nz-user-portal */
}

@media (min-width: 768px) and (max-width: 1023.98px) {
    header.hidden.md\:block nav.hidden.md\:flex {
        gap: 1rem;
        overflow-x: auto;
        -webkit-overflow-scrolling: touch;
        scrollbar-width: none;
    }

    header.hidden.md\:block nav.hidden.md\:flex a {
        white-space: nowrap;
        font-size: 12px;
    }

    main.hidden.md\:block {
        padding-left: 1.25rem !important;
        padding-right: 1.25rem !important;
    }
}

/* Streaming TV — solo páginas sin tabbar portal */
@media (max-width: 767.98px) {
    body:not(.nz-user-portal) header.fixed.top-0 .max-w-7xl.flex,
    body:not(.nz-user-portal) header.fixed.top-0 .max-w-\[1600px\].flex {
        flex-wrap: wrap;
        height: auto !important;
        min-height: 4.75rem;
        padding-top: 0.5rem;
        padding-bottom: 0.35rem;
        gap: 0.5rem;
    }

    body:not(.nz-user-portal) header.fixed.top-0 nav.hidden.md\:flex,
    body:not(.nz-user-portal) header.fixed.top-0 .hidden.md\:flex {
        display: flex !important;
        width: 100%;
        order: 3;
        overflow-x: auto;
        -webkit-overflow-scrolling: touch;
        scrollbar-width: none;
        gap: 0.75rem;
        border-top: 1px solid #f1f5f9;
        padding-top: 0.35rem;
        padding-bottom: 0.15rem;
    }

    body:not(.nz-user-portal) header.fixed.top-0 nav.hidden.md\:flex a {
        white-space: nowrap;
        font-size: 11px;
        flex-shrink: 0;
    }

    body:not(.nz-user-portal).page-red_social {
        padding-top: 7rem !important;
    }

    body:not(.nz-user-portal).page-red_social .rs-layout,
    body:not(.nz-user-portal).page-red_social #rs-app {
        margin-top: 0;
    }
}