/* R25 — 常驻 Agent：左导航 | 中间对话 | 右侧业务内容。
 * 业务页显示 .with-ai-side；任务/项目恢复原主对话与底部输入。
 * 面板按窗口宽度 312/296/280px；不以隐藏业务内容换取空间。
 */

/* ── main-body 两栏：Agent 对话（菜单栏右侧第一列）| 页面业务内容 ──
 *   DOM 顺序即视觉顺序（ai-side 在 transcript 前）；无 ai-side 时 transcript 独占（tasks Tab 与旧布局一致） */
.main-body { flex: 1; display: flex; min-height: 0; min-width: 0; overflow: hidden; }
.main-body > .transcript { flex: 1 1 0; min-width: 0; }
.main.with-ai-side { min-width: 0; }
.main.with-ai-side .main-body > .transcript { overflow-x: hidden; }
.main.with-ai-side .edge-marks,
.main.with-ai-side .welcome-hero { display: none; }

/* ── 显示开关：仅金融四 Tab（.main.with-ai-side 由 ai-side.js 切换） ── */
.ai-side { display: none; }
.main.with-ai-side .ai-side { display: flex; }
/* 隐藏底部对话（金融四 Tab 的对话在菜单栏右侧面板） */
.main.with-ai-side .composer-wrap { display: none; }
/* 无头滚动条轨道伪元素（styles.css .main::after）在 ai-side 上会叠影 → 关闭 */
.main.with-ai-side::after { display: none; }

/* ═══════════ 面板本体（菜单栏右侧第一列） ═══════════ */
.ai-side {
  flex: none;
  width: 312px;
  min-width: 0;
  flex-direction: column;
  background: var(--bg-container);
  border-right: 1px solid #e9e6ed;
  min-height: 0;
}

/* ── 头部：单一助手标签；当前业务上下文由页面及输入提示体现 ── */
.ai-side-head {
  flex: none;
  min-height: 50px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
  padding: 10px 16px;
  background: var(--bg-container);
}
.ai-side-brand { display: flex; align-items: center; gap: 7px; min-width: 0; }
.ai-side-mark { width: 18px; height: 18px; flex: none; }
.ai-side-name { font-size: var(--type-body-size); font-weight: 500; color: #68616f; white-space: nowrap;  line-height: var(--type-body-line); }
.ai-side-name b { font-weight: 300; }
.ai-side-ctx {
  display: none;
  min-width: 0;
  font-size: var(--type-caption-size); color: #777180; white-space: nowrap;
  overflow: hidden; text-overflow: ellipsis;
  font-variant-numeric: tabular-nums;
 line-height: var(--type-caption-line); }

/* ── 消息流 ── */
.ai-thread {
  flex: 1;
  min-height: 0;
  overflow-y: auto;
  padding: 8px 16px 10px;
  overscroll-behavior: contain;
}
.ai-thread::-webkit-scrollbar { width: 4px; }
.ai-thread::-webkit-scrollbar-track { background: #f6f7f8; }
.ai-thread::-webkit-scrollbar-thumb { background: #d8d8d8; border-radius: 2px; }

/* 用户消息（右，灰气泡 — 同 .msg.user .bubble 语言） */
.ai-msg-user { display: flex; justify-content: flex-end; margin: 6px 0 14px; }
.ai-msg-user .ai-bubble {
  max-width: 86%;
  background: #f1f1f1;
  border-radius: 12px;
  padding: 8px 13px;
  font-size: var(--type-body-size);  color: #202020;
  white-space: pre-wrap; word-break: break-word;
  user-select: text;
 line-height: var(--type-body-line); }

/* AI 消息（左）：思考行 + 正文 */
.ai-msg-ai { margin: 6px 0 16px; }
/* 思考折叠行（§6：R25 Thinking... 计时 → 已完成思考 · 已处理 Ns） */
.ai-think {
  display: flex; align-items: center; gap: 5px;
  font-size: var(--type-caption-size);  color: #89828f;
  margin-bottom: 6px;
  cursor: default;
  user-select: none;
 line-height: var(--type-caption-line); }
.ai-think .ai-think-dot {
  width: 5px; height: 5px; border-radius: 50%;
  background: #7B61FF;
  animation: ai-think-pulse 1.2s ease-in-out infinite;
}
.ai-think.done .ai-think-dot { animation: none; background: #c4c4c4; }
.ai-think[hidden] { display: none; }
.ai-analysis[hidden] { display: none; }
.ai-analysis { margin: 0 0 14px; border-left: 2px solid var(--border, #e7e4ed); padding-left: 12px; color: #68616f; font-size: var(--type-caption-size); line-height: var(--type-caption-line); }
.ai-analysis summary { cursor: pointer; width: fit-content; padding: 3px 0; font-weight: 500; }
.ai-analysis summary:focus-visible { outline: 2px solid #9b7ad1; outline-offset: 3px; border-radius: 3px; }
.ai-analysis-body { padding-top: 6px; white-space: pre-wrap; overflow-wrap: anywhere; }
.ai-think.unavailable { color: #927036; }
.ai-think.unavailable .ai-think-dot { background: #b39461; }
@keyframes ai-think-pulse { 0%,100% { opacity: .35; } 50% { opacity: 1; } }
/* 正文：Markdown 气泡（无底色纯文字，同 .msg.assistant 语言） */
.ai-msg-ai .ai-body {
  font-size: var(--type-body-size);  color: #202020;
  overflow-wrap: anywhere;
  user-select: text;
 line-height: var(--type-body-line); }
.ai-msg-ai .ai-body p { margin: 0 0 8px; }
.ai-msg-ai .ai-body p:last-child { margin-bottom: 0; }
.ai-msg-ai .ai-body ul, .ai-msg-ai .ai-body ol { margin: 4px 0 8px; padding-left: 18px; }
.ai-msg-ai .ai-body li { margin: 2px 0; }
.ai-msg-ai .ai-body code.md-code {
  font-family: ui-monospace, "SFMono-Regular", Menlo, monospace;
  font-size: var(--type-caption-size); background: #f1f1f1; border-radius: 4px; padding: 1px 5px;
 line-height: var(--type-caption-line); }
.ai-msg-ai .ai-body strong { font-weight: 600; }
.ai-msg-ai .ai-body blockquote {
  margin: 6px 0 2px; padding: 2px 0 2px 10px;
  border-left: 2px solid #e0e0e0; color: #808080; font-size: var(--type-caption-size);
 line-height: var(--type-caption-line); }
/* 流式光标 */
.ai-caret::after { content: "▌"; color: #b5b5b5; animation: ai-think-pulse 1s infinite; }

/* 错误/兜底提示行 */
.ai-err { font-size: var(--type-caption-size);  color: #927036; margin-top: 8px;  line-height: var(--type-caption-line); }

/* ── 输入区 ── */
.ai-composer { flex: none; padding: 12px 14px; border-top: 1px solid #e9e6ed; background: var(--bg-container); }
.ai-composer-box {
  display: flex;
  align-items: flex-end;
  gap: 8px;
  border: 1px solid #dddddd;
  border-radius: 12px;
  background: #fff;
  padding: 9px 9px 9px 13px;
}
.ai-composer-box:focus-within { border-color: #a890ca; box-shadow: 0 0 0 2px #eee8f650; }
#ai-input {
  flex: 1; min-width: 0;
  box-sizing: border-box; display: block;
  height: 28px; min-height: 28px; padding: 3px 0; margin: 0;
  border: 0; outline: 0; resize: none;
  background: transparent;
  font: inherit; font-size: var(--type-body-size);  color: #202020;
  max-height: 140px;
  user-select: text;
 line-height: var(--type-body-line); }
#ai-input::placeholder { color: #706978; opacity: 1; }
.ai-send {
  flex: none;
  width: 28px; height: 28px;
  border-radius: 50%;
  background: #1e1e1e; color: #fff;
  display: inline-flex; align-items: center; justify-content: center;
}
.ai-send svg { width: 13px; height: 13px; stroke-width: 2.4; }
.ai-send:active { transform: scale(.95); }
.ai-send:disabled { background: #d8d4de; cursor: default; opacity: .8; transform: none; }
/* 运行态 = 停止（同 .send.stop 语言：隐藏箭头，显示方块） */
.ai-send.running svg { display: none; }
.ai-send.running::after { content: ""; width: 9px; height: 9px; background: #fff; border-radius: 2px; }
.ai-note {
  margin-top: 7px;
  text-align: right;
  font-size: var(--type-caption-size); color: #9a9a9a; 
 line-height: var(--type-caption-line); }

/* ── 焦点可达性 ── */
.ai-send:focus-visible, .ai-guide-chip:focus-visible, .ai-side-head:focus-visible { outline: 2px solid #7B61FF; outline-offset: 2px; }

/* ═══════════ 面板内引导 chips（打开面板时的快捷提问，点击即发送；发送后收起） ═══════════ */
.ai-guides { display: flex; flex-direction: column; gap: 7px; margin: 14px 0 12px; }
.ai-guide-chip {
  display: flex; align-items: center; gap: 7px;
  text-align: left;
  width: 100%;
  background: #fff;
  border: 1px solid #e5e7eb;
  border-radius: 8px;
  padding: 8px 10px;
  font-size: var(--type-caption-size);  color: #374151;
  cursor: pointer;
  transition: border-color .15s, background .15s;
 line-height: var(--type-caption-line); }
.ai-guide-txt { min-width: 0; overflow-wrap: anywhere; }
.ai-guide-detail { display: block; margin-top: 3px; color: var(--type-muted); font-size: var(--type-caption-size); line-height: var(--type-caption-line); font-weight: 400; }
.ai-guide-chip:hover { border-color: #7B61FF; background: #f9f5ff; color: #1e1e1e; }
.ai-guide-chip .ai-guide-ic {
  flex: none; width: 16px; height: 16px;
  display: inline-flex; align-items: center; justify-content: center;
  color: var(--type-muted);
}
.ai-guide-chip .ai-guide-ic svg { width: 16px; height: 16px; stroke-width: 1.6; }
.ai-guide-chip:hover .ai-guide-ic { color: #7950af; }

/* ── 窄窗口：面板压缩 ── */
@media (max-width: 1180px) {
  .main.with-ai-side .ai-side { width: 296px; }
}
@media (max-width: 1000px) {
  .main.with-ai-side .ai-side { width: 280px; }
}
@media (max-width: 680px) {
  .main.with-ai-side .ai-side { width: 38%; min-width: 148px; }
  .ai-side-head { padding: 10px; flex-wrap: wrap; gap: 4px; }
  .ai-thread { padding: 14px 10px 10px; }
  .ai-composer { padding: 10px 8px; }
  .ai-composer-box { padding-left: 8px; gap: 4px; }
  .ai-note { font-size: var(--type-caption-size); text-align: left;  line-height: var(--type-caption-line); }
}