/* =====================================================
   AVISO DE COOKIES — montado pelo cookies-v1.js em todas as páginas.
   Arquivo próprio, carregado depois do CSS principal. Segue o tema claro/escuro
   pelos tokens e reaproveita .btn e .btn-outline.
   No computador é um cartão no canto de baixo, à esquerda (o WhatsApp fica à
   direita). No celular vira uma faixa no pé da tela: o botão do WhatsApp sobe
   e a página ganha espaço no fim, pela altura que o JS mede (--cookies-altura).
   ===================================================== */

.cookies-aviso{
  position:fixed;left:24px;bottom:24px;z-index:90;
  width:min(430px, calc(100vw - 48px));box-sizing:border-box;
  display:flex;flex-direction:column;gap:14px;
  padding:20px 22px;
  background:var(--surface);color:var(--text);
  border:1px solid var(--line-strong);border-radius:var(--radius-l);
  box-shadow:var(--shadow-2);
  font-family:var(--font-body);
  animation:cookiesSobe .4s cubic-bezier(.22,.8,.3,1);
}
.cookies-aviso[hidden]{display:none;}
.cookies-aviso:focus{outline:none;}
.cookies-aviso:focus-visible{outline:3px solid var(--panel);outline-offset:3px;}

.cookies-aviso-texto p{margin:0;font-size:14px;line-height:1.55;color:var(--text);}
.cookies-aviso-texto strong{color:var(--house);font-weight:700;}
.cookies-aviso-texto a{color:var(--house);font-weight:700;border-bottom:2px solid var(--sun);white-space:nowrap;}
.cookies-aviso-texto .cookies-aviso-estado{margin-top:8px;font-size:13px;font-weight:600;color:var(--text-soft);}

/* Os dois botões têm o mesmo tamanho e o mesmo estilo: recusar é tão fácil quanto aceitar. */
.cookies-aviso-acoes{display:flex;gap:10px;}
/* background: o .btn-outline nasceu para <a>; num <button> sobraria o cinza padrão do navegador. */
.cookies-aviso-acoes .btn{flex:1 1 0;min-height:44px;padding:0 16px;font-size:14.5px;background:transparent;}
.cookies-aviso-acoes .btn:hover{background:var(--surface-2);}

@keyframes cookiesSobe{from{opacity:0;transform:translateY(18px);}to{opacity:1;transform:none;}}

/* O "Saiba mais" do aviso leva a privacidade.html#cookies: sem isto o cabeçalho fixo cobre o título */
#cookies{scroll-margin-top:124px;}

@media (max-width:640px){
  .cookies-aviso{
    left:0;right:0;bottom:0;width:auto;gap:12px;
    padding:16px 16px calc(16px + env(safe-area-inset-bottom, 0px));
    border-width:1px 0 0;border-radius:var(--radius-l) var(--radius-l) 0 0;
  }
  .cookies-aviso-texto p{font-size:13.5px;line-height:1.5;}
  /* A faixa ocupa o pé da tela: o WhatsApp sobe e o fim do rodapé não fica escondido atrás dela */
  .cookies-aviso-aberto .whatsapp-float{bottom:calc(var(--cookies-altura, 170px) + 14px);}
  .cookies-aviso-aberto body{padding-bottom:var(--cookies-altura, 170px);}
}

/* O link "Cookies" fica no fim da última linha do rodapé, bem onde o botão do
   WhatsApp flutua no celular. A linha encolhe para o link não ficar embaixo dele
   (o Trabalhe conosco não tem o botão e fica como está). */
@media (max-width:640px){
  .site-footer:has(~ .whatsapp-float) .footer-bottom{padding-right:80px;}
}

@media (prefers-reduced-motion: reduce){
  .cookies-aviso{animation:none;}
}
