/* ===== Buttons ===== */
.btn {
  padding: 9px 20px;
  border-radius: 8px;
  font-size: 14px;
  font-weight: 500;
  cursor: pointer;
  border: none;
  transition: background 0.15s, opacity 0.15s;
  display: inline-flex;
  align-items: center;
  gap: 6px;
}
.btn-primary { background: #2563eb; color: #fff; }
.btn-primary:hover:not(:disabled) { background: #1d4ed8; }
.btn-primary:disabled { background: #93c5fd; cursor: not-allowed; }
.btn-secondary { background: #f3f4f6; color: #374151; border: 1px solid #e5e7eb; }
.btn-secondary:hover:not(:disabled) { background: #e5e7eb; }
.btn-secondary:disabled { opacity: 0.5; cursor: not-allowed; }
.btn-danger { background: #fee2e2; color: #dc2626; border: 1px solid #fca5a5; }
.btn-danger:hover:not(:disabled) { background: #fca5a5; }

.btn-sm {
  padding: 5px 12px;
  border-radius: 6px;
  font-size: 12px;
  border: 1px solid #d1d5db;
  background: #fff;
  cursor: pointer;
  color: #374151;
  display: inline-flex;
  align-items: center;
  gap: 5px;
  transition: background 0.15s;
}
.btn-sm:hover { background: #f9fafb; }
.btn-sm.primary { background: #2563eb; color: #fff; border-color: #2563eb; }
.btn-sm.primary:hover { background: #1d4ed8; }

.action-bar {
  display: flex;
  justify-content: flex-end;
  gap: 10px;
  margin-top: 16px;
}

/* ===== Cards ===== */
.card {
  background: #fff;
  border-radius: 12px;
  border: 1px solid #e5e7eb;
  padding: 24px;
  margin-bottom: 20px;
}
.card-title {
  font-size: 16px;
  font-weight: 600;
  color: #111827;
  margin-bottom: 16px;
  display: flex;
  align-items: center;
  gap: 8px;
}
.card-title .icon { font-size: 18px; }

/* ===== Upload Zone ===== */
.upload-zone {
  border: 2px dashed #d1d5db;
  border-radius: 10px;
  padding: 32px 20px;
  text-align: center;
  cursor: pointer;
  transition: border-color 0.2s, background 0.2s;
  background: #fafafa;
}
.upload-zone:hover { border-color: #2563eb; background: #eff6ff; }
.upload-zone.has-file { border-color: #10b981; background: #f0fdf4; cursor: default; }
.upload-zone .upload-icon { font-size: 36px; margin-bottom: 8px; }
.upload-zone .upload-label { font-size: 14px; font-weight: 600; color: #374151; margin-bottom: 4px; }
.upload-zone .upload-hint { font-size: 12px; color: #9ca3af; }
.upload-zone-full { width: 100%; overflow: hidden; }

/* ===== Source Slot ===== */
.source-slot-list { display: flex; flex-direction: column; gap: 8px; }

/* 空状态 slot */
.source-slot {
  border: 2px dashed #d1d5db;
  border-radius: 10px;
  padding: 18px 16px;
  background: #fafafa;
  transition: border-color 0.2s, background 0.2s;
  position: relative;
}
.source-slot.empty { cursor: pointer; text-align: center; }
.source-slot.empty:hover { border-color: #2563eb; background: #eff6ff; }

/* 空状态内容居中竖排 */
.source-slot .slot-empty-inner {
  display: flex; flex-direction: column; align-items: center; gap: 5px;
  pointer-events: none;
}
.source-slot .slot-icon { font-size: 28px; margin-bottom: 2px; }
.source-slot .slot-label { font-size: 13px; font-weight: 600; color: #374151; }
.source-slot .slot-hint { font-size: 11px; color: #9ca3af; }
.source-slot .slot-name-suggest { font-size: 11px; color: #b0b8c8; margin-top: 4px; line-height: 1.5; }

/* 空状态的删除按钮（右上角绝对定位） */
.source-slot.empty .slot-remove-btn {
  position: absolute; top: 8px; right: 8px;
}

/* 有文件状态：左侧竖条 + flex 横排，颜色由格式类决定 */
.source-slot.has-file {
  border: 1.5px solid #d1d5db;
  border-left: 4px solid #d1d5db;
  background: #fafafa;
  padding: 12px 14px;
  overflow: hidden;
}
/* Excel → 绿色 */
.source-slot.has-file.fmt-excel {
  border-color: #10b981;
  border-left-color: #10b981;
  background: #f0fdf4;
}
/* Word → 蓝色 */
.source-slot.has-file.fmt-word {
  border-color: #3b82f6;
  border-left-color: #3b82f6;
  background: #eff6ff;
}
/* PDF → 浅橙色 */
.source-slot.has-file.fmt-pdf {
  border-color: #f97316;
  border-left-color: #f97316;
  background: #fff7ed;
}

.source-slot .slot-file-row { display: flex; align-items: center; gap: 10px; min-width: 0; }

.source-slot .slot-file-info { flex: 1; min-width: 0; overflow: hidden; }
.source-slot .slot-file-name {
  font-size: 13px; font-weight: 600;
  white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
  display: block;
  color: #1a1a1a;
}
/* 按格式调整文件名颜色 */
.source-slot.has-file.fmt-excel .slot-file-name { color: #065f46; }
.source-slot.has-file.fmt-word  .slot-file-name { color: #1d4ed8; }
.source-slot.has-file.fmt-pdf   .slot-file-name { color: #c2410c; }

.source-slot .slot-file-meta { font-size: 11px; color: #6b7280; margin-top: 3px; }
.source-slot .slot-remove-btn {
  width: 26px; height: 26px; border-radius: 50%; border: none;
  background: #fee2e2; color: #dc2626; font-size: 13px; cursor: pointer;
  display: flex; align-items: center; justify-content: center; flex-shrink: 0;
  transition: background 0.15s; line-height: 1;
}
.source-slot .slot-remove-btn:hover { background: #fca5a5; }

/* 添加文件按钮：全宽，更有存在感 */
.add-file-btn {
  margin-top: 8px;
  width: 100%;
  padding: 9px 0;
  border: 1.5px dashed #93c5fd;
  border-radius: 8px;
  background: #f8fbff;
  color: #2563eb;
  font-size: 13px;
  font-weight: 500;
  cursor: pointer;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 6px;
  transition: background 0.15s, border-color 0.15s;
  box-sizing: border-box;
}
.add-file-btn:hover { background: #dbeafe; border-color: #3b82f6; }

/* ===== Form ===== */
.form-item { display: flex; flex-direction: column; gap: 6px; }
.form-item label { font-size: 13px; font-weight: 500; color: #374151; }
.form-item input, .form-item select, .form-item textarea {
  padding: 8px 12px;
  border: 1px solid #d1d5db;
  border-radius: 8px;
  font-size: 13px;
  color: #1a1a1a;
  outline: none;
  transition: border-color 0.15s;
  background: #fff;
  font-family: inherit;
}
.form-item input:focus, .form-item select:focus, .form-item textarea:focus {
  border-color: #2563eb;
  box-shadow: 0 0 0 3px #2563eb18;
}
.form-hint { font-size: 12px; color: #9ca3af; margin-top: 2px; }

/* Toggle Switch */
.toggle { position: relative; width: 40px; height: 22px; flex-shrink: 0; }
.toggle input { opacity: 0; width: 0; height: 0; }
.toggle-slider {
  position: absolute; inset: 0; background: #d1d5db;
  border-radius: 22px; cursor: pointer; transition: 0.2s;
}
.toggle-slider::before {
  content: ''; position: absolute;
  width: 16px; height: 16px; background: #fff;
  border-radius: 50%; left: 3px; top: 3px; transition: 0.2s;
}
.toggle input:checked + .toggle-slider { background: #2563eb; }
.toggle input:checked + .toggle-slider::before { transform: translateX(18px); }

.toggle-row { display: flex; align-items: center; gap: 12px; }

/* ===== Step 2: Config ===== */
.config-section-title {
  font-size: 11px;
  font-weight: 600;
  color: #9ca3af;
  text-transform: uppercase;
  letter-spacing: 0.5px;
  margin-bottom: 14px;
  padding-bottom: 8px;
  border-bottom: 1px solid #f3f4f6;
}
.divider { border: none; border-top: 1px solid #f3f4f6; margin: 22px 0; }

/* 债券类型行 */
.bond-type-row { display: flex; align-items: center; gap: 16px; flex-wrap: wrap; }
.bond-type-row .form-item { flex: 0 0 240px; }

/* ===== 自定义下拉组件（cs-wrap）===== */
.cs-wrap {
  position: relative;
  display: inline-block;
  min-width: 160px;
  user-select: none;
}
/* 报告期用的下拉占满列宽 */
.cs-wrap.cs-period { width: 100%; }

/* 触发按钮 */
.cs-trigger {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
  padding: 8px 12px;
  border: 1px solid #d1d5db;
  border-radius: 8px;
  background: #fff;
  font-size: 13px;
  color: #1a1a1a;
  cursor: pointer;
  transition: border-color 0.15s, box-shadow 0.15s;
  white-space: nowrap;
  width: 100%;
  box-sizing: border-box;
}
.cs-trigger:hover { border-color: #93c5fd; }
.cs-wrap.cs-open .cs-trigger {
  border-color: #2563eb;
  box-shadow: 0 0 0 3px rgba(37,99,235,0.12);
}
/* 新报告期列内：蓝色边框 */
.cs-wrap.cs-new .cs-trigger { border-color: #93c5fd; }
.cs-wrap.cs-new.cs-open .cs-trigger { border-color: #2563eb; }

/* 占位文字 */
.cs-val.placeholder { color: #9ca3af; }

/* 箭头图标 */
.cs-arrow {
  width: 16px;
  height: 16px;
  flex-shrink: 0;
  color: #9ca3af;
  transition: transform 0.15s, color 0.15s;
}
.cs-wrap.cs-open .cs-arrow { transform: rotate(180deg); color: #2563eb; }

/* 下拉浮层：fixed 定位防止被父容器裁剪 */
.cs-dropdown {
  display: none;
  position: fixed;
  background: #fff;
  border: 1px solid #e5e7eb;
  border-radius: 10px;
  box-shadow: 0 8px 24px rgba(0,0,0,0.10), 0 2px 6px rgba(0,0,0,0.06);
  z-index: 9999;
  overflow: hidden;
  padding: 4px 0;
  min-width: 160px;
}
.cs-wrap.cs-open .cs-dropdown { display: block; }

/* 选项 */
.cs-option {
  display: flex;
  align-items: center;
  gap: 8px;
  padding: 9px 14px;
  font-size: 13px;
  color: #374151;
  cursor: pointer;
  transition: background 0.1s;
  white-space: nowrap;
}
.cs-option:hover { background: #f0f9ff; color: #1d4ed8; }
.cs-option.cs-selected { background: #eff6ff; color: #1d4ed8; font-weight: 500; }

/* 选中勾图标 */
.cs-check {
  width: 14px;
  height: 14px;
  flex-shrink: 0;
  opacity: 0;
}
.cs-option.cs-selected .cs-check { opacity: 1; }

/* 债券类型卡片选择器（已废弃，保留以防引用） */
.bond-type-cards {
  display: flex;
  gap: 10px;
  flex-shrink: 0;
}
.bond-type-card {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 10px 16px;
  border: 1.5px solid #e5e7eb;
  border-radius: 10px;
  background: #fafafa;
  cursor: pointer;
  transition: border-color 0.15s, background 0.15s, box-shadow 0.15s;
  min-width: 160px;
  position: relative;
  user-select: none;
}
.bond-type-card:hover {
  border-color: #93c5fd;
  background: #f0f9ff;
}
.bond-type-card.selected {
  border-color: #2563eb;
  background: #eff6ff;
  box-shadow: 0 0 0 3px #2563eb18;
}
.bond-type-card-icon {
  font-size: 20px;
  flex-shrink: 0;
  line-height: 1;
}
.bond-type-card-body {
  flex: 1;
  min-width: 0;
}
.bond-type-card-name {
  font-size: 13px;
  font-weight: 600;
  color: #374151;
  line-height: 1.3;
}
.bond-type-card.selected .bond-type-card-name {
  color: #1d4ed8;
}
.bond-type-card-desc {
  font-size: 11px;
  color: #9ca3af;
  margin-top: 2px;
  white-space: nowrap;
}
.bond-type-card.selected .bond-type-card-desc {
  color: #60a5fa;
}
/* 选中圆圈指示器 */
.bond-type-card-check {
  width: 16px;
  height: 16px;
  border-radius: 50%;
  border: 2px solid #d1d5db;
  flex-shrink: 0;
  transition: border-color 0.15s, background 0.15s;
  position: relative;
}
.bond-type-card.selected .bond-type-card-check {
  border-color: #2563eb;
  background: #2563eb;
}
.bond-type-card.selected .bond-type-card-check::after {
  content: '';
  position: absolute;
  left: 3px;
  top: 1px;
  width: 4px;
  height: 7px;
  border: 2px solid #fff;
  border-top: none;
  border-left: none;
  transform: rotate(45deg);
}

.history-toggle {
  flex: 1;
  display: flex;
  align-items: center;
  gap: 12px;
  padding: 9px 14px;
  background: #f9fafb;
  border: 1px solid #e5e7eb;
  border-radius: 8px;
  min-width: 240px;
}

/* 报告期双栏布局 */
.period-columns {
  display: grid;
  grid-template-columns: 1fr 48px 1fr;
  gap: 0;
  align-items: start;
}
.period-col {
  background: #fafafa;
  border: 1px solid #e5e7eb;
  border-radius: 12px;
  padding: 20px;
}
.period-col.old { border-color: #e5e7eb; }
.period-col.new { border-color: #bfdbfe; background: #f0f9ff; }

.period-col-header {
  font-size: 13px;
  font-weight: 700;
  color: #374151;
  margin-bottom: 18px;
  display: flex;
  align-items: center;
  gap: 6px;
  flex-wrap: wrap;
}
.period-col.new .period-col-header { color: #1d4ed8; }
.period-col-header .required { color: #ef4444; font-size: 12px; }

.period-arrow-col {
  display: flex;
  align-items: center;
  justify-content: center;
  padding-top: 60px;
  color: #d1d5db;
  font-size: 24px;
}

.period-row {
  display: grid;
  grid-template-columns: 72px 1fr;
  gap: 12px;
  align-items: center;
  margin-bottom: 14px;
}
.period-row:last-child { margin-bottom: 0; }
.period-row-label { font-size: 13px; font-weight: 600; color: #374151; white-space: nowrap; }
.period-row select, .period-row input {
  padding: 8px 12px;
  border: 1px solid #d1d5db;
  border-radius: 8px;
  font-size: 13px;
  color: #1a1a1a;
  outline: none;
  transition: border-color 0.15s;
  background: #fff;
  width: 100%;
}
.period-row select:focus, .period-row input:focus {
  border-color: #2563eb;
  box-shadow: 0 0 0 3px #2563eb18;
}
.period-col.new .period-row select,
.period-col.new .period-row input { border-color: #93c5fd; }
.period-col.new .period-row select:focus,
.period-col.new .period-row input:focus { border-color: #2563eb; }

/* 报告期推导预览 */
.period-derived {
  margin-top: 16px;
  padding: 12px 14px;
  background: #fff;
  border: 1px solid #e5e7eb;
  border-radius: 8px;
}
.period-col.new .period-derived { background: #eff6ff; border-color: #bfdbfe; }
.period-derived-label {
  font-size: 11px;
  color: #9ca3af;
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: 0.3px;
  margin-bottom: 8px;
}
.period-tags { display: flex; flex-wrap: wrap; gap: 6px; }
.period-tag {
  padding: 3px 10px;
  border-radius: 20px;
  font-size: 12px;
  font-weight: 500;
  background: #f3f4f6;
  color: #374151;
  border: 1px solid #e5e7eb;
}
.period-tag.highlight { background: #dbeafe; color: #1d4ed8; border-color: #93c5fd; }
.period-tag.del { background: #fee2e2; color: #dc2626; border-color: #fca5a5; text-decoration: line-through; }
.period-tag.new-tag { background: #dcfce7; color: #16a34a; border-color: #86efac; }

/* ===== Chapter Tree ===== */
.chapter-tree { flex: 1; overflow-y: auto; padding: 8px; }

/* 树根列表 */
.tree-root { list-style: none; margin: 0; padding: 0; }

/* 树节点 li */
.tree-node { list-style: none; }

/* 节点行（可点击区域） */
.tree-node-row {
  display: flex;
  align-items: center;
  gap: 4px;
  padding: 4px 6px;
  border-radius: 6px;
  cursor: pointer;
  font-size: 13px;
  user-select: none;
  min-height: 28px;
}
.tree-node-row:hover { background: #f3f4f6; }

/* 展开/折叠按钮 */
.tree-expand-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 16px;
  height: 16px;
  font-size: 11px;
  color: #9ca3af;
  flex-shrink: 0;
  cursor: pointer;
  border-radius: 3px;
  transition: background 0.1s;
}
.tree-expand-btn:hover { background: #e5e7eb; color: #374151; }
.tree-expand-leaf { visibility: hidden; pointer-events: none; }

/* 复选框（CSS 方形样式，替代 Unicode 字符） */
.tree-checkbox {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 16px;
  height: 16px;
  flex-shrink: 0;
  cursor: pointer;
  border-radius: 3px;
  border: 2px solid #d1d5db;
  background: #fff;
  transition: border-color 0.15s, background 0.15s;
  font-size: 0; /* 隐藏内部 Unicode 文字，改用 CSS 实现 */
  position: relative;
}
.tree-checkbox:hover {
  border-color: #2563eb;
  background: #eff6ff;
}
/* 选中状态（☑） */
.tree-checkbox.cb-checked {
  background: #2563eb;
  border-color: #2563eb;
}
.tree-checkbox.cb-checked::after {
  content: '';
  position: absolute;
  left: 3px;
  top: 1px;
  width: 5px;
  height: 8px;
  border: 2px solid #fff;
  border-top: none;
  border-left: none;
  transform: rotate(45deg);
}
/* 半选状态（☒） */
.tree-checkbox.cb-partial {
  background: #2563eb;
  border-color: #2563eb;
}
.tree-checkbox.cb-partial::after {
  content: '';
  position: absolute;
  left: 2px;
  top: 5px;
  width: 8px;
  height: 2px;
  background: #fff;
}

/* 节点文字 */
.tree-node-text {
  flex: 1;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  color: #374151;
}

/* 子节点列表 */
.tree-children { list-style: none; margin: 0; padding: 0 0 0 16px; }

/* 按层级缩进和样式 */
.tree-level-1 > .tree-node-row { font-weight: 600; }
.tree-level-1 > .tree-node-row .tree-node-text { color: #111827; }
.tree-level-2 > .tree-node-row .tree-node-text { color: #374151; }
.tree-level-3 > .tree-node-row .tree-node-text { color: #6b7280; font-size: 12px; }
.tree-level-4 > .tree-node-row .tree-node-text { color: #9ca3af; font-size: 12px; }

/* 兼容旧命名（保留） */
.tree-node input[type=checkbox] { accent-color: #2563eb; flex-shrink: 0; cursor: pointer; }
.tree-node-l1 { font-weight: 600; color: #111827; }
.tree-node-l2 { padding-left: 20px; color: #374151; }
.tree-node-l3 { padding-left: 36px; color: #6b7280; font-size: 12px; }
.tree-node-l4 { padding-left: 52px; color: #9ca3af; font-size: 12px; }

/* ===== Progress / Stats ===== */
.stat-row { display: flex; gap: 16px; margin-bottom: 16px; }
.stat-box {
  flex: 1;
  background: #f9fafb;
  border: 1px solid #e5e7eb;
  border-radius: 10px;
  padding: 14px;
  text-align: center;
}
.stat-num { font-size: 24px; font-weight: 700; color: #111827; }
.stat-num.green { color: #10b981; }
.stat-num.gray  { color: #9ca3af; }
.stat-num.red   { color: #ef4444; }
.stat-num.orange{ color: #f59e0b; }
.stat-label { font-size: 12px; color: #9ca3af; margin-top: 2px; }

/* ===== Step4 时间线日志 ===== */

/* 容器 */
.timeline-log {
  max-height: 480px;
  overflow-y: auto;
  padding: 4px 0;
}

/* 占位文字 */
.timeline-placeholder {
  font-size: 13px;
  color: #9ca3af;
  padding: 20px 0;
  text-align: center;
}

/* ── 圆点（阶段行用，大圆点）── */
.tl-dot {
  width: 10px;
  height: 10px;
  border-radius: 50%;
  background: #d1d5db;
  flex-shrink: 0;
  margin-top: 3px;
}
.tl-dot.done {
  background: #059669;
}
.tl-dot.error {
  background: #dc2626;
}
.tl-dot.running {
  background: #2563eb;
  box-shadow: 0 0 0 0 rgba(37, 99, 235, 0.4);
  animation: tl-ripple 1.2s ease-out infinite;
}
@keyframes tl-ripple {
  0%   { box-shadow: 0 0 0 0   rgba(37, 99, 235, 0.4); }
  70%  { box-shadow: 0 0 0 8px rgba(37, 99, 235, 0);   }
  100% { box-shadow: 0 0 0 0   rgba(37, 99, 235, 0);   }
}

/* ── 圆点（子条目用，小圆点）── */
.tl-dot-sm {
  width: 6px;
  height: 6px;
  border-radius: 50%;
  background: #d1d5db;
  flex-shrink: 0;
  margin-top: 4px;
}
.tl-dot-sm.done  { background: #059669; }
.tl-dot-sm.error { background: #dc2626; }

/* ── 阶段标题行 ── */
.tl-stage-row {
  display: flex;
  align-items: flex-start;
  gap: 10px;
  padding: 10px 4px 6px;
}
.tl-stage-row:not(:first-child) {
  margin-top: 4px;
}

.tl-stage-label {
  font-size: 14px;
  font-weight: 600;
  color: #111827;
  line-height: 1.4;
}
.tl-stage-label-done {
  color: #9ca3af;
  font-weight: 500;
}

/* ── 文件子条目行 ── */
.tl-file-row {
  padding: 2px 4px;
}
.tl-file-indent {
  display: flex;
  align-items: flex-start;
  gap: 8px;
  padding-left: 20px;
}
.tl-file-name {
  font-size: 12px;
  color: #374151;
  word-break: break-all;
  line-height: 1.5;
}
.tl-file-name.done  { color: #059669; }
.tl-file-name.error { color: #dc2626; }

/* ── 普通信息行 ── */
.tl-info-row {
  padding: 2px 4px;
}
.tl-info-indent {
  display: flex;
  align-items: baseline;
  gap: 8px;
  padding-left: 20px;
}
.tl-info-text {
  font-size: 12px;
  color: #6b7280;
  line-height: 1.5;
}
.tl-info-text.done  { color: #059669; }
.tl-info-text.error { color: #dc2626; font-weight: 500; }

/* ── 时间戳 ── */
.tl-time {
  font-size: 11px;
  color: #9ca3af;
  white-space: nowrap;
  flex-shrink: 0;
  font-variant-numeric: tabular-nums;
}

/* ── AI更新进度条行 ── */
.tl-progress-row {
  padding: 6px 4px;
}
.tl-progress-indent {
  display: flex;
  align-items: center;
  gap: 12px;
  padding-left: 20px;
}
.tl-progress-bar-wrap {
  flex: 1;
  background: #e5e7eb;
  border-radius: 99px;
  height: 6px;
  overflow: hidden;
  max-width: 320px;
}
.tl-progress-bar {
  height: 100%;
  background: #2563eb;
  border-radius: 99px;
  transition: width 0.3s ease;
}
.tl-progress-text {
  font-size: 12px;
  color: #6b7280;
  white-space: nowrap;
  flex-shrink: 0;
  font-variant-numeric: tabular-nums;
}

/* ===== Document Preview ===== */
#preview-content h1,
#result-doc-content h1 {
  font-size: 18px; margin: 20px 0 10px; color: #111827; text-align: center;
}
#preview-content h2,
#result-doc-content h2 {
  font-size: 16px; margin: 16px 0 8px; color: #1d4ed8;
}
#preview-content h3,
#result-doc-content h3 {
  font-size: 14px; margin: 12px 0 6px; color: #374151; font-weight: 600;
}
#preview-content p,
#result-doc-content p {
  margin-bottom: 10px;
}
#preview-content table,
#result-doc-content table {
  width: 100%; border-collapse: collapse; margin: 12px 0; font-size: 13px;
}
#preview-content th,
#result-doc-content th {
  background: #f3f4f6; padding: 8px; border: 1px solid #e5e7eb; text-align: center;
}
#preview-content td,
#result-doc-content td {
  padding: 7px 8px; border: 1px solid #e5e7eb; text-align: right;
}
#preview-content td:first-child,
#result-doc-content td:first-child { text-align: left; }

/* ===== docx-preview container ===== */
#docx-preview-container {
  flex: 1;
  overflow-y: auto;
  padding: 16px;
  background: #f5f5f5;
}
#docx-preview-container .docx-wrapper {
  background: #fff;
  max-width: 860px;
  margin: 0 auto;
  box-shadow: 0 2px 12px rgba(0,0,0,0.08);
}

/* Highlight for updated content */
.highlight-change {
  background: #fef08a;
  color: #dc2626;
  font-weight: 500;
  border-radius: 2px;
  padding: 0 1px;
  cursor: pointer;
  transition: background 0.15s;
}
.highlight-change:hover { background: #fde047; }
.highlight-delete {
  background: #fee2e2;
  color: #dc2626;
  text-decoration: line-through;
  border-radius: 2px;
  padding: 0 1px;
  cursor: pointer;
}

/* ===== Trace Drawer 内部组件样式 ===== */

/* 上区空状态占位 */
.drawer-info-placeholder {
  display: flex;
  align-items: center;
  gap: 8px;
  color: #94a3b8;
  font-size: 13px;
  padding: 4px 0;
}

/* ── 上区多行布局（每行独占一行）── */
/* 上区整体：垂直排列，行间距紧凑 */
.drawer-info-rows {
  display: flex;
  flex-direction: column;
  gap: 4px;
}

/* 第一行：类型标签 | 更新值 | 指标名称 | 计算公式（inline 横排，竖线分隔，允许换行显示完整） */
.drawer-info-row1 {
  display: flex;
  align-items: center;
  gap: 0;
  min-height: 28px;
  flex-wrap: wrap;
  overflow: visible;
}
/* 竖线分隔符 */
.drawer-row1-sep {
  color: #d1d5db;
  margin: 0 10px;
  font-size: 14px;
  flex-shrink: 0;
}
/* 第一行字段：标签+值 inline */
.drawer-row1-field {
  display: flex;
  align-items: baseline;
  gap: 5px;
  flex-shrink: 0;
  min-width: 0;
}
.drawer-row1-field-label {
  font-size: 12px;
  color: #64748b;
  font-weight: 600;
  white-space: nowrap;
  flex-shrink: 0;
}
.drawer-row1-field-value {
  /* 指标名称可截断 */
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  max-width: 300px;
}

/* 第二行 / 第三行：结果验算（独占一行，单行截断） */
.drawer-info-row2,
.drawer-info-row3 {
  display: flex;
  align-items: center;
  gap: 6px;
  min-height: 26px;
  overflow: hidden;
}

/* 第四行：计算参数横向排列 */
.drawer-info-row4 {
  display: flex;
  align-items: center;
  gap: 6px;
  flex-wrap: nowrap;
  overflow-x: auto;
  padding-bottom: 2px;
  min-height: 34px;
}
/* 细滚动条 */
.drawer-info-row4::-webkit-scrollbar { height: 3px; }
.drawer-info-row4::-webkit-scrollbar-track { background: transparent; }
.drawer-info-row4::-webkit-scrollbar-thumb { background: #e2e8f0; border-radius: 2px; }

/* 行内字段标签（加深灰色，inline，与内容字号一致） */
.drawer-inline-label {
  font-size: 12px;
  color: #64748b;
  font-weight: 600;
  white-space: nowrap;
  flex-shrink: 0;
}

/* 公式/验算文字（单行截断，无框，加粗） */
.drawer-formula-inline {
  font-size: 13px;
  font-weight: 600;
  color: #374151;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  flex: 1;
  min-width: 0;
  cursor: default;
  line-height: 1.5;
}

/* 通用：字段标签（旧版兼容，保留） */
.drawer-info-cell-label {
  font-size: 10px;
  color: #94a3b8;
  font-weight: 500;
  margin-bottom: 2px;
  white-space: nowrap;
}

/* 通用：字段容器（旧版兼容） */
.drawer-info-cell {
  display: flex;
  flex-direction: column;
}

/* 指标类型标签 */
.drawer-type-badge {
  display: inline-flex;
  align-items: center;
  gap: 5px;
  padding: 3px 10px;
  border-radius: 20px;
  font-size: 12px;
  font-weight: 600;
  white-space: nowrap;
  flex-shrink: 0;
}
.drawer-type-badge.direct     { background: #dbeafe; color: #1d4ed8; }
.drawer-type-badge.calculated { background: #fef3c7; color: #92400e; }
.drawer-type-badge.delete     { background: #fee2e2; color: #b91c1c; }

/* 旧版兼容（删除指标用） */
.drawer-info-row {
  margin-bottom: 8px;
}
.drawer-info-label {
  font-size: 11px;
  color: #94a3b8;
  font-weight: 500;
  margin-bottom: 4px;
}

/* 更新值（与标签同字号，加粗区分） */
.drawer-value-text {
  font-size: 13px;
  font-weight: 700;
  color: #1e293b;
  line-height: 1.4;
  white-space: nowrap;
}

/* 标签文字（指标名称，与其他字段同字号） */
.drawer-label-text {
  font-size: 13px;
  font-weight: 500;
  color: #374151;
}

/* 验算公式 / 计算公式（等宽字体，上区用紧凑版） */
.drawer-formula-text {
  font-family: 'SF Mono', 'Menlo', 'Courier New', monospace;
  font-size: 11px;
  color: #374151;
  background: #f1f5f9;
  border: 1px solid #e2e8f0;
  border-radius: 6px;
  padding: 4px 8px;
  word-break: break-all;
  line-height: 1.5;
}

/* ── 计算参数横排（第三行） ── */
/* 标签文字 */
.drawer-params-label {
  font-size: 10px;
  color: #94a3b8;
  font-weight: 500;
  white-space: nowrap;
  flex-shrink: 0;
  align-self: center;
}

/* 参数卡片（横排，可点击） */
.drawer-param-item {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  padding: 4px 10px;
  border: 1px solid #e5e7eb;
  border-radius: 8px;
  background: #fff;
  cursor: pointer;
  transition: background 0.12s, border-color 0.12s;
  white-space: nowrap;
  flex-shrink: 0;
  min-width: 80px;
}
.drawer-param-item:hover {
  background: #f0f9ff;
  border-color: #93c5fd;
}
.drawer-param-item.active {
  background: #eff6ff;
  border-color: #2563eb;
  box-shadow: 0 0 0 2px #2563eb22;
}
.drawer-param-value {
  font-size: 13px;
  font-weight: 700;
  color: #1e293b;
}
.drawer-param-label {
  font-size: 11px;
  color: #6b7280;
  margin-top: 1px;
  max-width: 140px;
  overflow: hidden;
  text-overflow: ellipsis;
}
.drawer-param-no-source {
  font-size: 10px;
  color: #94a3b8;
  font-style: italic;
  margin-top: 1px;
}

/* 旧版兼容（保留，以防其他地方引用） */
.drawer-operands-list {
  display: flex;
  flex-direction: column;
  gap: 6px;
}
.drawer-operand-item {
  padding: 8px 10px;
  border: 1px solid #e5e7eb;
  border-radius: 8px;
  background: #fff;
  cursor: pointer;
  transition: background 0.12s, border-color 0.12s;
}
.drawer-operand-item:hover { background: #f0f9ff; border-color: #93c5fd; }
.drawer-operand-item.active { background: #eff6ff; border-color: #2563eb; }
.drawer-operand-value { font-size: 14px; font-weight: 700; color: #1e293b; }
.drawer-operand-label { font-size: 12px; color: #6b7280; margin-top: 2px; }
.drawer-operand-no-source { font-size: 10px; color: #94a3b8; margin-top: 2px; font-style: italic; }

/* 右侧：原始数据区顶部（文件名 + 位置）
 * padding / border-bottom 由 layout.css 的 #trace-drawer-raw > .drawer-raw-header 管控，
 * 此处只定义内部元素的字体样式。
 */
.drawer-raw-filename {
  font-size: 13px;
  font-weight: 600;
  color: #1e293b;
  margin-bottom: 4px;
  word-break: break-all;
}

/* 右侧：Excel 表格容器
 * 不在此处设置 overflow-x，由外层 .drawer-raw-content（overflow:auto）统一负责横向滚动。
 * 若此处单独设置 overflow-x:auto，会创建新的滚动容器，破坏 thead th 的 position:sticky。
 */
.drawer-excel-wrap {
  display: block; /* 空规则块占位，保留此 class 供 JS 引用 */
}

/*
 * .trace-table — 后端 result_manager.py 生成 Excel HTML 时固定使用此 class。
 * 在此统一定义样式，包含高亮行（highlight-row）和高亮单元格（highlight-cell）。
 * 不在 JS 里注入内联 style，保持样式统一由 CSS 文件管控。
 */
.trace-table {
  /* border-collapse:separate 是 position:sticky thead 生效的必要条件；
     border-spacing:0 消除单元格间距，视觉与 collapse 一致 */
  border-collapse: separate;
  border-spacing: 0;
  font-size: 12px;
  min-width: 500px;
  width: 100%;
}
.trace-table thead {
  /* 整个 thead 作为一个整体粘附在滚动容器顶部，5行表头同时冻结不会互相覆盖 */
  position: sticky;
  top: 0;
  z-index: 2;
}
.trace-table th {
  background: #e2e8f0;
  padding: 6px 12px;
  text-align: center;
  border: 1px solid #cbd5e1;
  color: #6b7280;
  font-weight: 600;
  white-space: nowrap;
}
.trace-table td {
  padding: 6px 12px;
  border: 1px solid #e2e8f0;
  text-align: right;
  color: #374151;
  white-space: nowrap;
}
.trace-table td:first-child {
  text-align: left;
  color: #1e293b;
  min-width: 140px;
}
.trace-table tr:hover td { background: #f8fafc; }
.trace-table tr.highlight-row td { background: #fef9c3; }
.trace-table td.highlight-cell,
.trace-table th.highlight-cell {
  background: #ff7a00 !important;
  color: #fff;
  font-weight: 700;
}

/* 右侧：PDF 预览容器 */
.drawer-pdf-wrap {
  display: flex;
  flex-direction: column;
  height: 100%;
  min-height: 300px;
}
.drawer-pdf-label {
  font-size: 12px;
  color: #64748b;
  margin-bottom: 8px;
  display: flex;
  align-items: center;
  gap: 8px;
}
.drawer-pdf-open-link {
  font-size: 11px;
  color: #2563eb;
  text-decoration: none;
  margin-left: auto;
}
.drawer-pdf-open-link:hover { text-decoration: underline; }
.drawer-pdf-iframe {
  flex: 1;
  width: 100%;
  min-height: 280px;
  border: 1px solid #e2e8f0;
  border-radius: 6px;
  background: #f9fafb;
}

/* 右侧：Word 内容容器 */
.drawer-word-wrap {
  background: #fff;
  border: 1px solid #e2e8f0;
  border-radius: 8px;
  padding: 16px 20px;
  font-size: 13px;
  line-height: 1.8;
  color: #1e293b;
}

/* 右侧：计算指标公式展示（仅右侧主区域，无操作数文件时显示） */
.drawer-calc-formula-wrap {
  background: #fff;
  border: 1px solid #e2e8f0;
  border-radius: 8px;
  padding: 16px 20px;
}
.drawer-calc-formula-expr {
  font-family: 'SF Mono', 'Menlo', 'Courier New', monospace;
  font-size: 13px;
  color: #1e293b;
  background: #f8fafc;
  border: 1px solid #e2e8f0;
  border-radius: 6px;
  padding: 10px 14px;
  margin-bottom: 14px;
}
.drawer-calc-hint {
  font-size: 12px;
  color: #94a3b8;
  margin-top: 10px;
}

/* 加载状态 */
.drawer-loading {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  padding: 40px 20px;
  gap: 10px;
  color: #94a3b8;
  font-size: 12px;
}
.drawer-loading-spinner {
  width: 20px;
  height: 20px;
  border: 2px solid #e5e7eb;
  border-top-color: #2563eb;
  border-radius: 50%;
  animation: spin 0.7s linear infinite;
}

/* 错误状态 */
.drawer-error {
  padding: 20px;
  color: #dc2626;
  font-size: 13px;
  background: #fef2f2;
  border-radius: 8px;
  margin: 10px;
}

/* ===== Result Summary Banner ===== */
.result-banner {
  display: flex;
  align-items: center;
  gap: 12px;
  margin-bottom: 12px;
}
.result-banner .banner-icon { font-size: 24px; }
.result-banner .banner-title { font-size: 16px; font-weight: 700; color: #111827; }
.result-banner .banner-time  { font-size: 13px; color: #6b7280; margin-top: 2px; }
.result-banner .banner-actions { margin-left: auto; display: flex; gap: 8px; }

/* ===== Loading Spinner ===== */
.spinner {
  width: 16px; height: 16px;
  border: 2px solid #e5e7eb;
  border-top-color: #2563eb;
  border-radius: 50%;
  animation: spin 0.7s linear infinite;
  display: inline-block;
  flex-shrink: 0;
}
.spinner.sm { width: 12px; height: 12px; }

/* ===== Empty State ===== */
.empty-state {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  padding: 40px 20px;
  color: #9ca3af;
  gap: 8px;
  text-align: center;
}
.empty-state .empty-icon { font-size: 36px; }
.empty-state .empty-title { font-size: 14px; font-weight: 600; color: #6b7280; }
.empty-state .empty-hint { font-size: 12px; }

/* ===== Error Banner ===== */
.error-banner {
  background: #fef2f2;
  border: 1px solid #fecaca;
  border-radius: 8px;
  padding: 12px 16px;
  font-size: 13px;
  color: #dc2626;
  display: flex;
  align-items: flex-start;
  gap: 8px;
}
.error-banner .error-icon { flex-shrink: 0; margin-top: 1px; }

/* ===== Modal Dialog ===== */
.modal-overlay {
  position: fixed;
  inset: 0;
  background: rgba(0, 0, 0, 0.4);
  display: flex;
  align-items: center;
  justify-content: center;
  z-index: 10000;
  transition: opacity 0.2s;
}
.modal-overlay.hidden { display: none; }

.modal-dialog {
  background: #fff;
  border-radius: 12px;
  box-shadow: 0 16px 48px rgba(0, 0, 0, 0.15), 0 4px 12px rgba(0, 0, 0, 0.08);
  width: 480px;
  max-width: 90vw;
  max-height: 80vh;
  display: flex;
  flex-direction: column;
  overflow: hidden;
}

.modal-header {
  padding: 18px 24px;
  font-size: 16px;
  font-weight: 600;
  color: #111827;
  border-bottom: 1px solid #f3f4f6;
}

.modal-body {
  padding: 20px 24px;
  overflow-y: auto;
  flex: 1;
}

.modal-footer {
  padding: 14px 24px;
  border-top: 1px solid #f3f4f6;
  display: flex;
  justify-content: flex-end;
  gap: 10px;
}

/* 配置确认摘要样式 */
.config-summary { display: flex; flex-direction: column; gap: 12px; }
.config-summary-row {
  display: flex;
  align-items: baseline;
  gap: 8px;
  font-size: 13px;
  line-height: 1.5;
}
.config-summary-label {
  color: #6b7280;
  font-weight: 500;
  white-space: nowrap;
  flex-shrink: 0;
  min-width: 80px;
}
.config-summary-value {
  color: #111827;
  font-weight: 600;
  word-break: break-all;
}
.config-summary-divider {
  border: none;
  border-top: 1px solid #f3f4f6;
  margin: 4px 0;
}
.config-summary-periods {
  display: flex;
  flex-wrap: wrap;
  gap: 4px;
  margin-top: 4px;
}
.config-summary-period-tag {
  padding: 2px 8px;
  border-radius: 12px;
  font-size: 12px;
  font-weight: 500;
  background: #f3f4f6;
  color: #374151;
  border: 1px solid #e5e7eb;
}
.config-summary-period-tag.new-tag {
  background: #dcfce7;
  color: #16a34a;
  border-color: #86efac;
}
.config-summary-warn {
  margin-top: 8px;
  padding: 10px 12px;
  background: #fffbeb;
  border: 1px solid #fde68a;
  border-radius: 8px;
  font-size: 12px;
  color: #92400e;
  line-height: 1.5;
}