/* ============================================================
   AMY — widget de chat
   Usa las variables de tema del sitio (--bg, --dark, --olive,
   --lime, --light, --font-*) para heredar el theming automático
   entre bosque/salvia/noche sin declarar colores propios.
   ============================================================ */

.amy-boton{
  position:fixed; right:16px; bottom:16px; z-index:400;
  width:92px; height:92px;
  display:flex; align-items:center; justify-content:center;
  background:none; border:none; padding:0; cursor:pointer;
  transition:transform .2s ease;
}
.amy-boton:hover{ transform:translateY(-2px) scale(1.03); }
.amy-boton__ojo{
  width:100%; height:100%; object-fit:contain;
  filter:drop-shadow(0 8px 22px rgba(0,0,0,.35));
}
.amy-boton[data-abierto="true"] .amy-boton__ojo{ display:none; }

.amy-boton__cerrar{
  display:none; position:absolute; inset:8px; border-radius:50%;
  align-items:center; justify-content:center;
  background:var(--dark); color:var(--light);
  box-shadow:0 8px 28px rgba(var(--ink-rgb),.3);
}
.amy-boton__cerrar svg{ width:26px; height:26px; }
.amy-boton[data-abierto="true"] .amy-boton__cerrar{ display:flex; }

.amy-panel{
  position:fixed; right:20px; bottom:114px; z-index:400;
  width:min(370px, calc(100vw - 32px));
  height:min(540px, calc(100vh - 130px));
  background:var(--bg); color:var(--dark);
  border-radius:18px; overflow:hidden;
  display:flex; flex-direction:column;
  box-shadow:0 20px 60px rgba(var(--ink-rgb),.3);
  border:1px solid rgba(var(--ink-rgb),.08);
  opacity:0; transform:translateY(12px) scale(.98); pointer-events:none;
  transition:opacity .18s ease, transform .18s ease;
}
.amy-panel[data-abierto="true"]{
  opacity:1; transform:translateY(0) scale(1); pointer-events:auto;
}

.amy-panel__header{
  display:flex; align-items:center; gap:10px;
  padding:16px 18px; background:var(--dark); color:var(--light);
  flex:0 0 auto;
}
.amy-panel__avatar{
  width:36px; height:36px; border-radius:50%;
  background:var(--olive); flex:0 0 auto;
  display:flex; align-items:center; justify-content:center;
  font-family:var(--font-display); font-size:15px; font-weight:600;
}
.amy-panel__titulo{ font-family:var(--font-display); font-size:15px; line-height:1.2; }
.amy-panel__subtitulo{
  font-family:var(--font-mono); font-size:10.5px; letter-spacing:.06em;
  opacity:.72; margin-top:2px;
}

.amy-panel__mensajes{
  flex:1 1 auto; overflow-y:auto; padding:16px;
  display:flex; flex-direction:column; gap:10px;
  background:var(--bg);
}

.amy-burbuja{
  max-width:82%; padding:10px 13px; border-radius:14px;
  font-family:var(--font-body); font-size:13.5px; line-height:1.5;
  white-space:pre-wrap; word-break:break-word;
}
.amy-burbuja--amy{
  align-self:flex-start; background:#ffffff;
  color:#161616; font-weight:450;
  border:1px solid rgba(var(--ink-rgb),.07);
  box-shadow:0 1px 3px rgba(var(--ink-rgb),.06);
  border-bottom-left-radius:4px;
}
.amy-burbuja--yo{
  align-self:flex-end; background:var(--olive); color:var(--light);
  border-bottom-right-radius:4px;
}

.amy-escribiendo{
  align-self:flex-start; display:flex; gap:4px; padding:12px 14px;
  background:#ffffff; border:1px solid rgba(var(--ink-rgb),.07);
  border-radius:14px; border-bottom-left-radius:4px;
}
.amy-escribiendo span{
  width:6px; height:6px; border-radius:50%; background:var(--olive);
  opacity:.5; animation:amy-parpadeo 1.1s infinite ease-in-out;
}
.amy-escribiendo span:nth-child(2){ animation-delay:.15s; }
.amy-escribiendo span:nth-child(3){ animation-delay:.3s; }
@keyframes amy-parpadeo{
  0%,80%,100%{ opacity:.35; transform:translateY(0); }
  40%{ opacity:1; transform:translateY(-2px); }
}

.amy-panel__form{
  flex:0 0 auto; display:flex; gap:8px; padding:12px;
  border-top:1px solid rgba(var(--ink-rgb),.08); background:var(--bg);
}
.amy-panel__input{
  flex:1 1 auto; border:1px solid rgba(var(--ink-rgb),.16); border-radius:10px;
  padding:10px 12px; font-family:var(--font-body); font-size:13.5px;
  background:var(--light); color:var(--dark); resize:none; max-height:90px;
}
.amy-panel__input:focus{ outline:2px solid var(--olive); outline-offset:1px; }
.amy-panel__input::placeholder{ color:rgba(var(--ink-rgb),.5); }
.amy-panel__enviar{
  flex:0 0 auto; width:40px; height:40px; border-radius:10px; border:none;
  background:var(--dark); color:var(--light); cursor:pointer;
  display:flex; align-items:center; justify-content:center;
}
.amy-panel__enviar:disabled{ opacity:.4; cursor:default; }
.amy-panel__enviar svg{ width:17px; height:17px; }

@media (max-width:480px){
  .amy-panel{ right:16px; bottom:100px; }
  .amy-boton{ right:14px; bottom:14px; width:76px; height:76px; }
}