/* Agente de la página. Todo bajo el prefijo .ag- para que no se mezcle con el
   resto de la hoja. Usa los mismos tokens de marca definidos en styles.css. */

/* ---------- lanzador ---------- */
.ag-dock{position:fixed;right:max(3vw,16px);bottom:max(3vw,16px);z-index:var(--z-dock);
  display:flex;align-items:center;gap:11px;min-height:56px;padding:9px 20px 9px 10px;
  background:var(--navy-900);color:#fff;border:1px solid rgba(224,192,113,.3);
  border-radius:999px;box-shadow:0 10px 34px -10px rgba(10,30,51,.55);
  font:600 .92rem/1.2 var(--sans);cursor:pointer;
  transition:transform var(--t),box-shadow var(--t),border-color var(--t)}
.ag-dock:hover{transform:translateY(-2px);border-color:var(--gold-300);
  box-shadow:0 16px 40px -12px rgba(10,30,51,.6)}
.ag-dock[hidden]{display:none}
.ag-dock .ag-av{width:38px;height:38px;border-radius:50%;flex:none;
  background:var(--gold-500);color:var(--navy-900);display:grid;place-items:center}
.ag-dock .ag-av svg{width:20px;height:20px}
.ag-dock i{width:8px;height:8px;border-radius:50%;background:#3fbf7f;flex:none;
  box-shadow:0 0 0 3px rgba(63,191,127,.22)}
.ag-dock b{font-weight:600;color:#fff}
.ag-dock small{display:block;font:400 .74rem/1.3 var(--sans);color:var(--on-navy-dim)}
@media(max-width:520px){.ag-dock small{display:none}}

/* ---------- overlay + panel ---------- */
.ag-ov{position:fixed;inset:0;z-index:var(--z-panel);display:none;
  background:rgba(10,30,51,.55);backdrop-filter:blur(3px);
  align-items:flex-end;justify-content:flex-end;padding:max(3vw,16px)}
.ag-ov[data-open]{display:flex}
.ag-panel{display:flex;flex-direction:column;width:min(440px,100%);height:min(640px,88vh);
  background:var(--white);border:1px solid var(--line);border-radius:18px;overflow:hidden;
  box-shadow:0 30px 80px -20px rgba(10,30,51,.5);
  animation:ag-in 220ms cubic-bezier(.22,.61,.36,1)}
@keyframes ag-in{from{opacity:0;transform:translateY(14px) scale(.985)}to{opacity:1;transform:none}}
@media(max-width:560px){
  .ag-ov{padding:0;align-items:stretch}
  .ag-panel{width:100%;height:100%;border-radius:0;border:0}
}
@media(prefers-reduced-motion:reduce){.ag-panel{animation:none}}

.ag-head{display:flex;align-items:center;gap:11px;padding:14px 14px 14px 16px;
  background:var(--navy-900);color:#fff;flex:none}
.ag-head .ag-av{width:38px;height:38px;border-radius:50%;flex:none;
  background:var(--gold-500);color:var(--navy-900);display:grid;place-items:center}
.ag-head .ag-av svg{width:20px;height:20px}
.ag-head .ag-id{margin-right:auto;min-width:0}
.ag-head b{display:block;font:600 .96rem/1.25 var(--sans);color:#fff}
.ag-head small{display:flex;align-items:center;gap:6px;font:400 .76rem/1.4 var(--sans);
  color:var(--on-navy-dim)}
.ag-head small i{width:7px;height:7px;border-radius:50%;background:#3fbf7f;flex:none}
.ag-ico{width:38px;height:38px;flex:none;display:grid;place-items:center;border-radius:9px;
  background:transparent;border:1px solid rgba(234,240,246,.24);color:var(--on-navy);
  transition:background var(--t),border-color var(--t),color var(--t)}
.ag-ico:hover{background:rgba(234,240,246,.14);color:#fff;border-color:var(--on-navy)}
.ag-ico svg{width:17px;height:17px}

/* ---------- mensajes ---------- */
.ag-body{flex:1;overflow-y:auto;overscroll-behavior:contain;padding:18px 16px;
  background:var(--paper);display:flex;flex-direction:column;gap:12px;scroll-behavior:smooth}
.ag-msg{max-width:88%;padding:12px 15px;border-radius:14px;font-size:.94rem;line-height:1.6}
.ag-msg b{color:inherit;font-weight:600}
.ag-msg ul,.ag-msg ol{margin:8px 0 0;padding-left:18px;list-style:disc}
.ag-msg li{margin-top:5px}
.ag-msg.bot{align-self:flex-start;background:var(--white);color:var(--body);
  border:1px solid var(--line);border-bottom-left-radius:5px}
.ag-msg.me{align-self:flex-end;background:var(--navy-800);color:#eaf0f6;
  border-bottom-right-radius:5px}
.ag-msg.me b{color:#fff}
.ag-dots{display:inline-flex;gap:5px;padding:3px 0}
.ag-dots i{width:7px;height:7px;border-radius:50%;background:var(--slate,#8a96a3);
  animation:ag-b 1.2s infinite ease-in-out}
.ag-dots i:nth-child(2){animation-delay:.16s}
.ag-dots i:nth-child(3){animation-delay:.32s}
@keyframes ag-b{0%,80%,100%{opacity:.28;transform:translateY(0)}40%{opacity:1;transform:translateY(-3px)}}
@media(prefers-reduced-motion:reduce){.ag-dots i{animation:none;opacity:.6}}

/* Botones de derivación dentro de una respuesta. */
.ag-acts{display:flex;flex-wrap:wrap;gap:8px;margin-top:12px}
.ag-acts a{display:inline-flex;align-items:center;gap:7px;min-height:40px;padding:9px 14px;
  border-radius:8px;font:600 .84rem/1.2 var(--sans);text-decoration:none;
  border:1px solid transparent;transition:background var(--t),border-color var(--t),color var(--t)}
.ag-acts svg{width:16px;height:16px;flex:none}
.ag-acts .wa{background:var(--gold-500);color:var(--navy-900);border-color:var(--gold-500)}
.ag-acts .wa:hover{background:var(--gold-600);color:#fff;border-color:var(--gold-600)}
.ag-acts .mail{background:var(--white);color:var(--navy-800);border-color:var(--line)}
.ag-acts .mail:hover{border-color:var(--navy-500);color:var(--navy-900)}

/* ---------- chips ---------- */
.ag-chips{display:flex;gap:8px;padding:0 16px 12px;flex-wrap:wrap;background:var(--paper);
  border-top:1px solid var(--line-soft);padding-top:12px;flex:none}
.ag-chips:empty{display:none}
.ag-chips button{min-height:38px;padding:8px 13px;border-radius:999px;
  background:var(--white);border:1px solid var(--line);color:var(--body);
  font:500 .82rem/1.2 var(--sans);text-align:left;
  transition:border-color var(--t),color var(--t),background var(--t)}
.ag-chips button:hover{border-color:var(--gold-500);color:var(--ink);background:var(--gold-050)}

/* ---------- formulario ---------- */
.ag-form{display:flex;align-items:center;gap:8px;padding:12px;background:var(--white);
  border-top:1px solid var(--line);flex:none}
.ag-form input{flex:1;min-width:0;min-height:46px;padding:12px 15px;border-radius:10px;
  border:1px solid var(--line);background:var(--paper);color:var(--ink);font-size:16px;
  transition:border-color var(--t),background var(--t)}
.ag-form input::placeholder{color:var(--muted)}
.ag-form input:focus{outline:0;border-color:var(--navy-500);background:var(--white);
  box-shadow:0 0 0 3px rgba(29,74,115,.14)}
.ag-btn{width:46px;height:46px;flex:none;display:grid;place-items:center;border-radius:10px;
  border:1px solid var(--line);background:var(--white);color:var(--muted);
  transition:border-color var(--t),color var(--t),background var(--t)}
.ag-btn:hover{border-color:var(--navy-500);color:var(--navy-800)}
.ag-btn svg{width:19px;height:19px}
.ag-btn.send{background:var(--navy-800);border-color:var(--navy-800);color:#fff}
.ag-btn.send:hover{background:var(--navy-900);border-color:var(--navy-900)}
.ag-btn.rec{background:#b3261e;border-color:#b3261e;color:#fff}
.ag-btn[hidden]{display:none}

.ag-disc{padding:0 14px 12px;background:var(--white);font:400 .72rem/1.5 var(--sans);
  color:var(--muted);flex:none;text-align:center}
.ag-disc a{color:var(--muted)}