.video-container {
    position: relative;
    display: inline-block;
    height: 100%;

    .custom-video {
        width: 100%;
        height: 100%;
        display: block;
    }

    .play-button {
        position: absolute;
        top: 50%;
        left: 50%;
        transform: translate(-50%, -50%);
        font-size: 4rem;
        color: white;
        background: rgba(0, 0, 0, 0.5);
        border: none;
        border-radius: 50%;
        width: 80px;
        height: 80px;
        cursor: pointer;
        display: none;
        padding-right: 0;
    }
}

/* Trick CSS : Firefox gère déjà le bouton natif → on masque */
@-moz-document url-prefix() {
    .play-button {
        display: none !important;
    }
}

.device-desktop .playplay-video {
    height: 100%;
    width: 100%;
}

.two-columns-playplay {
    position: relative;
    width: 100%;
    display: flex;
    justify-content: center;
    align-items: center;

    .playplay-video {
        height: 100%;
        width: auto;
        aspect-ratio: 1/1;
        position: relative;

        iframe {
            width: 100%;
            height: 100%;
            border: 0;
            object-fit: cover;
        }
    }
}

.page-banner-youtube {
    display: flex;
    justify-content: center;
    align-items: center;

    .playplay-video {
        aspect-ratio: 1 / 1;
        position: relative;
        height: 100%;
        width: auto;

        iframe {
            width: 100%;
            height: 100%;
            border: 0;
            object-fit: cover;
        }
    }
}