/* Chat do site, versão 1 (prévia 24/10): janela "Fale com a gente". Só tokens do loja.css, nos dois temas. Sem biblioteca. */
.chat-botao{position:fixed;right:16px;bottom:calc(16px + env(safe-area-inset-bottom,0px));z-index:40;display:inline-flex;align-items:center;gap:8px;
  min-height:48px;padding:0 18px 0 14px;border-radius:999px;border:0;background:var(--marca);color:var(--marca-tinta);font:600 16px var(--f-texto);
  box-shadow:0 4px 18px var(--sombra-forte);cursor:pointer;transition:background .15s,transform .15s}
.chat-botao:hover{background:var(--marca-fundo)}
.chat-botao:focus-visible{outline:3px solid var(--ouro);outline-offset:2px}
.chat-botao svg{width:22px;height:22px;flex:none}
.chat-botao .chat-ponto{width:9px;height:9px;border-radius:50%;background:var(--led);box-shadow:0 0 0 3px rgba(124,240,168,.25)}
.chat-botao[data-fora] .chat-ponto{background:var(--apagado);box-shadow:none}
.chat-botao[aria-expanded="true"]{display:none}
.chat-janela{position:fixed;right:16px;bottom:calc(16px + env(safe-area-inset-bottom,0px));z-index:41;width:min(380px,calc(100vw - 32px));
  max-height:min(640px,calc(100dvh - 32px - env(safe-area-inset-top,0px) - env(safe-area-inset-bottom,0px)));display:grid;grid-template-rows:auto 1fr;
  background:var(--superficie);color:var(--tinta);border:1px solid var(--linha);border-radius:14px;box-shadow:0 12px 40px var(--sombra-forte);overflow:hidden}
.chat-topo{display:flex;align-items:center;gap:10px;padding:14px 12px 14px 16px;background:var(--marca);color:var(--marca-tinta)}
.chat-topo h2{margin:0;font:700 1.25rem/1.1 var(--f-titulo);flex:1}
.chat-topo p{margin:2px 0 0;font:500 .8rem/1.3 var(--f-texto);opacity:.9;display:flex;align-items:center;gap:6px}
.chat-topo .chat-ponto{width:8px;height:8px;border-radius:50%;background:var(--led);flex:none}
.chat-topo[data-fora] .chat-ponto{background:var(--marca-suave);opacity:.6}
.chat-fechar{width:40px;height:40px;border:0;border-radius:9px;background:transparent;color:inherit;cursor:pointer;display:grid;place-items:center;flex:none}
.chat-fechar:hover{background:var(--marca-fundo)}
.chat-fechar:focus-visible{outline:2px solid var(--ouro)}
.chat-corpo{overflow-y:auto;overscroll-behavior:contain;padding:16px;display:grid;gap:12px;align-content:start}
.chat-intro{margin:0;font-size:.95rem;line-height:1.5}
.chat-produto{display:flex;gap:10px;align-items:center;padding:8px 10px;border:1px solid var(--linha);border-radius:10px;background:var(--papel);font-size:.85rem;line-height:1.35}
.chat-produto img{width:44px;height:44px;object-fit:contain;border-radius:6px;background:var(--foto-fundo);flex:none}
.chat-produto b{display:block}
.chat-produto .chat-tirar{margin-left:auto;border:0;background:transparent;color:var(--apagado);font:500 .8rem var(--f-texto);cursor:pointer;text-decoration:underline;padding:6px}
.chat-campo{display:grid;gap:5px}
.chat-campo label{font:600 .85rem/1.2 var(--f-texto)}
.chat-campo label small{font-weight:400;color:var(--apagado)}
.chat-campo input,.chat-campo textarea{width:100%;box-sizing:border-box;border:1.5px solid var(--linha);border-radius:9px;padding:10px 12px;
  font:400 16px/1.4 var(--f-texto);background:var(--papel);color:var(--tinta);resize:vertical}
.chat-campo textarea{min-height:96px}
.chat-campo input:focus,.chat-campo textarea:focus{outline:none;border-color:var(--vivo);box-shadow:0 0 0 3px var(--aceso-brilho)}
.chat-campo[data-erro] input,.chat-campo[data-erro] textarea{border-color:var(--aviso)}
.chat-erro{margin:0;font-size:.8rem;color:var(--aviso)}
.chat-isca{position:absolute;left:-9999px;width:1px;height:1px;overflow:hidden}
.chat-enviar{width:100%}
.chat-enviar[disabled]{opacity:.6;cursor:progress}
.chat-privacidade{margin:0;font-size:.75rem;line-height:1.45;color:var(--apagado)}
.chat-privacidade a{color:inherit}
.chat-falas{display:grid;gap:8px}
.chat-fala{max-width:85%;padding:9px 12px;border-radius:12px;font-size:.92rem;line-height:1.45;white-space:pre-wrap;overflow-wrap:anywhere}
.chat-fala time{display:block;margin-top:4px;font:500 .7rem var(--f-cod);opacity:.75}
.chat-fala.cliente{justify-self:end;background:var(--vivo);color:var(--vivo-tinta);border-bottom-right-radius:4px}
.chat-fala.loja{justify-self:start;background:var(--vivo-fundo);color:var(--tinta);border-bottom-left-radius:4px}
.chat-fala.sistema{justify-self:stretch;max-width:none;background:var(--baixo-fundo);color:var(--tinta);font-size:.85rem;border-radius:10px}
.chat-numero{margin:0;font:500 .75rem var(--f-cod);color:var(--apagado)}
.chat-responder{display:flex;gap:8px;align-items:flex-end}
.chat-responder textarea{flex:1;min-height:46px;max-height:140px;border:1.5px solid var(--linha);border-radius:9px;padding:10px 12px;font:400 16px/1.4 var(--f-texto);
  background:var(--papel);color:var(--tinta);resize:none}
.chat-responder textarea:focus{outline:none;border-color:var(--vivo)}
.chat-responder .btn{min-height:46px;padding:0 14px}
.chat-link{margin:0;font-size:.8rem;color:var(--apagado)}
.chat-link a{color:var(--vivo)}
.chat-nova{border:0;background:transparent;color:var(--vivo);font:600 .85rem var(--f-texto);cursor:pointer;text-decoration:underline;padding:4px 0;justify-self:start}
@media (max-width:480px){
  .chat-botao{padding:0 14px;min-height:52px}
  .chat-botao .chat-rotulo{display:none}
  .chat-janela{right:0;left:0;bottom:0;width:100%;max-height:calc(100dvh - 48px - env(safe-area-inset-top,0px));border-radius:14px 14px 0 0;
    padding-bottom:env(safe-area-inset-bottom,0px)}
}
@media (prefers-reduced-motion:reduce){.chat-botao{transition:none}}