/* Modal Overlay Structure (Critical) */
.biblia-modal {
    display: none;
    position: fixed;
    z-index: 999999;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    overflow: auto;
    background-color: rgba(0,0,0,0.6);
    backdrop-filter: blur(8px); /* Blur moderno no fundo */
    align-items: center;
    justify-content: center;
    opacity: 0;
    transition: opacity 0.3s ease;
}

.biblia-modal.open {
    display: flex !important;
    opacity: 1;
}

/* Modal Modernization */
.biblia-modal-content {
    background-color: #ffffff;
    margin: auto;
    padding: 30px;
    border: none;
    width: 95%;
    max-width: 550px;
    border-radius: 20px; /* Arredondamento moderno */
    position: relative;
    box-shadow: 0 20px 60px rgba(0,0,0,0.2);
    font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;
}

.biblia-modal-close {
    color: #cbd5e0;
    float: right;
    font-size: 24px;
    font-weight: bold;
    cursor: pointer;
    position: absolute;
    right: 20px;
    top: 20px;
    transition: color 0.2s;
    background: #f7fafc;
    width: 32px;
    height: 32px;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
}

.biblia-modal-close:hover {
    color: #2d3748;
    background: #edf2f7;
}

.biblia-modal-content h3 {
    margin-top: 0;
    margin-bottom: 25px;
    color: #2d3748;
    font-size: 1.25rem;
    font-weight: 700;
    border-bottom: none;
    text-align: center;
}

/* Preview Area Polish */
.biblia-card-preview-container {
    width: 100%;
    display: flex;
    justify-content: center;
    align-items: center;
    margin-bottom: 25px;
    background: #edf2f7; /* Fundo cinza suave */
    padding: 30px 20px;
    border-radius: 16px;
    border: 1px solid #e2e8f0;
    overflow: hidden; /* Evita overflow visual */
}

.biblia-card-preview {
    /* Layout e Tamanho Fixo para Preview (Quadrado Instagram) */
    width: 320px;
    height: 320px;
    min-width: 320px;
    min-height: 320px;
    
    /* Flexbox para Centralização Absoluta */
    display: flex !important; /* Forçar flex */
    flex-direction: column !important;
    justify-content: center !important;
    align-items: center !important;
    text-align: center !important;
    
    /* Espaçamento e Visual */
    padding: 30px !important;
    box-sizing: border-box;
    box-shadow: 0 15px 30px rgba(0,0,0,0.15);
    border-radius: 8px;
    position: relative;
    overflow: hidden;
}

/* Conteúdo do Card */
.biblia-card-content {
    z-index: 10; /* Acima do overlay da imagem */
    width: 100%;
    height: 100%; /* Ocupa toda altura disponível */
    position: relative;
    display: flex;
    flex-direction: column;
    justify-content: center; /* Centraliza verticalmente o bloco de texto */
    align-items: center;
}

.biblia-card-text {
    font-family: 'Georgia', serif;
    font-size: 1.4rem; /* Tamanho base, ajustável via JS */
    line-height: 1.3; /* Mais compacto para caber mais texto */
    margin-bottom: 15px;
    font-style: italic;
    color: #fff;
    width: 100%;
    word-wrap: break-word;
    /* Limite visual para não sobrepor footer */
    max-height: 220px; 
    overflow: hidden;
    display: -webkit-box;
    -webkit-line-clamp: 9; /* Limita número de linhas */
    line-clamp: 9; /* Propriedade padrão */
    -webkit-box-orient: vertical;
}

.biblia-card-reference {
    font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;
    font-size: 0.9rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 1px;
    color: rgba(255,255,255,0.95);
    margin: 0 0 30px 0; /* Espaço para o footer abaixo */
}

.biblia-card-footer {
    font-size: 0.7rem;
    opacity: 0.8;
    color: #fff;
    font-family: sans-serif;
    text-transform: uppercase;
    letter-spacing: 1px;
    
    /* Posicionamento Absoluto no Fundo */
    position: absolute;
    bottom: 0;
    left: 0;
    width: 100%;
    text-align: center;
    margin: 0;
}

/* Modern Range Slider */
input[type=range] {
    -webkit-appearance: none;
    appearance: none;
    width: 100%;
    background: transparent;
}

input[type=range]::-webkit-slider-thumb {
    -webkit-appearance: none;
    height: 20px;
    width: 20px;
    border-radius: 50%;
    background: #3182ce;
    cursor: pointer;
    margin-top: -8px;
    box-shadow: 0 2px 6px rgba(49, 130, 206, 0.4);
}

input[type=range]::-webkit-slider-runnable-track {
    width: 100%;
    height: 4px;
    cursor: pointer;
    background: #e2e8f0;
    border-radius: 2px;
}

input[type=range]:focus {
    outline: none;
}

/* Controls Layout */
.control-group label {
    font-size: 0.9rem;
    text-transform: uppercase;
    letter-spacing: 0.05em;
    color: #718096;
    margin-bottom: 12px;
}

.theme-selector {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(40px, 1fr));
    gap: 12px;
    padding: 5px;
}

.theme-btn {
    width: 40px;
    height: 40px;
    border-radius: 50%; /* Círculos perfeitos */
    border: 2px solid #fff;
    cursor: pointer;
    transition: all 0.2s cubic-bezier(0.4, 0, 0.2, 1);
    box-shadow: 0 2px 5px rgba(0,0,0,0.1);
    position: relative;
}

.theme-btn:hover {
    transform: scale(1.15);
    z-index: 2;
}

.theme-btn.active {
    transform: scale(1.1);
    border-color: #fff;
    box-shadow: 0 0 0 3px #3182ce, 0 4px 6px rgba(0,0,0,0.1); /* Anel de foco azul */
}

/* === NOVOS TEMAS === */

/* Gradientes Modernos */
.theme-gradient-1 { background: linear-gradient(135deg, #667eea 0%, #764ba2 100%); }
.theme-gradient-2 { background: linear-gradient(135deg, #ff9a9e 0%, #fecfef 99%, #fecfef 100%); }
.theme-gradient-3 { background: linear-gradient(135deg, #84fab0 0%, #8fd3f4 100%); }
.theme-gradient-4 { background: linear-gradient(to right, #ff7e5f, #feb47b); }
.theme-gradient-5 { background: linear-gradient(to top, #09203f 0%, #537895 100%); }
.theme-gradient-6 { background: linear-gradient(45deg, #85FFBD 0%, #FFFB7D 100%); } /* Lime Fresh */
.theme-gradient-7 { background: linear-gradient(160deg, #0093E9 0%, #80D0C7 100%); } /* Blue Water */
.theme-gradient-8 { background: linear-gradient(62deg, #8EC5FC 0%, #E0C3FC 100%); } /* Soft Purple */

/* Sólidos e Texturas Sutis */
.theme-solid-1 { background: #2d3436; }
.theme-solid-2 { background: #ffffff; }
.theme-solid-2 .biblia-card-text, 
.theme-solid-2 .biblia-card-reference,
.theme-solid-2 .biblia-card-footer { color: #2d3748; text-shadow: none; }

.theme-solid-3 { background: #fdfbf7; background-image: url("https://www.transparenttextures.com/patterns/cream-paper.png"); } /* Paper Texture */
.theme-solid-3 .biblia-card-text, 
.theme-solid-3 .biblia-card-reference,
.theme-solid-3 .biblia-card-footer { color: #5d4037; text-shadow: none; font-family: 'Georgia', serif; }

.theme-solid-4 { background: #1a1a1a; } /* True Black */

/* Imagens (Unsplash Source) */
/* Overlay comum */
.theme-image-1::before, .theme-image-2::before, .theme-image-3::before, 
.theme-image-4::before, .theme-image-5::before, .theme-image-6::before, 
.theme-image-7::before, .theme-image-8::before {
    content: '';
    position: absolute;
    top: 0; left: 0; right: 0; bottom: 0;
    background: rgba(0,0,0,0.5); /* Escurecimento para contraste */
    z-index: 1;
    border-radius: 4px;
}

.theme-image-1, .theme-image-2, .theme-image-3, .theme-image-4,
.theme-image-5, .theme-image-6, .theme-image-7, .theme-image-8 {
    background-size: cover;
    background-position: center;
    position: relative;
}

/* Forçar texto branco e sombra em temas de imagem para legibilidade */
.theme-image-1 .biblia-card-text, .theme-image-1 .biblia-card-reference, .theme-image-1 .biblia-card-footer,
.theme-image-2 .biblia-card-text, .theme-image-2 .biblia-card-reference, .theme-image-2 .biblia-card-footer,
.theme-image-3 .biblia-card-text, .theme-image-3 .biblia-card-reference, .theme-image-3 .biblia-card-footer,
.theme-image-4 .biblia-card-text, .theme-image-4 .biblia-card-reference, .theme-image-4 .biblia-card-footer,
.theme-image-5 .biblia-card-text, .theme-image-5 .biblia-card-reference, .theme-image-5 .biblia-card-footer,
.theme-image-6 .biblia-card-text, .theme-image-6 .biblia-card-reference, .theme-image-6 .biblia-card-footer,
.theme-image-7 .biblia-card-text, .theme-image-7 .biblia-card-reference, .theme-image-7 .biblia-card-footer,
.theme-image-8 .biblia-card-text, .theme-image-8 .biblia-card-reference, .theme-image-8 .biblia-card-footer {
    color: #ffffff !important;
    text-shadow: 0 2px 4px rgba(0,0,0,0.6);
    z-index: 2;
    position: relative;
}

/* IDs específicos Unsplash de alta qualidade */
.theme-image-1 { background-image: url('https://images.unsplash.com/photo-1504608524841-42fe6f032b4b?auto=format&fit=crop&w=1080&q=80'); } /* Montanhas (Atmospheric) */
.theme-image-2 { background-image: url('https://images.unsplash.com/photo-1519681393784-d120267933ba?auto=format&fit=crop&w=1080&q=80'); } /* Céu (Stars) */
.theme-image-3 { background-image: url('https://images.unsplash.com/photo-1472214103451-9374bd1c798e?auto=format&fit=crop&w=1080&q=80'); } /* Natureza (Green) */
.theme-image-4 { background-image: url('https://images.unsplash.com/photo-1507434965515-61970f2bd7c6?auto=format&fit=crop&w=1080&q=80'); } /* Bíblia (Reading) */
.theme-image-5 { background-image: url('https://images.unsplash.com/photo-1534067783741-5143b3d8de17?auto=format&fit=crop&w=1080&q=80'); } /* Nuvens (Blue Sky) */
.theme-image-6 { background-image: url('https://images.unsplash.com/photo-1465146344425-f00d5f5c8f07?auto=format&fit=crop&w=1080&q=80'); } /* Trigo (Golden) */
.theme-image-7 { background-image: url('https://images.unsplash.com/photo-1470071459604-3b5ec3a7fe05?auto=format&fit=crop&w=1080&q=80'); } /* Água/Neblina (Calm) */
.theme-image-8 { background-image: url('https://images.unsplash.com/photo-1550684848-fac1c5b4e853?auto=format&fit=crop&w=1080&q=80'); } /* Abstrato Escuro */

/* Sharing Buttons Polish */
.share-btn {
    box-shadow: 0 10px 15px -3px rgba(0, 0, 0, 0.1), 0 4px 6px -2px rgba(0, 0, 0, 0.05);
    transition: transform 0.2s, box-shadow 0.2s;
}
.share-btn:hover {
    transform: translateY(-2px);
    box-shadow: 0 20px 25px -5px rgba(0, 0, 0, 0.1), 0 10px 10px -5px rgba(0, 0, 0, 0.04);
}


.action-buttons {
    margin-top: 20px;
    text-align: center;
}

.action-buttons {
    margin-top: 20px;
    display: flex;
    gap: 15px;
    flex-wrap: wrap;
    justify-content: center;
    padding-bottom: 10px;
}

.share-btn {
    width: 50px;
    height: 50px;
    border-radius: 50%;
    border: none;
    color: white;
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    transition: transform 0.2s, opacity 0.2s, box-shadow 0.2s;
    font-size: 24px;
    box-shadow: 0 4px 6px rgba(0,0,0,0.1);
}

.share-btn:hover {
    transform: translateY(-3px);
    opacity: 0.95;
    box-shadow: 0 6px 12px rgba(0,0,0,0.15);
}

.share-btn:disabled {
    opacity: 0.6;
    cursor: not-allowed;
    transform: none;
}

.share-btn .material-icons {
    font-size: 24px;
}

.share-btn.fb { 
    background-color: #1877f2;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='white'%3E%3Cpath d='M22 12c0-5.52-4.48-10-10-10S2 6.48 2 12c0 5.01 3.66 9.15 8.44 9.88v-6.99H7.9v-2.89h2.54V9.8c0-2.51 1.49-3.89 3.77-3.89 1.09 0 2.23.19 2.23.19v2.47h-1.26c-1.24 0-1.63.77-1.63 1.56v1.88h2.78l-.45 2.89h-2.33v6.99C18.34 21.15 22 17.01 22 12z'/%3E%3C/svg%3E");
    background-size: 28px;
    background-position: center;
    background-repeat: no-repeat;
}

.share-btn.wa { 
    background-color: #25d366;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='white'%3E%3Cpath d='M12.04 2c-5.46 0-9.91 4.45-9.91 9.91 0 1.75.46 3.45 1.32 4.95L2.05 22l5.25-1.38c1.45.79 3.08 1.21 4.74 1.21 5.46 0 9.91-4.45 9.91-9.91 0-2.65-1.03-5.14-2.9-7.01A9.816 9.816 0 0 0 12.04 2m.01 16.61c-1.48 0-2.93-.4-4.2-1.15l-.3-.18-3.12.82.83-3.04-.2-.31a8.264 8.264 0 0 1-1.26-4.38c0-4.54 3.7-8.24 8.24-8.24 2.2 0 4.27.86 5.82 2.42a8.183 8.183 0 0 1 2.41 5.83c.02 4.54-3.68 8.23-8.22 8.23m4.52-6.16c-.25-.12-1.47-.72-1.69-.81-.23-.08-.39-.12-.56.12-.17.25-.64.81-.78.97-.14.17-.29.19-.54.06-.25-.12-1.05-.39-1.99-1.23-.74-.66-1.23-1.47-1.38-1.72-.14-.25-.02-.38.11-.51.11-.11.25-.29.37-.43s.17-.25.25-.41c.08-.17.04-.31-.02-.43s-.56-1.34-.76-1.84c-.2-.48-.41-.42-.56-.43h-.48c-.17 0-.43.06-.66.31-.22.25-.86.85-.86 2.07 0 1.22.89 2.4 1.01 2.56.12.17 1.75 2.67 4.23 3.74.59.26 1.05.41 1.41.52.59.19 1.13.16 1.56.1.48-.07 1.47-.6 1.67-1.18.21-.58.21-1.07.14-1.18s-.27-.16-.51-.28z'/%3E%3C/svg%3E");
    background-size: 28px;
    background-position: center;
    background-repeat: no-repeat;
}

.share-btn.tw { 
    background-color: #000000; 
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='white'%3E%3Cpath d='M18.244 2.25h3.308l-7.227 8.26 8.502 11.24H16.17l-5.214-6.817L4.99 21.75H1.68l7.73-8.835L1.254 2.25H8.08l4.713 6.231zm-1.161 17.52h1.833L7.084 4.126H5.117z'/%3E%3C/svg%3E");
    background-size: 22px;
    background-position: center;
    background-repeat: no-repeat;
}

.share-btn.ig { 
    background: radial-gradient(circle at 30% 107%, #fdf497 0%, #fdf497 5%, #fd5949 45%, #d6249f 60%, #285AEB 90%);
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='white' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='2' y='2' width='20' height='20' rx='5' ry='5'%3E%3C/rect%3E%3Cpath d='M16 11.37A4 4 0 1 1 12.63 8 4 4 0 0 1 16 11.37z'%3E%3C/path%3E%3Cline x1='17.5' y1='6.5' x2='17.51' y2='6.5'%3E%3C/line%3E%3C/svg%3E"), radial-gradient(circle at 30% 107%, #fdf497 0%, #fdf497 5%, #fd5949 45%, #d6249f 60%, #285AEB 90%);
    background-size: 26px, auto;
    background-position: center;
    background-repeat: no-repeat, no-repeat;
    background-blend-mode: normal;
}

.share-btn.cp { background-color: #666666; } /* Download/Copy generic */

/* Mobile Adjustments */
@media (max-width: 480px) {
    .biblia-modal-content {
        width: 95%;
        padding: 15px;
    }
    
    .biblia-card-preview {
        width: 260px;
        height: 260px;
    }
    
    .share-btn {
        width: 45px;
        height: 45px;
    }
}