/* CM26_MODAL_PROPORCION_V1
   Reproductor sobre el encabezado y botones proporcionados. */

/* MODAL: por encima de la barra superior y del selector de idiomas. */

body.cm26-v2 #promoVideo.modal {
    z-index: 4110 !important;
}

body.cm26-v2:has(#promoVideo.show) .modal-backdrop {
    z-index: 4100 !important;
}

/* El modal se trasladará al body mediante JavaScript,
   evitando que el slider limite su superposición. */


/* BOTONES DEL HERO: mismas alturas y alineación. */

@media (min-width: 768px) {

    body.cm26-v2
    #cm-premium-hero .cm-button {
        box-sizing: border-box !important;

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

        width: auto !important;
        height: 58px !important;
        min-height: 58px !important;

        padding: 0 27px !important;
        line-height: 1.2 !important;
        white-space: nowrap !important;
    }

    body.cm26-v2
    #cm-premium-hero .cm26-learn-wrapper {
        display: inline-flex !important;
        align-items: center !important;

        margin: 0 !important;
        padding: 0 !important;
        vertical-align: middle !important;
    }

    body.cm26-v2
    #cm-premium-hero .cm26-learn-original {
        box-sizing: border-box !important;

        display: inline-flex !important;
        align-items: center !important;
        justify-content: flex-start !important;

        height: 58px !important;
        min-height: 58px !important;

        padding: 0 !important;
        margin: 0 !important;

        line-height: 1.2 !important;
        white-space: nowrap !important;
    }

    /* Mantener intacta la geometría original del play. */

    body.cm26-v2
    #cm-premium-hero .cm26-learn-original > i {
        flex-shrink: 0 !important;
    }
}

/* En celulares se conserva la disposición adaptable actual. */


/* CM26_MARCO_VIDEO_UNIFORME_V2
   Recuperar el marco uniforme del reproductor original. */

/* El contenedor no necesita espacio para una cabecera. */

body.cm26-v2 #promoVideo .modal-content {
    position: relative !important;
    padding: 0 !important;
    overflow: hidden !important;
}

/* Marco oscuro uniforme de 10 px alrededor del video. */

body.cm26-v2 #promoVideo .modal-content > .modal-body {
    padding: 10px !important;
    margin: 0 !important;
}

/* La X queda superpuesta, sin aumentar la altura superior. */

body.cm26-v2 #promoVideo .modal-content > .text-end.p-2 {
    position: absolute !important;

    top: 15px !important;
    right: 15px !important;

    width: 34px !important;
    height: 34px !important;

    display: flex !important;
    align-items: center !important;
    justify-content: center !important;

    padding: 0 !important;
    margin: 0 !important;

    border-radius: 50% !important;
    background: rgba(26, 31, 37, .78) !important;

    z-index: 5 !important;
}

/* Conservar visible el botón de cierre. */

body.cm26-v2
#promoVideo .modal-content > .text-end.p-2 .btn-close {
    position: static !important;
    margin: 0 !important;
    opacity: 1 !important;
}

/* No se alteran las dimensiones del video. */


/* CM26_MODAL_APERTURA_UNICA_V2
   Apertura inmediata y superposición uniforme. */

/* El fondo oscuro tiene prioridad desde el primer instante,
   sin esperar a que el reproductor tenga la clase show. */

body.cm26-v2 > .modal-backdrop {
    z-index: 4490 !important;
    transition: none !important;
    animation: none !important;
}

/* El reproductor queda sobre el fondo y el encabezado. */

body.cm26-v2 #promoVideo.modal {
    z-index: 4500 !important;
    transition: none !important;
    animation: none !important;
}

/* Evitar el desplazamiento y la aparición gradual del cuadro. */

body.cm26-v2 #promoVideo .modal-dialog {
    transform: none !important;
    transition: none !important;
    animation: none !important;
}

/* Conservar el marco uniforme y la X ya corregidos. */