/* =========================
   CATÁLOGO DE FLIPBOOKS
========================= */

.cpad-flipbook-wrapper{
    width:100%;
}

.cpad-flipbook-grid{
    display:grid;
}

.cpad-flipbook-row{
    display:flex;
    flex-direction:row;
    flex-wrap:wrap;
}

.cpad-flipbook-column{
    display:flex;
    flex-direction:column;
}

.cpad-flipbook-card{
    background:#ffffff;
    overflow:hidden;
    cursor:pointer;
    transition:all .25s ease;
}

.cpad-flipbook-card:hover{
    transform:translateY(-4px);
}

.cpad-flipbook-thumb{
    width:100%;
    display:block;
    object-fit:cover;
}

.cpad-flipbook-title{
    padding:12px;
    text-align:center;
    font-size:14px;
    font-weight:500;
    color:#333;
}

/* =========================
   MODAL
========================= */

.cpad-flipbook-modal{
    display:none;
    position:fixed;
    inset:0;
    z-index:99999;
}

.cpad-flipbook-modal-inner{
    width:100vw;
    height:100vh;
    display:flex;
    justify-content:center;
    align-items:center;
    position:relative;
    overflow:hidden;
}

/* =========================
   BOTÃO FECHAR
========================= */

.cpad-close-btn{
    position:absolute;
    top:20px;
    right:20px;
    width:46px;
    height:46px;
    border:none;
    border-radius:50%;
    background:#ffffff;
    color:#222;
    font-size:20px;
    cursor:pointer;
    z-index:1000;
    box-shadow:0 4px 12px rgba(0,0,0,.18);
    transition:all .25s ease;
}

.cpad-close-btn:hover{
    transform:scale(1.05);
}

/* =========================
   ÁREA DO LIVRO
========================= */

.cpad-book-container{
    width:80vw;
    height:80vh;
    display:flex;
    justify-content:center;
    align-items:center;
    transition:transform .25s ease;
}

/* =========================
   TOOLBAR
========================= */

.cpad-toolbar{
    position:absolute;
    bottom:20px;
    left:50%;
    transform:translateX(-50%);
    display:flex;
    align-items:center;
    gap:10px;
    z-index:1000;
}

.cpad-toolbar button{
    width:44px;
    height:44px;
    border:none;
    border-radius:50%;
    background:#ffffff;
    color:#222;
    font-size:18px;
    cursor:pointer;
    box-shadow:0 4px 12px rgba(0,0,0,.18);
    transition:all .25s ease;
}

.cpad-toolbar button:hover{
    transform:scale(1.08);
}

/* =========================
   FULLSCREEN
========================= */

.cpad-flipbook-modal:fullscreen{
    width:100vw;
    height:100vh;
}

/* =========================
   RESPONSIVO
========================= */

@media (max-width:1024px){

    .cpad-book-container{
        width:90vw;
        height:75vh;
    }

    .cpad-toolbar{
        bottom:15px;
    }

    .cpad-toolbar button{
        width:40px;
        height:40px;
        font-size:16px;
    }
}

@media (max-width:767px){

    .cpad-book-container{
        width:95vw;
        height:70vh;
    }

    .cpad-close-btn{
        width:40px;
        height:40px;
        font-size:16px;
        top:12px;
        right:12px;
    }

    .cpad-toolbar{
        gap:8px;
        bottom:10px;
    }

    .cpad-toolbar button{
        width:36px;
        height:36px;
        font-size:15px;
    }

    .cpad-flipbook-title{
        font-size:13px;
        padding:10px;
    }
}