/* chat-widget.css — Trading en Conjunto / Chat de soporte (botón flotante + panel)
   Todo con prefijo .tecchat- para no chocar con los estilos de cada página.
   z-index 190: queda debajo de los popups/modales de la web (WhatsApp 1000, compra 200). */
.tecchat-root{--tc-ink:#211F30;--tc-soft:#5B5870;--tc-mute:#6A6780;--tc-line:#E6E3F0;--tc-bg:#F6F5FA;--tc-blue:#6C9CF5;
  --tc-grad:linear-gradient(90deg,#B784EA,#6C9CF5,#5FD1C9,#8FDB8C,#F5D667,#FFA45B,#FF8FA3,#E38FE0);
  --tc-bottom:20px;
  font-family:'Inter',-apple-system,BlinkMacSystemFont,'Segoe UI',Roboto,Arial,sans-serif;font-size:15px;line-height:1.45;color:var(--tc-ink);
  -webkit-font-smoothing:antialiased;}
.tecchat-root *,.tecchat-root *::before,.tecchat-root *::after{box-sizing:border-box;}

/* ---------- botón flotante ---------- */
/* Píldora negra con borde de colores del logo + robot; en celular queda solo el círculo con el robot */
.tecchat-btn{position:fixed;right:20px;bottom:var(--tc-bottom);z-index:190;display:flex;align-items:center;gap:10px;height:62px;padding:4px 20px 4px 4px;
  border-radius:100px;border:2px solid transparent;cursor:pointer;color:#fff;font:inherit;text-align:left;
  background:linear-gradient(#17151F,#17151F) padding-box,conic-gradient(#B784EA,#6C9CF5,#5FD1C9,#8FDB8C,#F5D667,#FFA45B,#FF8FA3,#E38FE0,#B784EA) border-box;
  box-shadow:0 16px 34px -10px rgba(33,31,48,.6),0 0 0 4px rgba(108,156,245,.12);transition:transform .2s ease,box-shadow .2s ease;}
.tecchat-btn:hover{transform:translateY(-3px);box-shadow:0 20px 38px -10px rgba(33,31,48,.65),0 0 0 6px rgba(108,156,245,.18);}
.tecchat-btn:focus-visible{outline:3px solid var(--tc-blue);outline-offset:3px;}
.tecchat-btn-in{flex:0 0 auto;display:flex;align-items:center;justify-content:center;width:50px;height:50px;border-radius:50%;background:#2A2738;}
.tecchat-bot{width:40px;height:40px;display:block;animation:tecchat-bob 3s ease-in-out infinite;}
.tecchat-bot-eyes{transform-box:fill-box;transform-origin:center;animation:tecchat-blink 4.5s infinite;}
.tecchat-bot-ant{animation:tecchat-glow 1.6s ease-in-out infinite alternate;}
@keyframes tecchat-bob{0%,100%{transform:translateY(0);}50%{transform:translateY(-2px);}}
@keyframes tecchat-blink{0%,92%,100%{transform:scaleY(1);}95%{transform:scaleY(.1);}}
@keyframes tecchat-glow{from{fill:#FFA45B;}to{fill:#F5D667;}}
.tecchat-btn-txt{display:flex;flex-direction:column;line-height:1.15;white-space:nowrap;}
.tecchat-btn-txt b{font-size:15px;font-weight:800;letter-spacing:.01em;}
.tecchat-btn-txt small{display:flex;align-items:center;gap:6px;font-size:12.5px;color:#C9C6D8;}
.tecchat-btn-txt small i{width:8px;height:8px;border-radius:50%;background:#8FDB8C;box-shadow:0 0 0 3px rgba(143,219,140,.25);}
.tecchat-btn::after{content:'';position:absolute;inset:-6px;border-radius:100px;border:2px solid #6C9CF5;opacity:0;animation:tecchat-pulse 3s ease-out 1.5s infinite;pointer-events:none;}
@keyframes tecchat-pulse{0%{transform:scale(.96);opacity:.7;}70%,100%{transform:scale(1.12);opacity:0;}}
.tecchat-dot{position:absolute;top:-2px;right:-2px;min-width:20px;height:20px;padding:0 5px;border-radius:10px;background:#E5484D;color:#fff;
  font-size:11px;font-weight:700;line-height:20px;text-align:center;border:2px solid #fff;}
.tecchat-dot[hidden]{display:none;}
.tecchat-root.is-open .tecchat-btn::after{display:none;}

/* ---------- panel ---------- */
.tecchat-panel{position:fixed;right:20px;bottom:calc(var(--tc-bottom) + 72px);z-index:191;width:370px;max-width:calc(100vw - 24px);
  height:min(600px,calc(100vh - var(--tc-bottom) - 96px));display:flex;flex-direction:column;background:#fff;border:1px solid var(--tc-line);
  border-radius:20px;box-shadow:0 30px 70px -20px rgba(33,31,48,.38);overflow:hidden;
  opacity:0;transform:translateY(12px);transition:opacity .2s ease,transform .2s ease;}
.tecchat-panel[hidden]{display:none;}
.tecchat-root.is-open .tecchat-panel{opacity:1;transform:none;}
.tecchat-head{position:relative;display:flex;align-items:center;gap:10px;padding:16px 14px 12px 16px;border-bottom:1px solid var(--tc-line);background:#fff;flex:0 0 auto;}
.tecchat-head::before{content:'';position:absolute;top:0;left:0;right:0;height:4px;background:var(--tc-grad);}
.tecchat-head img{width:36px;height:36px;border-radius:50%;flex:0 0 auto;object-fit:contain;background:var(--tc-bg);}
.tecchat-title{flex:1 1 auto;min-width:0;}
.tecchat-title b{display:block;font-family:'Poppins','Inter',sans-serif;font-size:15px;font-weight:700;line-height:1.2;}
.tecchat-title span{display:block;font-size:12px;color:var(--tc-mute);line-height:1.3;margin-top:2px;}
.tecchat-x{flex:0 0 auto;width:36px;height:36px;border:0;border-radius:50%;background:var(--tc-bg);color:var(--tc-soft);font-size:22px;line-height:1;cursor:pointer;}
.tecchat-x:hover{background:var(--tc-line);color:var(--tc-ink);}
.tecchat-x:focus-visible,.tecchat-send:focus-visible,.tecchat-chip:focus-visible{outline:3px solid var(--tc-blue);outline-offset:2px;}

.tecchat-list{flex:1 1 auto;overflow-y:auto;overflow-x:hidden;padding:14px;background:var(--tc-bg);display:flex;flex-direction:column;gap:8px;overscroll-behavior:contain;}
.tecchat-msg{max-width:86%;padding:9px 12px;border-radius:16px;font-size:14px;line-height:1.5;word-wrap:break-word;overflow-wrap:anywhere;white-space:normal;}
.tecchat-msg.u{align-self:flex-end;background:var(--tc-blue);color:#fff;border-bottom-right-radius:5px;}
.tecchat-msg.b,.tecchat-msg.a{align-self:flex-start;background:#fff;border:1px solid var(--tc-line);border-bottom-left-radius:5px;}
.tecchat-msg.a{border-color:#BFE8CF;background:#F2FBF5;}
.tecchat-msg .tecchat-who{display:block;font-size:11px;font-weight:700;color:#1F7A55;margin-bottom:2px;}
.tecchat-msg a{color:#3F63B8;text-decoration:underline;overflow-wrap:anywhere;}
.tecchat-msg.u a{color:#fff;}
.tecchat-msg b{font-weight:700;}
.tecchat-note{align-self:center;max-width:94%;font-size:12px;color:var(--tc-soft);background:#fff;border:1px dashed var(--tc-line);border-radius:10px;padding:6px 10px;text-align:center;}
.tecchat-note.err{color:#B94A4A;border-color:#F2C4C4;background:#FDF3F3;}
.tecchat-typing{align-self:flex-start;display:flex;gap:4px;padding:12px 14px;background:#fff;border:1px solid var(--tc-line);border-radius:16px;border-bottom-left-radius:5px;}
.tecchat-typing i{width:7px;height:7px;border-radius:50%;background:var(--tc-mute);animation:tecchat-dot 1.2s infinite ease-in-out;}
.tecchat-typing i:nth-child(2){animation-delay:.15s;} .tecchat-typing i:nth-child(3){animation-delay:.3s;}
@keyframes tecchat-dot{0%,80%,100%{transform:translateY(0);opacity:.5;}40%{transform:translateY(-4px);opacity:1;}}

.tecchat-chips{display:flex;flex-wrap:wrap;gap:6px;padding:10px 14px 0;background:#fff;flex:0 0 auto;}
.tecchat-chips[hidden]{display:none;}
.tecchat-chip{border:1.5px solid var(--tc-line);background:#fff;color:var(--tc-ink);border-radius:100px;padding:6px 11px;font:inherit;font-size:12.5px;font-weight:600;cursor:pointer;max-width:100%;text-align:left;}
.tecchat-chip:hover{border-color:var(--tc-blue);color:#3F63B8;}

.tecchat-form{display:flex;align-items:flex-end;gap:8px;padding:10px 12px 6px;background:#fff;flex:0 0 auto;}
.tecchat-input{flex:1 1 auto;min-width:0;resize:none;border:1.5px solid var(--tc-line);border-radius:14px;padding:10px 12px;font:inherit;font-size:16px;line-height:1.35;
  max-height:110px;min-height:42px;overflow-y:hidden;color:var(--tc-ink);background:#fff;}
.tecchat-input:focus{outline:none;border-color:var(--tc-blue);}
.tecchat-send{flex:0 0 auto;width:42px;height:42px;border:0;border-radius:50%;background:var(--tc-blue);color:#fff;cursor:pointer;display:flex;align-items:center;justify-content:center;}
.tecchat-send:disabled{opacity:.5;cursor:default;}
.tecchat-send svg{width:18px;height:18px;}
.tecchat-priv{padding:2px 14px 10px;background:#fff;font-size:11px;color:var(--tc-mute);text-align:center;flex:0 0 auto;}
.tecchat-priv a{color:var(--tc-mute);}
.tecchat-sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap;}

/* ---------- celular: panel a pantalla completa ---------- */
@media (max-width:480px){
  .tecchat-btn{right:14px;width:62px;height:62px;padding:4px;justify-content:center;}
  .tecchat-btn-txt{display:none;}
  .tecchat-panel{inset:0;right:0;bottom:0;width:100%;max-width:100%;height:100%;height:100dvh;border-radius:0;border:0;}
  .tecchat-root.is-open .tecchat-btn{display:none;}
}
@media (prefers-reduced-motion:reduce){
  .tecchat-btn,.tecchat-panel{transition:none;}
  .tecchat-btn::after,.tecchat-typing i,.tecchat-bot,.tecchat-bot-eyes,.tecchat-bot-ant{animation:none;}
}
@media print{.tecchat-root{display:none;}}

/* Botón "Seguir por WhatsApp" (links wa.me que manda el bot) */
.tecchat-root a.tecchat-wa{display:inline-block;margin:8px 0 2px;padding:9px 16px;border-radius:999px;background:#25D366;color:#052E16 !important;font-weight:700;text-decoration:none !important;box-shadow:0 2px 8px rgba(37,211,102,.35);}
.tecchat-root a.tecchat-wa:hover{background:#1EBE5A;}
