/* ═══════════════════════════════════════════════════════════════════════════
   Aviso de cookies (includes/cookies.php)

   Na linguagem do card do Trabalhe Conosco: fundo azul-ardósia em degradê, luz
   âmbar parada no canto, botão âmbar em pílula e Roboto. Fica no canto inferior
   esquerdo, longe do botão do chat (direita). No celular ocupa a largura toda,
   com os botões um embaixo do outro.

   Só o próprio card se mexe: sobe e aparece uma vez, ao abrir, e desce ao fechar.
   Nada no fundo da página se move.
   ═══════════════════════════════════════════════════════════════════════════ */

.vp-cookies {
  position: fixed; left: 24px; bottom: 24px; z-index: 99990;
  width: min(440px, calc(100% - 48px)); box-sizing: border-box;
  padding: 22px 22px 20px; border-radius: 18px; overflow: hidden;
  background: linear-gradient(165deg, #5d6280 0%, #4c5169 100%);
  border: 1px solid rgba(255, 255, 255, .09);
  box-shadow: 0 28px 60px -24px rgba(38, 42, 66, .75), 0 2px 0 rgba(255, 255, 255, .05) inset;
  color: #fff; font-family: "Roboto", sans-serif; font-size: 15px; line-height: 1.55;
  animation: vp-cookies-entra .35s cubic-bezier(.2, .7, .3, 1) both;
}
.vp-cookies[hidden] { display: none; }
.vp-cookies.vp-cookies--saindo { animation: vp-cookies-sai .22s ease-in both; }

/* luz parada no canto, no laranja da marca (a mesma do card) */
.vp-cookies::before {
  content: ""; position: absolute; right: -80px; top: -80px; width: 220px; height: 220px; border-radius: 50%;
  background: radial-gradient(circle, rgba(254, 183, 53, .22) 0%, rgba(227, 122, 54, .10) 45%, transparent 70%);
  pointer-events: none;
}
.vp-cookies > * { position: relative; }

.vp-cookies__topo { display: flex; align-items: center; gap: 12px; margin-bottom: 10px; }
.vp-cookies__icone {
  flex: none; display: inline-flex; align-items: center; justify-content: center;
  width: 40px; height: 40px; border-radius: 50%;
  background: rgba(254, 183, 53, .16); color: #feb735;
}
.vp-cookies__icone svg { width: 22px; height: 22px; }
.vp-cookies__titulo {
  margin: 0; padding: 0; color: #fff !important;
  font-family: "Roboto", sans-serif; font-size: 18px; font-weight: 700; line-height: 1.3; letter-spacing: .005em;
}
.vp-cookies__texto { margin: 0 0 18px; color: rgba(255, 255, 255, .86); }
.vp-cookies__texto a {
  color: #feb735; font-weight: 600; text-decoration: underline;
  text-decoration-thickness: 1px; text-underline-offset: 3px;
}
.vp-cookies__texto a:hover, .vp-cookies__texto a:focus-visible { color: #ffc95e; }

/* "Sua escolha atual", ao reabrir pelo rodapé */
.vp-cookies__atual {
  display: flex; align-items: center; gap: 8px; margin: -6px 0 16px; padding: 9px 12px; border-radius: 10px;
  background: rgba(255, 255, 255, .07); border: 1px solid rgba(255, 255, 255, .12);
  color: rgba(255, 255, 255, .9); font-size: 14px; line-height: 1.4;
}
.vp-cookies__atual[hidden] { display: none; }
.vp-cookies__atual::before { content: ""; flex: none; width: 8px; height: 8px; border-radius: 50%; background: #7ed996; }
.vp-cookies__atual b { color: #fff; font-weight: 700; }

.vp-cookies__acoes { display: flex; gap: 10px; }
.vp-cookies__btn {
  flex: 1 1 0; min-height: 46px; padding: 0 18px; border-radius: 50px; cursor: pointer;
  font-family: "Roboto", sans-serif; font-size: 15px; font-weight: 700; letter-spacing: .01em; line-height: 1;
  display: inline-flex; align-items: center; justify-content: center; text-transform: none;
  transition: background-color .15s ease, border-color .15s ease, box-shadow .15s ease, transform .1s ease;
}
.vp-cookies__btn--pri {
  border: 0; background-color: #feb735; color: #fff;
  box-shadow: 0 10px 22px -10px rgba(254, 183, 53, .75);
}
.vp-cookies__btn--pri:hover, .vp-cookies__btn--pri:focus { background-color: #e9a324; color: #fff; box-shadow: 0 12px 26px -10px rgba(233, 163, 36, .85); }
.vp-cookies__btn--sec {
  border: 1.5px solid rgba(255, 255, 255, .35); background: transparent; color: #fff;
}
.vp-cookies__btn--sec:hover, .vp-cookies__btn--sec:focus { border-color: #fff; background: rgba(255, 255, 255, .08); color: #fff; }
.vp-cookies__btn:active { transform: translateY(1px); }
.vp-cookies__btn:focus-visible, .vp-cookies__texto a:focus-visible { outline: 2px solid #fff; outline-offset: 3px; }

@media (max-width: 600px) {
  /* o botão do chat (canto direito) cobriria o "Só os essenciais": some só enquanto o aviso está aberto */
  html.vp-cookies-aberto #edconversa-fab { visibility: hidden; }
  .vp-cookies { left: 12px; right: 12px; bottom: 12px; width: auto; padding: 18px 18px 16px; font-size: 14.5px; }
  .vp-cookies__acoes { flex-direction: column-reverse; }   /* o principal fica em cima, perto do polegar */
  .vp-cookies__btn { flex: none; width: 100%; }
}

@keyframes vp-cookies-entra { from { opacity: 0; transform: translateY(16px); } to { opacity: 1; transform: none; } }
@keyframes vp-cookies-sai   { from { opacity: 1; transform: none; } to { opacity: 0; transform: translateY(12px); } }
@media (prefers-reduced-motion: reduce) {
  .vp-cookies, .vp-cookies.vp-cookies--saindo { animation: none; }
}
@media print { .vp-cookies { display: none !important; } }
