/* 业务地址 · 批量导入页 —— 只补本页要用的东西;基础视觉(按钮/卡片/登录门/toast/导航条)
   全部复用 dict.css。本文件只有这一页 link,故这里放宽 .card 的内边距不会影响别的页。 */

main { max-width: 1000px; }          /* 比别的页宽一点:错误清单有四列,880 会挤 */
main > .card { padding: 18px 20px; }
main > .card h3 { margin: 0 0 10px; font-size: 15px; }

/* ---- 步骤条 ---- */
.steps {
  display: flex; gap: 8px; list-style: none; margin: 0 0 16px; padding: 0;
}
.step {
  flex: 1; display: flex; align-items: center; gap: 8px;
  padding: 9px 14px; border-radius: 8px; font-size: 13px;
  background: #eceef1; color: #8a9099; border: 1px solid #e6e8eb;
}
.step-no {
  width: 20px; height: 20px; border-radius: 50%; flex: none;
  display: inline-flex; align-items: center; justify-content: center;
  background: #c7ccd3; color: #fff; font-size: 12px; font-weight: 600;
}
.step.current { background: #fff; color: #1f2328; border-color: #2563eb; font-weight: 600; }
.step.current .step-no { background: #2563eb; }
.step.done { color: #14663a; background: #e7f6ec; border-color: #bce3c9; }
.step.done .step-no { background: #16a34a; }

/* ---- 模板说明 ---- */
.tpl-box {
  background: #fafbfc; border: 1px solid #e6e8eb; border-radius: 8px;
  padding: 14px 16px; margin: 14px 0 18px;
}
.tpl-title { font-size: 13px; font-weight: 600; margin-bottom: 8px; }
.tpl-table { border-collapse: collapse; font-size: 12px; margin-bottom: 10px; }
.tpl-table th, .tpl-table td { border: 1px solid #dfe3e8; padding: 5px 12px; text-align: left; }
.tpl-table th { background: #eff1f4; font-weight: 600; }
.tpl-table td { color: #6b7280; }
.tpl-note { font-size: 12px; line-height: 1.7; margin-bottom: 10px; }

/* ---- 横幅(预览结果的一句话结论)---- */
.banner {
  padding: 11px 14px; border-radius: 8px; font-size: 13px; line-height: 1.6;
  margin: 12px 0 14px;
}
.banner-ok  { background: #e7f6ec; color: #14663a; border: 1px solid #bce3c9; }
.banner-err { background: #fdecec; color: #a01d1d; border: 1px solid #f2b8b8; }

/* ---- 分布(按公司 / 按部门)---- */
.dist-row { display: flex; gap: 12px; margin-bottom: 16px; }
.dist-box {
  flex: 1; background: #fafbfc; border: 1px solid #e6e8eb;
  border-radius: 8px; padding: 10px 14px;
}
.dist-title { font-size: 12px; color: #8a9099; margin-bottom: 6px; }
.dist-line { display: flex; justify-content: space-between; padding: 2px 0; font-size: 13px; }
.dist-count { color: #6b7280; }

/* ---- 表格(样例 / 错误清单)---- */
.sample-title { font-size: 13px; color: #5b636e; margin-bottom: 8px; }
.table-wrap { overflow-x: auto; border: 1px solid #e6e8eb; border-radius: 8px; }
.data-table { border-collapse: collapse; width: 100%; font-size: 13px; }
.data-table th, .data-table td {
  padding: 8px 12px; text-align: left; border-bottom: 1px solid #f0f1f3;
  white-space: nowrap;
}
.data-table th { background: #fafbfc; font-weight: 600; font-size: 12px; color: #5b636e; }
.data-table tbody tr:last-child td { border-bottom: none; }
.data-table .mono {
  font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace; font-size: 12px;
}

/* 错误清单:行号和原值要显眼 —— 人要照着它回表格里找那个格子 */
.err-table .err-row-no { font-weight: 700; color: #a01d1d; }
.err-table .err-val { color: #6b7280; max-width: 320px; overflow: hidden; text-overflow: ellipsis; }
.err-table td:last-child { white-space: normal; min-width: 260px; }
#error-more { font-size: 12px; margin-top: 8px; }

/* ---- 卡片底部按钮 ---- */
.card-actions {
  display: flex; justify-content: flex-end; gap: 10px;
  margin-top: 16px; padding-top: 14px; border-top: 1px solid #f0f1f3;
}
.card-actions a.btn { text-decoration: none; display: inline-flex; align-items: center; }

/* 第一步的按钮区不需要上边框(上面就是个文件选择框,画条线显得断) */
#sec-pick .card-actions { border-top: none; padding-top: 0; }

#done-detail { font-size: 12px; line-height: 1.8; }

/* ---- 导入方式(单选)---- */
.mode-line {
  display: flex; align-items: flex-start; gap: 8px; padding: 8px 10px;
  border: 1px solid #e6e8eb; border-radius: 8px; margin-bottom: 6px;
  cursor: pointer; font-size: 13px; line-height: 1.6;
}
.mode-line:hover { background: #fafbfc; }
.mode-line input { margin-top: 3px; flex: none; width: auto !important; }
.mode-line span { color: #5b636e; }
.mode-line strong { color: #1f2328; }
#company-field[hidden], #tpl-box[hidden] { display: none; }

/* ---- 四分类概览(数字一眼可见)---- */
.stat-row { display: flex; gap: 10px; margin-bottom: 12px; }
.stat {
  flex: 1; background: #fafbfc; border: 1px solid #e6e8eb;
  border-radius: 8px; padding: 10px 14px; text-align: center;
}
.stat-n { font-size: 22px; font-weight: 700; line-height: 1.3; }
.stat-t { font-size: 12px; color: #8a9099; }
.stat.ok     { background: #e7f6ec; border-color: #bce3c9; }
.stat.ok .stat-n { color: #14663a; }
.stat.warn   { background: #fdf3e2; border-color: #f0d9a8; }
.stat.warn .stat-n { color: #8a5a00; }
.stat.danger { background: #fdecec; border-color: #f2b8b8; }
.stat.danger .stat-n { color: #a01d1d; }

/* ---- 折叠块(每一类一块)---- */
.block {
  border: 1px solid #e6e8eb; border-radius: 8px;
  margin-bottom: 10px; background: #fff;
}
.block[hidden] { display: none; }
.block-h {
  padding: 10px 14px; font-size: 13px; font-weight: 600;
  cursor: pointer; user-select: none; list-style: none;
}
.block-h::-webkit-details-marker { display: none; }
.block-h::before { content: "▸ "; color: #8a9099; }
.block[open] > .block-h::before { content: "▾ "; }
.block-h.warn-h   { color: #8a5a00; background: #fdf9f0; }
.block-h.danger-h { color: #a01d1d; background: #fdf2f2; }
.block > .table-wrap { border: none; border-top: 1px solid #f0f1f3; border-radius: 0; }
.blk-note { font-size: 12px; padding: 8px 14px; line-height: 1.7; background: #fafbfc; }

/* 明细原文:可换行、限高,否则一段几百字的申请单会把表格撑爆 */
.detail-cell {
  white-space: pre-wrap !important; max-width: 460px; font-size: 12px;
  color: #6b7280; max-height: 90px; overflow-y: auto; display: block;
}
.data-table td.wrap { white-space: pre-line !important; }

/* ---- 勾选闸 ---- */
.ack-box {
  background: #fdf9f0; border: 1px solid #f0d9a8; border-radius: 8px;
  padding: 12px 14px; margin-top: 14px;
}
.ack-box .chk-line { display: flex; align-items: flex-start; gap: 9px; font-size: 13px; }
.ack-box input { margin-top: 2px; flex: none; }