/* ════════════════════════════════════════════════════════ */
/*                        ASISTENTE                         */
/* ════════════════════════════════════════════════════════ */
.chat-wrap{
  display:flex;
  flex-direction:column;
  height:calc(100vh - 94px);
  background:var(--bg2);
  border:1px solid var(--border);
  border-radius:var(--r);
  overflow:hidden;}

/* ───────────────────────────────────────────── */
/*                  CHAT HEADER                  */
/* ───────────────────────────────────────────── */
.chat-header{
  display:flex;
  align-items:center;
  gap:12px;
  padding:14px 18px;
  background:
    linear-gradient(135deg,
      rgba(139,92,246,.08),
      rgba(232,96,44,.08));
  border-bottom:1px solid var(--border);}

.chat-hic{
  display:flex;
  align-items:center;
  justify-content:center;
  width:36px;
  height:36px;
  background:linear-gradient(135deg,var(--purple),var(--acc));
  border-radius:10px;
  font-size:18px;}

.chat-htitle{
  font-size:14px;
  font-weight:700;}

.chat-hsub{
  font-size:11px;
  color:var(--text2);}

/* ───────────────────────────────────────────── */
/*                 CHAT CONTEXT                  */
/* ───────────────────────────────────────────── */
.chat-context{
  display:flex;
  align-items:center;
  flex-wrap:wrap;
  gap:10px;
  padding:10px 18px;
  background:var(--bg3);
  border-bottom:1px solid var(--border);}

.chat-ctx-label{
  font-size:11px;
  color:var(--text2);}

.ctx-chip{
  padding:3px 10px;
  background:var(--bg4);
  border:1px solid var(--border);
  border-radius:20px;
  font-size:11px;
  color:var(--text2);}

.ctx-chip.on{
  background:var(--acc-dim);
  border-color:var(--acc);
  color:var(--acc);}

/* ───────────────────────────────────────────── */
/*                 CHAT MENSAJES                 */
/* ───────────────────────────────────────────── */
.chat-msgs{
  flex:1;
  display:flex;
  flex-direction:column;
  gap:14px;
  overflow-y:auto;
  padding:18px;}

.msg{display:flex;gap:10px;}

.msg.user{flex-direction:row-reverse;}

.msg-av{
  display:flex;
  align-items:center;
  justify-content:center;
  width:30px;
  height:30px;
  border-radius:50%;
  font-size:13px;
  flex-shrink:0;}

.msg.ai .msg-av{
  background:linear-gradient(135deg,var(--purple),var(--acc));
  color:#fff;}

.msg.user .msg-av{
  background:var(--acc);
  color:#fff;
  font-size:10px;
  font-weight:800;}

.msg-bubble{
  max-width:75%;
  padding:12px 14px;
  border-radius:12px;
  font-size:13px;
  line-height:1.6;}

.msg.ai .msg-bubble{
  background:var(--bg3);
  border:1px solid var(--border);
  border-radius:4px 12px 12px 12px;}

.msg.user .msg-bubble{
  background:var(--acc);
  color:#fff;
  border-radius:12px 4px 12px 12px;}

.msg-bubble strong{color:var(--acc);}

/* ───────────────────────────────────────────── */
/*               CHAT SUGGESTIONS                */
/* ───────────────────────────────────────────── */
.chat-suggestions{
  display:flex;
  flex-wrap:wrap;
  gap:7px;
  padding:0 18px 12px;}

.sug{
  padding:5px 12px;
  background:var(--bg3);
  border:1px solid var(--border);
  border-radius:20px;
  font-size:11.5px;
  color:var(--text2);}

.sug:hover{
  border-color:var(--acc);
  color:var(--acc);}

/* ───────────────────────────────────────────── */
/*                  CHAT INPUT                   */
/* ───────────────────────────────────────────── */
.chat-inp{
  display:flex;
  align-items:flex-end;
  gap:10px;
  padding:14px 18px;
  border-top:1px solid var(--border);}

.chat-inp textarea{
  flex:1;
  min-height:44px;
  max-height:120px;
  padding:10px 13px;
  background:var(--bg3);
  border:1px solid var(--border);
  border-radius:9px;
  color:var(--text);
  font-size:13px;
  outline:none;
  resize:none;}

.chat-send{
  display:flex;
  align-items:center;
  justify-content:center;
  width:40px;
  height:40px;
  background:var(--acc);
  border:none;
  border-radius:9px;
  color:#fff;
  font-size:16px;}

/* ───────────────────────────────────────────── */
/*                ASSISTANT TOOLS                */
/* ───────────────────────────────────────────── */
.assistant-tools{
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:10px;
  padding:12px 18px;
  border-bottom:1px solid var(--border);}

.assistant-tool{
  padding:10px;
  background:var(--bg3);
  border:1px solid var(--border);
  border-radius:8px;
  font-size:12px;}

.assistant-tool b{
  display:block;
  margin-bottom:3px;}

/* ───────────────────────────────────────────── */
/*               PROVIDER SELECT                 */
/* ───────────────────────────────────────────── */
.provider-select{
  margin-left:auto;
  padding:6px 9px;
  background:var(--bg3);
  border:1px solid var(--border);
  border-radius:7px;
  color:var(--text);
  font-size:12px;}

/* ════════════════════════════════════════════════════════ */
/*                        SOPORTE                           */
/* ════════════════════════════════════════════════════════ */
#support-fab{
  position:fixed;
  right:24px;
  bottom:24px;
  z-index:610;
  width:52px;
  height:52px;
  background:linear-gradient(135deg,var(--purple),var(--acc));
  border:1px solid rgba(139,92,246,.45);
  border-radius:50%;
  color:#fff;
  font-size:22px;
  box-shadow:0 16px 40px rgba(0,0,0,.5);}

/* ───────────────────────────────────────────── */
/*                 SUPPORT PANEL                 */
/* ───────────────────────────────────────────── */
.support-panel{
  position:fixed;
  right:24px;
  bottom:88px;
  z-index:611;
  display:none;
  flex-direction:column;
  width:340px;
  height:460px;
  overflow:hidden;
  background:var(--bg2);
  border:1px solid var(--border);
  border-radius:16px;
  box-shadow:0 24px 60px rgba(0,0,0,.55);
  animation:fadeUp .2s ease;}

.support-panel.show{display:flex;}

/* ───────────────────────────────────────────── */
/*                SUPPORT HEADER                 */
/* ───────────────────────────────────────────── */
.support-h{
  display:flex;
  align-items:center;
  justify-content:space-between;
  padding:13px 16px;
  background:linear-gradient(135deg,
      rgba(139,92,246,.1),
      rgba(232,96,44,.08));
  border-bottom:1px solid var(--border);}

.support-t{font-weight:800;}

.support-sub{
  font-size:11px;
  color:var(--text2);}

/* ───────────────────────────────────────────── */
/*               SUPPORT AGENTS                  */
/* ───────────────────────────────────────────── */
.support-agents{
  display:flex;
  gap:10px;
  padding:9px 13px;
  background:var(--bg3);
  border-bottom:1px solid var(--border);}

.s-agent{
  display:flex;
  align-items:center;
  gap:5px;
  font-size:11px;
  color:var(--text2);}

.s-agent-dot{
  width:7px;
  height:7px;
  border-radius:50%;}

/* ───────────────────────────────────────────── */
/*                SUPPORT MENSAJES               */
/* ───────────────────────────────────────────── */
.support-msgs{
  flex:1;
  display:flex;
  flex-direction:column;
  gap:9px;
  overflow:auto;
  padding:13px;}

.smsg{
  padding:9px 10px;
  background:var(--bg3);
  border:1px solid var(--border);
  border-radius:10px;
  color:var(--text2);
  font-size:12px;}

.smsg.me{
  margin-left:40px;
  background:var(--acc);
  border-color:var(--acc);
  color:#fff;}

/* ───────────────────────────────────────────── */
/*                 SUPPORT INPUT                 */
/* ───────────────────────────────────────────── */
.support-in{
  display:flex;
  gap:7px;
  padding:11px;
  border-top:1px solid var(--border);}

.support-in input{flex:1;}

/* ───────────────────────────────────────────── */
/*                 QUICK ACTIONS                 */
/* ───────────────────────────────────────────── */
.quick{
  display:flex;
  flex-wrap:wrap;
  gap:6px;
  margin-top:6px;}

.qbtn{
  padding:4px 8px;
  background:var(--bg3);
  border:1px solid var(--border);
  border-radius:999px;
  color:var(--text2);
  font-size:11px;}