/* SPEII NEX 2.8.4 - Layout Engine & Responsive Framework
   Objetivo: todas as páginas do Speii Nex respeitam a mesma navbar, sidebar, grid, footer e responsividade. */
:root{
    --speii-nex-topbar-height: 92px;
    --speii-nex-sidebar-width: 76px;
    --speii-nex-page-left: 98px;
    --speii-nex-page-right: 28px;
    --speii-nex-page-top: 118px;
    --speii-nex-page-bottom: 70px;
    --speii-nex-page-bg: #050511;
    --speii-nex-line: rgba(255,255,255,.10);
}

body.speii-next-template{
    background: var(--speii-nex-page-bg) !important;
    overflow-x: hidden !important;
}
body.speii-next-template .page-wrapper{
    background: radial-gradient(circle at top left, rgba(188,0,255,.12), transparent 32%), #050511 !important;
    overflow-x: hidden !important;
}
body.speii-next-template .speii-topbar{
    position: fixed !important;
    top: 0 !important;
    left: 0 !important;
    right: 0 !important;
    z-index: 99990 !important;
}
body.speii-next-template .speii-sidebar{
    position: fixed !important;
    top: var(--speii-nex-topbar-height) !important;
    left: 0 !important;
    bottom: 0 !important;
    z-index: 99980 !important;
}

/* Master container oficial para páginas Speii Nex atuais e futuras */
body.speii-next-template .speii-page-container,
body.speii-next-template .speii-next-page,
body.speii-next-template .speii-generic-page,
body.speii-next-template .speii-catalog-page,
body.speii-next-template section.speii-blog-page,
body.speii-next-template section.speii-devices-page,
body.speii-next-template .speii-season-page,
body.speii-next-template .speii-release-calendar,
body.speii-next-template .speii-watch-party-page,
body.speii-next-template .speii-profile-page,
body.speii-next-template .speii-account-page,
body.speii-next-template .speii-history-page,
body.speii-next-template .speii-wishlist-page,
body.speii-next-template .speii-family-page,
body.speii-next-template .speii-calendar-page,
body.speii-next-template .speii-programming-page,
body.speii-next-template .speii-sports-page,
body.speii-next-template .speii-tv-page{
    box-sizing: border-box !important;
    width: 100% !important;
    max-width: none !important;
    min-height: calc(100vh - var(--speii-nex-topbar-height)) !important;
    margin: 0 !important;
    padding: var(--speii-nex-page-top) var(--speii-nex-page-right) var(--speii-nex-page-bottom) var(--speii-nex-page-left) !important;
    position: relative !important;
    z-index: 1 !important;
    background: radial-gradient(circle at top left, rgba(188,0,255,.14), transparent 34%), #050511 !important;
    color: #fff !important;
    clear: both !important;
}

/* Evita que classes antigas empurrem ou escondam conteúdo abaixo da navbar */
body.speii-next-template section.pt-100,
body.speii-next-template section.pt-80,
body.speii-next-template div.pt-100,
body.speii-next-template div.pt-80{
    padding-top: var(--speii-nex-page-top) !important;
}
body.speii-next-template section.mt-80,
body.speii-next-template div.mt-80{
    margin-top: 0 !important;
}

/* Containers internos devem alinhar em todas as páginas */
body.speii-next-template .speii-page-container > .container,
body.speii-next-template .speii-next-page > .container,
body.speii-next-template .speii-generic-page > .container,
body.speii-next-template .speii-catalog-page > .container,
body.speii-next-template section.speii-blog-page > .container,
body.speii-next-template section.speii-devices-page > .container,
body.speii-next-template .speii-season-page > .container,
body.speii-next-template .speii-release-calendar > .container{
    max-width: 1480px !important;
    width: 100% !important;
    padding-left: 0 !important;
    padding-right: 0 !important;
    margin-left: 0 !important;
    margin-right: auto !important;
}
body.speii-next-template .container-fluid{
    max-width: 100% !important;
    padding-left: var(--speii-nex-page-left) !important;
    padding-right: var(--speii-nex-page-right) !important;
}

/* Blog: herda o mesmo eixo da Home */
body.speii-next-template section.speii-blog-page .speii-blog-header,
body.speii-next-template section.speii-devices-page .speii-devices-head,
body.speii-next-template .speii-season-page .speii-season-hero{
    margin-top: 0 !important;
}
body.speii-next-template .speii-blog-grid,
body.speii-next-template .speii-blog-featured-grid,
body.speii-next-template .speii-devices-grid{
    align-items: stretch !important;
}

/* Cards grandes nunca devem invadir navbar/sidebar */
body.speii-next-template .speii-device-card,
body.speii-next-template .speii-blog-card,
body.speii-next-template .speii-season-card,
body.speii-next-template .speii-detail-panel{
    box-sizing: border-box !important;
}

/* Breadcrumb padrão também deve respeitar o grid Speii Nex */
body.speii-next-template .speii-breadcrumb{
    padding-left: var(--speii-nex-page-left) !important;
    padding-right: var(--speii-nex-page-right) !important;
    padding-top: var(--speii-nex-page-top) !important;
}

/* Footer alinhado com o conteúdo, sem cobrir páginas curtas */
body.speii-next-template .speii-footer,
body.speii-next-template footer{
    position: relative !important;
    z-index: 1 !important;
}

/* Utilitários para novos módulos */
body.speii-next-template .speii-layout-card{
    border: 1px solid var(--speii-nex-line);
    border-radius: 22px;
    background: linear-gradient(180deg, rgba(255,255,255,.08), rgba(255,255,255,.035));
    box-shadow: 0 20px 60px rgba(0,0,0,.28);
}
body.speii-next-template .speii-layout-title{
    color: #fff;
    font-size: clamp(26px, 3vw, 38px);
    line-height: 1.05;
    font-weight: 900;
    margin: 0 0 10px;
}
body.speii-next-template .speii-layout-subtitle{
    color: rgba(255,255,255,.68);
    margin: 0;
}

@media (max-width: 1350px){
    :root{
        --speii-nex-page-right: 22px;
        --speii-nex-page-left: 92px;
    }
}
@media (max-width: 900px){
    :root{
        --speii-nex-topbar-height: 118px;
        --speii-nex-sidebar-width: 0px;
        --speii-nex-page-left: 14px;
        --speii-nex-page-right: 14px;
        --speii-nex-page-top: 136px;
        --speii-nex-page-bottom: 34px;
    }
    body.speii-next-template .speii-sidebar{
        display: none !important;
    }
    body.speii-next-template .container-fluid{
        padding-left: var(--speii-nex-page-left) !important;
        padding-right: var(--speii-nex-page-right) !important;
    }
    body.speii-next-template .speii-breadcrumb{
        padding-left: var(--speii-nex-page-left) !important;
        padding-right: var(--speii-nex-page-right) !important;
    }
}
@media (max-width: 560px){
    :root{
        --speii-nex-page-top: 148px;
        --speii-nex-page-left: 12px;
        --speii-nex-page-right: 12px;
    }
    body.speii-next-template .speii-page-container,
    body.speii-next-template .speii-next-page,
    body.speii-next-template .speii-generic-page,
    body.speii-next-template .speii-catalog-page,
    body.speii-next-template section.speii-blog-page,
    body.speii-next-template section.speii-devices-page,
    body.speii-next-template .speii-season-page,
    body.speii-next-template .speii-release-calendar{
        padding-bottom: 28px !important;
    }
}