.measurement-choice { position: fixed; inset: auto 1rem 1rem; z-index: 2147483647; max-width: 44rem; margin-inline: auto; padding: 1rem; background: #171b1a; color: #f4f1e7; border: 1px solid #c5b98e; border-radius: .6rem; box-shadow: 0 4px 24px #0008; font: 1rem/1.5 system-ui, sans-serif; }
.measurement-choice[hidden] { display: none; }
.measurement-choice p { margin: 0 0 .7rem; }
.measurement-choice a { color: #fff; text-decoration: underline; }
.measurement-actions { display: flex; flex-wrap: wrap; gap: .75rem; }
.measurement-actions button, .measurement-preferences { padding: .6rem .9rem; border: 1px solid currentColor; border-radius: .3rem; background: transparent; color: inherit; cursor: pointer; font: inherit; }
.measurement-actions button:focus-visible, .measurement-preferences:focus-visible { outline: 3px solid #e7ce80; outline-offset: 3px; }
.measurement-footer { padding: .8rem 1rem; font: .875rem/1.5 system-ui, sans-serif; }
.measurement-status { margin-left: .75rem; }
/* Celular (10/10/2026): o aviso começa recolhido numa faixa baixa (measurement.js) e a página ganha espaço embaixo do tamanho
   dele, para não cobrir o botão de cadastro. "Ver opções" abre o aviso inteiro. */
html { scroll-padding-bottom: calc(var(--measurement-space, 0px) + 16px); }
html.measurement-aberta body { padding-bottom: var(--measurement-space, 0px); }
.measurement-expand { flex: none; padding: .5rem .8rem; border: 1px solid currentColor; border-radius: .3rem; background: transparent; color: inherit; cursor: pointer; font: inherit; font-weight: 600; }
.measurement-expand[hidden] { display: none; }
.measurement-expand:focus-visible { outline: 3px solid #e7ce80; outline-offset: 3px; }
@media (max-width: 720px) {
  .measurement-choice { inset: auto .5rem .5rem; padding: .7rem .85rem; font-size: .875rem; line-height: 1.4; max-height: 42vh; overflow-y: auto; }
  .measurement-choice p { margin: 0 0 .4rem; }
  .measurement-actions { flex-wrap: nowrap; gap: .5rem; }
  .measurement-actions button { flex: 1 1 0; padding: .55rem .5rem; }
}
/* Até 1100 px o aviso começa recolhido (a capa ocupa a largura toda). Acima disso, ele fica no canto direito, longe da chamada. */
@media (max-width: 1100px) {
  .measurement-choice--compacta:not([hidden]) { display: flex; align-items: center; gap: .75rem; padding: .5rem .5rem .5rem .85rem; }
  .measurement-choice--compacta > p:first-child { flex: 1 1 auto; margin: 0; }
  .measurement-choice--compacta > p ~ p, .measurement-choice--compacta > #google-ads-choice, .measurement-choice--compacta > #meta-pixel-choice, .measurement-choice--compacta .measurement-actions:not(.measurement-all) { display: none; }
  .measurement-choice--compacta:not([hidden]) { flex-wrap: wrap; }
  .measurement-choice--compacta > .measurement-all { display: flex; flex: 1 1 100%; order: 2; margin: 0; }
  .measurement-choice--compacta > .measurement-expand { order: 1; }
}
/* 15/10/2026: "Aceitar tudo" e "Recusar tudo" com o mesmo peso visual, para recusar ser tão fácil quanto aceitar. */
.measurement-all { margin: 0 0 .7rem; }
@media (min-width: 1101px) {
  .measurement-choice { inset: auto 1rem 1rem auto; max-width: 26rem; margin: 0; max-height: calc(100vh - 2rem); overflow-y: auto; }
}
/* Escolhas separadas no mesmo aviso (Google Ads, anúncios da Meta): uma linha fina entre elas. */
#google-ads-choice, #meta-pixel-choice { margin-top: .8rem; padding-top: .8rem; border-top: 1px solid #c5b98e55; }
/* 22/10/2026 (dono: "pq o site tem esse espaço grande sem nada?"): em tela larga o aviso é uma caixa no canto direito e o
   rodapé fica à esquerda, longe dela. Reservar a altura inteira da caixa deixava uma faixa vazia enorme no fim da página.
   A partir de 1500 px a página não reserva mais o espaço (a rolagem por teclado continua com a folga de 16 px). */
@media (min-width: 1500px) {
  html.measurement-aberta body { padding-bottom: 0; }
  html { scroll-padding-bottom: 16px; }
}
