/* ============================================================
   consent.css — banner de cookies (o markup é gerado por assets/boot.js).
   Não bloqueia a página: enquanto ele está aberto, o boot.js dá ao body um
   padding-bottom da altura do banner, para rolar além dele.
   z-index 150: acima do cabeçalho (60) e abaixo do modal de contato (200). Aceitar, Recusar e Configurar têm o MESMO
   peso visual: nenhum caminho é empurrado.
   ============================================================ */
.cookie-banner {
  position: fixed; left: 16px; right: 16px; bottom: 16px; z-index: 150;
  max-width: 760px; margin: 0 auto;
  max-height: calc(100vh - 32px); overflow-y: auto; overscroll-behavior: contain;
  background: var(--surface, #FFFFFF); color: var(--tx-1, #17211E);
  border: 1px solid var(--border-mid, #BAC7C4); border-radius: var(--r4, 14px);
  box-shadow: var(--sh-pop, 0 8px 40px rgba(30, 50, 45, 0.16), 0 2px 8px rgba(30, 50, 45, 0.10));
  padding: 18px 20px;
  font-family: var(--f-body, 'Inter', system-ui, sans-serif);
}
.cookie-banner[hidden] { display: none; }
.cookie-banner:focus { outline: none; }
.cookie-banner:focus-visible { outline: 2px solid var(--verde-dk, #246B55); outline-offset: 2px; }

.cookie-texto {
  margin: 0; font-size: 14px; line-height: 1.55; color: var(--tx-2, #45524E); max-width: 72ch;
}
.cookie-texto a { color: var(--verde-dk, #246B55); font-weight: 700; text-decoration: underline; text-underline-offset: 2px; }

/* chaves de Configurar */
.cookie-opcoes { display: grid; gap: 4px; margin-top: 12px; }
.cookie-opcoes[hidden] { display: none; }
.cookie-chave {
  position: relative; display: flex; align-items: center; gap: 12px; min-height: 44px;
  font-size: 14px; font-weight: 600; color: var(--tx-1, #17211E); cursor: pointer;
}
.cookie-chave input {
  position: absolute; left: 0; top: 50%; width: 44px; height: 26px; margin: -13px 0 0;
  opacity: 0; cursor: pointer;
}
.cookie-chave-trilho {
  position: relative; flex: 0 0 auto; width: 44px; height: 26px; border-radius: 999px;
  background: var(--surface-3, #D8E0DF); border: 1px solid var(--border-mid, #BAC7C4);
  transition: background-color var(--tf, 150ms) var(--ease, ease), border-color var(--tf, 150ms) var(--ease, ease);
}
.cookie-chave-trilho::after {
  content: ''; position: absolute; top: 2px; left: 2px; width: 20px; height: 20px; border-radius: 50%;
  background: #FFFFFF; box-shadow: 0 1px 3px rgba(30, 50, 45, 0.30);
  transition: transform var(--tf, 150ms) var(--ease, ease);
}
.cookie-chave input:checked + .cookie-chave-trilho { background: var(--verde-dk, #246B55); border-color: var(--verde-dk, #246B55); }
.cookie-chave input:checked + .cookie-chave-trilho::after { transform: translateX(18px); }
.cookie-chave input:focus-visible + .cookie-chave-trilho { outline: 2px solid var(--verde-dk, #246B55); outline-offset: 2px; }

/* botões — todos iguais */
.cookie-acoes { display: flex; flex-wrap: wrap; gap: 10px; margin-top: 14px; }
.cookie-btn {
  flex: 1 1 auto; min-width: 0; min-height: 44px; padding: 10px 18px;
  border-radius: var(--rpill, 999px); border: 1px solid var(--verde-dk, #246B55);
  background: var(--surface, #FFFFFF); color: var(--verde-dk, #246B55);
  font: 700 15px/1.2 var(--f-body, 'Inter', system-ui, sans-serif); cursor: pointer;
  transition: background-color var(--tf, 150ms) var(--ease, ease);
}
.cookie-btn:hover { background: var(--surface-hover, #EAF1EE); }
.cookie-btn:focus-visible { outline: 2px solid var(--verde-dk, #246B55); outline-offset: 2px; }
.cookie-btn[hidden] { display: none; }

@media (max-width: 480px) {
  .cookie-banner { left: 8px; right: 8px; bottom: 8px; max-height: calc(100vh - 16px); padding: 14px 14px 12px; }
  .cookie-texto { font-size: 13.5px; }
  .cookie-acoes { gap: 8px; margin-top: 12px; }
  .cookie-btn { padding: 10px 12px; font-size: 14px; }
}

@media (prefers-reduced-motion: reduce) {
  .cookie-chave-trilho, .cookie-chave-trilho::after, .cookie-btn { transition: none; }
}

@media print { .cookie-banner { display: none !important; } body { padding-bottom: 0 !important; } }