/* =================================================================
   MAX — widget de chat do agente
================================================================= */

.mx-launcher{
  position:fixed;right:22px;bottom:22px;z-index:940;
  display:flex;align-items:center;gap:10px;
  padding:0;border:none;background:none;
}
.mx-launcher__btn{
  width:60px;height:60px;border-radius:50%;flex:none;
  display:grid;place-items:center;border:1px solid rgba(255,255,255,.22);
  background:var(--grad,linear-gradient(100deg,#2b7fff,#7b5cff 45%,#22d3ee));
  color:#fff;box-shadow:0 16px 38px -14px rgba(90,110,255,.95);
  transition:transform .3s,box-shadow .3s;
}
.mx-launcher:hover .mx-launcher__btn{transform:scale(1.07)}
.mx-launcher__btn svg{width:28px;height:28px}
.mx-launcher__bubble{
  background:#0b0e26;color:#eef1ff;border:1px solid rgba(255,255,255,.16);
  padding:10px 16px;border-radius:100px 100px 4px 100px;font-size:13.5px;
  white-space:nowrap;box-shadow:0 14px 34px -18px #000;
  animation:mxPop .5s .9s both;
}
@keyframes mxPop{from{opacity:0;transform:translateY(8px) scale(.9)}to{opacity:1;transform:none}}
.mx-launcher.is-open{opacity:0;visibility:hidden;pointer-events:none}
.mx-launcher__dot{
  position:absolute;top:2px;right:2px;width:13px;height:13px;border-radius:50%;
  background:#3ddc97;border:2px solid #0b0e26;
}

/* ---------- janela ---------- */
.mx-panel{
  position:fixed;right:22px;bottom:22px;z-index:950;
  width:min(392px,calc(100vw - 32px));height:min(620px,calc(100svh - 44px));
  display:flex;flex-direction:column;overflow:hidden;
  border-radius:22px;border:1px solid rgba(255,255,255,.16);
  background:#0b0e26;box-shadow:0 50px 110px -40px rgba(0,0,0,.9);
  opacity:0;visibility:hidden;transform:translateY(24px) scale(.97);
  transition:opacity .3s,transform .3s,visibility .3s;
  font-family:var(--ff,'Poppins',system-ui,sans-serif);
}
.mx-panel.is-open{opacity:1;visibility:visible;transform:none}

.mx-head{
  display:flex;align-items:center;gap:12px;padding:16px 18px;flex:none;
  border-bottom:1px solid rgba(255,255,255,.09);
  background:linear-gradient(140deg,rgba(43,127,255,.18),rgba(123,92,255,.12));
}
.mx-head__av{
  width:42px;height:42px;border-radius:50%;flex:none;display:grid;place-items:center;
  background:var(--grad,linear-gradient(100deg,#2b7fff,#7b5cff 45%,#22d3ee));
  color:#fff;font-weight:700;font-size:17px;font-family:var(--fd,'Syne',sans-serif);
}
.mx-head__txt{flex:1;min-width:0}
.mx-head__txt strong{display:block;font-size:15px;color:#eef1ff;font-weight:600}
.mx-head__txt span{
  display:flex;align-items:center;gap:6px;font-size:12px;color:#a3aacb;margin-top:1px;
}
.mx-head__txt span::before{
  content:"";width:7px;height:7px;border-radius:50%;background:#3ddc97;
  box-shadow:0 0 0 0 rgba(61,220,151,.7);animation:mxPulse 2.4s infinite;
}
@keyframes mxPulse{0%{box-shadow:0 0 0 0 rgba(61,220,151,.6)}70%{box-shadow:0 0 0 7px rgba(61,220,151,0)}100%{box-shadow:0 0 0 0 rgba(61,220,151,0)}}
.mx-head__x{
  width:40px;height:40px;border-radius:50%;flex:none;border:none;
  background:rgba(255,255,255,.07);color:#eef1ff;font-size:20px;line-height:1;
  transition:background .25s,transform .25s;
}
.mx-head__x:hover{background:rgba(255,255,255,.16);transform:rotate(90deg)}

/* ---------- corpo ---------- */
.mx-body{
  flex:1;overflow-y:auto;padding:20px 18px;display:flex;flex-direction:column;gap:12px;
  scrollbar-width:thin;
}
.mx-body::-webkit-scrollbar{width:6px}
.mx-body::-webkit-scrollbar-thumb{background:#2a3170;border-radius:6px}

.mx-msg{
  max-width:88%;padding:12px 15px;border-radius:16px;font-size:14.2px;line-height:1.6;
  font-weight:300;white-space:pre-wrap;word-wrap:break-word;
  animation:mxIn .35s ease both;
}
@keyframes mxIn{from{opacity:0;transform:translateY(8px)}to{opacity:1;transform:none}}
.mx-msg--bot{
  align-self:flex-start;background:rgba(255,255,255,.06);
  border:1px solid rgba(255,255,255,.09);border-bottom-left-radius:5px;color:#eef1ff;
}
.mx-msg--me{
  align-self:flex-end;color:#fff;border-bottom-right-radius:5px;
  background:var(--grad,linear-gradient(100deg,#2b7fff,#7b5cff 45%,#22d3ee));
}
.mx-msg--sys{
  align-self:center;max-width:100%;text-align:center;background:none;
  border:1px dashed rgba(255,255,255,.18);color:#22d3ee;
  font-size:11.5px;letter-spacing:.06em;text-transform:uppercase;padding:8px 14px;
}

.mx-typing{align-self:flex-start;display:flex;gap:4px;padding:14px 16px;
  background:rgba(255,255,255,.06);border:1px solid rgba(255,255,255,.09);
  border-radius:16px;border-bottom-left-radius:5px}
.mx-typing i{width:7px;height:7px;border-radius:50%;background:#7d85a8;animation:mxBounce 1.3s infinite}
.mx-typing i:nth-child(2){animation-delay:.16s}
.mx-typing i:nth-child(3){animation-delay:.32s}
@keyframes mxBounce{0%,60%,100%{transform:translateY(0);opacity:.5}30%{transform:translateY(-5px);opacity:1}}

/* ---------- sugestões ---------- */
.mx-chips{display:flex;flex-wrap:wrap;gap:7px;margin-top:2px}
.mx-chip{
  padding:8px 14px;border-radius:100px;font-size:12.8px;font-weight:500;
  border:1px solid rgba(34,211,238,.42);background:rgba(34,211,238,.08);color:#22d3ee;
  transition:background .25s,transform .2s;
}
.mx-chip:hover{background:rgba(34,211,238,.2);transform:translateY(-2px)}

/* ---------- salto para o WhatsApp ---------- */
.mx-wa{
  display:flex;align-items:center;justify-content:center;gap:9px;
  padding:13px 18px;border-radius:14px;background:#25d366;color:#fff;
  font-size:14px;font-weight:600;align-self:stretch;
  transition:transform .25s,filter .25s;
}
.mx-wa:hover{transform:translateY(-2px);filter:brightness(1.06)}
.mx-wa svg{width:19px;height:19px}

/* ---------- rodapé ---------- */
.mx-foot{
  flex:none;padding:14px 16px 16px;border-top:1px solid rgba(255,255,255,.09);
  background:rgba(255,255,255,.02);
}
.mx-form{display:flex;gap:9px;align-items:flex-end}
.mx-input{
  flex:1;resize:none;max-height:110px;padding:12px 14px;border-radius:14px;
  background:rgba(255,255,255,.05);border:1px solid rgba(255,255,255,.12);
  color:#eef1ff;font-family:inherit;font-size:14px;font-weight:300;line-height:1.5;
  transition:border-color .25s;
}
.mx-input::placeholder{color:#5f668c}
.mx-input:focus{outline:none;border-color:#7b5cff}
.mx-send{
  width:44px;height:44px;flex:none;border-radius:14px;border:none;display:grid;place-items:center;
  background:var(--grad,linear-gradient(100deg,#2b7fff,#7b5cff 45%,#22d3ee));color:#fff;
  transition:transform .25s,opacity .25s;
}
.mx-send:hover:not(:disabled){transform:translateY(-2px)}
.mx-send:disabled{opacity:.4;cursor:not-allowed}
.mx-send svg{width:19px;height:19px}
.mx-note{
  margin:10px 0 0;text-align:center;font-size:11.5px;color:#6b7396;
  letter-spacing:.03em;font-weight:300;
}

/* ---------- botão do WhatsApp sobe para não colidir ---------- */
.wa{bottom:96px!important}

@media (max-width:680px){
  .mx-launcher{right:16px;bottom:16px}
  .mx-launcher__bubble{display:none}
  .mx-launcher__btn{width:54px;height:54px}
  .mx-panel{right:0;bottom:0;width:100vw;height:100svh;border-radius:0;border:none}
  .wa{bottom:84px!important;right:16px!important}
}

@media (prefers-reduced-motion:reduce){
  .mx-panel,.mx-msg,.mx-launcher__bubble{animation:none!important;transition:opacity .2s!important}
}
