/* Liga o visual da CookieConsent aos tokens do kit webpsi (kit/kit.css), com valores de reserva
 * para sites fora do kit. Variáveis primeiro; os poucos ajustes de forma vêm depois, com o motivo. */
#cc-main {
  --cc-font-family: var(--font-body, inherit);
  --cc-bg: var(--color-bg, #fff);
  --cc-primary-color: var(--color-ink, #222);
  --cc-secondary-color: var(--color-text, #444);
  --cc-link-color: var(--color-primary, #1a5fb4);
  --cc-modal-border-radius: 20px;
  --cc-btn-border-radius: 14px; /* também é o canto das seções das preferências; os botões viram pílula abaixo */
  --cc-btn-primary-bg: var(--color-primary, #1a5fb4);
  --cc-btn-primary-color: var(--color-primary-ink, #fff);
  --cc-btn-primary-border-color: var(--color-primary, #1a5fb4);
  --cc-btn-primary-hover-bg: var(--color-primary-hover, #144a8c);
  --cc-btn-primary-hover-color: var(--color-primary-ink, #fff);
  --cc-btn-primary-hover-border-color: var(--color-primary-hover, #144a8c);
  --cc-btn-secondary-bg: var(--color-bg-alt, #eee);
  --cc-btn-secondary-color: var(--color-ink, #222);
  --cc-btn-secondary-border-color: var(--color-bg-alt, #eee);
  --cc-btn-secondary-hover-bg: var(--color-border, #ddd);
  --cc-btn-secondary-hover-color: var(--color-ink, #222);
  --cc-btn-secondary-hover-border-color: var(--color-border, #ddd);
  --cc-separator-border-color: var(--color-border, #ddd);
  --cc-toggle-on-bg: var(--color-primary, #1a5fb4);
  --cc-toggle-off-bg: var(--color-text-muted, #777);
  --cc-toggle-readonly-bg: var(--color-accent, #8a8a8a); /* "Necessários": ligado e travado, visível como ligado */
  --cc-toggle-readonly-knob-bg: #fff;
  --cc-toggle-readonly-knob-icon-color: var(--color-accent, #8a8a8a);
  --cc-cookie-category-block-bg: var(--color-bg, #fff);
  --cc-cookie-category-block-border: var(--color-border, #e3e3e3);
  --cc-cookie-category-block-hover-bg: var(--color-bg-alt, #f3f3f3);
  --cc-cookie-category-block-hover-border: var(--color-border, #e3e3e3);
  --cc-cookie-category-expanded-block-bg: var(--color-bg, #fff);
  --cc-cookie-category-expanded-block-hover-bg: var(--color-bg, #fff);
  --cc-footer-bg: var(--color-bg, #fff);
  --cc-footer-color: var(--color-text, #444);
  --cc-footer-border-color: var(--color-border, #ddd);
}

/* Botões em pílula, como no site, com texto legível (a biblioteca usa .82em). */
#cc-main .cm__btn,
#cc-main .pm__btn {
  border-radius: 999px;
  font-size: .95rem;
}

/* Títulos com a fonte de título do tema. */
#cc-main .cm__title,
#cc-main .pm__title {
  font-family: var(--font-heading, inherit);
  font-size: 1.25rem;
  font-weight: 600;
}

/* Links reconhecíveis como links. */
#cc-main .cm__desc a,
#cc-main .cm__links a,
#cc-main .pm__section-desc a,
#cc-main .cm__footer a {
  text-decoration: underline;
  text-underline-offset: 2px;
}

/* Desktop: rótulos dos botões numa linha só. */
#cc-main .cm .cm__btn {
  white-space: nowrap;
  padding-left: 1.25rem;
  padding-right: 1.25rem;
}

/* Rodapé do aviso: "Gerenciar preferências" e "Política de cookies" lado a lado. */
#cc-main .cm__footer {
  padding: .6rem 0 .7rem;
}
#cc-main .cm__footer .cm__link-group {
  display: flex;
  flex-wrap: wrap;
  gap: .25rem 1.25rem;
}
#cc-main .cm__footer .cm__link-group a {
  font-size: .875rem; /* a biblioteca usa .8em, pequeno demais */
}

/* Desktop: a biblioteca limita a coluna de botões a 23em, o que corta "Rejeitar não necessários". */
#cc-main .cm--cloud .cm__btns {
  max-width: none;
  flex: 0 0 auto;
}
#cc-main .cm--cloud .cm__btn {
  min-width: 15rem; /* a biblioteca usa 19em; 15rem cabe "Rejeitar não necessários" e sobra espaço para o texto */
}

/* Setinhas das categorias: a biblioteca usa a cor da chave travada; aqui ficam discretas. */
#cc-main .pm__section--expandable .pm__section-arrow {
  background: var(--color-bg-alt, #eee);
}

/* Selo "Sempre ativos" da categoria necessários. */
#cc-main .pm__badge {
  background: var(--color-bg-alt, #eee);
  color: var(--color-ink, #222);
}

/* Celular: a biblioteca empilha tudo; aqui "Aceitar" e "Rejeitar" ficam lado a lado, com o mesmo peso. */
@media screen and (max-width: 640px) {
  #cc-main .cm .cm__btn-group {
    flex-direction: row !important;
    gap: .5rem;
  }
  #cc-main .cm .cm__btn-group .cm__btn + .cm__btn {
    margin: 0 !important;
  }
  #cc-main .cm .cm__btn {
    flex: 1 1 0 !important;
    min-width: 0 !important;
    padding: .55rem .75rem;
    font-size: .9rem;
    line-height: 1.2;
    white-space: normal; /* "Rejeitar não necessários" quebra em duas linhas em vez de ser cortado */
  }
  #cc-main .cm__desc {
    font-size: .875rem;
  }
  /* A biblioteca esconde o selo no celular; "Sempre ativos" explica por que a chave não desliga. */
  #cc-main .pm .pm__badge {
    display: flex;
  }
}
