/*
handler: ndmais-post-continue-lendo
version: 1.0.2
*/

/* Bloqueia o container principal */
.site-bloqueado {
    position: relative;
    overflow: hidden;
    transition: max-height 0.6s ease;
}

#overlay-bloqueio-leitura {
    display: none;
}

/* Container do gradiente + botões */
#overlay-bloqueio-leitura.overlay-bloqueio {
    position: absolute;
    bottom: 0;
    left: 0;
    right: 0;
    width: 100%;
    z-index: 100;
    pointer-events: none;
    display: block;

    /* Gradiente suave */
    background: linear-gradient(to bottom,
        rgba(255, 255, 255, 0) 0%,
        rgba(255, 255, 255, 0.5) 10%,
        rgba(255, 255, 255, 1) 40%
    );
}

/* Animação de saída */
#overlay-bloqueio-leitura.overlay-bloqueio.removendo {
    opacity: 0;
    transition: opacity 0.5s ease;
}

/* Área dos botões */
#overlay-bloqueio-leitura .overlay-botoes {
    padding: 40px 20px;
    text-align: center;
    pointer-events: auto;
}

/* Botão Continue Lendo */
#overlay-bloqueio-leitura .btn-continue {
    display: inline-block;
    background: linear-gradient(110.75deg, #22CAF7 10.88%, #9B36F7 108.78%);
    background-size: 200% 200%;
    background-position: left center;
    color: #ffffff;
    font-size: 15px;
    font-weight: 500;
    padding: 13px 65px;
    border-radius: 4px;
    text-decoration: none;
    border: none;
    cursor: pointer;
    box-shadow: 0 4px 15px rgba(0, 115, 170, 0.3);
    transition: .3s;
    margin-bottom: 12px;
}

#overlay-bloqueio-leitura .btn-continue:hover {
    background-position: right center;
    box-shadow: 0 6px 20px rgba(0, 115, 170, 0.4);
}

/* Botão Voltar */
#overlay-bloqueio-leitura .btn-home {
    display: flex;
    width: fit-content;
    color: #5D7886;
    font-size: 15px;
    font-weight: 500;
    padding: 16px 40px;
    border-radius: 4px;
    text-decoration: none;
    margin-top: 15px;
    transition: color 0.3s ease;
    background: var(--gray-light);
    margin: auto;
    height: 48px;
    place-items: center;
}

#overlay-bloqueio-leitura .btn-home:hover {
    color: #fff;
    background-color: var(--gray);
    text-decoration: none;
}