/* ─────────────────────────────────────────────────────────────────
 * Shared Agent Drawer — chat (iframe) + files surfaces.
 *
 * Hosted on any page that wants:
 *   - a bottom-right FAB to open a slide-in chat with the page's
 *     "currently selected agent", and
 *   - an out-of-band Files drawer that shows the agent's FileStorage
 *     contents with ext icons, source filters, copy/download, and
 *     opens previews via the shared Canvas module.
 *
 * z-index layering (kept consistent with canvas.css below us):
 *   997 — FAB
 *   998 — backdrop
 *   999 — chat / files drawer
 *
 * Theme: relies entirely on host-page CSS variables
 *   --bg-surface, --bg-card, --bg-input, --border-dim, --border-glow,
 *   --text-primary, --text-secondary, --text-muted, --accent,
 *   --accent-bg, --font-sans, --font-mono, --red
 * No hardcoded palette colors — drop in any page that already has
 * the platform theme system loaded.
 * ───────────────────────────────────────────────────────────────── */

/* ── FAB (bottom-right entry point) ────────────────────────────── */
.adrw-fab{
  position:fixed;right:20px;bottom:20px;z-index:997;
  width:56px;height:56px;border-radius:50%;border:none;
  background:var(--accent);color:#fff;
  font-size:22px;line-height:1;cursor:pointer;
  box-shadow:0 6px 18px rgba(0,0,0,0.28),0 0 24px rgba(34,211,238,0.18);
  display:none;align-items:center;justify-content:center;
  transition:transform .15s ease, box-shadow .2s ease, opacity .15s;
}
.adrw-fab:hover{transform:translateY(-2px);box-shadow:0 10px 24px rgba(0,0,0,0.32),0 0 28px rgba(34,211,238,0.24)}
.adrw-fab:active{transform:translateY(0)}
.adrw-fab.visible{display:flex}

/* ── Backdrop (shared by chat + files drawers) ─────────────────── */
.adrw-backdrop{
  position:fixed;inset:0;z-index:998;
  background:rgba(0,0,0,0.45);
  opacity:0;pointer-events:none;
  transition:opacity .2s ease;
}
.adrw-backdrop.open{opacity:1;pointer-events:auto}

/* ── Drawer base (slides in from the right) ────────────────────── */
.adrw-drawer{
  position:fixed;top:0;right:0;bottom:0;z-index:999;
  background:var(--bg-surface);
  border-left:1px solid var(--border-glow);
  display:flex;flex-direction:column;overflow:hidden;
  transform:translateX(100%);
  transition:transform .25s ease, width .2s ease;
  box-shadow:-12px 0 40px rgba(0,0,0,0.35);
}
.adrw-drawer.open{transform:translateX(0)}

/* Width = S/M/L profile. Capped to 92vw so small viewports don't
   ever produce a horizontally clipped drawer. */
.adrw-drawer.size-sm{width:min(340px,92vw)}
.adrw-drawer.size-md{width:min(640px,92vw)}
.adrw-drawer.size-lg{width:min(940px,92vw)}

/* ── Drawer header (title + sizer + close) ─────────────────────── */
.adrw-head{
  display:flex;align-items:center;gap:10px;
  padding:10px 14px;border-bottom:1px solid var(--border-dim);
  flex-shrink:0;background:var(--bg-surface);
}
.adrw-title{
  font-size:13px;font-weight:700;letter-spacing:.02em;
  color:var(--text-primary);font-family:var(--font-sans);
  flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;
}
.adrw-sizer{
  display:flex;align-items:center;gap:2px;
  padding:2px;border:1px solid var(--border-dim);border-radius:6px;
  background:var(--bg-input);
}
.adrw-sizer button{
  background:none;border:none;
  font-family:var(--font-sans);font-size:10px;font-weight:700;letter-spacing:.04em;
  color:var(--text-muted);cursor:pointer;
  padding:3px 8px;border-radius:4px;transition:all .15s;
}
.adrw-sizer button:hover{color:var(--text-secondary)}
.adrw-sizer button.active{background:var(--accent);color:#fff}
.adrw-close{
  background:none;border:none;color:var(--text-muted);
  font-size:18px;cursor:pointer;padding:2px 8px;border-radius:4px;
  transition:color .15s, background .15s;
}
.adrw-close:hover{color:var(--text-primary);background:rgba(255,255,255,.05)}

/* ── Searchable agent-switcher + "open full page" (coordinator pages) ─ */
.adrw-agent-combo{position:relative;flex:0 1 auto;min-width:0;max-width:180px}
.adrw-agent-input{
  width:100%;box-sizing:border-box;
  font-family:var(--font-sans);font-size:11px;font-weight:600;
  color:var(--text-primary);background:var(--bg-input);
  border:1px solid var(--border-dim);border-radius:6px;
  padding:3px 8px;cursor:text;outline:none;
}
.adrw-agent-input:focus{border-color:var(--accent)}
.adrw-agent-input::placeholder{color:var(--text-muted);font-weight:500}
.adrw-agent-menu{
  display:none;position:absolute;top:calc(100% + 4px);left:0;
  min-width:200px;max-width:260px;max-height:280px;overflow-y:auto;z-index:10;
  background:var(--bg-surface);border:1px solid var(--border-dim);border-radius:8px;
  box-shadow:0 8px 24px rgba(0,0,0,.35);padding:4px;
}
.adrw-agent-menu.open{display:block}
.adrw-agent-item{
  display:flex;align-items:baseline;gap:8px;justify-content:space-between;
  padding:5px 8px;border-radius:5px;cursor:pointer;
  font-family:var(--font-sans);
}
.adrw-agent-item:hover,.adrw-agent-item.hi{background:rgba(255,255,255,.06)}
.adrw-agent-name{font-size:12px;font-weight:600;color:var(--text-primary);
  overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.adrw-agent-id{font-size:10px;color:var(--text-muted);flex-shrink:0;font-family:var(--font-mono,monospace)}
.adrw-agent-empty{
  padding:8px;text-align:center;color:var(--text-muted);
  font-family:var(--font-sans);font-size:11px;
}
.adrw-fullpage{
  flex-shrink:0;background:none;border:1px solid var(--border-dim);border-radius:6px;
  font-family:var(--font-sans);font-size:10px;font-weight:700;letter-spacing:.02em;
  color:var(--text-muted);cursor:pointer;padding:3px 8px;transition:all .15s;white-space:nowrap;
}
.adrw-fullpage:hover{color:var(--text-primary);background:rgba(255,255,255,.05)}

/* ── Chat drawer body — full-bleed iframe ──────────────────────── */
.adrw-chat-body{flex:1;display:flex;min-height:0}
.adrw-chat-body iframe{flex:1;border:none;width:100%;height:100%;background:var(--bg-surface)}
.adrw-chat-empty{
  flex:1;display:flex;align-items:center;justify-content:center;text-align:center;
  padding:24px;color:var(--text-muted);font-family:var(--font-sans);font-size:13px;
}

/* ── Files drawer (filter bar + list + items) ──────────────────── */
.adrw-files-filters{
  display:flex;gap:4px;padding:8px 14px;
  border-bottom:1px solid var(--border-dim);flex-shrink:0;
}
.adrw-files-filter{
  font-family:var(--font-sans);font-size:10px;font-weight:600;
  padding:3px 8px;border-radius:4px;
  border:1px solid var(--border-dim);background:none;color:var(--text-muted);
  cursor:pointer;transition:all .15s;
}
.adrw-files-filter:hover{border-color:var(--border-glow);color:var(--text-secondary)}
.adrw-files-filter.active{border-color:var(--accent);color:var(--accent);background:var(--accent-bg)}

.adrw-files-list{flex:1;overflow-y:auto;padding:6px 0;min-height:0}
.adrw-files-empty{padding:24px 14px;text-align:center;font-size:12px;color:var(--text-muted);font-family:var(--font-sans)}

.adrw-files-item{
  display:flex;align-items:center;gap:8px;padding:7px 14px;
  cursor:pointer;transition:background .15s;
}
.adrw-files-item:hover{background:var(--bg-card)}
.adrw-files-icon{font-size:14px;flex-shrink:0;width:20px;text-align:center}
.adrw-files-info{flex:1;min-width:0}
.adrw-files-name{
  font-family:var(--font-sans);font-size:12px;font-weight:500;color:var(--text-primary);
  white-space:nowrap;overflow:hidden;text-overflow:ellipsis;
}
.adrw-files-folder{
  font-family:var(--font-mono);font-size:10px;color:var(--text-muted);
  margin-top:1px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;
}
.adrw-files-meta{
  font-family:var(--font-sans);font-size:10px;color:var(--text-muted);
  display:flex;gap:6px;align-items:center;margin-top:2px;
}
.adrw-files-source{
  font-size:9px;font-weight:700;letter-spacing:.04em;text-transform:uppercase;
  padding:1px 4px;border-radius:3px;
}
.adrw-files-source.permanent{color:var(--accent);background:var(--accent-bg)}
.adrw-files-source.temp{color:var(--text-muted);background:var(--bg-input)}

.adrw-files-dl,.adrw-files-copy{
  background:none;border:none;color:var(--text-muted);
  cursor:pointer;font-size:12px;padding:2px 4px;flex-shrink:0;
  transition:color .15s;
}
.adrw-files-dl:hover,.adrw-files-copy:hover{color:var(--accent)}
.adrw-files-copy{opacity:0;transition:opacity .15s, color .15s}
.adrw-files-item:hover .adrw-files-copy{opacity:1}

/* ── Refresh button (in drawer header for files drawer) ────────── */
.adrw-refresh{
  background:none;border:none;color:var(--text-muted);
  font-size:14px;cursor:pointer;padding:2px 6px;border-radius:4px;
  transition:color .15s, transform .5s linear;
}
.adrw-refresh:hover{color:var(--text-primary)}

/* ── Panel drawer body (additive third kind) ───────────────────── */
.adrw-panel-body{
  flex:1;min-height:0;display:flex;flex-direction:column;overflow-y:auto;
  padding:16px 18px;font-family:var(--font-sans);
}
.adrw-panel-statusbar{display:flex;justify-content:flex-end;margin-bottom:8px;min-height:18px}
.adrw-panel-host{flex:1;min-height:0}
.adrw-panel-fallback{font-size:13px;color:var(--text-muted);padding:8px 0}