/* ===== TENBET Cookie Consent (CLARO / sem botão flutuante) ===== */
/* Mobile-first e 100% responsivo */

:root{
  --cc-bg:#ffffff;
  --cc-fg:#1f2a26;
  --cc-muted:#586662;

  --cc-accent:#2a8e58;          /* verde TENBET */
  --cc-accent-dark:#1f6f45;     /* hover/ativo mais escuro */

  --cc-line:#2a8e58;            /* bordas 1.5px verdes */
  --cc-soft:#f4faf6;            /* plano suave */
  --cc-soft-2:#eaf5ef;          /* hover */
  --cc-focus: rgba(42,142,88,.3);
}

/* ===== Banner (fixo no rodapé) ===== */
#ten-cookie-banner{
  position: fixed; left:0; right:0; bottom:0;
  z-index:1054; display:none;
  background:var(--cc-bg); color:var(--cc-fg);
  border-top:1.5px solid var(--cc-line);       /* linha verde destacada */
  box-shadow:0 -10px 30px rgba(0,0,0,.08), inset 0 1px 0 #fff;
  /* padding considera safe-area em iOS */
  padding: max(12px, env(safe-area-inset-top)) max(16px, env(safe-area-inset-right))
           max(16px, env(safe-area-inset-bottom)) max(16px, env(safe-area-inset-left));
  font-family: system-ui,-apple-system,Segoe UI,Roboto,Poppins,Arial,sans-serif;
}

/* brilho sutil no início da faixa */
#ten-cookie-banner::before{
  content:""; position:absolute; top:-1px; left:0; right:0; height:1px;
  background:linear-gradient(90deg,transparent,rgba(42,142,88,.45),transparent);
}

#ten-cookie-banner .cc-wrap{
  width:100%; max-width:1200px; margin:0 auto;
  display:grid; gap:.9rem; grid-template-columns:1fr; align-items:center;
}

/* em telas médias, texto + ações lado a lado */
@media (min-width:768px){
  #ten-cookie-banner .cc-wrap{ grid-template-columns:1fr auto; }
}

#ten-cookie-banner h3{ margin:0 0 .25rem 0; font-size:1.15rem; font-weight:800; letter-spacing:.2px; }
#ten-cookie-banner p{ margin:0; line-height:1.55; color:var(--cc-muted); font-size:.98rem; }
#ten-cookie-banner a{ color:var(--cc-accent); text-decoration:underline; text-underline-offset:2px; }
#ten-cookie-banner a:hover{ color:var(--cc-accent-dark); }

#ten-cookie-banner .cc-actions{
  display:flex; gap:.6rem; flex-wrap:wrap; justify-content:flex-start;
}

/* Botões viram “full width” em visores muito estreitos */
@media (max-width:420px){
  #ten-cookie-banner .cc-actions{ gap:.5rem; }
  #ten-cookie-banner .cc-actions .cc-btn{ flex:1 1 100%; text-align:center; }
}

/* ===== Botões ===== */
.cc-btn{
  appearance:none; cursor:pointer;
  padding:.66rem 1.05rem; border-radius:999px;
  font-weight:800; letter-spacing:.2px; line-height:1.1;
  border:1.5px solid var(--cc-line);           /* borda 1.5px verde nos secundários */
  transition: background .15s ease, color .15s ease, border-color .15s ease, box-shadow .15s ease, transform .02s ease;
  touch-action: manipulation;
}
.cc-btn:active{ transform:translateY(1px); }

/* Aceitar – principal */
.cc-accept{
  background:var(--cc-accent); color:#fff;
  border-color:var(--cc-accent);
  box-shadow:0 2px 0 rgba(0,0,0,.08);
}
.cc-accept:hover{ background:var(--cc-accent-dark); border-color:var(--cc-accent-dark); }
.cc-accept:focus-visible{ outline:3px solid var(--cc-focus); outline-offset:2px; }

/* Recusar – com borda verde e hover visível */
.cc-reject{
  background:var(--cc-soft); color:var(--cc-fg);
}
.cc-reject:hover{
  background:var(--cc-soft-2);
  box-shadow:0 0 0 2px rgba(42,142,88,.08) inset;
}
.cc-reject:focus-visible{ outline:3px solid var(--cc-focus); outline-offset:2px; }

/* Personalizar – com borda verde */
.cc-customize{
  background:#fff; color:var(--cc-fg);
}
.cc-customize:hover{
  background:var(--cc-soft);
  box-shadow:0 0 0 2px rgba(42,142,88,.08) inset;
}
.cc-customize:focus-visible{ outline:3px solid var(--cc-focus); outline-offset:2px; }

/* ===== Modal (claro) ===== */
#ten-cc-modal{
  position:fixed; inset:0; z-index:1055; display:none;
  background:rgba(0,0,0,.35); backdrop-filter:blur(2px);
  padding: env(safe-area-inset-top) env(safe-area-inset-right)
           env(safe-area-inset-bottom) env(safe-area-inset-left);
}

/* caixa central com rolagem interna para telas pequenas */
#ten-cc-modal .cc-box{
  background:#fff; color:var(--cc-fg);
  width:min(720px, 96vw);
  margin:8vh auto; padding:1rem 1rem 1.1rem;
  border-radius:14px; border:1.5px solid var(--cc-line);
  box-shadow:0 24px 48px rgba(0,0,0,.14);
  max-height:84vh; display:flex; flex-direction:column;
}
#ten-cc-modal .cc-header{
  display:flex; align-items:center; justify-content:space-between; gap:.75rem; margin-bottom:.5rem;
}
#ten-cc-modal h4{ margin:0; font-weight:800; }
#ten-cc-modal .cc-close{ background:transparent; border:0; font-size:22px; cursor:pointer; color:var(--cc-fg); }
#ten-cc-modal .cc-close:focus-visible{ outline:3px solid var(--cc-focus); border-radius:8px; }

#ten-cc-modal .cc-body{ overflow:auto; padding-right:.25rem; }
#ten-cc-modal .cc-body p{ color:var(--cc-muted); margin:.25rem 0 .75rem 0; }

#ten-cc-modal .cc-row{
  display:flex; align-items:center; justify-content:space-between; gap:1rem;
  border:1.5px solid var(--cc-line); border-radius:12px; padding:.9rem 1rem; margin:.7rem 0;
  background:var(--cc-soft);
}
#ten-cc-modal .cc-footer{ display:flex; justify-content:flex-end; gap:.6rem; margin-top:.75rem; }

/* empilhar botões no modal em telas muito pequenas */
@media (max-width:420px){
  #ten-cc-modal .cc-footer .cc-btn{ flex:1 1 100%; text-align:center; }
}

/* ===== Switch – ativo VERDE de verdade ===== */
.cc-toggle{
  appearance:none; width:52px; height:30px; border-radius:999px;
  background:#dfeae4; border:1.5px solid var(--cc-line); position:relative; cursor:pointer;
  transition: background .18s ease, border-color .18s ease;
}
.cc-toggle::before{
  content:""; position:absolute; top:2px; left:2px; width:24px; height:24px;
  border-radius:50%; background:#fff; border:1px solid rgba(0,0,0,.06);
  transition: transform .18s ease, box-shadow .18s ease;
  box-shadow:0 1px 2px rgba(0,0,0,.12);
}
.cc-toggle:hover{ background:#d1e7db; }
.cc-toggle:checked{
  background:var(--cc-accent);               /* VERDE quando ativo */
  border-color:var(--cc-accent);
}
.cc-toggle:checked::before{
  transform: translateX(22px);
  border-color: rgba(0,0,0,.0);
  box-shadow:0 0 0 2px rgba(255,255,255,.45) inset;
}
.cc-toggle:disabled{ opacity:.7; cursor:not-allowed; }

/* acessibilidade / prefers-reduced-motion */
@media (prefers-reduced-motion: reduce){
  *{ transition:none !important; }
}
