/* ==========================================================================
   Chat guiado — Consórcio Pix
   Lançador flutuante + painel de conversa. Sem IA: passos roteirizados que
   qualificam e captam o lead para hub.leads (origem 'chat'). Depende de base.css.
   ========================================================================== */

.chat-fab {
  position:fixed; right:clamp(1rem,4vw,1.6rem); bottom:clamp(1rem,4vw,1.6rem); z-index:80;
  display:flex; align-items:center; gap:.55rem; padding:.85rem 1.2rem .85rem 1rem;
  background:var(--verde); color:#fff; border:none; border-radius:999px; cursor:pointer;
  font:600 .95rem var(--corpo); box-shadow:0 8px 26px color-mix(in srgb,var(--verde) 40%,transparent);
  transition:transform .16s, background .2s;
}
.chat-fab:hover { background:var(--verde-esc); transform:translateY(-2px); }
.chat-fab svg { width:22px; height:22px; flex-shrink:0; }
.chat-fab .pulse { position:absolute; top:-3px; right:-3px; width:12px; height:12px; background:var(--ouro); border-radius:50%; border:2px solid var(--verde); }
@media (max-width:520px){ .chat-fab span { display:none; } .chat-fab { padding:.9rem; } }

.chat-panel {
  position:fixed; right:clamp(.7rem,4vw,1.6rem); bottom:clamp(.7rem,4vw,1.6rem); z-index:81;
  width:min(380px, calc(100vw - 1.4rem)); height:min(560px, calc(100vh - 1.4rem));
  display:none; flex-direction:column; overflow:hidden;
  background:var(--branco); border-radius:18px; box-shadow:0 24px 60px color-mix(in srgb,var(--grafite) 30%,transparent);
  border:1px solid color-mix(in srgb,var(--grafite) 10%,transparent);
}
.chat-panel.aberto { display:flex; animation:chatUp .22s ease; }
@keyframes chatUp { from{ opacity:0; transform:translateY(14px); } to{ opacity:1; transform:none; } }

.chat-head { display:flex; align-items:center; gap:.7rem; padding:.9rem 1rem; background:var(--verde); color:#fff; }
.chat-head img { width:34px; height:34px; background:#fff; border-radius:50%; padding:4px; }
.chat-head b { font:600 .98rem var(--corpo); display:block; }
.chat-head small { font-size:.74rem; color:#CFEBDD; }
.chat-head .fechar { margin-left:auto; background:none; border:none; color:#fff; font-size:1.4rem; cursor:pointer; line-height:1; opacity:.85; }
.chat-head .fechar:hover { opacity:1; }

.chat-corpo { flex:1; overflow-y:auto; padding:1rem; background:var(--areia); display:flex; flex-direction:column; gap:.7rem; }
.bolha { max-width:82%; padding:.7rem .9rem; border-radius:14px; font-size:.9rem; line-height:1.45; }
.bolha--bot { background:var(--branco); color:var(--grafite); border-bottom-left-radius:4px; align-self:flex-start; box-shadow:0 1px 2px color-mix(in srgb,var(--grafite) 8%,transparent); }
.bolha--user { background:var(--verde); color:#fff; border-bottom-right-radius:4px; align-self:flex-end; }
.bolha a { color:var(--verde-esc); }

.chat-opcoes { display:flex; flex-wrap:wrap; gap:.45rem; padding:0 1rem .4rem; background:var(--areia); }
.chat-opcoes button { padding:.5rem .85rem; border-radius:999px; cursor:pointer; font:600 .84rem var(--corpo);
  color:var(--verde-esc); background:var(--verde-cl); border:1.5px solid transparent; transition:.15s; }
.chat-opcoes button:hover { border-color:var(--verde); }

.chat-form { display:none; gap:.5rem; padding:.7rem 1rem 1rem; background:var(--areia); border-top:1px solid color-mix(in srgb,var(--grafite) 8%,transparent); }
.chat-form.on { display:flex; }
.chat-form input { flex:1; padding:.7rem .85rem; font:400 .92rem var(--corpo); border:1.5px solid color-mix(in srgb,var(--grafite) 16%,transparent); border-radius:10px; }
.chat-form input:focus { outline:2px solid var(--verde); outline-offset:1px; border-color:transparent; }
.chat-form button { padding:.7rem 1rem; background:var(--verde); color:#fff; border:none; border-radius:10px; cursor:pointer; font:600 .9rem var(--corpo); }
.chat-form button:hover { background:var(--verde-esc); }

.chat-check { padding:.4rem 1rem .9rem; background:var(--areia); font-size:.76rem; color:var(--grafite-sv); display:none; align-items:flex-start; gap:.5rem; }
.chat-check.on { display:flex; }
.chat-check a { color:var(--verde-esc); }

.chat-hp { position:absolute; left:-9999px; opacity:0; height:0; }
@media (prefers-reduced-motion: reduce){ .chat-panel.aberto{ animation:none; } .chat-fab:hover{ transform:none; } }
