/* ---------------------------------------------------------
   El Especialista — widget de chat
   Compartido entre vitomartinez.com y 7dias.cl (mismo archivo,
   copiado a los dos sitios). Se apoya en las variables de tema
   que ambos sitios ya definen (--accent, --accent-ink, --text,
   --hair, --muted): hereda el color de marca de cada sitio sin
   configuración aparte. Cero border-radius, sin dependencias
   externas — mismas reglas que el resto del sitio.
--------------------------------------------------------- */

#esp-launcher{
  position:fixed;
  right:20px;
  bottom:20px;
  z-index:9999;
  display:flex;
  align-items:center;
  gap:8px;
  background:var(--accent);
  color:var(--accent-ink);
  border:0;
  border-radius:0;
  padding:14px 20px;
  font:800 13px/1 "Helvetica Neue",Helvetica,Arial,sans-serif;
  letter-spacing:.03em;
  text-transform:uppercase;
  cursor:pointer;
  box-shadow:0 4px 20px rgba(0,0,0,.35);
}
#esp-launcher:hover{ filter:brightness(1.08); }
#esp-launcher.esp-hidden{ display:none; }

.esp-icon{
  width:16px;
  height:16px;
  flex:0 0 auto;
}

#esp-panel{
  position:fixed;
  right:20px;
  bottom:20px;
  z-index:9999;
  width:380px;
  max-width:calc(100vw - 32px);
  height:560px;
  max-height:calc(100vh - 32px);
  background:#000;
  border:1px solid var(--hair);
  display:flex;
  flex-direction:column;
  font-family:"Helvetica Neue",Helvetica,Arial,sans-serif;
}
#esp-panel.esp-hidden{ display:none; }

#esp-head{
  background:var(--accent);
  color:var(--accent-ink);
  padding:14px 16px;
  display:flex;
  align-items:center;
  justify-content:space-between;
  font-weight:800;
  text-transform:uppercase;
  letter-spacing:.03em;
  font-size:13px;
  flex:0 0 auto;
}
#esp-head > span{
  display:flex;
  align-items:center;
  gap:8px;
}
#esp-close{
  background:transparent;
  border:0;
  color:var(--accent-ink);
  font-size:20px;
  line-height:1;
  cursor:pointer;
  padding:0 4px;
}

#esp-body{
  flex:1;
  overflow-y:auto;
  padding:16px;
  display:flex;
  flex-direction:column;
  gap:10px;
}
.esp-msg{
  max-width:85%;
  padding:10px 12px;
  font-size:14px;
  line-height:1.45;
  border:1px solid var(--hair);
  word-wrap:break-word;
}
.esp-msg a{ color:inherit; text-decoration:underline; }
.esp-msg-bot{
  align-self:flex-start;
  background:rgba(255,255,255,0.05);
  color:var(--text);
}
.esp-msg-user{
  align-self:flex-end;
  background:var(--accent);
  color:var(--accent-ink);
  border-color:var(--accent);
}
.esp-typing{
  align-self:flex-start;
  color:var(--muted);
  font-size:13px;
  padding:4px 12px;
}

#esp-form{
  display:flex;
  align-items:flex-end;
  border-top:1px solid var(--hair);
  flex:0 0 auto;
}
#esp-input{
  flex:1;
  min-width:0;
  resize:none;
  background:#000;
  color:var(--text);
  border:0;
  padding:14px;
  font-size:14px;
  line-height:1.4;
  font-family:inherit;
  max-height:96px;
  overflow-y:auto;
}
#esp-input:focus{ outline:none; }
#esp-input::placeholder{ color:var(--muted); }
#esp-send{
  background:var(--accent);
  color:var(--accent-ink);
  border:0;
  padding:14px 18px;
  font-weight:800;
  text-transform:uppercase;
  font-size:12px;
  letter-spacing:.03em;
  cursor:pointer;
  flex:0 0 auto;
}
#esp-send:disabled{ opacity:.5; cursor:default; }

@media (max-width:480px){
  #esp-panel{
    right:0; bottom:0; left:0; top:0;
    width:auto; height:auto; max-width:none; max-height:none;
    border:0;
  }
  #esp-launcher{ right:16px; bottom:16px; }
}

@media (prefers-reduced-motion:no-preference){
  #esp-panel{ animation:esp-in .18s ease-out; }
}
@keyframes esp-in{
  from{ opacity:0; transform:translateY(8px); }
  to{ opacity:1; transform:none; }
}
