/* ===========================================================
   Economus Streaming Gallery — v1.0.7
   Layout: cards com descrição sempre visível,
   card destacado em caixa branca com borda rosa.
   =========================================================== */

.esg-gallery{
    --esg-card-w:300px;
    --esg-active-w:520px;
    --esg-media-h:380px;
    --esg-gap:16px;
    --esg-pink:#f3246b;
    --esg-navy:#173186;
    --esg-title:#24398c;
    position:relative;
    width:100%;
    max-width:100%;
    box-sizing:border-box;
    overflow:visible;
    padding:40px;
    background:transparent;
}
.esg-gallery *{box-sizing:border-box;}

.esg-section-title{
    font-size:28px;line-height:1.1;font-weight:900;
    margin:0 0 28px;color:var(--esg-title);letter-spacing:.01em;
}
.esg-section-subtitle{margin:-16px 0 24px;color:var(--esg-title);}

/* ---------- Carrossel ---------- */
.esg-carousel-wrap{position:relative;width:100%;display:flex;align-items:flex-start;}
.esg-viewport{width:100%;overflow:hidden;padding:4px 0 12px;}
.esg-track{display:flex;align-items:flex-start;gap:var(--esg-gap);transition:transform .42s ease;will-change:transform;}

/* ---------- Card ---------- */
.esg-card{
    flex:0 0 var(--esg-card-w);
    width:var(--esg-card-w);
    display:flex;flex-direction:column;
    background:transparent;
    border:2px solid transparent;
    border-radius:16px;
    padding:0;
    transition:flex-basis .34s ease,width .34s ease,background .24s ease,
               border-color .24s ease,box-shadow .24s ease,padding .24s ease;
}
.esg-card-link{display:block;text-decoration:none!important;color:inherit;}

.esg-card-media{
    position:relative;
    height:var(--esg-media-h);
    overflow:hidden;
    background-size:cover;background-position:center;
    border-radius:12px;
    isolation:isolate;
}
.esg-card-media:before{
    content:"";position:absolute;inset:0;z-index:1;
    background:linear-gradient(180deg,rgba(255,255,255,.04) 0%,rgba(8,12,18,.18) 40%,rgba(8,12,18,.92) 100%);
}
.esg-card-shade{position:absolute;inset:0;z-index:2;background:linear-gradient(90deg,rgba(255,255,255,.08),transparent 35%);}

.esg-card-copy{position:absolute;z-index:4;left:22px;right:18px;bottom:22px;color:#fff;}
.esg-episode{font-size:15px;line-height:1.2;margin-bottom:8px;color:#fff;font-weight:500;text-shadow:0 1px 3px rgba(0,0,0,.45);}
.esg-card-title{font-size:26px;font-weight:900;line-height:1.02;color:#fff;text-shadow:0 2px 8px rgba(0,0,0,.55);max-width:100%;}

/* Badge ORIGINAL — canto superior direito */
.esg-badge{
    position:absolute;z-index:5;top:16px;right:18px;
    font-size:10px;letter-spacing:.14em;text-transform:uppercase;
    font-weight:900;color:var(--esg-pink);
    text-shadow:0 1px 3px rgba(0,0,0,.35);
}

/* Coração — estilo mockup: círculo branco, afastado da borda */
.esg-heart{
    position:absolute!important;
    z-index:30;
    top:22px!important;
    left:22px!important;
    right:auto!important;
    bottom:auto!important;
    width:44px!important;
    height:44px!important;
    min-width:44px!important;
    min-height:44px!important;
    padding:0!important;
    margin:0!important;
    border-radius:999px!important;
    border:0!important;
    outline:0!important;
    background:#fff!important;
    color:var(--esg-pink)!important;
    font-size:0!important;
    line-height:1!important;
    display:flex!important;
    align-items:center!important;
    justify-content:center!important;
    cursor:pointer;
    box-shadow:0 8px 20px rgba(0,0,0,.14)!important;
    backdrop-filter:none!important;
    -webkit-backdrop-filter:none!important;
    overflow:visible!important;
    transform:none;
    transition:transform .18s ease,box-shadow .18s ease,background .18s ease,color .18s ease;
}
.esg-heart:before{
    content:"\2661";
    font-size:24px;
    line-height:1;
    color:var(--esg-pink);
    font-family:Arial, Helvetica, sans-serif;
    font-weight:700;
}
.esg-heart:hover{
    transform:scale(1.08);
    box-shadow:0 10px 24px rgba(0,0,0,.18)!important;
}
.esg-heart.is-saved,
.esg-heart[aria-pressed="true"]{
    background:#fff!important;
    color:var(--esg-pink)!important;
}
.esg-heart.is-saved:before,
.esg-heart[aria-pressed="true"]:before{
    content:"\2665";
    color:var(--esg-pink)!important;
}

/* ---------- Painel de descrição (sempre visível) ---------- */
.esg-description-panel{
    background:transparent;
    color:var(--esg-navy);
    padding:16px 4px 4px;
}
.esg-meta{font-size:15px;font-weight:900;margin-bottom:10px;color:var(--esg-pink);}
.esg-desc-title{display:block;font-size:16px;margin-bottom:8px;font-weight:900;color:var(--esg-title);}
.esg-description-panel p{font-size:15px;line-height:1.5;margin:0;}

/* ---------- Card em destaque (ativo / hover) ---------- */
.esg-card.is-active,
.esg-card:hover{
    flex-basis:var(--esg-active-w);
    width:var(--esg-active-w);
    background:#fff;
    border-color:var(--esg-pink);
    padding:7px;
    box-shadow:0 22px 50px rgba(4,15,32,.20);
}
.esg-card.is-active .esg-description-panel,
.esg-card:hover .esg-description-panel{padding:16px 12px 8px;}

/* ---------- Setas ---------- */
.esg-arrow{
    position:absolute!important;
    z-index:40!important;
    top:calc(var(--esg-media-h) / 2)!important;
    transform:translateY(-50%)!important;
    width:48px!important;
    height:48px!important;
    min-width:48px!important;
    min-height:48px!important;
    padding:0!important;
    margin:0!important;
    border:0!important;
    border-radius:50%!important;
    background:#fff!important;
    color:var(--esg-title)!important;
    font-size:30px!important;
    font-weight:800!important;
    line-height:1!important;
    display:flex!important;
    align-items:center!important;
    justify-content:center!important;
    cursor:pointer!important;
    opacity:1!important;
    visibility:visible!important;
    box-shadow:0 8px 22px rgba(8,20,45,.20)!important;
    transition:transform .18s ease,box-shadow .18s ease;
}
.esg-arrow:hover{
    transform:translateY(-50%) scale(1.07)!important;
    box-shadow:0 12px 28px rgba(8,20,45,.28)!important;
}
.esg-prev{left:12px!important;}
.esg-next{right:12px!important;}

/* ---------- Dots / bullets discretos ---------- */
.esg-dots{
    display:flex!important;
    gap:12px!important;
    align-items:center!important;
    justify-content:center!important;
    margin-top:20px!important;
}
.esg-dot{
    appearance:none!important;
    -webkit-appearance:none!important;
    width:8px!important;
    height:8px!important;
    min-width:8px!important;
    min-height:8px!important;
    max-width:8px!important;
    max-height:8px!important;
    padding:0!important;
    margin:0!important;
    border:0!important;
    border-radius:999px!important;
    background:rgba(120,140,170,.42)!important;
    cursor:pointer!important;
    display:block!important;
    opacity:1!important;
    box-shadow:none!important;
    transition:background .2s ease,transform .2s ease;
}
.esg-dot:before,.esg-dot:after{display:none!important;content:none!important;}
.esg-dot.is-active{
    background:var(--esg-pink)!important;
    transform:scale(1.12);
}

/* ---------- Continuar assistindo ---------- */
.esg-continue{margin-top:42px;}
.esg-continue-title{
    font-size:20px;font-weight:900;letter-spacing:.04em;text-transform:uppercase;
    color:var(--esg-title);margin:0 0 18px;
}
.esg-continue-row{
    display:flex;
    gap:18px;
    overflow-x:auto;
    overflow-y:hidden;
    padding:4px 2px 14px;
    scroll-snap-type:x proximity;
    -webkit-overflow-scrolling:touch;
}
.esg-continue-card{
    display:block;
    flex:0 0 clamp(220px,24vw,340px);
    max-width:340px;
    min-width:220px;
    text-decoration:none!important;
    color:inherit;
    scroll-snap-align:start;
}
.esg-continue-thumb{
    position:relative;width:100%;aspect-ratio:16/9;
    border-radius:14px;overflow:hidden;
    background-size:cover;background-position:center;background-color:#0c1626;
    box-shadow:0 14px 30px rgba(4,15,32,.18);
}
.esg-continue-thumb:before{
    content:"";position:absolute;inset:0;z-index:1;
    background:linear-gradient(180deg,rgba(0,0,0,.05) 0%,rgba(0,0,0,.25) 55%,rgba(0,0,0,.85) 100%);
}
.esg-play{
    position:absolute;z-index:3;top:50%;left:50%;transform:translate(-50%,-50%);
    width:56px;height:56px;border-radius:50%;
    border:2px solid rgba(255,255,255,.92);
    background:rgba(12,22,38,.30);backdrop-filter:blur(2px);
    display:flex;align-items:center;justify-content:center;
    color:#fff;font-size:20px;padding-left:3px;
    transition:transform .18s ease,background .18s ease;
}
.esg-continue-card:hover .esg-play{transform:translate(-50%,-50%) scale(1.08);background:rgba(243,36,107,.85);border-color:transparent;}
.esg-continue-copy{position:absolute;z-index:3;left:16px;right:16px;bottom:14px;color:#fff;}
.esg-continue-copy strong{display:block;font-size:15px;font-weight:800;line-height:1.2;text-shadow:0 1px 4px rgba(0,0,0,.5);}
.esg-continue-copy small{display:block;font-size:12px;margin-top:5px;color:rgba(255,255,255,.85);}
.esg-continue-progress{position:absolute;z-index:4;left:0;right:0;bottom:0;height:4px;background:rgba(255,255,255,.28);}
.esg-continue-progress i{display:block;height:100%;background:var(--esg-pink);}

/* ---------- Página de favoritos (shortcode) ---------- */
.esg-favorites-page{width:100%;padding:20px 0;}
.esg-fav-page-title{color:var(--esg-title);font-weight:900;margin:0 0 22px;}
.esg-favorites-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(220px,1fr));gap:20px;}
.esg-fav-card{display:block;text-decoration:none!important;color:inherit;background:#fff;border-radius:14px;overflow:hidden;box-shadow:0 12px 26px rgba(0,0,0,.1);border:1px solid rgba(0,0,0,.08);}
.esg-fav-thumb{height:150px;background-size:cover;background-position:center;background-color:#071324;position:relative;}
.esg-fav-thumb:after{content:"\25B6";position:absolute;inset:auto 14px 14px auto;width:38px;height:38px;border-radius:50%;background:rgba(255,255,255,.9);display:flex;align-items:center;justify-content:center;color:var(--esg-title);}
.esg-fav-body{padding:15px;}
.esg-fav-body strong{display:block;color:var(--esg-title);font-size:17px;line-height:1.2;}
.esg-fav-body small{display:block;color:var(--esg-pink);margin-top:7px;font-weight:700;}
.esg-fav-empty{color:var(--esg-title);font-size:18px;}

/* ---------- Backgrounds demo (cards sem imagem) ---------- */
.esg-demo-bg{background-image:linear-gradient(135deg,#c9e9ff,#1e293b);}
.esg-demo-1{background-image:linear-gradient(140deg,#bfe4ff,#243e68 58%,#111);}
.esg-demo-2{background-image:linear-gradient(140deg,#d5d5d5,#8ea1ad 45%,#111);}
.esg-demo-3{background-image:linear-gradient(140deg,#557c4e,#d0b56d 48%,#111);}
.esg-demo-4{background-image:linear-gradient(140deg,#10233d,#587a91 45%,#111);}
.esg-demo-5{background-image:linear-gradient(140deg,#052034,#0079bd 50%,#111);}
.esg-demo-6{background-image:linear-gradient(140deg,#fff,#c7b196 46%,#111);}

/* ---------- Responsivo ---------- */
@media(max-width:1100px){
    .esg-prev{left:6px;}
    .esg-next{right:6px;}
    .esg-arrow{width:42px;height:42px;font-size:23px;}
}
@media(max-width:767px){
    .esg-gallery{--esg-card-w:78vw;--esg-active-w:78vw;--esg-media-h:300px;}
    .esg-section-title{font-size:24px;margin-bottom:20px;}
    .esg-card,
    .esg-card.is-active,
    .esg-card:hover{flex-basis:var(--esg-card-w);width:var(--esg-card-w);}
    .esg-card-title{font-size:23px;}
    .esg-card-copy{left:18px;right:16px;bottom:20px;}
    .esg-continue-card{flex-basis:220px;}
    .esg-continue-title{font-size:18px;}
    .esg-dots{gap:10px;}
    .esg-dot{width:7px!important;height:7px!important;min-width:7px!important;min-height:7px!important;}
    .esg-heart{top:18px!important;left:18px!important;width:40px!important;height:40px!important;min-width:40px!important;min-height:40px!important;}
    .esg-heart:before{font-size:22px;}
}

/* ---------- Robustez contra estilos de botão do tema (WoodMart) ----------
   Garante que setas/coração não entrem no fluxo e empurrem os cards. */
.esg-gallery .esg-arrow{position:absolute!important;}
.esg-gallery .esg-heart{position:absolute!important;}

/* ---------- Histórico automático / Continuar Assistindo ---------- */
.esg-watch-history-page{width:100%;padding:20px 0;}
.esg-watch-history-page .esg-continue-row .esg-fav-empty,
.esg-continue-row .esg-fav-empty{grid-column:1/-1;margin:0;color:var(--esg-title);font-size:17px;}
.esg-watch-history-page .esg-continue-card{min-width:220px;max-width:340px;}
.esg-watch-history-page .esg-fav-page-title{text-transform:uppercase;letter-spacing:.04em;}

/* ---------- Modal de vídeo / histórico ---------- */
.esg-modal-lock{overflow:hidden!important;}
.esg-modal{
    position:fixed;inset:0;z-index:999999;
    display:none;align-items:center;justify-content:center;
    padding:28px;
}
.esg-modal.is-open{display:flex;}
.esg-modal-backdrop{
    position:absolute;inset:0;background:rgba(0,0,0,.88);
    backdrop-filter:blur(5px);-webkit-backdrop-filter:blur(5px);
}
.esg-modal-dialog{
    position:relative;
    z-index:2;
    width:min(1180px,94vw);
    max-height:92vh;
    overflow:visible;
    background:transparent;
    border-radius:0;
    padding:0;
    box-shadow:none;
}
.esg-modal-close{
    position:absolute!important;z-index:4;top:14px!important;right:14px!important;
    width:42px!important;height:42px!important;border-radius:999px!important;
    border:0!important;background:#fff!important;color:var(--esg-pink)!important;
    box-shadow:0 8px 24px rgba(0,0,0,.22)!important;
    display:flex!important;align-items:center!important;justify-content:center!important;
    font-size:30px!important;line-height:1!important;font-weight:700!important;
    cursor:pointer!important;padding:0!important;margin:0!important;
}
.esg-modal-video-wrap{
    position:relative;width:100%;aspect-ratio:16/9;background:#08101d;
    border-radius:14px;overflow:hidden;box-shadow:0 30px 90px rgba(0,0,0,.55);
}
.esg-modal-iframe{position:absolute;inset:0;width:100%;height:100%;border:0;display:block;}

.esg-modal-info,
.esg-modal-history,
.esg-modal-history-row{
    display:none!important;
}

.esg-modal-info{display:flex;flex-direction:column;gap:4px;padding:16px 4px 10px;color:var(--esg-title);}
.esg-modal-title{font-size:22px;font-weight:900;line-height:1.2;}
.esg-modal-subtitle{font-size:14px;color:var(--esg-pink);font-weight:800;}
.esg-modal-history{padding:6px 4px 2px;}
.esg-modal-history h3{margin:0 0 14px;font-size:18px;font-weight:900;text-transform:uppercase;color:var(--esg-title);letter-spacing:.03em;}
.esg-modal-history-row{
    display:flex;gap:16px;overflow-x:auto;overflow-y:hidden;padding:2px 2px 12px;
    scroll-snap-type:x proximity;
}
.esg-modal-history-card{flex:0 0 220px;scroll-snap-align:start;}
.esg-modal-history-card .esg-continue-thumb{aspect-ratio:16/9;border-radius:14px;}
.esg-modal-history-card.is-current .esg-continue-thumb{outline:3px solid var(--esg-pink);outline-offset:3px;}
@media(max-width:767px){
    .esg-modal{padding:12px;align-items:flex-start;}
    .esg-modal-dialog{width:100%;max-height:96vh;border-radius:0;padding:0;}
    .esg-modal-close{top:8px!important;right:8px!important;width:38px!important;height:38px!important;font-size:26px!important;}
    .esg-modal-title{font-size:18px;}
    .esg-modal-history-card{flex-basis:180px;}
}

/* Header administrável: Logo | Menu | Logo */
.esg-header{
    display:grid;
    grid-template-columns:minmax(120px,1fr) auto minmax(120px,1fr);
    align-items:center;
    gap:24px;
    width:100%;
}
.esg-header-logo{display:flex;align-items:center;min-width:0;}
.esg-header-logo-left{justify-content:flex-start;}
.esg-header-logo-right{justify-content:flex-end;}
.esg-header-logo img{display:block;height:auto;max-height:90px;object-fit:contain;}
.esg-header-menu{display:flex;justify-content:center;align-items:center;min-width:0;}
.esg-header-menu-list{
    display:flex!important;
    align-items:center;
    justify-content:center;
    gap:34px;
    flex-wrap:wrap;
    list-style:none!important;
    margin:0!important;
    padding:0!important;
}
.esg-header-menu-list li{margin:0!important;padding:0!important;list-style:none!important;}
.esg-header-menu-list a{
    display:inline-flex;
    align-items:center;
    justify-content:center;
    min-height:36px;
    padding:7px 14px;
    border-radius:999px;
    color:var(--esg-title,#24398c)!important;
    font-size:15px;
    font-weight:900;
    text-transform:uppercase;
    letter-spacing:.02em;
    text-decoration:none!important;
    transition:all .2s ease;
}
.esg-header-menu-list a:hover,
.esg-header-menu-list .current-menu-item > a{
    background:var(--esg-title,#24398c)!important;
    color:#fff!important;
}
@media (max-width: 767px){
    .esg-header{
        grid-template-columns:1fr 1fr;
        grid-template-areas:"logo-left logo-right" "menu menu";
        gap:14px 18px;
    }
    .esg-header-logo-left{grid-area:logo-left;justify-content:flex-start;}
    .esg-header-logo-right{grid-area:logo-right;justify-content:flex-end;}
    .esg-header-menu{grid-area:menu;width:100%;justify-content:center;}
    .esg-header-menu-list{gap:10px 18px;}
    .esg-header-menu-list a{font-size:13px;min-height:30px;padding:5px 10px;}
    .esg-header-logo img{max-height:64px;}
}

/* v1.0.12 - Continuar Assistindo com navegação horizontal longa */
.esg-history-carousel{position:relative;}
.esg-history-shell{position:relative;width:100%;}
.esg-history-shell .esg-continue-row{
    scroll-behavior:smooth;
    scrollbar-width:none;
    padding-left:4px;
    padding-right:4px;
}
.esg-history-shell .esg-continue-row::-webkit-scrollbar{display:none;}
.esg-history-shell .esg-continue-card{
    flex:0 0 clamp(230px,22vw,330px)!important;
    width:clamp(230px,22vw,330px)!important;
    min-width:230px!important;
    max-width:330px!important;
}
.esg-history-arrow{
    position:absolute!important;
    top:50%!important;
    transform:translateY(-50%)!important;
    z-index:8!important;
    width:42px!important;
    height:42px!important;
    min-width:42px!important;
    min-height:42px!important;
    border-radius:50%!important;
    border:0!important;
    background:#fff!important;
    color:var(--esg-title)!important;
    box-shadow:0 10px 26px rgba(4,15,32,.20)!important;
    display:flex!important;
    align-items:center!important;
    justify-content:center!important;
    font-size:30px!important;
    line-height:1!important;
    font-weight:900!important;
    cursor:pointer!important;
    padding:0!important;
    margin:0!important;
}
.esg-history-prev{left:-16px!important;}
.esg-history-next{right:-16px!important;}
.esg-history-arrow:hover{background:var(--esg-pink)!important;color:#fff!important;}
@media(max-width:767px){
    .esg-history-shell .esg-continue-card{
        flex-basis:220px!important;
        width:220px!important;
        min-width:220px!important;
    }
    .esg-history-arrow{width:36px!important;height:36px!important;min-width:36px!important;min-height:36px!important;font-size:25px!important;}
    .esg-history-prev{left:2px!important;}
    .esg-history-next{right:2px!important;}
}