/* Nipomax · Chat de WhatsApp — estilos del plugin. El tema puede redefinir las variables --wc-*. */
/* ============================================================
   MINI CHAT DE WHATSAPP (2-oct-2026)
   Colores por --wc-*; cada tema los define.
   ============================================================ */
.wachat{
  --wc-fondo:#fff;--wc-sup:#f4f6fa;--wc-linea:rgba(1,42,96,.14);--wc-texto:#0b1f45;--wc-suave:#5f6f8c;
  --wc-agente:#eef2f8;--wc-yo:#012A60;--wc-yo-texto:#fff;--wc-acento:#012A60;
  position:fixed;right:20px;bottom:20px;z-index:1000;width:min(380px,calc(100vw - 24px));height:min(560px,calc(100vh - 120px));
  display:flex;flex-direction:column;background:var(--wc-fondo);border:1px solid var(--wc-linea);border-radius:18px;overflow:hidden;
  box-shadow:0 24px 70px rgba(0,0,0,.35);opacity:0;transform:translateY(16px) scale(.98);transition:opacity .25s,transform .25s;
  font-family:var(--f-texto);
}
.wachat.abierto{opacity:1;transform:none}
.wachat[hidden]{display:none}
.wachat__cab{display:flex;align-items:center;gap:.7rem;padding:.85rem 1rem;background:#075E54;color:#fff}
.wachat__cab img{width:40px;height:40px;border-radius:50%;background:#fff;padding:4px;object-fit:contain}
.wachat__cab b{display:block;font-family:var(--f-display);font-size:1rem}
.wachat__cab span{display:flex;align-items:center;gap:.35rem;font-size:.76rem;opacity:.9}
.wachat__cab i{width:8px;height:8px;border-radius:50%;background:#25D366;box-shadow:0 0 0 3px rgba(37,211,102,.3)}
.wachat__cerrar{margin-left:auto;background:transparent;border:0;color:#fff;font-size:1.7rem;line-height:1;cursor:pointer;padding:.2rem .4rem}
.wachat__msgs{flex:1;overflow-y:auto;padding:1rem .9rem;display:flex;flex-direction:column;gap:.5rem;background:var(--wc-sup)}
.wachat__b{max-width:85%;padding:.6rem .85rem;border-radius:14px;font-size:.93rem;line-height:1.4;white-space:pre-line;animation:wachat-entra .3s ease}
.wachat__b--agente{align-self:flex-start;background:var(--wc-agente);color:var(--wc-texto);border-bottom-left-radius:4px}
.wachat__b--yo{align-self:flex-end;background:var(--wc-yo);color:var(--wc-yo-texto);border-bottom-right-radius:4px}
.wachat__b--resumen{align-self:stretch;max-width:none;background:var(--wc-fondo);color:var(--wc-texto);border:1px dashed var(--wc-linea);font-size:.86rem}
.wachat__escribe{display:flex;gap:4px;padding:.8rem .9rem}
.wachat__escribe span{width:7px;height:7px;border-radius:50%;background:var(--wc-suave);animation:wc-punto 1s infinite}
.wachat__escribe span:nth-child(2){animation-delay:.15s}.wachat__escribe span:nth-child(3){animation-delay:.3s}
@keyframes wc-punto{0%,60%,100%{opacity:.3;transform:none}30%{opacity:1;transform:translateY(-3px)}}
.wachat__entrada{padding:.75rem .9rem;border-top:1px solid var(--wc-linea);background:var(--wc-fondo);display:flex;flex-direction:column;gap:.55rem;max-height:46%;overflow-y:auto}
.wachat__chips{display:flex;flex-wrap:wrap;gap:.4rem}
.wachat__chip{padding:.45rem .75rem;border-radius:999px;border:1px solid var(--wc-linea);background:transparent;color:var(--wc-texto);font-size:.84rem;cursor:pointer;transition:all .2s}
.wachat__chip:hover{border-color:var(--wc-acento)}
.wachat__chip.activa{background:var(--wc-acento);border-color:var(--wc-acento);color:var(--wc-fondo)}
.wachat__form{display:flex;gap:.5rem;align-items:center;flex-wrap:wrap}
.wachat__form input{flex:1;min-width:0;padding:.65rem .85rem;border-radius:999px;border:1px solid var(--wc-linea);background:var(--wc-sup);color:var(--wc-texto);font-size:.93rem}
.wachat__form input:focus{outline:none;border-color:var(--wc-acento)}
.wachat__enviar{padding:.6rem 1.1rem;border-radius:999px;border:0;background:#25D366;color:#fff;font-weight:600;cursor:pointer}
.wachat__enviar:disabled{opacity:.4;cursor:default}
.wachat__saltar{background:transparent;border:0;color:var(--wc-suave);font-size:.84rem;cursor:pointer;text-decoration:underline}
.wachat__wa{display:flex;align-items:center;justify-content:center;gap:.5rem;padding:.85rem;border-radius:12px;background:#25D366;color:#fff!important;font-weight:700;font-family:var(--f-display)}
.wachat__wa svg{width:22px;height:22px}
.wachat__wa:hover{background:#1ebe5b}
@media (max-width:768px){.wachat{right:12px;bottom:84px;height:min(520px,calc(100vh - 160px))}}
@media (prefers-reduced-motion:reduce){.wachat,.wachat__b{transition:none;animation:none}.wachat__escribe span{animation:none}}

/* Botón flotante del chat (2-oct-2026), siempre visible abajo a la derecha */
.wa-lanzador{position:fixed;right:20px;bottom:20px;z-index:990;display:flex;align-items:flex-end;gap:.7rem}
.wa-boton{position:relative;width:62px;height:62px;border-radius:50%;border:0;cursor:pointer;background:#25D366;color:#fff;display:grid;place-items:center;
  box-shadow:0 10px 28px rgba(37,211,102,.45);animation:wa-respira 2.8s ease-in-out infinite;transition:transform .2s}
.wa-boton:hover{transform:scale(1.07)}
.wa-boton .icono-wa{width:32px;height:32px;fill:currentColor;stroke:none}
.wa-boton__punto{position:absolute;top:3px;right:3px;width:14px;height:14px;border-radius:50%;background:#DD0917;border:2px solid #fff}
@keyframes wa-respira{0%,100%{box-shadow:0 10px 28px rgba(37,211,102,.45),0 0 0 0 rgba(37,211,102,.45)}50%{box-shadow:0 10px 28px rgba(37,211,102,.45),0 0 0 12px rgba(37,211,102,0)}}
.wa-cta{position:relative;max-width:240px;background:#fff;color:#0b1f45;border-radius:14px 14px 4px 14px;padding:.8rem 2rem .85rem 1rem;
  box-shadow:0 14px 40px rgba(0,0,0,.3);cursor:pointer;opacity:0;transform:translateY(8px);transition:opacity .25s,transform .25s;margin-bottom:8px}
.wa-cta.visible{opacity:1;transform:none}
.wa-cta[hidden]{display:none}
.wa-cta b{display:block;font-family:var(--f-display);font-size:.98rem;line-height:1.25;margin-bottom:.2rem}
.wa-cta span{display:block;font-size:.82rem;color:#5f6f8c;line-height:1.35}
.wa-cta__cerrar{position:absolute;top:4px;right:6px;background:transparent;border:0;color:#5f6f8c;font-size:1.2rem;cursor:pointer;line-height:1;padding:.2rem}
.wachat-abierto .wa-lanzador{display:none}
@media (max-width:768px){.wa-lanzador{right:14px;bottom:82px}.wa-boton{width:56px;height:56px}.wa-cta{max-width:210px}}
@media (prefers-reduced-motion:reduce){.wa-boton{animation:none}}

@keyframes wachat-entra{from{opacity:0;transform:translateY(8px)}to{opacity:1;transform:none}}
