/*
    assets/css/modelos_layout.css
    Modelos Ultra Modernos do Portal i7nove.
    Mantém todos os recursos originais do portal.
*/

/* =============================== */
/* MODELO PADRÃO */
/* =============================== */

body.modelo-padrao{
    background:#f3f4f6;
}

/* ===================================================== */
/* MODELO 1 - INFINITY DARK ULTRA */
/* ===================================================== */

body.modelo-infinity-dark{
    background:
        radial-gradient(circle at 8% 0%, rgba(37,99,235,.38), transparent 28%),
        radial-gradient(circle at 92% 10%, rgba(168,85,247,.34), transparent 30%),
        radial-gradient(circle at 50% 100%, rgba(20,184,166,.18), transparent 36%),
        linear-gradient(180deg,#020617 0%,#0f172a 46%,#020617 100%);
    color:#e5e7eb;
}

body.modelo-infinity-dark:before{
    content:"";
    position:fixed;
    inset:0;
    pointer-events:none;
    z-index:-1;
    background-image:
        linear-gradient(rgba(255,255,255,.045) 1px, transparent 1px),
        linear-gradient(90deg, rgba(255,255,255,.045) 1px, transparent 1px);
    background-size:46px 46px;
    mask-image:linear-gradient(to bottom, rgba(0,0,0,.8), transparent 75%);
}

body.modelo-infinity-dark .header-topo{
    max-width:1240px;
    margin:18px auto 0!important;
    border-radius:28px 28px 0 0!important;
    background:rgba(2,6,23,.74)!important;
    border:1px solid rgba(148,163,184,.24)!important;
    box-shadow:0 24px 80px rgba(0,0,0,.38)!important;
    backdrop-filter:blur(20px);
}

body.modelo-infinity-dark .menu-wrapper{
    max-width:1240px;
    margin:0 auto 18px!important;
    border-radius:0 0 28px 28px!important;
    background:rgba(15,23,42,.72)!important;
    border:1px solid rgba(148,163,184,.20)!important;
    border-top:0!important;
    box-shadow:0 24px 80px rgba(0,0,0,.28)!important;
    backdrop-filter:blur(20px);
}

body.modelo-infinity-dark #menu-categorias{
    justify-content:center!important;
}

body.modelo-infinity-dark #menu-categorias a{
    background:rgba(255,255,255,.07)!important;
    color:#fff!important;
    border:1px solid rgba(255,255,255,.14)!important;
    border-radius:999px!important;
    box-shadow:inset 0 1px 0 rgba(255,255,255,.10);
}

body.modelo-infinity-dark #menu-categorias a:hover{
    background:linear-gradient(135deg,#2563eb,#7c3aed,#14b8a6)!important;
    color:#fff!important;
    transform:translateY(-2px);
}

body.modelo-infinity-dark .radio-player{
    max-width:1240px!important;
    margin:14px auto!important;
    background:linear-gradient(135deg,rgba(37,99,235,.94),rgba(124,58,237,.92),rgba(20,184,166,.82))!important;
    border:1px solid rgba(255,255,255,.22)!important;
    border-radius:28px!important;
    box-shadow:0 22px 70px rgba(37,99,235,.28)!important;
}

body.modelo-infinity-dark .carrossel-noticias{
    max-width:1240px!important;
    margin:18px auto 10px!important;
    border-radius:24px!important;
    overflow:hidden!important;
    background:rgba(2,6,23,.76)!important;
    border:1px solid rgba(148,163,184,.20)!important;
    box-shadow:0 24px 80px rgba(0,0,0,.28)!important;
}

body.modelo-infinity-dark .carrossel-titulo,
body.modelo-infinity-dark .destaque-categoria,
body.modelo-infinity-dark .fotos-label,
body.modelo-infinity-dark .foto-filtro.active,
body.modelo-infinity-dark .foto-filtro:hover,
body.modelo-infinity-dark .programa-label,
body.modelo-infinity-dark .radio-live,
body.modelo-infinity-dark .radio-btn{
    background:linear-gradient(135deg,#2563eb,#7c3aed,#14b8a6)!important;
    color:#fff!important;
}

body.modelo-infinity-dark .topo-destaques-moderno{
    max-width:1240px!important;
    margin:24px auto!important;
    padding:18px!important;
    border-radius:34px!important;
    background:rgba(15,23,42,.58)!important;
    border:1px solid rgba(148,163,184,.20)!important;
    box-shadow:0 30px 95px rgba(0,0,0,.36)!important;
    backdrop-filter:blur(20px);
}

body.modelo-infinity-dark .destaques-container{
    grid-template-columns:1.65fr 1fr!important;
    gap:22px!important;
}

body.modelo-infinity-dark .destaque-slide-area{
    height:520px!important;
    border-radius:30px!important;
}

body.modelo-infinity-dark .destaques-laterais{
    gap:22px!important;
}

body.modelo-infinity-dark .destaque-lateral-card{
    border-radius:30px!important;
    min-height:249px!important;
}

body.modelo-infinity-dark .destaque-slide-area,
body.modelo-infinity-dark .destaque-lateral-card,
body.modelo-infinity-dark .foto-card-portal,
body.modelo-infinity-dark .video-card,
body.modelo-infinity-dark .tv-player{
    border:1px solid rgba(255,255,255,.16)!important;
    box-shadow:0 24px 70px rgba(0,0,0,.45)!important;
}

body.modelo-infinity-dark .destaque-slide-overlay,
body.modelo-infinity-dark .destaque-lateral-overlay{
    background:
        linear-gradient(to top, rgba(2,6,23,.96), rgba(2,6,23,.55), transparent)!important;
}

body.modelo-infinity-dark .destaque-slide-overlay h2{
    font-size:42px!important;
    letter-spacing:-1.2px;
}

body.modelo-infinity-dark .secao-categoria-home{
    max-width:1240px!important;
    margin:24px auto!important;
    padding:20px!important;
    border-radius:34px!important;
    background:rgba(15,23,42,.64)!important;
    border:1px solid rgba(148,163,184,.20)!important;
    box-shadow:0 24px 80px rgba(0,0,0,.28)!important;
    backdrop-filter:blur(18px);
}

body.modelo-infinity-dark .secao-categoria-home h2{
    color:#fff!important;
    font-size:30px!important;
    margin-top:0!important;
    display:flex;
    align-items:center;
    gap:12px;
}

body.modelo-infinity-dark .secao-categoria-home h2:before{
    content:"";
    width:14px;
    height:34px;
    border-radius:999px;
    background:linear-gradient(180deg,#2563eb,#7c3aed,#14b8a6);
}

body.modelo-infinity-dark .card{
    background:rgba(2,6,23,.82)!important;
    border:1px solid rgba(255,255,255,.12)!important;
    border-radius:24px!important;
    overflow:hidden!important;
    box-shadow:0 20px 60px rgba(0,0,0,.32)!important;
}

body.modelo-infinity-dark .card img{
    height:210px!important;
}

body.modelo-infinity-dark .card a{
    color:#ffffff!important;
    background:rgba(2,6,23,.88)!important;
}

body.modelo-infinity-dark .secao-app,
body.modelo-infinity-dark .secao-fotos,
body.modelo-infinity-dark .secao-videos,
body.modelo-infinity-dark .tv-lateral-wrapper,
body.modelo-infinity-dark .carrossel-anuncios,
body.modelo-infinity-dark .adsense-box{
    max-width:1240px!important;
    margin-left:auto!important;
    margin-right:auto!important;
    background:rgba(15,23,42,.58)!important;
    border:1px solid rgba(148,163,184,.20)!important;
    border-radius:34px!important;
    box-shadow:0 24px 80px rgba(0,0,0,.28)!important;
    backdrop-filter:blur(18px);
}

body.modelo-infinity-dark h1,
body.modelo-infinity-dark h2,
body.modelo-infinity-dark h3{
    color:#ffffff!important;
}

body.modelo-infinity-dark .footer-portal{
    background:#020617!important;
    border-top:1px solid rgba(148,163,184,.25);
}

/* ===================================================== */
/* MODELO 2 - MAGAZINE LIGHT ULTRA */
/* ===================================================== */

body.modelo-magazine-light{
    background:
        linear-gradient(180deg,#ffffff 0%,#f8fafc 48%,#eef6ff 100%);
    color:#111827;
}

body.modelo-magazine-light .header-topo{
    max-width:1280px;
    margin:14px auto 0!important;
    background:#ffffff!important;
    border:1px solid #e5e7eb!important;
    border-bottom:0!important;
    border-radius:26px 26px 0 0!important;
    box-shadow:0 12px 35px rgba(15,23,42,.07)!important;
}

body.modelo-magazine-light .menu-wrapper{
    max-width:1280px;
    margin:0 auto 16px!important;
    background:#ffffff!important;
    border:1px solid #e5e7eb!important;
    border-top:0!important;
    border-radius:0 0 26px 26px!important;
    box-shadow:0 14px 32px rgba(15,23,42,.06)!important;
}

body.modelo-magazine-light #menu-categorias{
    justify-content:center!important;
}

body.modelo-magazine-light #menu-categorias a{
    background:#f8fafc!important;
    color:#0f172a!important;
    border-radius:999px!important;
    border:1px solid #e2e8f0!important;
    font-weight:900!important;
}

body.modelo-magazine-light #menu-categorias a:hover{
    background:#f97316!important;
    color:#fff!important;
    transform:translateY(-2px);
}

body.modelo-magazine-light .radio-player{
    max-width:1280px!important;
    margin:14px auto!important;
    border-radius:22px!important;
    background:#111827!important;
    box-shadow:0 18px 42px rgba(15,23,42,.18)!important;
}

body.modelo-magazine-light .carrossel-noticias{
    max-width:1280px!important;
    margin:18px auto 0!important;
    border-radius:22px!important;
    overflow:hidden!important;
    background:#ffffff!important;
    border:1px solid #e5e7eb!important;
    box-shadow:0 12px 28px rgba(15,23,42,.07)!important;
}

body.modelo-magazine-light .carrossel-titulo{
    background:#f97316!important;
    color:#fff!important;
    letter-spacing:.2px;
}

body.modelo-magazine-light .topo-destaques-moderno{
    max-width:1280px!important;
    margin:18px auto 18px!important;
    padding:0 14px!important;
}

body.modelo-magazine-light .destaques-container{
    display:grid!important;
    grid-template-columns:1.15fr .85fr!important;
    gap:18px!important;
}

body.modelo-magazine-light .destaque-slide-area{
    height:500px!important;
    border-radius:30px!important;
    box-shadow:0 24px 60px rgba(15,23,42,.14)!important;
}

body.modelo-magazine-light .destaques-laterais{
    grid-template-rows:1fr 1fr!important;
    gap:18px!important;
}

body.modelo-magazine-light .destaque-lateral-card{
    border-radius:28px!important;
    min-height:241px!important;
    box-shadow:0 18px 42px rgba(15,23,42,.12)!important;
}

body.modelo-magazine-light .destaque-slide-overlay,
body.modelo-magazine-light .destaque-lateral-overlay{
    background:linear-gradient(to top,rgba(15,23,42,.88),rgba(15,23,42,.38),transparent)!important;
}

body.modelo-magazine-light .destaque-categoria,
body.modelo-magazine-light .fotos-label,
body.modelo-magazine-light .foto-filtro.active,
body.modelo-magazine-light .foto-filtro:hover,
body.modelo-magazine-light .programa-label,
body.modelo-magazine-light .radio-live,
body.modelo-magazine-light .radio-btn{
    background:#f97316!important;
    color:#fff!important;
}

/* Categorias em círculos abaixo das notícias topo */
body.modelo-magazine-light .magazine-categorias-circulos{
    max-width:1280px;
    margin:0 auto 24px!important;
    padding:22px 18px 18px;
    background:#ffffff;
    border:1px solid #e5e7eb;
    border-radius:28px;
    box-shadow:0 16px 42px rgba(15,23,42,.07);
}

body.modelo-magazine-light .magazine-categorias-head{
    display:flex;
    align-items:flex-end;
    justify-content:space-between;
    gap:16px;
    margin-bottom:16px;
    flex-wrap:wrap;
}

body.modelo-magazine-light .magazine-categorias-head span{
    display:inline-flex;
    background:#fff7ed;
    color:#c2410c;
    padding:7px 12px;
    border-radius:999px;
    font-weight:900;
    font-size:13px;
}

body.modelo-magazine-light .magazine-categorias-head h2{
    margin:0;
    font-size:30px;
    color:#0f172a!important;
}

body.modelo-magazine-light .magazine-categorias-scroll{
    display:flex;
    gap:16px;
    overflow-x:auto;
    padding:4px 2px 10px;
    scroll-snap-type:x mandatory;
}

body.modelo-magazine-light .magazine-categorias-scroll::-webkit-scrollbar{
    height:8px;
}

body.modelo-magazine-light .magazine-categorias-scroll::-webkit-scrollbar-thumb{
    background:#fed7aa;
    border-radius:999px;
}

body.modelo-magazine-light .magazine-categoria-bolha{
    min-width:112px;
    max-width:112px;
    display:flex;
    flex-direction:column;
    align-items:center;
    gap:9px;
    text-decoration:none;
    color:#0f172a!important;
    scroll-snap-align:start;
}

body.modelo-magazine-light .magazine-categoria-bolha span{
    width:86px;
    height:86px;
    border-radius:50%;
    display:flex;
    align-items:center;
    justify-content:center;
    background:
        radial-gradient(circle at 30% 20%,#fff7ed,#fed7aa 45%,#f97316 100%);
    color:#ffffff;
    font-size:34px;
    font-weight:1000;
    box-shadow:0 16px 34px rgba(249,115,22,.24);
    border:5px solid #ffffff;
    outline:1px solid #fed7aa;
    transition:.25s ease;
}

body.modelo-magazine-light .magazine-categoria-bolha strong{
    font-size:13px;
    line-height:1.2;
    text-align:center;
    color:#111827;
}

body.modelo-magazine-light .magazine-categoria-bolha:hover span{
    transform:translateY(-4px) scale(1.05);
    box-shadow:0 22px 44px rgba(249,115,22,.32);
}

body.modelo-magazine-light .secao-categoria-home{
    max-width:1280px;
    margin:24px auto!important;
    background:#ffffff!important;
    border:1px solid #e5e7eb!important;
    border-radius:28px!important;
    padding:22px!important;
    box-shadow:0 16px 42px rgba(15,23,42,.07)!important;
}

body.modelo-magazine-light .secao-categoria-home h2{
    color:#0f172a!important;
    border-left:8px solid #f97316;
    padding-left:13px;
    font-size:29px!important;
}

body.modelo-magazine-light .card{
    background:#ffffff!important;
    border:1px solid #e5e7eb!important;
    border-radius:20px!important;
    overflow:hidden!important;
    box-shadow:0 12px 32px rgba(15,23,42,.08)!important;
}

body.modelo-magazine-light .card img{
    height:210px!important;
}

body.modelo-magazine-light .card a{
    color:#111827!important;
    background:#fff!important;
    font-size:17px!important;
}

body.modelo-magazine-light .card a:hover{
    color:#f97316!important;
}

body.modelo-magazine-light .secao-app,
body.modelo-magazine-light .secao-fotos,
body.modelo-magazine-light .secao-videos,
body.modelo-magazine-light .tv-lateral-wrapper,
body.modelo-magazine-light .carrossel-anuncios,
body.modelo-magazine-light .adsense-box{
    max-width:1280px!important;
    margin-left:auto!important;
    margin-right:auto!important;
    background:#ffffff!important;
    border:1px solid #e5e7eb!important;
    border-radius:28px!important;
    box-shadow:0 16px 42px rgba(15,23,42,.07)!important;
}

body.modelo-magazine-light .footer-portal{
    background:#111827!important;
}

/* Responsivo dos modelos */
@media(max-width:900px){
    body.modelo-infinity-dark .destaques-container,
    body.modelo-magazine-light .destaques-container{
        grid-template-columns:1fr!important;
    }

    body.modelo-infinity-dark .destaque-slide-area,
    body.modelo-magazine-light .destaque-slide-area{
        height:360px!important;
    }

    body.modelo-infinity-dark .destaques-laterais,
    body.modelo-magazine-light .destaques-laterais{
        grid-template-columns:1fr 1fr!important;
        grid-template-rows:auto!important;
    }
}

@media(max-width:600px){
    body.modelo-infinity-dark .destaque-slide-area,
    body.modelo-magazine-light .destaque-slide-area{
        height:310px!important;
        border-radius:20px!important;
    }

    body.modelo-infinity-dark .destaques-laterais,
    body.modelo-magazine-light .destaques-laterais{
        grid-template-columns:1fr!important;
    }

    body.modelo-magazine-light .magazine-categoria-bolha{
        min-width:92px;
        max-width:92px;
    }

    body.modelo-magazine-light .magazine-categoria-bolha span{
        width:72px;
        height:72px;
        font-size:28px;
    }
}


/* ===================================================== */
/* MAGAZINE ULTRA 2.0 - MENU + MOEDAS + CATEGORIAS FOTO */
/* ===================================================== */

body.modelo-magazine-light .menu-wrapper{
    position:relative;
    overflow:hidden;
    padding:12px 16px!important;
    background:
        linear-gradient(135deg,#ffffff 0%,#f8fafc 48%,#fff7ed 100%)!important;
    border:1px solid #e2e8f0!important;
    box-shadow:0 18px 44px rgba(15,23,42,.08)!important;
}

body.modelo-magazine-light .menu-wrapper:before{
    content:"";
    position:absolute;
    inset:auto 24px 0 24px;
    height:4px;
    border-radius:999px 999px 0 0;
    background:linear-gradient(90deg,#f97316,#2563eb,#16a34a,#f97316);
}

body.modelo-magazine-light .menu-toggle{
    background:#0f172a!important;
    color:#fff!important;
    border-radius:999px!important;
    border:0!important;
    padding:12px 18px!important;
    font-weight:1000!important;
}

body.modelo-magazine-light #menu-categorias{
    gap:10px!important;
    align-items:center!important;
    padding:4px 0!important;
}

body.modelo-magazine-light #menu-categorias a{
    position:relative;
    min-height:44px;
    display:inline-flex!important;
    align-items:center!important;
    justify-content:center!important;
    background:#ffffff!important;
    color:#0f172a!important;
    border-radius:999px!important;
    border:2px solid #e2e8f0!important;
    padding:11px 17px!important;
    font-weight:1000!important;
    box-shadow:0 8px 18px rgba(15,23,42,.06)!important;
    overflow:hidden;
}

body.modelo-magazine-light #menu-categorias a:before{
    content:"";
    position:absolute;
    inset:0;
    background:linear-gradient(135deg,#f97316,#fb923c);
    opacity:0;
    transition:.22s ease;
    z-index:0;
}

body.modelo-magazine-light #menu-categorias a:hover:before{
    opacity:1;
}

body.modelo-magazine-light #menu-categorias a:hover{
    color:#fff!important;
    border-color:#fdba74!important;
    transform:translateY(-3px);
    box-shadow:0 14px 28px rgba(249,115,22,.20)!important;
}

body.modelo-magazine-light #menu-categorias a > *,
body.modelo-magazine-light #menu-categorias a{
    z-index:1;
}

/* Carrossel de moedas */
body.modelo-magazine-light .magazine-moedas-carousel{
    max-width:1280px;
    margin:0 auto 18px!important;
    overflow:hidden;
    border-radius:24px;
    background:#0f172a;
    border:1px solid #1e293b;
    box-shadow:0 18px 44px rgba(15,23,42,.16);
    padding:12px 0;
}

body.modelo-magazine-light .magazine-moedas-track{
    display:flex;
    gap:12px;
    width:max-content;
    animation:moedasMagazineScroll 32s linear infinite;
}

body.modelo-magazine-light .magazine-moedas-carousel:hover .magazine-moedas-track{
    animation-play-state:paused;
}

body.modelo-magazine-light .magazine-moeda-item{
    min-width:245px;
    display:grid;
    grid-template-columns:46px 1fr auto;
    align-items:center;
    gap:8px;
    padding:11px 14px;
    border-radius:18px;
    background:#ffffff;
    color:#0f172a;
    border:1px solid #e2e8f0;
    box-shadow:0 10px 24px rgba(0,0,0,.12);
}

body.modelo-magazine-light .moeda-icone{
    grid-row:1/3;
    width:46px;
    height:46px;
    border-radius:16px;
    display:flex;
    align-items:center;
    justify-content:center;
    background:linear-gradient(135deg,#f97316,#fed7aa);
    color:#fff;
    font-size:21px;
    font-weight:1000;
}

body.modelo-magazine-light .magazine-moeda-item strong{
    font-size:14px;
    line-height:1;
}

body.modelo-magazine-light .magazine-moeda-item b{
    font-size:12px;
    color:#2563eb;
    justify-self:end;
}

body.modelo-magazine-light .magazine-moeda-item em{
    font-style:normal;
    font-weight:1000;
    font-size:18px;
}

body.modelo-magazine-light .magazine-moeda-item small{
    justify-self:end;
    background:#dcfce7;
    color:#166534;
    padding:4px 8px;
    border-radius:999px;
    font-weight:900;
}

@keyframes moedasMagazineScroll{
    from{transform:translateX(0)}
    to{transform:translateX(-50%)}
}

/* Categorias em círculo com imagem da última notícia */
body.modelo-magazine-light .magazine-categorias-circulos{
    background:
        radial-gradient(circle at top left,rgba(249,115,22,.14),transparent 34%),
        #ffffff!important;
}

body.modelo-magazine-light .magazine-categoria-bolha{
    min-width:128px;
    max-width:128px;
}

body.modelo-magazine-light .magazine-categoria-bolha span{
    width:98px!important;
    height:98px!important;
    padding:0!important;
    background:#0f172a!important;
    overflow:hidden;
    position:relative;
    box-shadow:0 18px 38px rgba(15,23,42,.18)!important;
    outline:2px solid #fed7aa!important;
    border:5px solid #ffffff!important;
}

body.modelo-magazine-light .magazine-categoria-bolha span:after{
    content:"";
    position:absolute;
    inset:0;
    background:linear-gradient(to top,rgba(15,23,42,.42),transparent 60%);
}

body.modelo-magazine-light .magazine-categoria-bolha img{
    width:100%;
    height:100%;
    object-fit:cover;
    display:block;
    transition:.28s ease;
}

body.modelo-magazine-light .magazine-categoria-bolha strong{
    font-size:14px!important;
    font-weight:1000!important;
}

body.modelo-magazine-light .magazine-categoria-bolha:hover img{
    transform:scale(1.12);
}

@media(max-width:600px){
    body.modelo-magazine-light .magazine-moeda-item{
        min-width:220px;
    }

    body.modelo-magazine-light .magazine-categoria-bolha{
        min-width:108px;
        max-width:108px;
    }

    body.modelo-magazine-light .magazine-categoria-bolha span{
        width:82px!important;
        height:82px!important;
    }
}
