/* ============================================
   Banner de consentimento de cookies
   Autossuficiente de propósito: as duas páginas do site usam sistemas
   de design diferentes, então aqui não se depende de nenhum token.
   ============================================ */

.consent-banner {
    position: fixed;
    left: 12px;
    right: 12px;
    bottom: 12px;
    z-index: 1200;
    box-sizing: border-box;
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: space-between;
    gap: 16px;
    max-width: 880px;
    margin-inline: auto;
    padding: 18px;
    border: 1px solid rgba(255, 255, 255, 0.16);
    border-radius: 16px;
    background: rgba(8, 13, 10, 0.96);
    backdrop-filter: blur(18px);
    -webkit-backdrop-filter: blur(18px);
    box-shadow: 0 20px 50px rgba(0, 0, 0, 0.55);
    font-family: inherit;
    transform: translate3d(0, 150%, 0);
    transition: transform 0.6s cubic-bezier(0.22, 1, 0.36, 1);
}

.consent-banner.is-visible { transform: none; }

/* enquanto o aviso está na tela, o botão flutuante sobe para não cobrir
   o "Aceitar" no celular */
.has-consent-banner .whatsapp-float {
    transform: translateY(-96px);
    transition: transform 0.4s cubic-bezier(0.22, 1, 0.36, 1);
}

@media (min-width: 621px) {
    .has-consent-banner .whatsapp-float { transform: none; }
}

.consent-banner p {
    flex: 1 1 300px;
    min-width: 0;
    margin: 0;
    font-size: 0.78rem;
    line-height: 1.6;
    color: #a8b5ae;
}

.consent-banner a {
    color: #00ff88;
    text-decoration: underline;
    text-underline-offset: 2px;
}

.consent-actions {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
}

/* botões próprios: não herdam .btn porque cada página tem o seu */
.consent-actions button {
    padding: 10px 20px;
    border: 1px solid transparent;
    border-radius: 999px;
    font-family: inherit;
    font-size: 0.8rem;
    font-weight: 600;
    line-height: 1.2;
    cursor: pointer;
    transition: transform 0.2s ease, background-color 0.2s ease, border-color 0.2s ease;
}

.consent-allow {
    background: linear-gradient(135deg, #00ff88, #00cc6a);
    color: #04140c;
}

.consent-allow:hover { transform: translateY(-1px); }

.consent-deny {
    background: transparent;
    border-color: rgba(255, 255, 255, 0.2);
    color: #d5ded8;
}

.consent-deny:hover {
    border-color: rgba(255, 255, 255, 0.4);
    color: #fff;
}

.consent-banner button:focus-visible {
    outline: 2px solid #00ff88;
    outline-offset: 3px;
}

@media (max-width: 620px) {
    .consent-banner { padding: 16px; }
    .consent-actions { width: 100%; }
    .consent-actions button { flex: 1; }
}

@media (prefers-reduced-motion: reduce) {
    .consent-banner { transition: none; }
}
