/* ════════════════════════════════════════════════════════════════════════
   Lechuza 360 — Panel lateral del asistente (Etapa C del rediseño, 2026-10).
   Drawer a la derecha (escritorio) / hoja inferior (móvil). Reusa el backend
   asistente_chat. Tokens --ds-*. Partial: _partials/ai_drawer.html.twig.
   ════════════════════════════════════════════════════════════════════════ */
:root{ --ai-w: 400px; --ai-accent:#6d28d9; }

#sigre-ai-scrim{
  position:fixed; inset:0; background:rgba(15,23,42,.28); z-index:1055;
  opacity:0; pointer-events:none; transition:opacity .2s ease;
}
body.ai-open #sigre-ai-scrim{ opacity:1; pointer-events:auto; }

.sigre-ai-drawer{
  position:fixed; top:0; right:0; bottom:0; width:var(--ai-w); max-width:92vw; z-index:1060;
  background:var(--ds-bg-surface,#fff); border-left:1px solid var(--ds-border,#e2e8f0);
  box-shadow:-18px 0 44px rgba(15,23,42,.18);
  display:flex; flex-direction:column; min-height:0;
  transform:translateX(100%); transition:transform .24s cubic-bezier(.4,0,.2,1);
}
body.ai-open .sigre-ai-drawer{ transform:none; }

/* Header */
.sigre-ai-head{ display:flex; align-items:center; gap:10px; padding:13px 15px; border-bottom:1px solid var(--ds-border,#e2e8f0); }
.sigre-ai-orb{ width:34px; height:34px; border-radius:11px; flex:none; display:grid; place-items:center; color:#fff; font-size:16px;
  background:conic-gradient(from 200deg,#6d28d9,#0d3b66,#1e8a4f,#6d28d9); box-shadow:0 4px 12px rgba(109,40,217,.3); }
.sigre-ai-head .ht{ font-weight:650; font-size:14px; color:var(--ds-text-strong,#0f172a); line-height:1.15; }
.sigre-ai-head .hs{ font-size:11px; color:var(--ds-text-muted,#64748b); display:block; margin-top:1px; }
.sigre-ai-head .hx{ margin-left:auto; border:0; background:transparent; color:var(--ds-text-muted,#64748b); font-size:18px; cursor:pointer; width:32px; height:32px; border-radius:8px; }
.sigre-ai-head .hx:hover{ background:var(--ds-bg-subtle,#f1f5f9); color:var(--ds-text,#1e293b); }

/* Chip de contexto */
.sigre-ai-ctx{ margin:11px 15px 0; display:flex; align-items:center; gap:8px; background:var(--ds-bg-subtle,#f1f5f9);
  border:1px solid var(--ds-border,#e2e8f0); border-radius:9px; padding:7px 10px; font-size:12px; color:var(--ds-text-soft,#475569); }
.sigre-ai-ctx i{ color:var(--ds-brand-primary,#0d3b66); flex:none; }
.sigre-ai-ctx .ctx-t{ flex:1; min-width:0; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }

/* Hilo */
.sigre-ai-thread{ flex:1; overflow-y:auto; padding:14px 15px; display:flex; flex-direction:column; gap:11px; min-height:0; }
.sigre-ai-msg{ max-width:92%; font-size:13.5px; line-height:1.5; }
.sigre-ai-msg.me{ align-self:flex-end; background:var(--ds-brand-primary,#0d3b66); color:#fff; padding:9px 13px; border-radius:14px 14px 4px 14px; }
.sigre-ai-msg.bot{ align-self:flex-start; background:var(--ds-bg-subtle,#f6f8fb); border:1px solid var(--ds-border,#e2e8f0); color:var(--ds-text,#1e293b); padding:10px 13px; border-radius:14px 14px 14px 4px; }
.sigre-ai-msg.bot.err{ background:var(--ds-danger-50,#fef2f2); border-color:var(--ds-danger-200,#fecaca); color:var(--ds-danger-700,#991b1b); }
.sigre-ai-msg.bot p{ margin:0 0 6px; } .sigre-ai-msg.bot p:last-child{ margin-bottom:0; }
.sigre-ai-msg.bot a{ color:var(--ds-link,#2563eb); }
.sigre-ai-msg.bot strong{ color:var(--ds-text-strong,#0f172a); }
.sigre-ai-empty{ color:var(--ds-text-muted,#94a3b8); font-size:13px; text-align:center; margin:auto 0; padding:20px 10px; }
.sigre-ai-empty .big{ font-size:30px; display:block; margin-bottom:8px; }
.sigre-ai-dots span{ display:inline-block; width:6px; height:6px; margin:0 1px; border-radius:50%; background:currentColor; opacity:.4; animation:aiBlink 1.2s infinite; }
.sigre-ai-dots span:nth-child(2){ animation-delay:.2s; } .sigre-ai-dots span:nth-child(3){ animation-delay:.4s; }
@keyframes aiBlink{ 0%,100%{opacity:.25;} 50%{opacity:.9;} }
.sigre-ai-meta{ font-size:10px; color:var(--ds-text-muted,#94a3b8); margin-top:4px; font-family:var(--ds-font-mono,monospace); }

/* Chips de sugerencia */
.sigre-ai-chips{ display:flex; gap:7px; flex-wrap:wrap; padding:9px 15px 0; }
.sigre-ai-chip{ font-size:12px; border:1px solid var(--ds-border,#d7ddf0); background:var(--ds-bg-surface,#fff); color:var(--ds-text-soft,#334155);
  border-radius:999px; padding:6px 12px; cursor:pointer; display:inline-flex; gap:6px; align-items:center; }
.sigre-ai-chip i{ color:var(--ai-accent); }
.sigre-ai-chip:hover{ background:var(--ds-bg-subtle,#f1f5f9); border-color:var(--ds-brand-primary,#0d3b66); }

/* Composer */
.sigre-ai-composer{ padding:10px 15px 13px; border-top:1px solid var(--ds-border,#e2e8f0); }
.sigre-ai-inwrap{ display:flex; align-items:flex-end; gap:8px; border:1.5px solid var(--ds-border-strong,#c9d3e6); border-radius:14px; padding:8px 10px; background:var(--ds-bg-surface,#fff); }
.sigre-ai-inwrap:focus-within{ border-color:var(--ds-brand-primary,#0d3b66); box-shadow:0 0 0 3px rgba(13,59,102,.12); }
.sigre-ai-input{ flex:1; border:0; outline:none; resize:none; font-family:inherit; font-size:13.5px; line-height:1.4; max-height:120px; background:transparent; color:var(--ds-text,#1e293b); }
.sigre-ai-send{ flex:none; width:34px; height:34px; border-radius:10px; border:0; background:var(--ds-brand-primary,#0d3b66); color:#fff; cursor:pointer; display:grid; place-items:center; font-size:15px; }
.sigre-ai-send:disabled{ opacity:.5; cursor:not-allowed; }
.sigre-ai-foot{ font-size:10.5px; color:var(--ds-text-muted,#94a3b8); text-align:center; margin-top:7px; display:flex; gap:5px; justify-content:center; align-items:center; }

/* Móvil: hoja inferior */
@media (max-width:768px){
  .sigre-ai-drawer{ top:auto; left:0; right:0; width:100%; max-width:100%; height:86vh; border-left:0; border-top:1px solid var(--ds-border,#e2e8f0);
    border-radius:18px 18px 0 0; transform:translateY(100%); box-shadow:0 -14px 40px rgba(15,23,42,.3); }
  body.ai-open .sigre-ai-drawer{ transform:none; }
}
@media (prefers-reduced-motion:reduce){ .sigre-ai-drawer, #sigre-ai-scrim{ transition:none !important; } }
