/* ==========================================================
   ICPD LIVE MANAGER 3.3.2
   VIDEO PLAYER
========================================================== */

.icpd-live-wrapper{
    width:100%;
    max-width:1400px;
    margin:40px auto;
    padding:0 20px;
    box-sizing:border-box;
}

.icpd-live-player{
    width:100%;
    margin:0 auto;
}

.icpd-video-responsive{
    position:relative;
    width:100%;
    aspect-ratio:16/9;
    overflow:hidden;
    background:#000;
    border-radius:18px 18px 0 0;
}

.icpd-video-responsive iframe{
    position:absolute;
    inset:0;
    width:100%;
    height:100%;
    border:0;
    display:block;
}
/* ==========================================================
   BANDA DE ESTADO
========================================================== */

.icpd-live-status{
    display:flex;
    width:100%;
    overflow:hidden;
    border-radius:0 0 18px 18px;
    box-shadow:0 8px 25px rgba(0,0,0,.12);
}

.icpd-status{
    width:100%;
    display:flex;
    align-items:center;
    gap:18px;
    padding:20px 26px;
    color:#fff;
}

.icpd-status.live{
    background:linear-gradient(90deg,#b30000,#ff2f2f);
}

.icpd-status.upcoming{
    background:linear-gradient(90deg,#0a58ca,#4d94ff);
}

.icpd-status.latest{
    background:linear-gradient(90deg,#222,#555);
}

.icpd-icon{
    flex-shrink:0;
    font-size:34px;
    line-height:1;
}

.icpd-status-text{
    display:flex;
    flex-direction:column;
}

.icpd-status-text strong{
    font-size:22px;
    font-weight:700;
    margin-bottom:4px;
    letter-spacing:.3px;
}

.icpd-status-text span{
    font-size:15px;
    opacity:.95;
}

.icpd-status.live .icpd-icon{
    animation:icpdLivePulse 1.2s infinite;
}

@keyframes icpdLivePulse{

    0%{
        transform:scale(1);
    }

    50%{
        transform:scale(1.20);
    }

    100%{
        transform:scale(1);
    }

}
/* ==========================================================
   PANEL DE INFORMACIÓN
========================================================== */

.icpd-live-info{
    background:#ffffff;
    padding:28px;
    border:1px solid #ececec;
    border-top:none;
    border-radius:0 0 18px 18px;
    box-shadow:0 8px 25px rgba(0,0,0,.08);
}

.icpd-live-badge{
    display:inline-block;
    padding:8px 18px;
    border-radius:40px;
    background:#d60000;
    color:#fff;
    font-size:13px;
    font-weight:700;
    text-transform:uppercase;
    letter-spacing:.5px;
}

.icpd-live-info h2{
    margin:18px 0 12px;
    font-size:34px;
    line-height:1.25;
    color:#222;
}

.icpd-live-date{
    margin:0 0 18px;
    color:#666;
    font-size:15px;
}

.icpd-live-description{
    margin:20px 0;
    color:#555;
    line-height:1.8;
    font-size:16px;
}

.icpd-live-church{
    margin-top:20px;
    padding-top:20px;
    border-top:1px solid #ececec;
    color:#444;
    line-height:1.7;
}

.icpd-live-actions{
    display:flex;
    gap:15px;
    flex-wrap:wrap;
    margin-top:25px;
}

.icpd-btn-primary,
.icpd-btn-secondary{

    display:inline-flex;
    align-items:center;
    justify-content:center;

    min-width:220px;

    padding:14px 24px;

    border-radius:10px;

    text-decoration:none;

    font-weight:700;

    transition:.30s;

}

.icpd-btn-primary{

    background:#d60000;
    color:#fff;

}

.icpd-btn-primary:hover{

    background:#b10000;
    color:#fff;

}

.icpd-btn-secondary{

    background:#f3f3f3;
    color:#222;

}

.icpd-btn-secondary:hover{

    background:#e3e3e3;
    color:#000;

}
/* ==========================================================
   RESPONSIVE
========================================================== */

@media (max-width:1024px){

    .icpd-live-wrapper{

        padding:0 18px;

    }

    .icpd-live-info{

        padding:22px;

    }

    .icpd-live-info h2{

        font-size:28px;

    }

    .icpd-status{

        padding:18px 20px;

    }

    .icpd-icon{

        font-size:30px;

    }

    .icpd-status-text strong{

        font-size:20px;

    }

}

@media (max-width:768px){

    .icpd-live-wrapper{

        padding:0 12px;
        margin:20px auto;

    }

    .icpd-video-responsive{

        border-radius:14px 14px 0 0;

    }

    .icpd-live-status{

        border-radius:0 0 14px 14px;

    }

    .icpd-status{

        padding:16px;
        gap:12px;

    }

    .icpd-icon{

        font-size:26px;

    }

    .icpd-status-text strong{

        font-size:18px;

    }

    .icpd-status-text span{

        font-size:14px;

    }

    .icpd-live-info{

        padding:18px;
        border-radius:0 0 14px 14px;

    }

    .icpd-live-info h2{

        font-size:22px;
        line-height:1.35;

    }

    .icpd-live-description{

        font-size:15px;
        line-height:1.7;

    }

    .icpd-live-actions{

        flex-direction:column;

    }

    .icpd-btn-primary,
    .icpd-btn-secondary{

        width:100%;
        min-width:0;

    }

}

@media (max-width:480px){

    .icpd-live-wrapper{

        padding:0 8px;

    }

    .icpd-status{

        padding:14px;

    }

    .icpd-icon{

        font-size:22px;

    }

    .icpd-status-text strong{

        font-size:16px;

    }

    .icpd-status-text span{

        font-size:13px;

    }

}
/* ==========================================================
   LIMPIEZA Y COMPATIBILIDAD 3.3.2
========================================================== */

/* Evita espacios innecesarios */

.icpd-live-wrapper *{
    box-sizing:border-box;
}

/* El iframe siempre ocupa el ancho disponible */

.icpd-live-player iframe{
    display:block;
    width:100%;
    max-width:100%;
}

/* Imágenes responsivas */

.icpd-live-wrapper img{
    max-width:100%;
    height:auto;
    display:block;
}

/* Evita desbordamientos */

.icpd-live-player,
.icpd-video-responsive,
.icpd-live-status,
.icpd-live-info{
    overflow:hidden;
}

/* Chat */

.icpd-live-chat{
    margin-top:30px;
    border-radius:16px;
    overflow:hidden;
    border:1px solid #e8e8e8;
    background:#fff;
}

.icpd-live-chat iframe{
    display:block;
    width:100%;
    height:650px;
    border:0;
}

/* Elementor */

.elementor-widget-container .icpd-live-wrapper{
    margin:0 auto;
}

/* Temas que agregan márgenes */

.icpd-live-wrapper h2,
.icpd-live-wrapper p{
    margin-top:0;
}

/* Tablet */

@media(max-width:991px){

    .icpd-live-chat iframe{

        height:500px;

    }

}

/* Celular */

@media(max-width:768px){

    .icpd-live-chat iframe{

        height:420px;

    }

}

/* Celulares pequeños */

@media(max-width:480px){

    .icpd-live-chat iframe{

        height:360px;

    }

}
/* ==========================================================================
   MÓDULOS DE CONTENIDO — MINIATURAS UNIFORMES
   ========================================================================== */

.icpd-series-thumbnail {
    width: 100%;
    aspect-ratio: 16 / 9;
    overflow: hidden;
}

.icpd-series-thumbnail img {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.icpd-series-content {
    width: 100%;
}

.icpd-series-title {
    margin: 12px 0 0;
}

.icpd-series-actions {
    margin-top: 12px;
}
/* ==========================================================================
   PORTADA — TARJETAS DE CONTENIDO
   ========================================================================== */

.icpd-series-grid {
    width: 100%;
    max-width: 1400px;
    margin: 0 auto;
    padding: 30px 20px;
    box-sizing: border-box;

    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 24px;
}

.icpd-series-module {
    width: 100%;
    background: #fff;
    border: 1px solid #e5e5e5;
    border-radius: 16px;
    overflow: hidden;
    box-shadow: 0 6px 20px rgba(0, 0, 0, .08);
}

.icpd-series-module .icpd-series-thumbnail {
    width: 100%;
    aspect-ratio: 16 / 9;
    overflow: hidden;
}

.icpd-series-module .icpd-series-thumbnail img {
    width: 100%;
    height: 100%;
    display: block;
    object-fit: cover;
}

.icpd-series-content {
    padding: 18px;
}

.icpd-series-badge {
    margin-bottom: 10px;
    font-size: 12px;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: .4px;
}

.icpd-series-title {
    margin: 0;
    font-size: 20px;
    line-height: 1.35;
}

.icpd-series-actions {
    margin-top: 16px;
}

.icpd-series-actions .icpd-button-primary {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 100%;
    padding: 11px 16px;
    box-sizing: border-box;
    text-decoration: none;
}

/* Tablet */

@media (max-width: 991px) {

    .icpd-series-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

}

/* Celular */

@media (max-width: 767px) {

    .icpd-series-grid {
        grid-template-columns: 1fr;
        padding: 20px 12px;
        gap: 18px;
    }

    .icpd-series-title {
        font-size: 18px;
    }

}
/* ==========================================================================
   TRANSMISIÓN EN VIVO — VIDEO + CHAT
   ========================================================================== */

.icpd-series-module.icpd-series-live {
    grid-column: 1 / -1 !important;
    padding: 0;
}

/* La tarjeta EN VIVO usa todo el ancho para alojar video + chat. */
.icpd-series-module.icpd-series-live-card {
    grid-column: 1 / -1 !important;
    padding: 0;
}


.icpd-live-module {
    display: grid;
    grid-template-columns: minmax(0, 2fr) minmax(300px, 1fr);
    gap: 0;
    width: 100%;
}

.icpd-live-player-column {
    min-width: 0;
}

.icpd-live-player {
    width: 100%;
    aspect-ratio: 16 / 9;
    background: #000;
    overflow: hidden;
}

.icpd-live-player iframe {
    width: 100%;
    height: 100%;
    display: block;
    border: 0;
}

.icpd-live-header {
    padding: 18px 22px 22px;
}

.icpd-live-badge {
    display: inline-block;
    margin-bottom: 10px;
}

.icpd-live-header .icpd-series-title {
    margin: 0 0 16px;
}

.icpd-live-button {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 12px 20px;
    border-radius: 10px;
    background: #d60000;
    color: #fff;
    text-decoration: none;
    font-weight: 700;
}

.icpd-live-button:hover {
    background: #b10000;
    color: #fff;
}

.icpd-live-chat {
    min-height: 100%;
    background: #fff;
    border-left: 1px solid #e5e5e5;
}

.icpd-live-chat iframe {
    width: 100%;
    height: 100%;
    min-height: 500px;
    display: block;
    border: 0;
}

@media (max-width: 991px) {

    .icpd-series-module.icpd-series-live {
        grid-column: 1 / -1;
    }

    .icpd-live-module {
        grid-template-columns: 1fr;
    }

    .icpd-live-chat {
        border-left: 0;
        border-top: 1px solid #e5e5e5;
    }

    .icpd-live-chat iframe {
        min-height: 450px;
    }

}
/* ==========================================================================
   TARJETAS — TÍTULOS UNIFORMES
   ========================================================================== */

.icpd-series-module .icpd-series-title {
    font-size: 17px;
    line-height: 1.35;
    min-height: 72px;
    margin: 0;
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 3;
    overflow: hidden;
    word-break: normal;
}
.icpd-series-module .icpd-series-actions {
    margin-top: 16px;
}

.icpd-series-module .icpd-series-actions .icpd-button-primary {
    width: 100%;
    min-height: 44px;
}

/* Celular */

@media (max-width: 767px) {

    .icpd-series-module .icpd-series-title {
        font-size: 18px;
        min-height: auto;
        -webkit-line-clamp: unset;
        display: block;
    }

}
/* ==========================================================================
   REPRODUCTOR EMBEBIDO EN TARJETAS
   ========================================================================== */

.icpd-series-player {
    width: 100%;
    aspect-ratio: 16 / 9;
    background: #000;
    overflow: hidden;
}

.icpd-series-player iframe {
    width: 100%;
    height: 100%;
    display: block;
    border: 0;
}
/* ==========================================================================
   BOTÓN GLOBAL EN VIVO
   ========================================================================== */

.icpd-live-entry {
    width: 100%;
    display: flex;
    justify-content: center;
    margin: 0 0 24px;
}

.icpd-live-entry-button {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 12px 24px;
    border-radius: 999px;
    background: #d60000;
    color: #fff;
    text-decoration: none;
    font-size: 16px;
    font-weight: 700;
    line-height: 1;
    box-shadow: 0 6px 18px rgba(214,0,0,.25);
    transition: transform .2s ease, box-shadow .2s ease;
}

.icpd-live-entry-button:hover {
    color: #fff;
    transform: translateY(-1px);
    box-shadow: 0 8px 22px rgba(214,0,0,.32);
}

.icpd-live-section {
    width: 100%;
    scroll-margin-top: 100px;
    margin-bottom: 30px;
}

@media (max-width: 767px) {

    .icpd-live-entry {
        margin-bottom: 18px;
    }

    .icpd-live-entry-button {
        width: 100%;
        max-width: 340px;
    }

}

/* ==========================================================================
   TRES CAJAS — ÚLTIMA TRANSMISIÓN / PERLITA / PRÉDICA
   ========================================================================== */
.icpd-three-cards {
    align-items: start;
}

.icpd-three-cards .icpd-series-module {
    align-self: start;
}

.icpd-three-cards .icpd-series-thumbnail-link {
    display: block;
    width: 100%;
    aspect-ratio: 16 / 9;
    overflow: hidden;
    background: #000;
}

.icpd-three-cards .icpd-series-thumbnail-img {
    width: 100%;
    height: 100%;
    display: block;
    object-fit: cover;
}

.icpd-three-cards .icpd-series-content {
    min-height: 0;
}

.icpd-active-visitors {
    display: inline-flex;
    align-items: center;
    gap: 5px;
    margin: 2px 0 10px;
    font-size: 13px;
    line-height: 1.4;
    font-weight: 600;
}

.icpd-three-cards .icpd-series-title {
    min-height: 0;
}

.icpd-three-cards .icpd-series-live-card .icpd-series-player {
    aspect-ratio: 16 / 9;
}

@media (max-width: 991px) {
    .icpd-three-cards .icpd-series-module {
        min-height: 0;
    }
}


/* ======================================================================
   3.3.29 — TRES CAJAS MÁS ANCHAS Y CENTRADAS EN ESCRITORIO
   Se ensancha únicamente el bloque de las tres tarjetas.
   En móvil no se modifica su comportamiento.
   ====================================================================== */
.icpd-three-cards {
    position: relative !important;
    left: 50% !important;
    width: min(1320px, calc(100vw - 80px)) !important;
    max-width: 1320px !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
    transform: translateX(-50%) !important;
    box-sizing: border-box !important;
    overflow: visible !important;
}

.icpd-three-cards .icpd-series-module {
    min-width: 0;
}

@media (min-width: 992px) {
    .icpd-three-cards .icpd-series-module.icpd-series-live-card {
        grid-column: auto !important;
    }

    .icpd-three-cards .icpd-series-live-card .icpd-live-module {
        grid-template-columns: 1fr;
    }

    .icpd-three-cards .icpd-series-live-card .icpd-live-chat {
        border-left: 0;
        border-top: 1px solid #e5e5e5;
    }

    .icpd-three-cards .icpd-series-live-card .icpd-live-chat iframe {
        height: 420px;
        min-height: 420px;
    }
}

@media (max-width: 991px) {
    .icpd-three-cards {
        width: calc(100vw - 36px) !important;
        max-width: none !important;
    }
}

@media (max-width: 767px) {
    .icpd-three-cards {
        width: calc(100vw - 24px) !important;
        max-width: none !important;
        left: 50% !important;
        transform: translateX(-50%) !important;
    }
}

/* ==========================================================
   BOTÓN DE NAVEGACIÓN AL EN VIVO / PRÓXIMO LIVE
   3.3.25 — visible desde el primer pantallazo, debajo del
   botón EN VIVO del encabezado, sin obligar al visitante a
   desplazarse hasta las tres cajas.
========================================================== */
.icpd-live-jump-button{
    position:fixed;
    top:188px;
    left:50%;
    transform:translateX(-50%);
    z-index:99998;
    display:flex;
    width:max-content;
    margin:0;
    align-items:center;
    justify-content:center;
    gap:8px;
    min-width:150px;
    padding:10px 20px;
    border-radius:999px;
    background:#d60000;
    color:#fff !important;
    text-decoration:none !important;
    font-weight:800;
    font-size:14px;
    line-height:1;
    letter-spacing:.3px;
    box-shadow:0 8px 24px rgba(0,0,0,.22);
    transition:transform .2s ease, box-shadow .2s ease, background .2s ease;
}
.icpd-live-jump-button:hover,
.icpd-live-jump-button:focus{
    color:#fff !important;
    transform:translateX(-50%) translateY(-1px);
    box-shadow:0 10px 28px rgba(0,0,0,.28);
}
.icpd-live-jump-dot{
    width:10px;
    height:10px;
    border-radius:50%;
    background:#fff;
    box-shadow:0 0 0 0 rgba(255,255,255,.7);
    animation:icpdLiveJumpPulse 1.4s infinite;
    flex:0 0 auto;
}
@keyframes icpdLiveJumpPulse{
    0%{box-shadow:0 0 0 0 rgba(255,255,255,.65)}
    70%{box-shadow:0 0 0 7px rgba(255,255,255,0)}
    100%{box-shadow:0 0 0 0 rgba(255,255,255,0)}
}
#icpd-live-ahora,
#icpd-proximo-live{scroll-margin-top:100px;}
.icpd-live-jump-live{background:#d60000;}
.icpd-live-jump-upcoming{
    background:#f59e0b;
    box-shadow:0 6px 18px rgba(245,158,11,.25);
}
.icpd-live-jump-upcoming:hover,
.icpd-live-jump-upcoming:focus{
    color:#fff !important;
    background:#d97706;
    box-shadow:0 8px 22px rgba(217,119,6,.32);
}

@media (max-width:767px){
    .icpd-live-jump-button{
        top:54px;
        left:auto;
        right:18px;
        transform:none;
        min-width:148px;
        padding:10px 18px;
        font-size:13px;
    }
    .icpd-live-jump-button:hover,
    .icpd-live-jump-button:focus{
        transform:translateY(-1px);
    }
}

/* ======================================================================
   3.3.29 — LIVE EN DOS COLUMNAS EN ESCRITORIO
   Cuando la primera tarjeta está EN VIVO:
   - el LIVE ocupa toda la primera fila;
   - video y chat quedan lado a lado;
   - Perlita y Prédica pasan juntas a la fila inferior.
   Cuando no hay LIVE, las tres tarjetas vuelven a su rejilla normal.
   En móvil se conserva el comportamiento aprobado.
   ====================================================================== */
@media (min-width: 992px) {
    .icpd-three-cards:has(.icpd-series-live-card) {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .icpd-three-cards:has(.icpd-series-live-card) .icpd-series-live-card {
        grid-column: 1 / -1 !important;
    }

    .icpd-three-cards:has(.icpd-series-live-card) .icpd-series-live-card .icpd-live-module {
        grid-template-columns: minmax(0, 2fr) minmax(300px, 1fr);
        align-items: stretch;
    }

    .icpd-three-cards:has(.icpd-series-live-card) .icpd-series-live-card .icpd-live-chat {
        border-left: 1px solid #e5e5e5;
        border-top: 0;
        min-width: 0;
    }

    .icpd-three-cards:has(.icpd-series-live-card) .icpd-series-live-card .icpd-live-chat iframe {
        height: 100%;
        min-height: 0;
    }
}

/* ==========================================================
   ICPD 3.3.35 — BOTÓN EN VIVO INTEGRADO AL ENCABEZADO
   PC: el botón se mueve dentro del bloque derecho del header
   y queda debajo de los elementos de navegación, no flotando
   sobre el contenido.
   MÓVIL: conserva exactamente la posición aprobada.
========================================================== */
@media (min-width: 992px) {
    .icpd-live-jump-button.icpd-live-header-integrated {
        position: absolute !important;
        top: calc(100% + 8px) !important;
        right: 0 !important;
        left: auto !important;
        transform: none !important;
        margin: 0 !important;
        z-index: 99998 !important;
        white-space: nowrap;
    }

    .icpd-live-header-integrated-wrap {
        position: relative !important;
    }

    .icpd-live-jump-button.icpd-live-header-integrated:hover,
    .icpd-live-jump-button.icpd-live-header-integrated:focus {
        transform: translateY(-1px) !important;
    }
}

@media (max-width: 991px) {
    .icpd-live-jump-button.icpd-live-header-integrated {
        position: fixed !important;
        top: 54px !important;
        right: 18px !important;
        left: auto !important;
        transform: none !important;
    }
}

/* ======================================================================
   3.3.37 — PANEL REAL PARA PRÓXIMO LIVE
   El botón PRÓXIMO LIVE siempre apunta a un destino que existe en la
   misma página. El panel solo aparece cuando YouTube entrega un evento
   upcoming real.
====================================================================== */
.icpd-upcoming-panel{
    width:min(1400px,calc(100vw - 48px));
    margin:0 auto 28px;
    scroll-margin-top:100px;
}
.icpd-upcoming-inner{
    display:grid;
    grid-template-columns:minmax(260px,430px) 1fr;
    grid-template-rows:auto auto;
    gap:28px;
    align-items:stretch;
    padding:22px;
    background:#fff;
    border:1px solid rgba(0,0,0,.08);
    border-radius:18px;
    box-shadow:0 10px 30px rgba(0,0,0,.08);
}
.icpd-upcoming-thumb-link{display:block;grid-column:2;grid-row:1;align-self:center;}
.icpd-upcoming-thumb{display:block;width:100%;height:auto;aspect-ratio:16/9;object-fit:cover;border-radius:14px;}
.icpd-upcoming-label{display:inline-flex;align-self:center;justify-self:start;align-items:center;gap:8px;margin:0;padding:8px 14px;border-radius:999px;background:#f59e0b;color:#fff;font-weight:800;font-size:14px;}
.icpd-upcoming-copy{grid-column:1 / -1;grid-row:2;}
.icpd-upcoming-copy h2{margin:0 0 12px;font-size:30px;line-height:1.15;}
.icpd-upcoming-copy p{margin:0 0 18px;font-size:16px;}
.icpd-upcoming-watch{display:inline-block;padding:11px 18px;border-radius:999px;background:#f59e0b;color:#fff !important;text-decoration:none !important;font-weight:800;}
.icpd-upcoming-watch:hover,.icpd-upcoming-watch:focus{background:#d97706;color:#fff !important;}
@media (max-width:991px){
    .icpd-upcoming-panel{width:calc(100vw - 36px);}
    .icpd-upcoming-inner{grid-template-columns:1fr;grid-template-rows:none;gap:18px;}
    .icpd-upcoming-label,.icpd-upcoming-thumb-link,.icpd-upcoming-copy{grid-column:auto;grid-row:auto;}
    .icpd-upcoming-copy h2{font-size:24px;}
}
@media (max-width:767px){
    .icpd-upcoming-panel{width:calc(100vw - 24px);}
    .icpd-upcoming-inner{padding:16px;border-radius:16px;}
}

/* ======================================================================
   3.3.39 — PRÓXIMO LIVE SIN DESBORDAMIENTO HORIZONTAL
   Evita que el panel programado genere una franja lateral por overflow.
   ====================================================================== */
.icpd-upcoming-panel{
    box-sizing:border-box !important;
    width:min(1400px, calc(100% - 48px)) !important;
    max-width:100% !important;
    min-width:0 !important;
    overflow:hidden !important;
}
.icpd-upcoming-inner{
    box-sizing:border-box !important;
    width:100% !important;
    max-width:100% !important;
    min-width:0 !important;
    overflow:hidden !important;
}
.icpd-upcoming-inner > *{
    min-width:0 !important;
}
.icpd-upcoming-thumb-link{
    min-width:0 !important;
    max-width:100% !important;
    overflow:hidden !important;
}
.icpd-upcoming-thumb{
    display:block !important;
    width:100% !important;
    max-width:100% !important;
    height:auto !important;
    box-sizing:border-box !important;
}
@media (max-width:991px){
    .icpd-upcoming-panel{
        width:calc(100% - 36px) !important;
        max-width:100% !important;
    }
}
@media (max-width:767px){
    .icpd-upcoming-panel{
        width:calc(100% - 24px) !important;
        max-width:100% !important;
    }
}

/* ======================================================================
   3.3.42 — VITRINA DINÁMICA
   El orden de las tarjetas se decide por la fecha efectiva del contenido.
   No se modifica la posición móvil existente de las tarjetas.
   ====================================================================== */
.icpd-dynamic-content-grid {
    align-items: start;
}

.icpd-dynamic-card-wrap {
    min-width: 0;
}

.icpd-dynamic-card-primary {
    min-width: 0;
}

.icpd-dynamic-content-grid .icpd-series-module {
    height: 100%;
}


/* ======================================================================
   3.3.43 — VITRINA DINÁMICA: PROTAGONISTA ARRIBA
   La tarjeta que ocupa la primera posición se muestra grande en escritorio.
   Las dos siguientes quedan debajo en dos columnas.
   En móvil no se altera el comportamiento existente.
   ====================================================================== */
@media (min-width: 992px) {
    .icpd-dynamic-content-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
        align-items: start !important;
        row-gap: 28px !important;
    }

    .icpd-dynamic-content-grid .icpd-dynamic-card-primary {
        grid-column: 1 / -1 !important;
        width: 100% !important;
        min-width: 0 !important;
    }

    .icpd-dynamic-content-grid .icpd-dynamic-card-primary .icpd-series-module {
        width: 100% !important;
    }

    /* La protagonista normal conserva la miniatura 16:9, pero a todo el ancho. */
    .icpd-dynamic-content-grid .icpd-dynamic-card-primary .icpd-series-thumbnail-link {
        aspect-ratio: 16 / 7 !important;
    }

    .icpd-dynamic-content-grid .icpd-dynamic-card-primary .icpd-series-thumbnail-img {
        object-position: center center;
    }

    /* Cuando la protagonista es LIVE, respetamos video + chat lado a lado. */
    .icpd-dynamic-content-grid .icpd-dynamic-card-primary.icpd-series-live-card,
    .icpd-dynamic-content-grid .icpd-dynamic-card-primary .icpd-series-live-card {
        min-width: 0;
    }
}

/* ======================================================================
   3.3.44 — VITRINA PROTAGONISTA: TAMAÑO Y REPRODUCCIÓN EN PÁGINA
   ====================================================================== */
.icpd-dynamic-card-primary .icpd-series-thumbnail-link {
    position: relative !important;
    display: block !important;
    width: min(1120px, 100%) !important;
    margin: 0 auto !important;
    aspect-ratio: 16 / 9 !important;
    overflow: hidden !important;
    background: #000 !important;
    border: 0 !important;
    padding: 0 !important;
    cursor: pointer !important;
    appearance: none !important;
    -webkit-appearance: none !important;
}
.icpd-dynamic-card-primary .icpd-series-thumbnail-img {
    width: 100% !important;
    height: 100% !important;
    object-fit: cover !important;
    display: block !important;
}
.icpd-inline-play-icon {
    position: absolute;
    left: 50%;
    top: 50%;
    transform: translate(-50%, -50%);
    width: 76px;
    height: 76px;
    display: grid;
    place-items: center;
    border-radius: 50%;
    background: rgba(0,0,0,.72);
    color: #fff;
    font-size: 30px;
    line-height: 1;
    padding-left: 5px;
    box-sizing: border-box;
    box-shadow: 0 8px 25px rgba(0,0,0,.28);
    pointer-events: none;
}
.icpd-inline-play-trigger:hover .icpd-inline-play-icon,
.icpd-inline-play-trigger:focus-visible .icpd-inline-play-icon {
    transform: translate(-50%, -50%) scale(1.06);
}
.icpd-inline-video-wrap {
    position: relative !important;
    width: 100% !important;
    aspect-ratio: 16 / 9 !important;
    overflow: hidden !important;
    background: #000 !important;
}
.icpd-inline-video-wrap iframe {
    position: absolute !important;
    inset: 0 !important;
    width: 100% !important;
    height: 100% !important;
    border: 0 !important;
    display: block !important;
}
.icpd-inline-play-button {
    border: 0 !important;
    cursor: pointer !important;
}
.icpd-series-actions {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: center;
    gap: 10px;
}
.icpd-youtube-secondary-link {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    text-decoration: none !important;
}
@media (max-width: 991px) {
    .icpd-dynamic-card-primary .icpd-series-thumbnail-link {
        width: 100% !important;
        aspect-ratio: 16 / 9 !important;
    }
}


/* ======================================================================
   3.3.45 — VITRINA PROTAGONISTA: IMAGEN COMPLETA + BOTONES LIMPIOS
   La miniatura protagonista se muestra completa, sin recorte.
   Se elimina el círculo negro superpuesto sobre la imagen.
   El botón secundario YouTube conserva forma de botón normal.
   No se modifica la lógica ni el layout aprobado del contenido móvil.
   ====================================================================== */
.icpd-dynamic-card-primary .icpd-series-thumbnail-link {
    aspect-ratio: auto !important;
    height: auto !important;
    overflow: hidden !important;
}
.icpd-dynamic-card-primary .icpd-series-thumbnail-img {
    width: 100% !important;
    height: auto !important;
    object-fit: contain !important;
    object-position: center center !important;
    display: block !important;
}
.icpd-dynamic-card-primary .icpd-inline-play-icon {
    display: none !important;
}
.icpd-dynamic-card-primary .icpd-youtube-secondary-link,
.icpd-three-cards .icpd-youtube-secondary-link {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    width: auto !important;
    min-width: 96px !important;
    min-height: 44px !important;
    padding: 10px 16px !important;
    margin: 0 !important;
    border-radius: 10px !important;
    background: #f1f1f1 !important;
    color: #222 !important;
    text-decoration: none !important;
    box-shadow: none !important;
    transform: none !important;
}
.icpd-dynamic-card-primary .icpd-youtube-secondary-link:hover,
.icpd-three-cards .icpd-youtube-secondary-link:hover {
    background: #e6e6e6 !important;
    color: #111 !important;
}
@media (max-width: 767px) {
    .icpd-dynamic-card-primary .icpd-series-thumbnail-link {
        aspect-ratio: auto !important;
        height: auto !important;
    }
    .icpd-dynamic-card-primary .icpd-series-thumbnail-img {
        height: auto !important;
        object-fit: contain !important;
    }
}


/* ======================================================================
   3.3.46 — BOTÓN DE REPRODUCCIÓN LIMPIO
   Evita estilos globales del tema que conviertan el botón en un
   círculo negro. El video sigue reproduciéndose dentro de la página.
   ====================================================================== */
.icpd-inline-play-button {
    appearance: none !important;
    -webkit-appearance: none !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    width: auto !important;
    min-width: 0 !important;
    min-height: 0 !important;
    height: auto !important;
    margin: 0 auto !important;
    padding: 0 !important;
    border: 0 !important;
    border-radius: 0 !important;
    outline: none !important;
    background: transparent !important;
    box-shadow: none !important;
    color: #e85d04 !important;
    font: inherit !important;
    font-size: 15px !important;
    font-weight: 600 !important;
    line-height: 1.4 !important;
    letter-spacing: .08em !important;
    text-transform: uppercase !important;
    cursor: pointer !important;
}
.icpd-inline-play-button::before,
.icpd-inline-play-button::after {
    content: none !important;
    display: none !important;
}
.icpd-inline-play-button:hover,
.icpd-inline-play-button:focus,
.icpd-inline-play-button:active {
    background: transparent !important;
    box-shadow: none !important;
    border: 0 !important;
    color: #c94f00 !important;
}


/* ======================================================================
   3.3.47 — REPRODUCCIÓN INLINE: SIN ESTILOS DE BOTÓN DEL TEMA
   El control de reproducción se renderiza como enlace para evitar que
   Astra/Elementor u otro CSS global lo convierta en círculo negro.
   ====================================================================== */
.icpd-dynamic-card-primary .icpd-inline-play-button,
.icpd-three-cards .icpd-inline-play-button {
    display: inline-block !important;
    position: static !important;
    width: auto !important;
    min-width: 0 !important;
    max-width: none !important;
    height: auto !important;
    min-height: 0 !important;
    margin: 0 auto !important;
    padding: 0 !important;
    border: 0 !important;
    border-width: 0 !important;
    border-style: none !important;
    border-radius: 0 !important;
    background: transparent !important;
    background-image: none !important;
    box-shadow: none !important;
    outline: none !important;
    text-decoration: none !important;
    transform: none !important;
    color: #e85d04 !important;
    font: inherit !important;
    font-size: 15px !important;
    font-weight: 600 !important;
    line-height: 1.4 !important;
    letter-spacing: .08em !important;
    text-transform: uppercase !important;
    cursor: pointer !important;
    appearance: none !important;
    -webkit-appearance: none !important;
}
.icpd-dynamic-card-primary .icpd-inline-play-button:hover,
.icpd-dynamic-card-primary .icpd-inline-play-button:focus,
.icpd-dynamic-card-primary .icpd-inline-play-button:focus-visible,
.icpd-dynamic-card-primary .icpd-inline-play-button:active,
.icpd-three-cards .icpd-inline-play-button:hover,
.icpd-three-cards .icpd-inline-play-button:focus,
.icpd-three-cards .icpd-inline-play-button:focus-visible,
.icpd-three-cards .icpd-inline-play-button:active {
    background: transparent !important;
    background-image: none !important;
    box-shadow: none !important;
    border: 0 !important;
    border-radius: 0 !important;
    outline: none !important;
    transform: none !important;
    color: #c94f00 !important;
    text-decoration: none !important;
}
.icpd-dynamic-card-primary .icpd-inline-play-button::before,
.icpd-dynamic-card-primary .icpd-inline-play-button::after,
.icpd-three-cards .icpd-inline-play-button::before,
.icpd-three-cards .icpd-inline-play-button::after {
    content: none !important;
    display: none !important;
    width: 0 !important;
    height: 0 !important;
    background: none !important;
    border: 0 !important;
    box-shadow: none !important;
}
.icpd-dynamic-card-primary .icpd-series-thumbnail-link .icpd-inline-play-icon,
.icpd-three-cards .icpd-series-thumbnail-link .icpd-inline-play-icon {
    display: none !important;
    visibility: hidden !important;
    opacity: 0 !important;
    width: 0 !important;
    height: 0 !important;
    pointer-events: none !important;
}


/* ======================================================================
   3.3.48 — AJUSTE DE TAMAÑO DE LA IMAGEN PROTAGONISTA
   Mantiene la imagen completa, pero reduce su escala en escritorio para
   evitar que domine demasiado la pantalla. No modifica la estructura móvil.
   ====================================================================== */
@media (min-width: 992px) {
    .icpd-dynamic-card-primary .icpd-series-thumbnail-link {
        width: min(1100px, 100%) !important;
        margin-left: auto !important;
        margin-right: auto !important;
    }

    .icpd-dynamic-card-primary .icpd-series-thumbnail-img {
        width: 100% !important;
        height: auto !important;
        object-fit: contain !important;
    }
}


/* ======================================================================
   3.3.49 — TAMAÑO DEFINITIVO DE LA IMAGEN PROTAGONISTA
   La imagen principal queda en un tamaño visual equilibrado en escritorio:
   960px de ancho máximo, centrada y completa. En móvil conserva 100%.
   No altera la lógica dinámica ni el layout móvil.
   ====================================================================== */
@media (min-width: 992px) {
    .icpd-dynamic-content-grid .icpd-dynamic-card-primary > .icpd-series-module > .icpd-series-thumbnail-link {
        width: 960px !important;
        max-width: calc(100% - 80px) !important;
        margin-top: 18px !important;
        margin-left: auto !important;
        margin-right: auto !important;
        aspect-ratio: auto !important;
        height: auto !important;
        overflow: hidden !important;
        margin-bottom: 4px !important;
    }

    .icpd-dynamic-content-grid .icpd-dynamic-card-primary > .icpd-series-module > .icpd-series-thumbnail-link .icpd-series-thumbnail-img {
        display: block !important;
        width: 100% !important;
        height: auto !important;
        max-width: 100% !important;
        object-fit: contain !important;
        object-position: center center !important;
    }
}

@media (max-width: 991px) {
    .icpd-dynamic-content-grid .icpd-dynamic-card-primary > .icpd-series-module > .icpd-series-thumbnail-link {
        width: 100% !important;
        max-width: 100% !important;
        aspect-ratio: auto !important;
        height: auto !important;
    }
}


/* ======================================================================
   3.3.50 — AJUSTE FINO: SEPARACIÓN SUPERIOR DE LA PROTAGONISTA
   Evita que la miniatura protagonista quede pegada al borde superior de la tarjeta.
   Solo escritorio; no altera el comportamiento móvil.
   ====================================================================== */
@media (min-width: 992px) {
    .icpd-dynamic-content-grid .icpd-dynamic-card-primary > .icpd-series-module > .icpd-series-thumbnail-link {
        margin-top: 18px !important;
    }
}

/* ======================================================================
   3.3.66 — LIVE RESPONSIVE DEFINITIVO
   PC, tablet, Android y iPhone.
   Evita que el chat ocupe una altura excesiva en pantallas pequeñas.
   Mantiene video 16:9 y adapta el chat por tipo de dispositivo.
   ====================================================================== */
.icpd-three-cards .icpd-series-live-card,
.icpd-three-cards .icpd-series-live-card .icpd-live-module,
.icpd-three-cards .icpd-series-live-card .icpd-live-chat {
    box-sizing: border-box !important;
    min-width: 0 !important;
}

.icpd-three-cards .icpd-series-live-card .icpd-live-module {
    width: 100% !important;
}

.icpd-three-cards .icpd-series-live-card .icpd-live-chat {
    margin: 0 !important;
    padding: 0 !important;
    overflow: hidden !important;
}

.icpd-three-cards .icpd-series-live-card .icpd-live-chat iframe {
    display: block !important;
    width: 100% !important;
    border: 0 !important;
    max-width: 100% !important;
    margin: 0 !important;
}

/* PC: video + chat lado a lado */
@media (min-width: 1200px) {
    .icpd-three-cards .icpd-series-live-card {
        padding: 0 !important;
    }

    .icpd-three-cards .icpd-series-live-card .icpd-live-module {
        grid-template-columns: minmax(0, 2fr) minmax(320px, 1fr) !important;
        gap: 0 !important;
        align-items: stretch !important;
    }

    .icpd-three-cards .icpd-series-live-card .icpd-live-chat {
        border-left: 1px solid #e5e5e5 !important;
        border-top: 0 !important;
        height: 100% !important;
    }

    .icpd-three-cards .icpd-series-live-card .icpd-live-chat iframe {
        height: 100% !important;
        min-height: 0 !important;
        max-height: none !important;
    }
}

/* Tablet: video arriba, chat abajo */
@media (min-width: 768px) and (max-width: 1199px) {
    .icpd-three-cards .icpd-series-live-card {
        padding: 0 0 20px !important;
    }

    .icpd-three-cards .icpd-series-live-card .icpd-live-module {
        grid-template-columns: 1fr !important;
        gap: 18px !important;
    }

    .icpd-three-cards .icpd-series-live-card .icpd-live-chat {
        border-left: 0 !important;
        border-top: 1px solid #e5e5e5 !important;
    }

    .icpd-three-cards .icpd-series-live-card .icpd-live-chat iframe {
        height: 480px !important;
        min-height: 480px !important;
        max-height: 480px !important;
    }
}

/* Teléfonos: caja contenida para que iOS/Android no alargue la página */
@media (max-width: 767px) {
    .icpd-three-cards .icpd-series-live-card {
        padding: 0 0 18px !important;
    }

    .icpd-three-cards .icpd-series-live-card .icpd-live-module {
        grid-template-columns: 1fr !important;
        gap: 16px !important;
    }

    .icpd-three-cards .icpd-series-live-card .icpd-live-chat {
        border-left: 0 !important;
        border-top: 1px solid #e5e5e5 !important;
        height: 400px !important;
        max-height: 400px !important;
    }

    .icpd-three-cards .icpd-series-live-card .icpd-live-chat iframe {
        height: 400px !important;
        min-height: 0 !important;
        max-height: 400px !important;
    }
}

/* Teléfonos pequeños / iPhone compacto */
@media (max-width: 480px) {
    .icpd-three-cards .icpd-series-live-card .icpd-live-chat {
        height: 360px !important;
        max-height: 360px !important;
    }

    .icpd-three-cards .icpd-series-live-card .icpd-live-chat iframe {
        height: 360px !important;
        min-height: 0 !important;
        max-height: 360px !important;
    }
}

/* ======================================================================
   3.3.67 — CHAT LIVE RESPONSIVE DEFINITIVO
   Regla final: evita que el iframe de YouTube se alargue en iPhone/iPad/
   Android y mantiene una altura controlada en todos los dispositivos.
   ====================================================================== */
.icpd-live-chat {
    width: 100% !important;
    max-width: 100% !important;
    overflow: hidden !important;
    box-sizing: border-box !important;
}

.icpd-live-chat iframe {
    display: block !important;
    width: 100% !important;
    border: 0 !important;
    margin: 0 !important;
    box-sizing: border-box !important;
    height: 560px !important;
    min-height: 560px !important;
    max-height: 560px !important;
}

/* Tablet */
@media (min-width: 768px) and (max-width: 1199px) {
    .icpd-live-chat {
        height: 420px !important;
        max-height: 420px !important;
    }

    .icpd-live-chat iframe {
        height: 420px !important;
        min-height: 420px !important;
        max-height: 420px !important;
    }
}

/* Teléfonos */
@media (max-width: 767px) {
    .icpd-live-chat {
        height: 320px !important;
        max-height: 320px !important;
    }

    .icpd-live-chat iframe {
        height: 320px !important;
        min-height: 320px !important;
        max-height: 320px !important;
    }
}

/* iPhone compacto */
@media (max-width: 480px) {
    .icpd-live-chat {
        height: 300px !important;
        max-height: 300px !important;
    }

    .icpd-live-chat iframe {
        height: 300px !important;
        min-height: 300px !important;
        max-height: 300px !important;
    }
}

/* Cuando el chat está dentro del módulo destacado o del shortcode,
   las mismas reglas deben ganar también sobre sus contenedores padres. */
.icpd-featured-chat .icpd-live-chat,
.icpd-live-wrapper .icpd-live-chat,
.icpd-series-live-card .icpd-live-chat {
    box-sizing: border-box !important;
    overflow: hidden !important;
}