/* 0.4 对话面·生命周期的样式（施工图 §3.0：归 WA1）。第 0 波由 P-COPY 建空文件并挂进 index.html（chat.css 之后），规则由 WA1 填。 */

/* 只读令牌（施工图 K-11）：进场只认 [data-enter]:not([data-enter=""])；@keyframes 只动 opacity / transform；
 * 时长只读 --dur-* / --spring-*-dur / --loop-*；不用 --glass-*、不写 backdrop-filter。既有样式一行不改（归 LG-W）。
 */

/* ---------------------------------------------------------------- 回执行（K-14 [data-receipt]）
 * 0.4 A3：「没有联网：这台服务的联网还没开放」。它和「本轮读取」同一个角色——每条回答下面的注脚：
 * 安静的一行字，没有底、没有边（与 .chat-read-receipt 同一种长相，0.3.6 七修的判据）。 */
.chat-receipt-line {
  margin-top: 8px;
  color: var(--text-faint);
  font-size: var(--fs-tiny);
  line-height: 1.65;
  overflow-wrap: anywhere;
}

/* 0.4.1：联网回执带来源了。来源清单与回执行是同一个角色——回答下面的注脚，
 * 所以沿用同一档字号与同一种安静的灰，只多一层缩进；链接由 rich-text 的既有策略决定
 * 能不能点（对外模式 ≠ off 时中和成「文字 + 拷贝链接」），这里不给它另一种长相。 */
.chat-search-sources {
  margin: 4px 0 0;
  padding-left: 1.1em;
  color: var(--text-faint);
  font-size: var(--fs-tiny);
  line-height: 1.65;
  list-style: disc;
}
.chat-search-sources li { overflow-wrap: anywhere; }
.chat-search-sources small { margin-left: 6px; color: var(--text-faint); }

/* ---------------------------------------------------------------- 依据（L-07）
 * 答案原位不动，依据追加在下面；超过 6 行默认折进「查看依据」。
 * 折叠开关与「本轮读取」同一种长相：一行安静的字，悬停才加深。 */
.chat-basis > summary {
  cursor: pointer;
  width: fit-content;
  max-width: 100%;
  padding: 4px 0;
  color: var(--text-faint);
  font-size: var(--fs-tiny);
}
.chat-basis > summary:hover { color: var(--text-muted); }
.chat-basis__body {
  display: flex;
  flex-direction: column;
  gap: 14px;
  margin-top: 10px;
}

@media (max-width: 820px) {
  .chat-basis > summary { min-height: var(--touch-target); display: flex; align-items: center; }
}

/* ---------------------------------------------------------------- 首次调用告知（M-01；K-14 [data-notice="intelligence-first-call"]）
 * 气泡下内嵌的一张纸：与「工作进度等待同步」那一条（.chat-continuity-pending）同一种长相——
 * 细边、强调色淡底、纸面上的字；宽度与消息同一条阅读栏。它是纸，不是玻璃（K-11：这里不写 backdrop-filter）。 */
.chat-notice {
  width: 100%;
  max-width: var(--reading-w);
  margin: -14px auto 0;
  padding: 12px 14px;
  display: flex;
  flex-direction: column;
  gap: 6px;
  border: 1px solid color-mix(in srgb, var(--accent) 28%, var(--hairline));
  border-radius: var(--radius-sm);
  background: color-mix(in srgb, var(--accent-soft) 52%, var(--surface));
  color: var(--text-muted);
  font-size: var(--fs-tiny);
  line-height: 1.6;
}
.chat-notice__title { color: var(--text); font-size: var(--fs-small); font-weight: 600; }
.chat-notice__text { overflow-wrap: anywhere; }
.chat-notice__error { color: var(--danger); }
.chat-notice__acts { display: flex; justify-content: flex-end; flex-wrap: wrap; gap: 8px; margin-top: 4px; }

/* ---------------------------------------------------------------- 额度卡（M-03；K-14 [data-receipt="quota"]）
 * 回答位上的一段：标题 / 事实 / 还能用什么 / 动作。与结构化回答同一种排版（纸面上的字，不另起一张彩色卡）。 */
.chat-quota { display: flex; flex-direction: column; gap: 8px; }
.chat-quota__title { color: var(--text); font-size: var(--fs-body); font-weight: 600; }
.chat-quota p { color: var(--text-muted); font-size: var(--fs-small); line-height: 1.65; overflow-wrap: anywhere; }
.chat-quota__facts { color: var(--text); }
.chat-quota footer { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 2px; }

@media (max-width: 820px) {
  .chat-notice__acts .btn, .chat-quota footer .btn { min-height: var(--touch-target); flex: 1 1 auto; }
}

/* ---------------------------------------------------------------- 0.4.3 B2：大段粘贴 → 逐条候选
 * 这一张就是对话里「等你确认」的计划卡（UI_PATTERNS §12：提议卡 / 导入预览 = .chat-plan，--accent-soft 卡头），
 * 只是每一行自己带动作——逐条确认，不是一次勾完一起写。原文那一行与计划卡的 q 同一种引文长相。 */
.chat-bulk { margin-top: 10px; }
.chat-bulk__note { margin: 0; padding: 8px 16px 10px; font-size: var(--fs-small); color: var(--text-muted); border-top: 1px solid var(--hairline); }
.chat-bulk__row { cursor: default; flex-wrap: wrap; }
.chat-bulk__row:hover { background: none; }
.chat-bulk__row.is-settled .chat-plan__icon { color: var(--accent-ink); background: var(--accent-soft); }
.chat-bulk__row.is-settled b { color: var(--text-muted); font-weight: 500; }
.chat-bulk__content { display: flex; flex: 1 1 16em; flex-direction: column; gap: 2px; min-width: 0; overflow-wrap: anywhere; }
.chat-bulk__content q {
  display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden;
}
/* 动作单独占一行、靠右：内容那一列要多宽就多宽，四枚按钮不被挤成一竖条。
   用 div 不用 span：chat.css 的 `.chat-plan__item > span:last-child` 会把最后一个 span 排成竖列。 */
.chat-bulk__acts { display: flex; flex: 1 0 100%; flex-wrap: wrap; align-items: center; justify-content: flex-end; gap: 6px; }
.chat-bulk__acts .btn { flex: none; align-self: center; }
.chat-bulk__mark { display: block; width: 8px; height: 8px; }
.chat-bulk__mark.is-event { border-radius: 50%; background: var(--accent); }
.chat-bulk__mark.is-task { border-radius: 2px; border: 1.5px solid var(--text-muted); }
.chat-bulk__editor { display: flex; flex: 1 1 100%; flex-direction: column; gap: 8px; min-width: 0; }
.chat-bulk__editor label { display: flex; flex-direction: column; gap: 4px; font-size: var(--fs-micro); color: var(--text-faint); }
.chat-bulk__editor .input { background: var(--surface-sunken); }
.chat-bulk__when { display: flex; flex-wrap: wrap; gap: 8px; }
.chat-bulk__when label { flex: 1 1 10em; }
.chat-bulk__editor footer { display: flex; justify-content: flex-end; gap: 8px; }
.chat-bulk__error { margin: 0; font-size: var(--fs-small); color: var(--danger); }
.chat-bulk__done { margin-right: auto; font-size: var(--fs-small); color: var(--text-muted); }

@media (max-width: 820px) {
  .chat-bulk__acts { justify-content: flex-start; padding-left: 33px; }
  .chat-bulk__acts .btn, .chat-bulk__editor .btn { min-height: var(--touch-target); }
}