/* web/static/css/panels.css - 工作区浮层面板视觉层 (楔子报告 / 保存报告 / 诊断分类列表 / 修复预览)
 *
 * INPUT:  wedge.templ / save.templ / doctor.templ / repair.templ 的 class 与 id.
 * OUTPUT: 落地态楔子报告卡、save-impact 信任面板、分类列表 (.doctor-report__*)、修复预览卡 + reduced-motion 归零.
 * POS:    web/static/css - 纯样式; 由 cellsmith.css 的 token (:root) 供色, layout.templ 最后加载
 *         (reduced-motion 规则必须排在各面板 transition 之后才能覆盖).
 * PROTOCOL:
 *   - 从 cellsmith.css 拆出 (plan §10: 800 行上限), 拆分本身零视觉变化.
 *   - 变更时更新本头; class 增删同步对应 templ.
 */

/* ---- wedge report (落地态诊断报告: 复用 doctor-report 列表风格) ---- */
.wedge-report {
  width: 460px;
  max-width: 100%;
  max-height: 40vh;
  overflow: auto;
  margin-top: 18px;
  text-align: left;
  background: var(--card);
  border: 1px solid var(--rule);
  border-radius: 10px;
  padding: 14px 16px;
}

.wedge-report__summary {
  margin: 0 0 10px;
  font-size: 12px;
  font-weight: 600;
  color: var(--ink);
  font-variant-numeric: tabular-nums;
}

/* 分类列表复用 .doctor-report__list / __item 样式 (categoryItem 渲染同一组 class). */

.wedge-report__note { margin: 10px 0 0; font-size: 12px; color: var(--mute); }

/* ---- save-impact 信任面板 (持久可关闭卡片, 非 toast) ---- */
.save-report {
  width: 100%;
  max-width: 100%;
  max-height: 360px;
  overflow: auto;
  background: var(--surface-panel);
  border: 1px solid var(--border-subtle);
  border-radius: 8px;
  padding: 14px 16px;
}

.save-report__head { display: flex; align-items: center; justify-content: space-between; margin-bottom: 10px; }
.save-report__title { font-size: 12px; font-weight: 600; color: var(--text-primary); }

.save-report__close {
  font-family: var(--font-ui);
  font-size: 14px;
  line-height: 1;
  width: 22px;
  height: 22px;
  padding: 0;
  border: 1px solid var(--border-subtle);
  border-radius: 5px;
  background: var(--surface-panel);
  color: var(--text-secondary);
  cursor: pointer;
  transition: background-color 80ms ease;
}

.save-report__close:hover { background: var(--surface-hover); }

.save-report__summary {
  margin: 0 0 12px;
  font-family: var(--font-ui);
  font-size: 12px;
  line-height: 1.5;
  color: var(--text-secondary);
  white-space: pre-wrap;
}

.save-report__counts { margin: 0 0 12px; display: grid; grid-template-columns: 1fr auto; gap: 5px 14px; }
.save-report__counts dt { font-size: 12px; color: var(--text-secondary); }

.save-report__counts dd {
  margin: 0;
  font-family: var(--font-mono);
  font-size: 12px;
  color: var(--text-primary);
  text-align: right;
  font-variant-numeric: tabular-nums;
}

.save-report__sha { display: flex; align-items: baseline; gap: 8px; margin-bottom: 10px; }

.save-report__sha .tag {
  font-family: var(--font-ui);
  font-size: 12px;
  color: var(--accent);
}

.save-report__sha .code {
  font-family: var(--font-mono);
  font-size: 12px;
  color: var(--text-primary);
  font-variant-numeric: tabular-nums;
}

.save-report__profile { font-family: var(--font-ui); font-size: 12px; color: var(--text-muted); }

/* ---- 诊断分类列表 (共享 categoryItem; 落地页楔子用, lessons #10) ---- */
/* 工作台内的诊断自 batch 2 起是第 2 站九项清单 (css/spine.css .checks). */
.doctor-report__list {
  list-style: none;
  margin: 0;
  padding: 0;
  display: flex;
  flex-direction: column;
  gap: 8px;
}

/* item: 中性 info 默认细左边线 (FEEL 克制, 不惊吓). */
.doctor-report__item {
  padding: 8px 10px;
  border: 1px solid var(--border-subtle);
  border-left: 3px solid var(--border-subtle);
  border-radius: 6px;
  background: var(--surface-panel);
}

/* warn (仅 formula_injection): 轻微 amber 左线 + 极淡底; 不用刺眼红. */
.doctor-report__item--warn { border-left-color: var(--verm); background: var(--verm-bg); }
.doctor-report__item-head { display: flex; align-items: baseline; gap: 8px; margin-bottom: 4px; }

.doctor-report__label {
  flex: 1;
  min-width: 0;
  font-size: 12px;
  font-weight: 500;
  color: var(--text-primary);
}

.doctor-report__count {
  font-size: 14px;
  font-weight: 600;
  color: var(--text-primary);
  font-variant-numeric: tabular-nums;
}

/* warn 项计数轻调 amber, 引一眼注意但不指责. */
.doctor-report__item--warn .doctor-report__count { color: var(--verm); }

.doctor-report__sev {
  font-family: var(--font-ui);
  font-size: 12px;
  color: var(--text-muted);
}

.doctor-report__item--warn .doctor-report__sev { color: var(--verm); }
.doctor-report__message { margin: 0 0 4px; font-size: 12px; line-height: 1.45; color: var(--text-secondary); }

/* 受影响行/列号: mono + muted; 长 "and N more" 列表允许换行不断版. */
.doctor-report__rows {
  margin: 0;
  font-size: 12px;
  line-height: 1.45;
  color: var(--text-muted);
  word-break: break-word;
}

/* ---- Repair 预览 (只存在于第 4 站内; 站内排版见文件下方 #station-preview 规则) ---- */
.repair-preview__head { display: flex; align-items: center; justify-content: space-between; margin-bottom: 10px; }
.repair-preview__title { font-size: 12px; font-weight: 600; color: var(--text-primary); }

.repair-preview__close {
  font-family: var(--font-ui);
  font-size: 14px;
  line-height: 1;
  width: 22px;
  height: 22px;
  padding: 0;
  border: 1px solid var(--border-subtle);
  border-radius: 5px;
  background: var(--surface-panel);
  color: var(--text-secondary);
  cursor: pointer;
  transition: background-color 80ms ease;
}

.repair-preview__close:hover { background: var(--surface-hover); }

/* 影响计数: 英文中性全句; mono + tabular-nums (FEEL 数字列对齐, 不做装饰). */
.repair-preview__counts { margin: 0 0 12px; display: flex; flex-direction: column; gap: 4px; }

.repair-preview__line {
  margin: 0;
  font-family: var(--font-ui);
  font-size: 12px;
  line-height: 1.5;
  color: var(--text-secondary);
  font-variant-numeric: tabular-nums;
}

/* 样本 before->after: 浅底卡 + mono; 首尾空白已由 JS 转成 middle dot 可视化. */
.repair-preview__samples {
  margin: 0 0 12px;
  display: flex;
  flex-direction: column;
  gap: 3px;
  padding: 8px 10px;
  background: var(--surface-header);
  border: 1px solid var(--border-subtle);
  border-radius: 6px;
}

.repair-preview__sample {
  margin: 0;
  font-family: var(--font-mono);
  font-size: 12px;
  line-height: 1.4;
  color: var(--text-secondary);
  word-break: break-all;
}

.repair-preview__loc { color: var(--text-muted); margin-right: 6px; }
.repair-preview__ba { color: var(--text-primary); }
.repair-preview__actions { display: flex; gap: 8px; align-items: center; }
.repair-preview__note { font-family: var(--font-ui); font-size: 12px; color: var(--text-muted); }

.repair-preview__confirm {
  margin: 0;
  font-family: var(--font-ui);
  font-size: 12px;
  line-height: 1.5;
  color: var(--text-secondary);
  font-variant-numeric: tabular-nums;
}


/* Preview lives in station 4, not above the grid. */
#station-preview #repair-preview { padding: 3px 16px; }
#station-preview #repair-preview[hidden] { display: none; }
.preview-head { margin: 0; padding: 0 16px; }
.preview-head__title { margin: 0; font-size: 14px; line-height: 30px; font-weight: 600; }
.preview-head__counts { margin: 0; display: grid; grid-template-columns: 1fr auto; grid-auto-rows: 30px; align-items: center; gap: 0 8px; font-size: 12px; }
.preview-head__counts div { display: contents; }
.preview-head__counts dt { color: var(--text-muted); }
.preview-head__counts dd { margin: 0; text-align: right; font-variant-numeric: tabular-nums; }
.preview-head__kept { margin: 0; font-size: 12px; line-height: 30px; color: var(--text-muted); }
#station-preview .repair-preview__actions { flex-wrap: wrap; }
.vg-cell.preview-cell { line-height: 19px !important; padding-top: 3px !important; font-size: 12px !important; }
.preview-cell__before, .preview-cell__after { display: block; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; height: 19px; }
.preview-cell__before { color: var(--text-muted); }
.preview-cell del { color: var(--diff-del-fg); background: var(--diff-del-bg); text-decoration: line-through; }
.preview-cell ins { color: var(--diff-ins-fg); background: var(--diff-ins-bg); text-decoration: none; }

/* ---- split panel (split.templ; 浮在 lens bar 下方, 与 filter-panel 同一定位语言) ---- */
.split-panel,
.xlsx-panel {
  position: absolute;
  top: calc(100% + 5px);
  right: 16px;
  width: min(380px, calc(100vw - 36px));
  max-height: calc(100vh - 140px);
  overflow: auto;
  padding: 16px;
  border: 1px solid var(--rule-2);
  border-radius: 2px;
  background: var(--paper);
  box-shadow: var(--shadow-float);
  color: var(--ink);
  font-size: 14px;
}
.split-panel[hidden], .xlsx-panel[hidden] { display: none; }
.split-panel__head { display: flex; align-items: center; justify-content: space-between; }
.split-panel__head h2 { margin: 0; font-size: 14px; font-weight: 700; }
.split-panel__close { border: 0; background: transparent; color: var(--mute); cursor: pointer; font-size: 16px; line-height: 1; }
.split-panel__close:focus-visible { outline: 2px solid var(--focus-ring); }
.split-panel__lead { margin: 8px 0 12px; color: var(--mute); line-height: 1.45; }
.split-panel__form { display: flex; flex-direction: column; gap: 12px; align-items: flex-start; }
.split-fields { display: flex; flex-direction: column; gap: 10px; width: 100%; margin: 0; padding: 0; border: 0; min-width: 0; }
.split-fields__rows { display: flex; flex-direction: column; gap: 4px; font-weight: 600; }
.split-fields__rows input { width: 100%; padding: 6px 8px; border: 1px solid var(--rule-2); border-radius: 2px; background: var(--card); color: var(--ink); font-family: var(--font-ui); font-size: 16px; font-variant-numeric: tabular-nums; }
.split-fields__header { display: flex; align-items: center; gap: 8px; cursor: pointer; }
.split-fields__header input { accent-color: var(--ink); }
.split-fields__note { color: var(--mute); font-size: 12px; line-height: 1.4; }
.split-result { margin-top: 14px; }
.split-result:empty { display: none; }
.split-result__line { margin: 0 0 8px; font-weight: 600; font-variant-numeric: tabular-nums; line-height: 1.4; }
.split-result__parts { margin: 12px 0 0; padding: 0; list-style: none; color: var(--ink-2); font-variant-numeric: tabular-nums; line-height: 1.6; }
.split-result__more { margin: 4px 0 0; color: var(--mute); }
.split-result__note, .split-result__error { margin: 0; line-height: 1.45; }
.split-result__error { color: var(--verm); font-weight: 600; }
.split-result__download { display: inline-block; text-decoration: none; }
/* ---- xlsx panel (xlsx.templ; CSV to Excel, 与 split-panel 同一定位语言) ---- */
.xlsx-panel__head { display: flex; align-items: center; justify-content: space-between; }
.xlsx-panel__head h2 { margin: 0; font-size: 14px; font-weight: 700; }
.xlsx-panel__close { border: 0; background: transparent; color: var(--mute); cursor: pointer; font-size: 16px; line-height: 1; }
.xlsx-panel__close:focus-visible { outline: 2px solid var(--focus-ring); }
.xlsx-panel__lead { margin: 8px 0 12px; color: var(--mute); line-height: 1.45; }
.xlsx-panel__form { display: flex; flex-wrap: wrap; gap: 8px; align-items: flex-start; }
.xlsx-panel__view { display: flex; align-items: center; gap: 8px; margin: 10px 0 0; cursor: pointer; }
.xlsx-panel__view input { accent-color: var(--ink); }
.xlsx-panel__details { margin-top: 12px; color: var(--mute); font-size: 12px; line-height: 1.5; }
.xlsx-panel__details summary { cursor: pointer; }
.xlsx-panel__details p { margin: 8px 0 0; }
/* 单格式页: 有下载链接就不再并排放 Prepare; 失效/出错时它回来. */
.xlsx-panel:has(#xlsx-download) .xlsx-panel__form--solo { display: none; }
.xlsx-result { margin-top: 14px; }
.xlsx-result:empty { display: none; }
.xlsx-result__line { margin: 0 0 8px; font-weight: 600; font-variant-numeric: tabular-nums; line-height: 1.4; }
.xlsx-result__note, .xlsx-result__error { margin: 0; line-height: 1.45; }
.xlsx-result__error { color: var(--verm); font-weight: 600; }
.xlsx-result__download { display: inline-block; text-decoration: none; }
/* ---- merge report (Merge CSV Files: 合并结果 / 拒绝原因; 覆盖在网格左下, 可关闭) ---- */
.merge-report:empty { display: none; }
.merge-report {
  position: absolute;
  left: 16px;
  bottom: 16px;
  z-index: 4;
  width: min(560px, calc(100% - 32px));
}
.merge-report__card {
  background: var(--card);
  border: 1px solid var(--rule-2);
  border-radius: 10px;
  box-shadow: var(--shadow-card);
  padding: 14px 16px;
}
.merge-report__card--rejected { border-color: var(--warn); }
.merge-report__title { margin: 0 0 6px; font-size: 14px; font-weight: 600; color: var(--ink); }
.merge-report__meta { margin: 0 0 12px; font-size: 12px; line-height: 1.5; color: var(--ink-2); }
.merge-report__issues { margin: 0 0 12px; padding-left: 18px; font-size: 12px; line-height: 1.6; color: var(--ink-2); }
.merge-report__actions { display: flex; flex-wrap: wrap; gap: 6px; }
.merge-report__actions .btn { padding: 6px 10px; }

/* ---- motion: FEEL 下一帧法则. 网格永不动画; 仅微交互 <=80ms. ---- */
@media (prefers-reduced-motion: reduce) {
  .btn,
  .save-report__close,
  .repair-preview__close {
    transition: none;
    animation: none;
  }
}