/*!
 * ZenCode Consent — estilos
 * Dr. Criativo / ZenCode
 *
 * ------------------------------------------------------------------------
 * BLINDAGEM CONTRA O CSS DO SITE
 *
 * Prefixo .zc- não basta. Temas e page builders têm regras genéricas de
 * grande alcance — `a, button { color: ... }`, `.elementor button { ... }` —
 * que vencem por especificidade e sequestram a aparência do banner.
 *
 * Aconteceu no Bamboo Green: os botões saíram rosa (#cc3366, cor de link
 * padrão do WordPress) em vez da cor da marca. Um banner descaracterizado
 * passa impressão de coisa invadida, e o cliente perde a confiança.
 *
 * Por isso as propriedades visuais que importam levam !important e os
 * seletores são ancorados no contêiner (.zc-banner .zc-btn). É feio, mas é o
 * que garante que a mesma pasta funcione em qualquer site sem ajuste.
 * ------------------------------------------------------------------------
 */

.zc-banner, .zc-overlay, .zc-float, .zc-placeholder {
  font-family: var(--zc-font, inherit) !important;
  line-height: 1.5 !important;
  letter-spacing: normal !important;
  text-transform: none !important;
}
.zc-banner *, .zc-overlay *, .zc-float *, .zc-placeholder * {
  box-sizing: border-box !important;
  font-family: inherit !important;
}

.zc-sr {
  position: absolute !important; width: 1px; height: 1px;
  padding: 0; margin: -1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; border: 0;
}

/* ---------------------------------------------------------------- *
 * Botões                                                            *
 *                                                                   *
 * "Aceitar" e "Recusar" usam a MESMA classe e o mesmo estilo.        *
 * Não basta mesmo tamanho: se um é colorido e o outro apagado, o     *
 * olho vai no colorido e a escolha deixa de ser livre. Só o rótulo   *
 * muda entre eles.                                                   *
 * ---------------------------------------------------------------- */
.zc-banner .zc-btn, .zc-modal .zc-btn, .zc-placeholder .zc-btn {
  font-size: 14px !important;
  font-weight: 600 !important;
  line-height: 1.2 !important;
  padding: 11px 18px !important;
  min-height: 44px !important;
  border: 2px solid transparent !important;
  border-radius: calc(var(--zc-radius, 14px) / 1.75) !important;
  cursor: pointer !important;
  text-align: center !important;
  text-decoration: none !important;
  box-shadow: none !important;
  margin: 0 !important;
  width: auto !important;
  transition: filter .15s ease, background-color .15s ease !important;
}
.zc-banner .zc-btn:hover, .zc-modal .zc-btn:hover { filter: brightness(1.08) !important; }
.zc-banner .zc-btn:focus-visible, .zc-modal .zc-btn:focus-visible {
  outline: 3px solid var(--zc-accent) !important; outline-offset: 2px !important;
}

/* Ação sem oposto na tela (ex.: "Salvar minhas escolhas"). */
.zc-banner .zc-btn-primary, .zc-modal .zc-btn-primary {
  background: var(--zc-accent) !important;
  color: var(--zc-accent-text) !important;
  border-color: var(--zc-accent) !important;
}
/* Aceitar e recusar: idênticos. */
.zc-banner .zc-btn-choice, .zc-modal .zc-btn-choice {
  background: var(--zc-choice-bg) !important;
  color: var(--zc-choice-text) !important;
  border-color: var(--zc-choice-border) !important;
}
.zc-banner .zc-btn-ghost, .zc-modal .zc-btn-ghost {
  background: transparent !important;
  color: var(--zc-muted) !important;
  border-color: transparent !important;
  font-weight: 500 !important;
  text-decoration: underline !important;
  min-height: 38px !important;
  padding: 8px 10px !important;
}

.zc-banner .zc-link, .zc-modal .zc-link, .zc-linkish {
  color: var(--zc-accent) !important;
  text-decoration: underline !important;
  background: none !important; border: 0 !important; padding: 0 !important;
  font: inherit !important; cursor: pointer !important;
}
.zc-banner .zc-h, .zc-modal .zc-h {
  margin: 0 0 6px !important; font-size: 16px !important; font-weight: 700 !important;
  color: var(--zc-text) !important; padding: 0 !important;
}
.zc-banner .zc-p, .zc-modal .zc-p {
  margin: 0 !important; font-size: 13.5px !important; line-height: 1.55 !important;
  color: var(--zc-muted) !important; padding: 0 !important;
}

/* ---------------------------------------------------------------- *
 * Banner em cartão (padrão)                                         *
 * Formato compacto flutuante, no canto — não atravessa a tela nem   *
 * tapa o conteúdo como uma barra inteira.                           *
 * ---------------------------------------------------------------- */
.zc-banner {
  position: fixed !important;
  z-index: 2147483000 !important;
  width: min(400px, calc(100vw - 32px)) !important;
  background: var(--zc-bg) !important;
  color: var(--zc-text) !important;
  border: 1px solid var(--zc-border) !important;
  border-radius: var(--zc-radius, 14px) !important;
  box-shadow: 0 12px 40px rgba(0, 0, 0, .22) !important;
  opacity: 0; visibility: hidden; transform: translateY(16px) scale(.98);
  transition: transform .3s cubic-bezier(.2,.8,.3,1), opacity .3s ease, visibility .3s;
}
.zc-banner.zc-in { opacity: 1; visibility: visible; transform: translateY(0) scale(1); }

html.zc-pos-bottom-left  .zc-banner { bottom: 20px !important; left: 20px !important; }
html.zc-pos-bottom-right .zc-banner { bottom: 20px !important; right: 20px !important; }
html.zc-pos-top-left     .zc-banner { top: 20px !important; left: 20px !important; transform: translateY(-16px) scale(.98); }
html.zc-pos-top-right    .zc-banner { top: 20px !important; right: 20px !important; transform: translateY(-16px) scale(.98); }

/* Barra de largura total, para quem preferir. */
html.zc-pos-bottom .zc-banner, html.zc-pos-top .zc-banner {
  width: 100% !important; left: 0 !important; right: 0 !important;
  border-radius: 0 !important; border-left: 0 !important; border-right: 0 !important;
}
html.zc-pos-bottom .zc-banner { bottom: 0 !important; }
html.zc-pos-top .zc-banner { top: 0 !important; }
html.zc-pos-bottom .zc-banner-in, html.zc-pos-top .zc-banner-in {
  max-width: 1180px; margin: 0 auto; flex-direction: row !important; align-items: center;
}
html.zc-pos-bottom .zc-banner-acts, html.zc-pos-top .zc-banner-acts { flex-shrink: 0; }

.zc-banner-in {
  display: flex !important; flex-direction: column; gap: 16px;
  padding: 22px !important;
}
.zc-banner-head { display: flex !important; align-items: flex-start; gap: 12px; }
.zc-ico {
  flex-shrink: 0; width: 38px; height: 38px; border-radius: 50%;
  display: flex !important; align-items: center; justify-content: center;
  background: var(--zc-accent-soft); color: var(--zc-accent);
}
.zc-ico svg { width: 21px; height: 21px; display: block; }
.zc-banner-acts { display: flex !important; gap: 10px; flex-wrap: wrap; align-items: center; }
.zc-banner-acts .zc-btn-choice { flex: 1 1 0; min-width: 140px; }
.zc-banner-acts .zc-btn-ghost { flex: 1 1 100%; }

/* ---------------------------------------------------------------- *
 * Painel                                                            *
 * ---------------------------------------------------------------- */
.zc-overlay {
  position: fixed !important; inset: 0 !important; z-index: 2147483001 !important;
  background: var(--zc-overlay) !important;
  display: flex !important; align-items: center; justify-content: center; padding: 20px;
  opacity: 0; visibility: hidden; transition: opacity .2s ease, visibility .2s;
}
.zc-overlay.zc-in { opacity: 1; visibility: visible; }

.zc-modal {
  background: var(--zc-bg) !important; color: var(--zc-text) !important;
  border-radius: var(--zc-radius, 14px) !important;
  width: 100%; max-width: 620px; max-height: 88vh;
  display: flex !important; flex-direction: column; overflow: hidden;
  box-shadow: 0 24px 60px rgba(0, 0, 0, .3) !important;
  transform: translateY(12px); transition: transform .2s ease;
}
.zc-overlay.zc-in .zc-modal { transform: translateY(0); }

.zc-modal-head {
  display: flex !important; align-items: center; justify-content: space-between;
  gap: 12px; padding: 18px 22px !important; border-bottom: 1px solid var(--zc-border) !important;
}
.zc-modal-body { padding: 18px 22px !important; overflow-y: auto; -webkit-overflow-scrolling: touch; }
.zc-modal-foot {
  display: flex !important; gap: 10px; flex-wrap: wrap; justify-content: flex-end;
  padding: 16px 22px !important; border-top: 1px solid var(--zc-border) !important;
  background: var(--zc-secondary-bg) !important;
}
.zc-x {
  background: none !important; border: 0 !important; cursor: pointer;
  font-size: 26px !important; line-height: 1 !important; color: var(--zc-muted) !important;
  padding: 4px 8px !important; border-radius: 6px;
}
.zc-x:hover { color: var(--zc-text) !important; }
.zc-x:focus-visible { outline: 3px solid var(--zc-accent) !important; outline-offset: 2px; }

.zc-cat { padding: 16px 0 !important; border-top: 1px solid var(--zc-border) !important; }
.zc-cat:first-of-type { margin-top: 8px; }
.zc-cat-head { display: flex !important; gap: 16px; align-items: flex-start; justify-content: space-between; }
.zc-cat-txt { flex: 1; }
.zc-cat-name { margin: 0 0 4px !important; font-size: 15px !important; font-weight: 700 !important; color: var(--zc-text) !important; }
.zc-cat-desc { margin: 0 !important; font-size: 13px !important; line-height: 1.5 !important; color: var(--zc-muted) !important; }
.zc-always {
  flex-shrink: 0; font-size: 12px !important; font-weight: 600 !important;
  color: var(--zc-accent) !important; background: var(--zc-accent-soft) !important;
  border-radius: 999px; padding: 5px 12px; white-space: nowrap;
}

.zc-switch { position: relative; flex-shrink: 0; width: 48px; height: 28px; cursor: pointer; display: block !important; }
.zc-switch input { position: absolute; opacity: 0; width: 100%; height: 100%; margin: 0; cursor: pointer; }
.zc-slider {
  position: absolute; inset: 0; background: var(--zc-border) !important;
  border-radius: 999px; transition: background-color .18s ease; pointer-events: none;
}
.zc-slider::after {
  content: ''; position: absolute; top: 3px; left: 3px; width: 22px; height: 22px;
  background: #fff; border-radius: 50%; transition: transform .18s ease;
  box-shadow: 0 1px 3px rgba(0, 0, 0, .35);
}
.zc-switch input:checked + .zc-slider { background: var(--zc-accent) !important; }
.zc-switch input:checked + .zc-slider::after { transform: translateX(20px); }
.zc-switch input:focus-visible + .zc-slider { outline: 3px solid var(--zc-accent); outline-offset: 3px; }

.zc-cookies { margin-top: 12px; }
.zc-cookies summary {
  cursor: pointer; font-size: 13px !important; font-weight: 600 !important;
  color: var(--zc-accent) !important; padding: 6px 0; list-style: revert;
}
.zc-cookies summary:focus-visible { outline: 3px solid var(--zc-accent); outline-offset: 2px; }
.zc-tablewrap { overflow-x: auto; margin-top: 8px; }
.zc-cookies table { width: 100% !important; border-collapse: collapse !important; font-size: 12px !important; min-width: 460px; }
.zc-cookies th, .zc-cookies td {
  text-align: left !important; padding: 8px 10px !important;
  border-bottom: 1px solid var(--zc-border) !important;
  color: var(--zc-muted) !important; vertical-align: top;
}
.zc-cookies th { color: var(--zc-text) !important; font-weight: 700 !important; background: var(--zc-secondary-bg) !important; }

/* ---------------------------------------------------------------- *
 * Botão flutuante                                                   *
 * ---------------------------------------------------------------- */
.zc-float {
  position: fixed !important; z-index: 2147482999 !important;
  width: 46px !important; height: 46px !important;
  border-radius: 50% !important; border: 1px solid var(--zc-border) !important;
  background: var(--zc-bg) !important; color: var(--zc-accent) !important;
  display: flex !important; align-items: center; justify-content: center; cursor: pointer;
  box-shadow: 0 4px 16px rgba(0, 0, 0, .2) !important; padding: 0 !important;
  opacity: 0; transform: scale(.8); transition: opacity .2s ease, transform .2s ease;
}
.zc-float.zc-in { opacity: .9; transform: scale(1); }
.zc-float:hover { opacity: 1; }
.zc-float:focus-visible { outline: 3px solid var(--zc-accent) !important; outline-offset: 3px; opacity: 1; }
.zc-float svg { width: 22px; height: 22px; display: block; }
.zc-float-bottom-left { bottom: 20px; left: 20px; }
.zc-float-bottom-right { bottom: 20px; right: 20px; }
.zc-float-top-left { top: 20px; left: 20px; }
.zc-float-top-right { top: 20px; right: 20px; }

/* ---------------------------------------------------------------- *
 * Placeholder de conteúdo bloqueado                                 *
 * ---------------------------------------------------------------- */
.zc-placeholder {
  background: var(--zc-secondary-bg, #f3f5f7) !important;
  border: 1px dashed var(--zc-border, #e2e6ea) !important;
  border-radius: var(--zc-radius, 14px) !important;
  display: flex !important; align-items: center; justify-content: center;
  min-height: 180px; padding: 24px; text-align: center;
}
.zc-ph-inner { max-width: 420px; }
.zc-ph-title { margin: 0 0 6px !important; font-size: 15px !important; font-weight: 700 !important; color: var(--zc-text, #1a1d21) !important; }
.zc-ph-msg { margin: 0 0 14px !important; font-size: 13px !important; line-height: 1.5 !important; color: var(--zc-muted, #5b6470) !important; }
.zc-ph-accept { display: block !important; margin: 10px auto 0 !important; font-size: 12px !important; }

/* ---------------------------------------------------------------- *
 * Telas pequenas                                                    *
 * ---------------------------------------------------------------- */
@media (max-width: 640px) {
  .zc-banner {
    width: calc(100vw - 20px) !important;
    left: 10px !important; right: 10px !important; bottom: 10px !important;
  }
  html.zc-pos-bottom .zc-banner, html.zc-pos-top .zc-banner {
    width: 100% !important; left: 0 !important; right: 0 !important;
  }
  .zc-banner-in { padding: 18px !important; }
  /* Empilhados e do mesmo tamanho: nenhum ganha destaque. */
  .zc-banner-acts .zc-btn { flex: 1 1 100% !important; }
  .zc-overlay { padding: 0; align-items: flex-end; }
  .zc-modal { max-width: 100%; max-height: 92vh; border-radius: var(--zc-radius) var(--zc-radius) 0 0 !important; }
  .zc-modal-foot { flex-direction: column-reverse; }
  .zc-modal-foot .zc-btn { width: 100% !important; }
}

/* ---------------------------------------------------------------- *
 * Preferências do sistema                                           *
 * ---------------------------------------------------------------- */
@media (prefers-reduced-motion: reduce) {
  .zc-banner, .zc-overlay, .zc-modal, .zc-float, .zc-slider, .zc-slider::after, .zc-btn {
    transition: none !important;
  }
}
@media (prefers-contrast: more) {
  .zc-banner .zc-btn, .zc-modal .zc-btn { border-color: currentColor !important; }
}
@media print {
  .zc-banner, .zc-overlay, .zc-float { display: none !important; }
}
