/* Custom backdrop for applying the blur */
    .custom-backdrop {
        position: fixed;
        top: 0;
        left: 0;
        width: 100%;
        height: 100%;
        background: rgba(0, 0, 0, 0.5);
        backdrop-filter: blur(15px); /* Aplica um efeito de desfoque */
        z-index: 1039; /* Logo abaixo do modal */
        display: none; /* Inicialmente oculto */
    }

    .modal-dialog {
        max-width: 65%;
        margin: auto;
        z-index: 1040; /* Certifique-se de que o modal está acima do backdrop */
        display: flex;
        align-items: center;
        justify-content: center;
        height: 100vh; /* Certifique-se de que o modal ocupa toda a altura da viewport */
    }

    .modal-content {
        max-height: 90vh; /* Garante que o conteúdo não transborde da tela */
        position: relative;
    }

    .modal.show .custom-backdrop {
        display: block;
    }

    .btn-close {
        background-color: white;
        border: none;
        font-size: 0.6rem;
        font-weight: bold;
        opacity: 1; /* Opacidade forte por padrão */
        border-radius: 14px; /* Cantos suavemente arredondados */
        width: 10px;
        height: 10px;
        display: flex;
        align-items: center;
        justify-content: center;
        margin: 15px;
        z-index: 1053; /* Certifique-se de que o botão de fechar está acima de todos os outros elementos */
        cursor: pointer;
    }

    .btn-close:hover {
        opacity: 0.8; /* Opacidade ligeiramente reduzida ao passar o mouse */
    }

    .video-overlay {
        position: absolute;
        top: 0;
        left: 0;
        width: 100%;
        height: 100%;
        display: flex;
        align-items: center;
        justify-content: center;
        background-color: rgba(0, 0, 0, 0.5); /* Fundo semi-transparente para destacar o botão */
        z-index: 1051; /* Certifique-se de que está acima do iframe */
        cursor: pointer;
    }

    .custom-play-btn {
        width: 70px;
        height: 70px;
        background-color: #fff;
        border-radius: 50%; /* Botão arredondado */
        border: none;
        display: flex;
        align-items: center;
        justify-content: center;
        cursor: pointer;
        position: relative;
        z-index: 1052; /* Certifique-se de que o botão de play está acima de outros elementos */
        background-image: url('../img/play-circle.svg');
        background-repeat: no-repeat;
        background-position: center;
        background-size: 100%; /* Ajuste o tamanho do ícone conforme necessário */
        transition: transform 0.3s ease, background-color 0.3s ease; /* Transição suave para hover */
    }

    .custom-play-btn:hover {
        transform: scale(1.1); /* Aumenta o botão ligeiramente no hover */
        background-color: #e0e0e0; /* Escurece ligeiramente o botão no hover */
    }

    .video-overlay.hidden {
        display: none;
    }

    .ratio.ratio-16x9 iframe {
        z-index: 1050; /* Certifique-se de que o iframe está abaixo dos botões */
    }