/* A conversa da assistente dentro da landing. Usa as cores da própria página (variáveis --red, --ink, --line…). */

/* atalhos antes da primeira pergunta */
.lac-atalhos{display:flex;flex-wrap:wrap;justify-content:center;gap:8px;margin:12px auto 0;max-width:680px}
.lac-atalhos button{min-height:40px;padding:0 15px;border-radius:999px;border:1.5px solid var(--line);background:#fff;font-size:14.5px;font-weight:500;color:var(--ink);transition:border-color .15s,color .15s}
.lac-atalhos button:hover{border-color:var(--red-mid);color:var(--red)}
.lac-atalhos[hidden]{display:none}

/* a caixa: o que a pessoa perguntou, a resposta e o campo para continuar */
.lac-conv{display:grid;gap:10px;animation:rise .3s ease}
.lac-conv[hidden]{display:none}
.lac-troca{display:grid;gap:10px}
.lac-eu{justify-self:end;max-width:85%;background:var(--red);color:#fff;border-radius:20px 20px 6px 20px;padding:10px 16px;font-size:15.5px;line-height:1.4;box-shadow:0 8px 18px -12px rgba(109,31,23,.7);overflow-wrap:anywhere}
.lac-eu span{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}

.lac-digitando{justify-self:start;background:#fff;border:1.5px solid var(--line);border-radius:20px 20px 20px 6px;padding:14px 18px;box-shadow:var(--shadow)}
.lac-pontos{display:inline-flex;gap:5px;align-items:center}
.lac-pontos i{width:8px;height:8px;border-radius:50%;background:var(--red-mid);animation:lacPonto 1.1s infinite ease-in-out}
.lac-pontos i:nth-child(2){animation-delay:.15s}
.lac-pontos i:nth-child(3){animation-delay:.3s}
@keyframes lacPonto{0%,60%,100%{opacity:.25;transform:translateY(0)}30%{opacity:1;transform:translateY(-4px)}}

/* as partes do cartão chegam uma depois da outra */
.lac-ans > *{animation:lacEntra .38s cubic-bezier(.2,.7,.2,1) both;animation-delay:calc(var(--i,0) * 70ms)}
@keyframes lacEntra{from{opacity:0;transform:translateY(6px)}}

/* a fala: a frase de gente que reconhece o pedido */
.ans .lac-fala{margin:0 0 12px;padding:12px 14px;background:var(--red-soft);border-radius:4px 16px 16px 16px;color:var(--red-dark);font-size:16px;font-weight:500;line-height:1.45}

.lac-dica{display:flex;gap:10px;align-items:flex-start;margin-top:10px;padding:10px 12px;border-radius:14px;background:var(--warm);border:1px solid var(--warm-line);color:var(--warm-ink);font-size:14.5px}
.ans .lac-dica{color:var(--warm-ink)}
.lac-rot{margin-top:14px !important;font-size:12px !important;font-weight:700;letter-spacing:.08em;text-transform:uppercase;color:var(--dim) !important}
.lac-opcoes .sugg{margin-top:8px}
.lac-nota{font-size:13.5px !important;color:var(--dim) !important;text-align:center;margin-top:2px !important}

/* próximos passos sugeridos */
.lac-proximos{margin-top:4px}
.lac-chips{display:flex;flex-wrap:wrap;gap:8px;margin-top:8px}
.lac-chips button{min-height:40px;padding:0 14px;border-radius:999px;background:var(--bg);border:1px dashed var(--red-mid);color:var(--red);font-size:14px;font-weight:600}
.lac-chips button:hover,.lac-chips button:active{background:var(--red-soft)}

/* continuar a conversa */
.lac-seguir{display:flex;align-items:center;gap:6px;background:#fff;border:1.5px solid var(--line);border-radius:999px;padding:5px 5px 5px 18px;box-shadow:0 1px 6px rgba(32,33,36,.08)}
.lac-seguir:focus-within{border-color:var(--red-mid)}
.lac-seguir input{flex:1;min-width:0;border:0;outline:0;background:transparent;height:44px;font-size:16px;color:var(--ink)}
.lac-seguir button{width:44px;height:44px;border-radius:50%;background:var(--red);color:#fff;display:grid;place-items:center;flex:0 0 auto}
.lac-seguir button svg{width:18px;height:18px}
.lac-pe{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:6px 14px;padding:0 6px}
.lac-aviso{font-size:12.5px;color:var(--dim);line-height:1.4;flex:1 1 220px}
.lac-nova{font-size:13.5px;font-weight:600;color:var(--red);min-height:40px;padding:0 4px;text-decoration:underline;text-underline-offset:3px}

/* pedido de retorno (lead) */
.lac-lead{display:grid;gap:10px;margin-top:4px;padding:14px;border:1px solid var(--line);border-radius:16px;background:var(--bg)}
.lac-lead label{display:grid;gap:4px;font-size:13.5px;font-weight:600;color:var(--soft)}
.lac-lead input[type=text],.lac-lead input[type=tel]{height:48px;border:1.5px solid var(--line);border-radius:12px;padding:0 12px;background:#fff;font-size:16px;color:var(--ink);-webkit-appearance:none}
.lac-lead input:focus{border-color:var(--red-mid);outline:0}
.lac-lead .lac-aceite{display:flex;gap:10px;align-items:flex-start;font-weight:400;font-size:13.5px;color:var(--soft)}
.lac-lead .lac-aceite input{width:20px;height:20px;flex:0 0 20px;margin-top:1px;-webkit-appearance:checkbox;appearance:checkbox;accent-color:var(--red)}
.lac-erro{color:var(--al-ink);font-weight:600;font-size:14px}

/* convênios: os que têm logo e o "+N" que pergunta à assistente */
.logo-mais{gap:0;color:var(--red);cursor:pointer;background:var(--red-soft) !important;border-color:var(--red-soft) !important}
.logo-mais b{font-size:24px;line-height:1}
.logo-mais span{font-size:13px;font-weight:600}

@media (prefers-reduced-motion: reduce){
  .lac-ans > *,.lac-conv{animation:none}
  .lac-pontos i{animation:none;opacity:.6}
}

/* ---------- voz ---------- */
.lac-ans .eb{display:flex;align-items:center;justify-content:space-between;gap:10px}
.lac-ouvir{flex:0 0 auto;display:inline-flex;align-items:center;gap:6px;min-height:34px;padding:0 12px;border-radius:999px;border:1.5px solid var(--red-soft);background:var(--red-soft);color:var(--red-dark);font-size:13px;font-weight:700;letter-spacing:0;text-transform:none}
.lac-ouvir:hover{border-color:var(--red-mid)}
.lac-ouvir.tocando{background:var(--red);border-color:var(--red);color:#fff}
.lac-ouvir.tocando span:first-child{animation:pulse 1s infinite}
.lac-ouvir:disabled{opacity:.7}
.lac-digitando{display:flex;align-items:center;gap:10px}
.lac-digitando__txt{font-size:14px;color:var(--dim)}

.lac-mic{width:44px;height:44px;border-radius:50%;display:grid;place-items:center;flex:0 0 auto}
.lac-mic svg{width:22px;height:22px}
.lac-mic.listening{background:var(--red-soft);animation:pulse 1s infinite}
.no-voice .lac-mic{display:none}

.lac-gravando{--nivel:0;display:grid;grid-template-columns:auto 1fr auto;align-items:center;gap:6px 12px;max-width:680px;margin:10px auto 0;padding:12px 14px;border-radius:16px;background:#fff;border:1.5px solid var(--red-mid);box-shadow:var(--shadow);text-align:left}
.lac-gravando[hidden]{display:none}
.lac-gravando__txt{font-size:14.5px;color:var(--soft);line-height:1.35}
.lac-gravando__txt b{color:var(--red)}
.lac-gravando__x{font-size:13.5px;font-weight:600;color:var(--dim);text-decoration:underline;min-height:40px;padding:0 4px}
.lac-gravando__aviso{grid-column:1 / -1;font-size:12px;color:var(--dim)}
.lac-gravando__aviso:empty{display:none}
.lac-onda{display:inline-flex;align-items:center;gap:3px;height:28px}
.lac-onda i{width:4px;border-radius:4px;background:var(--red);height:calc(6px + var(--nivel) * 22px);transition:height .08s linear}
.lac-onda i:nth-child(2){height:calc(6px + var(--nivel) * 14px)}
.lac-onda i:nth-child(3){height:calc(6px + var(--nivel) * 26px)}
.lac-onda i:nth-child(4){height:calc(6px + var(--nivel) * 10px)}

.lac-pref-audio{font-size:13px;font-weight:600;color:var(--red);min-height:40px;padding:0 4px}
.lac-pref-audio[aria-pressed="true"]{color:var(--red-dark)}

@media (max-width:420px){
  .lac-gravando{grid-template-columns:auto 1fr}
  .lac-gravando__x{grid-column:1 / -1;justify-self:start}
}
@media (prefers-reduced-motion: reduce){ .lac-mic.listening,.lac-ouvir.tocando span:first-child{animation:none} }