/*
 * LGPD Custom Banner - v3.2 (CSS com Lógica Anti-Flicker)
 */

/* 1. O Fundo Escurecido (Overlay) */
#lgpd-banner {
    /* ALTERAÇÃO CRUCIAL: O banner agora começa escondido para evitar o "pisca-pisca" em páginas cacheadas. */
    display: none; 
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-color: rgba(0, 0, 0, 0.6);
    z-index: 99999;
    align-items: center;
    justify-content: center;
    padding: 15px;
    box-sizing: border-box;
}

/* 2. A Caixa do Modal Principal */
#lgpd-modal-content {
    background-color: #fff;
    color: #333;
    border-radius: 8px;
    box-shadow: 0 5px 20px rgba(0,0,0,0.2);
    width: 100%;
    max-width: 550px;
    padding: 25px 30px;
    text-align: center;
    position: relative;
    box-sizing: border-box;
}

/* 3. Cabeçalho */
#lgpd-modal-content .modal-header {
    margin-bottom: 15px;
    text-align: center;
    position: relative;
}

#lgpd-modal-content .modal-header h2 {
    margin: 0;
    font-size: 20px;
    color: #111;
    width: 100%;
}

/* 4. Corpo do Texto */
#lgpd-modal-content .modal-body p { margin: 0 0 10px 0; font-size: 14px; line-height: 1.6; }
#lgpd-modal-content .modal-body p:last-child { margin-bottom: 20px; }
#lgpd-modal-content .modal-body strong { font-size: 16px; display: block; margin-bottom: 5px; }

/* 5. Botões de Ação */
#lgpd-modal-content .lgpd-actions { display: flex; justify-content: center; gap: 12px; flex-wrap: wrap; margin-bottom: 20px; }
#lgpd-modal-content .lgpd-actions button { padding: 10px 25px; border-radius: 5px; font-weight: bold; font-size: 15px; cursor: pointer; border: 1px solid transparent; transition: all 0.2s ease-in-out; }
#lgpd-modal-content #lgpd-accept-all { background-color: #094c8c; color: white; border-color: #094c8c; }
#lgpd-modal-content #lgpd-deny-all,
#lgpd-modal-content #lgpd-view-prefs { background-color: #f0f0f0; color: #333; border: 1px solid #ccc; }
#lgpd-modal-content #lgpd-accept-all:hover,
#lgpd-modal-content #lgpd-deny-all:hover,
#lgpd-modal-content #lgpd-view-prefs:hover { background-color: #40d9f1; color: white; border-color: #40d9f1; }

/* 6. Link da Política de Privacidade */
#lgpd-modal-content .privacy-link { font-size: 14px; color: #094c8c; text-decoration: underline; }
#lgpd-modal-content .privacy-link:hover { color: #40d9f1; }

/* --- Estilos para o Modal Secundário (Preferências) --- */
#lgpd-modal-overlay { display: none; position: fixed; top: 0; left: 0; width: 100%; height: 100%; background-color: rgba(0,0,0,0.6); z-index: 100000; display: flex; align-items: center; justify-content: center; }
#lgpd-modal { background-color: #fff; border-radius: 8px; width: 90%; max-width: 500px; box-shadow: 0 5px 20px rgba(0,0,0,0.2); }
#lgpd-modal .modal-header { display: flex; justify-content: space-between; align-items: center; padding: 15px 20px; border-bottom: 1px solid #eee; }
#lgpd-modal .modal-header h3 { margin: 0; font-size: 18px; }
#lgpd-modal .modal-header #lgpd-close-prefs-modal { background: none; border: none; font-size: 28px; font-weight: bold; color: #888; cursor: pointer; line-height: 1; padding: 0; }
#lgpd-modal .modal-header #lgpd-close-prefs-modal:hover { color: #e53935; }
#lgpd-modal .modal-body { padding: 20px; }
#lgpd-modal .modal-body .pref-item { margin-bottom: 15px; }
#lgpd-modal .modal-body .pref-item label { display: flex; align-items: center; gap: 10px; font-size: 16px; cursor: pointer; }
#lgpd-modal .modal-body .pref-item p { font-size: 13px; color: #666; margin: 5px 0 0 28px; }
#lgpd-modal .modal-footer { padding: 15px 20px; text-align: right; border-top: 1px solid #eee; }
#lgpd-modal .modal-footer button { background-color: #094c8c; color: white; padding: 10px 20px; border-radius: 5px; border: none; cursor: pointer; }
#lgpd-modal .modal-footer button:hover { background-color: #40d9f1; }

/* Bloqueio de scroll */
body.lgpd-modal-open { overflow: hidden; }