/* ============================================================
   SITW — Asesor de IA flotante (paleta violeta, sin turquesa)
   FAB inferior derecho + panel (~25% de pantalla). Cara = imagen
   pixel-art (asesor-face.png) que pulsa y glitchea al hablar.
   ============================================================ */

/* Fix crítico: el atributo hidden debe ganar al display del panel */
.sitw-asesor-panel[hidden]{display:none !important;}

/* ── Botón flotante ── */
.sitw-asesor-fab{
  position:fixed;right:22px;bottom:22px;z-index:100020;
  width:60px;height:60px;border-radius:50%;border:none;cursor:pointer;
  display:inline-flex;align-items:center;justify-content:center;color:#fff;
  padding:0;overflow:hidden;
  background:linear-gradient(135deg,#6a1fd6,#9b30ff 55%,#c04bff);
  box-shadow:0 14px 38px -8px rgba(123,47,255,.8), 0 0 0 1px rgba(255,255,255,.12) inset;
  transition:transform .18s, box-shadow .25s;
  animation:sitw-asesor-pop .5s cubic-bezier(.2,.8,.3,1.2) both;
}
.sitw-asesor-fab:hover{transform:translateY(-3px) scale(1.05);box-shadow:0 20px 46px -8px rgba(155,48,255,.75);}
.sitw-asesor-fab-img{
  position:absolute;inset:6px;z-index:1;border-radius:50%;
  background-size:contain;background-position:center;background-repeat:no-repeat;
  filter:drop-shadow(0 2px 6px rgba(10,4,24,.55));
}
/* Brillo: gloss estático + banda de barrido angosta (antes se deslizaba la capa entera) */
.sitw-asesor-fab-effects{
  position:absolute;inset:0;z-index:3;border-radius:50%;pointer-events:none;overflow:hidden;
  background:radial-gradient(circle at 36% 26%, rgba(255,255,255,.28), transparent 34%);
  mix-blend-mode:screen;
}
.sitw-asesor-fab-effects::before{
  content:"";position:absolute;top:-25%;bottom:-25%;left:0;width:32%;
  background:linear-gradient(105deg, transparent, rgba(255,255,255,.35), transparent);
  transform:translateX(-180%) rotate(10deg);
  animation:sitw-asesor-fab-scan 3.6s ease-in-out infinite;
}
.sitw-asesor-fab::after{
  content:"";position:absolute;inset:0;z-index:3;border-radius:50%;pointer-events:none;
  border:1px solid rgba(255,255,255,.22);box-shadow:inset 0 0 16px rgba(255,255,255,.1);
}
/* La cara ES la identidad del asesor: el ícono de chat queda como detalle,
   chico y abajo a la derecha, en su propia burbuja (antes se pisaba con la cara). */
.sitw-asesor-fab-icon{
  position:absolute;right:-1px;bottom:-1px;z-index:4;
  width:22px;height:22px;padding:4px;border-radius:50%;
  background:linear-gradient(135deg,#7b2fff,#c04bff);
  border:2px solid #0a0713;box-sizing:border-box;
  filter:none;transform:none;top:auto;left:auto;
}
.sitw-asesor-fab svg{display:block;}
.sitw-asesor-fab-dot{
  position:absolute;top:4px;right:4px;z-index:5;width:12px;height:12px;border-radius:50%;
  background:#33d17a;border:2px solid #07070b;
  animation:sitw-asesor-ping 2.2s ease-in-out infinite;
}
@keyframes sitw-asesor-pop{from{opacity:0;transform:scale(.4)}to{opacity:1;transform:scale(1)}}
@keyframes sitw-asesor-ping{0%,100%{box-shadow:0 0 0 0 rgba(51,209,122,.5)}50%{box-shadow:0 0 0 7px rgba(51,209,122,0)}}
@keyframes sitw-asesor-fab-scan{0%,55%{transform:translateX(-200%) rotate(10deg)}100%{transform:translateX(430%) rotate(10deg)}}
.sitw-asesor-fab.is-open{transform:scale(.88);opacity:.85;}

/* ── Panel: ~25% de pantalla, cuadrante inferior derecho ── */
.sitw-asesor-panel{
  position:fixed;right:22px;bottom:96px;z-index:100019;
  width:min(50vw,680px);height:min(50vh,540px);
  display:flex;flex-direction:column;overflow:hidden;
  background:linear-gradient(180deg,#0d0c16,#07070b);
  border:1px solid rgba(155,48,255,.4);border-radius:20px;
  box-shadow:0 40px 90px -20px rgba(0,0,0,.85), 0 0 60px -24px rgba(123,47,255,.6);
  animation:sitw-asesor-rise .32s cubic-bezier(.2,.8,.3,1.1) both;
}
@keyframes sitw-asesor-rise{from{opacity:0;transform:translateY(24px) scale(.96)}to{opacity:1;transform:none}}

/* ── Header ── */
.sitw-asesor-head{
  flex:none;display:flex;align-items:center;gap:12px;
  padding:13px 16px;border-bottom:1px solid rgba(255,255,255,.08);
  background:rgba(255,255,255,.025);
}
.sitw-asesor-status{width:9px;height:9px;border-radius:50%;background:#33d17a;box-shadow:0 0 10px #33d17a;animation:sitw-asesor-ping 2.2s infinite;}
.sitw-asesor-head-txt{display:flex;flex-direction:column;line-height:1.2;min-width:0;}
.sitw-asesor-head-txt b{color:#fff;font-size:14px;font-weight:800;letter-spacing:.02em;}
.sitw-asesor-head-txt small{color:rgba(255,255,255,.5);font-size:10.5px;letter-spacing:.14em;text-transform:uppercase;font-weight:700;}
.sitw-asesor-close{
  margin-left:auto;background:rgba(255,255,255,.06);border:1px solid rgba(255,255,255,.12);
  color:rgba(255,255,255,.75);border-radius:10px;width:32px;height:32px;display:inline-flex;align-items:center;justify-content:center;padding:0;cursor:pointer;
  transition:background .2s,color .2s;
}
.sitw-asesor-close svg{display:block;}
.sitw-asesor-close:hover{background:rgba(155,48,255,.2);color:#fff;border-color:rgba(155,48,255,.5);}

/* ── Cuerpo: cara | chat ── */
.sitw-asesor-body{flex:1;display:flex;min-height:0;}

/* Cara (mitad izquierda): imagen pixel-art */
.sitw-asesor-face{
  flex:0 0 46%;position:relative;overflow:hidden;display:flex;align-items:center;justify-content:center;
  background:#0a0714;
  border-right:1px solid rgba(255,255,255,.07);
}
.sitw-asesor-entity{
  position:relative;z-index:1;height:100%;max-width:100%;aspect-ratio:428/661;
  animation:sitw-asesor-breathe 5.6s ease-in-out infinite;
  will-change:transform,filter;
}
.sitw-asesor-stage{
  position:absolute;inset:0;z-index:1;
  background-size:100% 100%;background-position:center;background-repeat:no-repeat;
}
@keyframes sitw-asesor-breathe{
  0%,100%{transform:scale(1.02) translateY(0);filter:brightness(1) saturate(1);}
  50%{transform:scale(1.035) translateY(-0.6%);filter:brightness(1.06) saturate(1.08);}
}
/* Al hablar: pulso de brillo en los ojos + micro-glitch */
.sitw-asesor-panel.is-speaking .sitw-asesor-entity{animation:sitw-asesor-talk 0.9s ease-in-out infinite;}
@keyframes sitw-asesor-talk{
  0%,100%{transform:scale(1.03);filter:brightness(1.08) saturate(1.15) contrast(1.04);}
  25%{transform:scale(1.04) translateX(0.4%);filter:brightness(1.28) saturate(1.35) contrast(1.1) hue-rotate(6deg);}
  55%{transform:scale(1.035) translateX(-0.3%);filter:brightness(1.12) saturate(1.2);}
  80%{transform:scale(1.045);filter:brightness(1.32) saturate(1.4);}
}
.sitw-asesor-eye-glow{
  position:absolute;z-index:2;width:12.5%;aspect-ratio:1;border-radius:50%;pointer-events:none;
  background:radial-gradient(circle, rgba(215,142,255,.78) 0%, rgba(172,72,255,.42) 40%, rgba(155,48,255,.12) 66%, transparent 72%);
  box-shadow:0 0 18px rgba(181,82,255,.82),0 0 34px rgba(155,48,255,.38);
  mix-blend-mode:screen;animation:sitw-asesor-eye-pulse 3.6s ease-in-out infinite;
}
.sitw-asesor-eye-glow-left{left:33.2%;top:39.2%;}
.sitw-asesor-eye-glow-right{left:59.6%;top:39.3%;}
@keyframes sitw-asesor-eye-pulse{
  0%,100%{opacity:.62;transform:scale(1);}
  50%{opacity:1;transform:scale(1.18);}
}
.sitw-asesor-panel.is-speaking .sitw-asesor-eye-glow{animation-duration:1.1s;}

/* Parpadeo: párpados oscuros que cubren los ojos un instante */
.sitw-asesor-eyelid{
  position:absolute;z-index:4;width:13.4%;height:8.4%;border-radius:48%;pointer-events:none;
  background:linear-gradient(180deg,#05020d 0%,#10051d 56%,#05020d 100%);
  box-shadow:0 0 12px rgba(0,0,0,.9), inset 0 -1px 0 rgba(155,48,255,.18);
  opacity:0;transform:scaleY(.18);transform-origin:center;transition:opacity .04s,transform .08s;
}
.sitw-asesor-eyelid-left{left:32.7%;top:38.9%;}
.sitw-asesor-eyelid-right{left:59.1%;top:39%;}
.sitw-asesor-panel.is-blinking .sitw-asesor-eyelid{opacity:1;transform:scaleY(1);}
.sitw-asesor-panel.is-blinking .sitw-asesor-eye-glow{opacity:0;animation:none;}
.sitw-asesor-panel.is-blinking .sitw-asesor-entity{animation:none;filter:brightness(.72) saturate(.78);transition:filter .05s;}

/* Boca: aparece solo mientras responde y se abre/cierra como la entidad de crear. */
.sitw-asesor-mouth{
  position:absolute;left:48.2%;top:59.4%;z-index:4;width:7.4%;height:1%;pointer-events:none;
  border-radius:0 0 999px 999px;background:rgba(176,82,255,.9);
  box-shadow:0 0 10px rgba(183,84,255,.9),0 0 22px rgba(155,48,255,.42);
  opacity:0;transform-origin:center;transition:opacity .18s ease;
}
.sitw-asesor-mouth::before,.sitw-asesor-mouth::after{
  content:"";position:absolute;top:-56%;width:22%;height:72%;background:inherit;box-shadow:inherit;
}
.sitw-asesor-mouth::before{left:-16%;}
.sitw-asesor-mouth::after{right:-16%;}
.sitw-asesor-panel.is-speaking .sitw-asesor-mouth{
  opacity:.95;animation:sitw-asesor-mouth-talk .38s steps(3,end) infinite;
}
@keyframes sitw-asesor-mouth-talk{
  0%{transform:scaleY(.35) scaleX(1);}
  30%{transform:scaleY(2.8) scaleX(.86);}
  60%{transform:scaleY(.8) scaleX(1.08);}
  100%{transform:scaleY(1.85) scaleX(.96);}
}
/* Línea de escaneo sutil */
.sitw-asesor-scan{
  position:absolute;inset:0;z-index:5;pointer-events:none;opacity:.65;
  background:repeating-linear-gradient(0deg, rgba(0,0,0,0) 0 3px, rgba(0,0,0,.18) 3px 4px), linear-gradient(180deg, transparent, rgba(155,48,255,.25), transparent);
  mix-blend-mode:screen;
}
.sitw-asesor-vignette{
  position:absolute;inset:0;z-index:6;pointer-events:none;
  background:radial-gradient(75% 65% at 50% 42%, transparent 55%, rgba(6,4,12,.55) 100%);
}

/* ── Chat (mitad derecha) ── */
.sitw-asesor-chat{flex:1;display:flex;flex-direction:column;min-width:0;}
.sitw-asesor-msgs{
  flex:1;overflow-y:auto;padding:16px;display:flex;flex-direction:column;gap:10px;
  scrollbar-width:thin;scrollbar-color:rgba(155,48,255,.5) transparent;
}
.sitw-asesor-msg{
  max-width:88%;padding:10px 14px;border-radius:14px;font-size:13.5px;line-height:1.55;color:#fff;
  animation:sitw-asesor-msgin .25s ease both;
}
@keyframes sitw-asesor-msgin{from{opacity:0;transform:translateY(8px)}to{opacity:1;transform:none}}
.sitw-asesor-msg--bot{
  align-self:flex-start;background:rgba(255,255,255,.05);
  border:1px solid rgba(255,255,255,.09);border-bottom-left-radius:4px;
}
.sitw-asesor-msg--user{
  align-self:flex-end;background:linear-gradient(120deg,rgba(123,47,255,.45),rgba(192,75,255,.32));
  border:1px solid rgba(155,48,255,.5);border-bottom-right-radius:4px;
}
.sitw-asesor-msg--typing{color:rgba(255,255,255,.55);font-style:italic;}
.sitw-asesor-msg--typing::after{content:"▋";animation:sitw-asesor-caret 1s steps(2) infinite;margin-left:2px;}
@keyframes sitw-asesor-caret{50%{opacity:0}}

/* Input */
.sitw-asesor-inputbar{
  flex:none;display:flex;gap:8px;padding:12px;border-top:1px solid rgba(255,255,255,.08);
  background:rgba(255,255,255,.02);
}
.sitw-asesor-inputbar input{
  flex:1;min-width:0;background:rgba(255,255,255,.05);border:1px solid rgba(255,255,255,.12);
  border-radius:11px;padding:11px 14px;color:#fff;font-size:13.5px;
  transition:border-color .2s, box-shadow .2s;
}
.sitw-asesor-inputbar input::placeholder{color:rgba(255,255,255,.35);}
.sitw-asesor-inputbar input:focus{outline:none;border-color:rgba(155,48,255,.6);box-shadow:0 0 0 3px rgba(155,48,255,.14);}
.sitw-asesor-inputbar button{
  flex:none;width:42px;height:42px;border:none;border-radius:11px;cursor:pointer;color:#fff;display:inline-flex;align-items:center;justify-content:center;padding:0;
  background:linear-gradient(120deg,#7b2fff,#c04bff);transition:transform .15s,filter .2s;
}
.sitw-asesor-inputbar button svg{display:block;}
.sitw-asesor-inputbar button:hover{transform:translateY(-1px);filter:saturate(1.2) brightness(1.08);}

/* ── Mobile ── */
@media (max-width:720px){
  .sitw-asesor-panel{right:10px;left:10px;bottom:86px;width:auto;height:min(62vh,560px);}
  .sitw-asesor-face{flex-basis:42%;}
}
@media (max-width:480px){
  .sitw-asesor-body{flex-direction:column;}
  .sitw-asesor-face{flex:0 0 36%;border-right:none;border-bottom:1px solid rgba(255,255,255,.07);}
}
@media (prefers-reduced-motion: reduce){
  .sitw-asesor-entity,.sitw-asesor-fab,.sitw-asesor-fab-dot,.sitw-asesor-status{animation:none !important;}
}