/* GENERATED FILE — DO NOT EDIT.
 * Source of truth: content/ui/ai-chat-dashboard.css
 * Regenerate with: npm run sync-studio
 */
/* ═══════════════════════════════════════════════════════════════
   AI Chat Dashboard (acd-)

   SINGLE SOURCE for AiChatComponent's look on every host:
   - extension: injected after tokens.css + button.css into the modal's
     Shadow root (content/content.js loadCSS pipeline)
   - Studio web app: vendored to server/public/app/vendor/ by
     `npm run sync-studio`, linked after vendor/tokens.css + button.css

   All colors are --mc-* tokens. Button chrome comes from the shared
   .mc-btn system (the component emits mc-btn variant classes alongside
   the acd-* behavior classes) — only layout-level overrides live here.
   ═══════════════════════════════════════════════════════════════ */

.acd-modal {
  width: min(900px, 94vw);
  height: min(860px, 90vh);
  display: flex;
  flex-direction: column;
}

/* Header bar — new-chat button + BU chip */
.acd-header-bar {
  position: relative; /* anchors the history/perms dropdowns */
  display: flex;
  align-items: center;
  gap: 8px;
  padding: 6px 12px 8px;
  border-bottom: 1px solid var(--mc-border);
}
.acd-bu-chip {
  margin-left: auto;
  font-size: var(--mc-text-xs);
  color: var(--mc-badge-info-fg);
  background: var(--mc-badge-info-bg);
  border: 1px solid rgba(26, 115, 232, 0.25);
  padding: 2px 8px;
  border-radius: 10px;
  font-weight: 500;
}

/* History dropdown menu (button chrome = .mc-btn--secondary .mc-btn--sm) */
.acd-history-menu {
  position: absolute;
  top: 100%;
  left: 12px;
  margin-top: 4px;
  background: var(--mc-surface);
  border: 1px solid var(--mc-border);
  border-radius: 10px;
  box-shadow: var(--mc-shadow-card);
  min-width: 260px;
  max-width: 360px;
  max-height: 360px;
  overflow-y: auto;
  z-index: 10;
}
.acd-history-empty {
  padding: 14px;
  font-size: var(--mc-text-sm);
  color: var(--mc-text-muted);
  text-align: center;
}
.acd-history-item {
  display: block;
  width: 100%;
  padding: 8px 12px;
  text-align: left;
  background: var(--mc-surface);
  border: none;
  border-bottom: 1px solid var(--mc-border-subtle);
  cursor: pointer;
  font: inherit;
}
/* Which BU a conversation was STARTED in (conversations.bu_mid). Shows the BU
   NAME when the host supplied one, else "BU <mid>"; the full "Name — MID" is in
   the title. Neutral by default; tinted to match the header's .acd-bu-chip when
   it is the BU being viewed right now, so rows from elsewhere read as
   "elsewhere" at a glance. Names are author-controlled in SFMC and can be long,
   hence the cap — the tooltip still carries the whole thing. */
.acd-history-bu {
  display: inline-block;
  font-size: var(--mc-text-xs);
  color: var(--mc-badge-neutral-fg);
  background: var(--mc-badge-neutral-bg);
  padding: 0 5px;
  border-radius: 8px;
  font-weight: 500;
  white-space: nowrap;
  max-width: 130px;
  overflow: hidden;
  text-overflow: ellipsis;
  vertical-align: bottom;
}
.acd-history-bu-current {
  color: var(--mc-badge-info-fg);
  background: var(--mc-badge-info-bg);
}
.acd-history-item:last-child { border-bottom: none; }
.acd-history-item:hover { background: var(--mc-surface-1); }
.acd-history-item-active { background: var(--mc-primary-tint); }
.acd-history-item-active:hover { background: var(--mc-primary-tint); }
.acd-history-title {
  font-size: 12.5px;
  font-weight: 500;
  color: var(--mc-text);
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.acd-history-meta {
  font-size: 10.5px;
  color: var(--mc-text-muted);
  margin-top: 2px;
}

/* Permissions popover (button chrome = .mc-btn--secondary .mc-btn--sm) */

/* Disconnected variant — light-red "Connect" pill */
.acd-perms-btn--connect {
  color: var(--mc-badge-err-fg);
  background: var(--mc-danger-tint);
  border-color: rgba(217, 48, 37, 0.3);
}
.acd-perms-btn--connect:hover {
  background: var(--mc-badge-err-bg);
  border-color: rgba(217, 48, 37, 0.45);
}

.acd-perms-menu {
  position: absolute;
  top: 100%;
  right: 12px;
  margin-top: 4px;
  background: var(--mc-surface);
  border: 1px solid var(--mc-border);
  border-radius: 10px;
  box-shadow: var(--mc-shadow-card);
  min-width: 320px;
  max-width: 420px;
  max-height: 440px;
  overflow-y: auto;
  z-index: 10;
  padding: 4px 0;
}
.acd-perms-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
  padding: 10px 14px 8px;
  font-size: var(--mc-text-sm);
  font-weight: 600;
  color: var(--mc-text);
  border-bottom: 1px solid var(--mc-border-subtle);
}
.acd-perms-count {
  font-size: 10.5px;
  font-weight: 500;
  color: var(--mc-text-muted);
  background: var(--mc-surface-2);
  border-radius: 10px;
  padding: 1px 8px;
}
.acd-perms-empty {
  padding: 14px;
  font-size: var(--mc-text-sm);
  color: var(--mc-text-muted);
  text-align: center;
}
.acd-perms-group {
  padding: 8px 14px 4px;
  border-bottom: 1px solid var(--mc-surface-1);
}
.acd-perms-group:last-of-type { border-bottom: none; }
.acd-perms-group-name {
  font-size: var(--mc-text-2xs);
  font-weight: 600;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  color: var(--mc-text-muted);
  margin-bottom: 4px;
}
.acd-perms-list {
  list-style: none;
  margin: 0;
  padding: 0;
}
.acd-perms-item {
  display: grid;
  grid-template-columns: auto 1fr auto;
  align-items: center;
  gap: 8px;
  padding: 5px 0;
  font-size: 12.5px;
  color: var(--mc-text);
}
.acd-perms-item--raw { grid-template-columns: auto 1fr; }
.acd-perms-item--raw .acd-perms-label {
  font-family: ui-monospace, SFMono-Regular, Menlo, monospace;
  font-size: var(--mc-text-sm);
  color: var(--mc-text-secondary);
}
.acd-perms-item svg { color: var(--mc-success); flex-shrink: 0; }
.acd-perms-label { line-height: 1.35; }
.acd-perms-raw {
  font-family: ui-monospace, SFMono-Regular, Menlo, monospace;
  font-size: 10.5px;
  color: var(--mc-text-subtle);
  background: var(--mc-surface-1);
  border: 1px solid var(--mc-border-subtle);
  border-radius: var(--mc-radius-sm);
  padding: 1px 5px;
  white-space: nowrap;
}
.acd-perms-foot {
  padding: 8px 14px 10px;
  font-size: var(--mc-text-xs);
  line-height: 1.4;
  color: var(--mc-text-muted);
  border-top: 1px solid var(--mc-border-subtle);
}

/* Wrap: fills the modal content area */
.acd-wrap {
  display: flex;
  flex-direction: column;
  height: 100%;
  min-height: 0; /* allow children to shrink */
}
.acd-messages {
  flex: 1;
  min-height: 0;
  overflow-y: auto;
  padding: 12px 16px;
  display: flex;
  flex-direction: column;
  gap: 10px;
  /* surface-2, not surface-1: the white assistant bubbles need visible
     separation from the canvas. */
  background: var(--mc-surface-2);
}
.acd-empty {
  text-align: center;
  padding: 40px 24px;
  color: var(--mc-text-muted);
  max-width: 420px;
  margin: 24px auto 0;
}
.acd-empty-title { font-weight: 600; margin-bottom: 8px; color: var(--mc-text-strong); font-size: var(--mc-text-lg); }
.acd-empty-desc  { font-size: var(--mc-text-sm); line-height: 1.6; }

/* ── Action launcher (empty state) ── */
.acd-empty--launcher {
  max-width: 560px;
  padding: 28px 16px;
}
.acd-empty--launcher .acd-empty-desc { margin-bottom: 18px; }
.acd-action-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 10px;
  text-align: left;
}
.acd-action-card {
  display: flex;
  align-items: flex-start;
  gap: 10px;
  padding: 12px 14px;
  background: var(--mc-surface);
  border: 1px solid var(--mc-border);
  border-radius: var(--mc-radius-xl);
  cursor: pointer;
  font: inherit;
  text-align: left;
  transition: border-color .12s ease, box-shadow .12s ease, transform .12s ease;
}
.acd-action-card:hover {
  border-color: var(--mc-primary);
  box-shadow: 0 2px 8px rgba(26, 115, 232, .1);
  transform: translateY(-1px);
}
.acd-action-card:focus-visible {
  outline: 2px solid var(--mc-primary);
  outline-offset: 1px;
}
.acd-action-card:active { transform: none; }
.acd-action-icon {
  flex: none;
  display: flex;
  align-items: center;
  justify-content: center;
  width: 32px;
  height: 32px;
  border-radius: var(--mc-radius-lg);
  background: var(--mc-primary-tint);
  color: var(--mc-primary);
}
.acd-action-text { display: flex; flex-direction: column; gap: 2px; min-width: 0; }
.acd-action-label { font-size: var(--mc-text-md); font-weight: 600; color: var(--mc-text); }
.acd-action-desc  { font-size: var(--mc-text-xs); color: var(--mc-text-muted); line-height: 1.4; }

.acd-msg {
  max-width: 80%;
  padding: 10px 14px;
  border-radius: var(--mc-radius-xl);
  font-size: var(--mc-text-md);
  line-height: 1.5;
  word-wrap: break-word;
  /* pre-wrap is applied only to .acd-msg-body for user/error variants
     below — putting it here would render the template-literal whitespace
     between copyBtn / body / chips / pendingWrites as real line breaks. */
}
.acd-msg-user {
  align-self: flex-end;
  background: var(--mc-primary);
  color: var(--mc-text-on-primary);
  border-bottom-right-radius: 4px;
}
.acd-msg-assistant {
  align-self: flex-start;
  background: var(--mc-surface);
  color: var(--mc-text);
  border: 1px solid var(--mc-border);
  border-bottom-left-radius: 4px;
  position: relative;
}

/* Copy button — hover on assistant bubble */
.acd-copy {
  position: absolute;
  top: 6px;
  right: 6px;
  padding: 3px 5px;
  border: 1px solid var(--mc-border);
  background: var(--mc-surface);
  border-radius: var(--mc-radius-md);
  color: var(--mc-text-muted);
  cursor: pointer;
  opacity: 0;
  transition: opacity 0.12s ease, color 0.12s ease;
  display: inline-flex;
  align-items: center;
}
.acd-msg-assistant:hover .acd-copy,
.acd-msg-assistant:focus-within .acd-copy,
.acd-copy:focus-visible { opacity: 1; }
.acd-copy:hover { color: var(--mc-primary); border-color: var(--mc-primary); }
.acd-copy-done { color: var(--mc-success) !important; border-color: var(--mc-success) !important; opacity: 1 !important; font-size: var(--mc-text-xs); padding: 3px 6px; }
.acd-msg-error {
  align-self: flex-start;
  background: var(--mc-danger-tint);
  color: var(--mc-danger-strong);
  border: 1px solid rgba(217, 48, 37, 0.3);
  border-bottom-left-radius: 4px;
}
.acd-thinking { opacity: 0.65; font-style: italic; }
.acd-thinking-row {
  display: flex;
  align-items: center;
  gap: 10px;
  justify-content: space-between;
}
.acd-thinking-cancel {
  flex: none;
  font-style: normal;
  font-size: var(--mc-text-xs);
  padding: 2px 10px;
  border: 1px solid var(--mc-border);
  border-radius: var(--mc-radius-pill);
  background: var(--mc-surface-1);
  color: var(--mc-text-muted);
  cursor: pointer;
}
.acd-thinking-cancel:hover:not(:disabled) { border-color: var(--mc-border-strong); color: var(--mc-text); }
.acd-thinking-cancel:disabled { opacity: 0.6; cursor: default; }
.acd-thinking-hint {
  display: block;
  margin-top: 4px;
  font-style: normal;
  font-size: var(--mc-text-xs);
  color: var(--mc-text-muted);
}
/* Centered, subtle context marker (live BU switch) — not a chat bubble. */
.acd-msg-note {
  align-self: center;
  max-width: 90%;
  margin: 2px 0;
  padding: 3px 10px;
  font-size: var(--mc-text-xs);
  color: var(--mc-text-muted);
  background: var(--mc-surface-2);
  border: 1px solid var(--mc-border);
  border-radius: var(--mc-radius-pill);
  text-align: center;
}
.acd-msg-user .acd-msg-body { white-space: pre-wrap; overflow-wrap: anywhere; }
.acd-msg-error .acd-msg-body { white-space: pre-wrap; overflow-wrap: anywhere; }
.acd-msg-error .acd-msg-body a { color: inherit; text-decoration: underline; }
/* Inline Retry on an undelivered turn (offline / transport error). */
.acd-retry {
  margin-top: 6px;
  font-size: var(--mc-text-xs);
  padding: 2px 12px;
  border: 1px solid rgba(217, 48, 37, 0.4);
  border-radius: var(--mc-radius-pill);
  background: var(--mc-surface-1);
  color: var(--mc-danger-strong);
  cursor: pointer;
}
.acd-retry:hover { border-color: var(--mc-danger-strong); }

/* Quick-pick chips under the last assistant reply — one click sends the
   label as the next message. */
.acd-suggestions {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  margin-top: 10px;
}
.acd-suggestion {
  max-width: 100%;
  padding: 4px 12px;
  font: inherit;
  font-size: var(--mc-text-xs);
  line-height: 1.4;
  text-align: left;
  color: var(--mc-primary);
  background: var(--mc-surface);
  border: 1px solid var(--mc-border);
  border-radius: var(--mc-radius-pill);
  cursor: pointer;
  transition: border-color .12s ease, background .12s ease;
}
.acd-suggestion:hover {
  border-color: var(--mc-primary);
  background: var(--mc-primary-tint);
}
.acd-suggestion:focus-visible {
  outline: 2px solid var(--mc-primary);
  outline-offset: 1px;
}

/* Markdown rendered into assistant bubbles */
.acd-msg-assistant .acd-msg-body p {
  margin: 0 0 8px 0;
}
.acd-msg-assistant .acd-msg-body p:last-child { margin-bottom: 0; }
.acd-msg-assistant .acd-msg-body br { display: block; content: ''; margin-top: 4px; }
.acd-msg-assistant .acd-msg-body strong { font-weight: 600; color: var(--mc-text); }
.acd-msg-assistant .acd-msg-body em     { font-style: italic; }
.acd-msg-assistant .acd-msg-body code {
  font-family: ui-monospace, SFMono-Regular, Menlo, monospace;
  font-size: var(--mc-text-sm);
  background: #eef2ff;
  color: #3730a3;
  padding: 1px 5px;
  border-radius: var(--mc-radius-sm);
}
/* Fenced code blocks (```lang) — flat dark slab, no inline-code pill. */
.acd-msg-assistant .acd-msg-body pre.mc-md-code {
  background: #0f172a;
  color: #e2e8f0;
  padding: 10px 12px;
  border-radius: var(--mc-radius-md, 8px);
  overflow-x: auto;
  margin: 6px 0;
  position: relative;
}
/* Per-code-block action bar (top-right): Copy + optional Apply. */
.acd-code-actions {
  position: absolute;
  top: 5px;
  right: 6px;
  display: flex;
  gap: 5px;
  align-items: center;
}
.acd-code-copy {
  padding: 2px 9px;
  font-size: 10.5px;
  font-weight: 600;
  color: #cbd5e1;
  background: rgba(148, 163, 184, 0.16);
  border: 1px solid rgba(148, 163, 184, 0.4);
  border-radius: 5px;
  cursor: pointer;
  font-family: inherit;
  line-height: 1.4;
  opacity: 0;
  transition: opacity 0.12s, background 0.12s, color 0.12s;
}
.acd-msg-assistant .acd-msg-body pre.mc-md-code:hover .acd-code-copy,
.acd-msg-assistant .acd-msg-body pre.mc-md-code:focus-within .acd-code-copy,
.acd-code-copy:focus-visible { opacity: 1; }
.acd-code-copy:hover { background: rgba(148, 163, 184, 0.28); color: #f1f5f9; }
.acd-code-copy.acd-copy-done {
  opacity: 1 !important;
  color: #bbf7d0 !important;
  background: rgba(34, 197, 94, 0.22) !important;
  border-color: rgba(74, 222, 128, 0.5) !important;
}
.acd-msg-assistant .acd-msg-body pre.mc-md-code code {
  background: transparent;
  color: inherit;
  padding: 0;
  font-size: var(--mc-text-sm);
  line-height: 1.5;
  /* Wrap long lines so the full code/SQL is always visible regardless of
     panel width (was `white-space: pre`, which clipped past the edge).
     pre-wrap preserves indentation; overflow-wrap breaks unbroken tokens. */
  white-space: pre-wrap;
  overflow-wrap: anywhere;
  word-break: break-word;
}
.acd-msg-assistant .acd-msg-body h2 { font-size: 15px; font-weight: 600; margin: 10px 0 6px; color: var(--mc-text); }
.acd-msg-assistant .acd-msg-body h3 { font-size: var(--mc-text-lg); font-weight: 600; margin: 8px 0 4px; color: var(--mc-text); }
.acd-msg-assistant .acd-msg-body h4 { font-size: var(--mc-text-md); font-weight: 600; margin: 6px 0 4px; color: var(--mc-text); }
.acd-msg-assistant .acd-msg-body ul,
.acd-msg-assistant .acd-msg-body ol,
.acd-msg-assistant .acd-msg-body .mc-md-list {
  margin: 4px 0 8px 20px;
  padding: 0;
}
.acd-msg-assistant .acd-msg-body li { margin: 2px 0; }

/* Tables — shared .mc-md-table class from McLensMarkdown.render() */
.acd-msg-assistant .acd-msg-body .mc-md-table {
  width: 100%;
  border-collapse: collapse;
  margin: 8px 0;
  font-size: var(--mc-text-sm);
}
.acd-msg-assistant .acd-msg-body .mc-md-table th,
.acd-msg-assistant .acd-msg-body .mc-md-table td {
  padding: 6px 8px;
  border: 1px solid var(--mc-border);
  text-align: left;
  vertical-align: top;
}
.acd-msg-assistant .acd-msg-body .mc-md-table th {
  background: var(--mc-surface-1);
  font-weight: 600;
  color: var(--mc-text-strong);
}
.acd-msg-assistant .acd-msg-body .mc-md-table tbody tr:nth-child(even) {
  background: var(--mc-surface-1);
}

/* ── Result cards (deterministic data render from tool JSON) ── */
.mc-rc-cards { margin-top: 10px; display: flex; flex-direction: column; gap: 8px; }
.mc-rc-card {
  background: var(--mc-surface);
  border: 1px solid var(--mc-border);
  border-radius: 10px;
  overflow: hidden;
}
.mc-rc-head {
  display: flex;
  align-items: center;
  gap: 7px;
  padding: 8px 12px;
  font-size: var(--mc-text-sm);
  font-weight: 600;
  color: var(--mc-text);
  background: var(--mc-surface-1);
  border-bottom: 1px solid var(--mc-border-subtle);
}
.mc-rc-head svg { color: var(--mc-primary); flex: none; }
.mc-rc-scroll { overflow-x: auto; }
.mc-rc-table { width: 100%; border-collapse: collapse; font-size: var(--mc-text-xs); }
.mc-rc-table th {
  text-align: left;
  padding: 6px 12px;
  color: var(--mc-text-muted);
  font-weight: 600;
  border-bottom: 1px solid var(--mc-border-subtle);
  white-space: nowrap;
}
.mc-rc-table td { padding: 6px 12px; color: var(--mc-text-strong); vertical-align: top; }
.mc-rc-table tbody tr:nth-child(even) { background: var(--mc-surface-1); }
.mc-rc-name { font-weight: 500; color: var(--mc-text); word-break: break-word; }
.mc-rc-dim { color: var(--mc-text-subtle); }
.mc-rc-status {
  display: inline-block;
  font-size: var(--mc-text-xs);
  padding: 1px 8px;
  border-radius: var(--mc-radius-pill);
  border: 1px solid rgba(0, 0, 0, 0.06);
  white-space: nowrap;
}
.mc-rc-status--ok      { background: var(--mc-badge-ok-bg);      color: var(--mc-badge-ok-fg); }
.mc-rc-status--warn    { background: var(--mc-badge-warn-bg);    color: var(--mc-badge-warn-fg); }
.mc-rc-status--err     { background: var(--mc-badge-err-bg);     color: var(--mc-badge-err-fg); }
.mc-rc-status--neutral { background: var(--mc-badge-neutral-bg); color: var(--mc-badge-neutral-fg); }
.mc-rc-expand {
  display: block;
  width: 100%;
  padding: 6px;
  background: var(--mc-surface-1);
  border: none;
  border-top: 1px solid var(--mc-border-subtle);
  color: var(--mc-primary);
  font-size: var(--mc-text-xs);
  font-weight: 600;
  cursor: pointer;
}
.mc-rc-expand:hover { background: var(--mc-surface-2); }
.mc-rc-foot { padding: 6px 12px; font-size: var(--mc-text-xs); color: var(--mc-text-subtle); border-top: 1px solid var(--mc-border-subtle); }

/* Tool-activity timeline — one per RUN of tool-carrying assistant turns, sat
   between bubbles (not inside one). Reads as a chain of work rather than a
   stack of near-empty bubbles. Quiet by construction: no bubble chrome, muted
   type, one short line per call. */
.acd-timeline {
  align-self: flex-start;
  max-width: 80%;
  display: flex;
  flex-direction: column;
  padding: 2px 0;
}
.acd-timeline-node {
  position: relative;
  display: flex;
  align-items: baseline;
  gap: 6px;
  padding: 3px 0 3px 20px;
  font-size: var(--mc-text-xs);
  line-height: 1.4;
  color: var(--mc-text-muted);
}
/* The connecting line: one segment per node, trimmed to the dot at the ends so
   it never leaks past the first/last node (both rules apply when there is a
   single node, which collapses the line to nothing). */
.acd-timeline-node::before {
  content: '';
  position: absolute;
  left: 6px;
  top: 0;
  bottom: 0;
  width: 1px;
  background: var(--mc-border);
}
.acd-timeline-node:first-child::before { top: 10px; }
.acd-timeline-node:last-child::before { bottom: calc(100% - 10px); }
/* Opaque, matching .acd-messages, so the dot masks the line behind it. */
.acd-timeline-dot {
  position: absolute;
  left: 0;
  top: 3px;
  width: 13px;
  height: 13px;
  display: flex;
  align-items: center;
  justify-content: center;
  border-radius: 50%;
  background: var(--mc-surface-2);
  font-size: 9px;
  line-height: 1;
}
.acd-timeline-name {
  color: var(--mc-text);
  font-weight: 500;
  overflow-wrap: anywhere;
}
.acd-timeline-meta { color: var(--mc-text-subtle, var(--mc-text-muted)); overflow-wrap: anywhere; }
.acd-timeline-node--ok .acd-timeline-dot { color: var(--mc-badge-ok-fg); }
.acd-timeline-node--denied .acd-timeline-dot { color: var(--mc-badge-warn-fg); }
.acd-timeline-node--error .acd-timeline-dot { color: var(--mc-danger); }
.acd-timeline-node--error .acd-timeline-name,
.acd-timeline-node--error .acd-timeline-meta { color: var(--mc-danger); }
/* A write the user cancelled — deliberately neutral, not the warn colour a
   denial/skip gets: nothing went wrong and nothing was blocked. */
.acd-timeline-node--cancelled .acd-timeline-dot { color: var(--mc-text-muted); }

/* Restore bar — a completed write that can still be put back (7 days).
   Deliberately quiet, unlike .acd-pending below: the write already happened
   and this is an available option, not a decision being demanded. Neutral
   surface, secondary button, one line. */
.acd-restore {
  display: flex; align-items: center; gap: 8px; flex-wrap: wrap;
  margin-top: 8px;
  padding: 8px 10px;
  border: 1px solid var(--mc-border);
  border-radius: 8px;
  background: var(--mc-surface-subtle, rgba(0, 0, 0, 0.02));
}
.acd-restore svg { flex-shrink: 0; color: var(--mc-text-muted); }
.acd-restore-text {
  flex: 1 1 auto; min-width: 0;
  font-size: var(--mc-text-sm);
  color: var(--mc-text-muted);
  line-height: 1.4;
}
.acd-restore-btn { flex-shrink: 0; }

/* Pending-write confirmation card — destructive framing.
   Yellow-on-yellow read like a "tip" the user could brush past. Writes are
   irreversible against live SFMC, so this card uses red borders + a
   prominent destructive action button (.mc-btn--danger from button.css). */
.acd-pending {
  margin-top: 10px;
  padding: 12px 14px;
  border: 1px solid rgba(217, 48, 37, 0.35);
  background: var(--mc-danger-tint);
  border-radius: 10px;
  box-shadow: 0 1px 2px rgba(217, 48, 37, 0.08);
}
.acd-pending-head {
  display: flex; align-items: center; gap: 8px;
  font-size: var(--mc-text-md); font-weight: 600; color: var(--mc-danger-strong);
  margin-bottom: 4px;
}
.acd-pending-head svg { width: 16px; height: 16px; flex-shrink: 0; }
.acd-pending-action {
  font-size: var(--mc-text-md);
  color: var(--mc-text);
  margin-bottom: 8px;
  line-height: 1.45;
}
.acd-pending-action strong {
  font-weight: 600;
  color: var(--mc-text);
}
.acd-pending-action code {
  font-family: ui-monospace, SFMono-Regular, Menlo, monospace;
  font-size: var(--mc-text-sm);
  background: var(--mc-surface);
  border: 1px solid rgba(217, 48, 37, 0.25);
  padding: 1px 5px;
  border-radius: var(--mc-radius-sm);
  color: var(--mc-danger-strong);
}
.acd-pending-tool {
  font-size: var(--mc-text-xs);
  color: var(--mc-text-muted);
  margin-bottom: 6px;
  font-family: ui-monospace, SFMono-Regular, Menlo, monospace;
}
/* What the write will change, as readable labelled fields. Replaces the raw
   JSON argument dump that used to sit here: it exposed internal tool-argument
   structure and was unreadable for the non-developer audience this is for.
   No confirmation surface prints JSON — see _argsSummaryLines in the component. */
.acd-pending-fields {
  font-size: var(--mc-text-xs); color: var(--mc-text);
  background: var(--mc-surface); border: 1px solid rgba(217, 48, 37, 0.25);
  padding: 8px 10px; border-radius: var(--mc-radius-md);
  max-height: 240px; overflow: auto;
  margin-bottom: 10px;
}
.acd-pending-field {
  display: flex; gap: 10px; align-items: baseline;
  padding: 3px 0;
}
.acd-pending-field + .acd-pending-field { border-top: 1px solid var(--mc-border-subtle); }
.acd-pending-field-k {
  flex: 0 0 34%; min-width: 0;
  color: var(--mc-text-muted); font-weight: 500;
  overflow-wrap: anywhere;
}
.acd-pending-field-v { flex: 1 1 auto; min-width: 0; overflow-wrap: anywhere; }
.acd-pending-subfields {
  margin: 2px 0 4px; padding-left: 18px;
  color: var(--mc-text-muted); list-style: disc;
}
.acd-pending-subfields li { padding: 1px 0; overflow-wrap: anywhere; }
.acd-pending-iframe {
  width: 100%;
  height: 320px;
  background: var(--mc-surface);
  border: 1px solid rgba(217, 48, 37, 0.25);
  border-radius: var(--mc-radius-md);
  margin-bottom: 10px;
  display: block;
}
.acd-pending-actions { display: flex; gap: 8px; align-items: center; }

.acd-prefill-hint {
  padding: 8px 14px 0;
  font-size: var(--mc-text-sm);
  color: var(--mc-text-muted);
  background: var(--mc-surface);
}
.acd-prefill-hint[hidden] {
  display: none;
}
.acd-form {
  display: flex;
  gap: 8px;
  padding: 10px 14px;
  border-top: 1px solid var(--mc-border);
  background: var(--mc-surface);
}
/* Drag-over feedback while an image hovers the composer (allowImageInput hosts). */
.acd-form--drag {
  outline: 2px dashed var(--mc-primary);
  outline-offset: -4px;
  background: var(--mc-primary-tint);
}

/* ── Image attachments (allowImageInput hosts only) ──
   Thumbnails are painted into <canvas> by the component, never
   <img src="data:…">: the extension composer renders inside the host SFMC
   page, whose CSP may not allow img-src data:. Sizes here must match the
   canvas width/height attributes the component emits (44px tray, 120px msg). */
.acd-attach-tray {
  padding: 8px 14px 0;
  background: var(--mc-surface);
}
.acd-attach-chips {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}
.acd-attach-chip {
  display: flex;
  align-items: center;
  gap: 8px;
  padding: 4px 6px 4px 4px;
  border: 1px solid var(--mc-border);
  border-radius: var(--mc-radius-lg);
  background: var(--mc-surface-1);
}
.acd-attach-thumb {
  display: block;
  width: 44px;
  height: 44px;
  border-radius: var(--mc-radius-md);
  background: var(--mc-surface-2);
}
.acd-attach-kb {
  font-size: var(--mc-text-xs);
  color: var(--mc-text-muted);
}
.acd-attach-remove {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 20px;
  height: 20px;
  padding: 0;
  border: 1px solid var(--mc-border);
  border-radius: var(--mc-radius-pill);
  background: var(--mc-surface);
  color: var(--mc-text-muted);
  font-size: var(--mc-text-lg);
  line-height: 1;
  cursor: pointer;
}
.acd-attach-remove:hover {
  color: var(--mc-danger-strong);
  border-color: var(--mc-danger-strong);
}
.acd-attach-remove:focus-visible {
  outline: 2px solid var(--mc-primary);
  outline-offset: 2px;
}
.acd-attach-error {
  margin-top: 6px;
  font-size: var(--mc-text-xs);
  color: var(--mc-danger-strong);
}
/* Paperclip trigger, sized to sit level with the send button. */
.acd-attach-btn {
  flex: none;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  align-self: flex-end;
  width: 40px;
  min-height: 40px;
  padding: 0;
  border: 1px solid var(--mc-border);
  border-radius: var(--mc-radius-lg);
  background: var(--mc-surface);
  color: var(--mc-text-tertiary);
  cursor: pointer;
}
.acd-attach-btn:hover:not(:disabled) {
  color: var(--mc-primary);
  border-color: var(--mc-primary);
}
.acd-attach-btn:disabled { opacity: 0.5; cursor: default; }
.acd-attach-btn:focus-visible {
  outline: 2px solid var(--mc-primary);
  outline-offset: 2px;
}

/* Attachments shown on a sent user turn: live thumbnails, or a light
   metadata chip once the conversation is restored from history (payload
   bytes never ride the conversation load). */
.acd-msg-images {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  margin-top: 8px;
}
.acd-msg-thumb {
  display: block;
  width: 120px;
  height: 120px;
  border-radius: var(--mc-radius-lg);
  background: var(--mc-surface-2);
}
.acd-msg-imgchip {
  font-size: var(--mc-text-xs);
  padding: 3px 8px;
  border-radius: var(--mc-radius-pill);
  background: rgba(255, 255, 255, 0.18);
  border: 1px solid rgba(255, 255, 255, 0.35);
  color: var(--mc-text-on-primary);
}
/* AI AUP disclosure (Salesforce Acceptable Use Policy — automated-system notice) */
.acd-ai-disclosure {
  padding: 0 14px 8px;
  font-size: var(--mc-text-xs);
  line-height: 1.3;
  color: var(--mc-text-subtle);
  background: var(--mc-surface);
  text-align: center;
}
.acd-input {
  flex: 1;
  resize: none;
  font: inherit;
  font-size: var(--mc-text-md);
  padding: 8px 12px;
  border: 1px solid var(--mc-border);
  border-radius: var(--mc-radius-lg);
  outline: none;
  background: var(--mc-surface);
  color: var(--mc-text);
  min-height: 40px;
  max-height: 320px;
  overflow-y: auto;
}
.acd-input:focus { border-color: var(--mc-primary); box-shadow: 0 0 0 2px rgba(26, 115, 232, 0.15); }
/* Send keeps .mc-btn--primary colors; only its shape differs. */
.acd-send {
  padding: 0 18px;
  min-height: 40px;
}

.acd-history-item:focus-visible {
  outline: 2px solid var(--mc-primary);
  outline-offset: 2px;
}
.acd-copy:focus-visible {
  outline: 2px solid var(--mc-primary);
  outline-offset: 2px;
}
.acd-input:focus-visible {
  outline: 2px solid var(--mc-primary);
  outline-offset: 1px;
  border-color: transparent;
}

/* ── Reduced motion ── */
@media (prefers-reduced-motion: reduce) {
  .acd-copy,
  .acd-send,
  .acd-input,
  .acd-pending-confirm,
  .acd-thinking {
    transition: none !important;
    animation: none !important;
  }
}

/* Bubbles carrying result cards widen so tables breathe. */
.acd-msg.acd-msg-has-cards { max-width: 96%; width: 96%; }