/* ============================================================
 * 敦煌印刷 · 业务报价系统 原型样式
 * 浅色主题 · 主色 #1565C0
 * ============================================================ */
:root {
  --primary: #1565C0;
  --primary-dark: #0D47A1;
  --primary-light: #E3F2FD;
  --accent: #FF8F00;
  --bg: #F2F4F8;
  --card: #FFFFFF;
  --text: #1F2937;
  --muted: #6B7280;
  --border: #E2E6EC;
  --ok: #16A34A;
  --warn: #B45309;
  --danger: #DC2626;
  --radius: 10px;
  --shadow: 0 1px 3px rgba(15, 23, 42, .08), 0 4px 16px rgba(15, 23, 42, .06);
}

/* V3.6.1.6：禁用 number input 滚轮增/减数字（聚焦 + 滚轮 = 误触改值；客户/业务反馈）
   同时收掉 spinner 按钮，视觉与防误触双保险。Firefox 通过下方 JS wheel 事件拦截。 */
input[type=number]::-webkit-outer-spin-button,
input[type=number]::-webkit-inner-spin-button { -webkit-appearance: none; margin: 0; }
input[type=number] { -moz-appearance: textfield; }

* { box-sizing: border-box; margin: 0; padding: 0; }
body {
  font-family: "Microsoft YaHei", "PingFang SC", "Helvetica Neue", Arial, sans-serif;
  background: var(--bg);
  color: var(--text);
  font-size: 14px;
  line-height: 1.6;
}
a { color: var(--primary); text-decoration: none; }
a:hover { text-decoration: underline; }
button { font-family: inherit; cursor: pointer; }
input, select, textarea {
  font-family: inherit; font-size: 13px;
  border: 1px solid var(--border); border-radius: 6px;
  padding: 6px 10px; background: #fff; color: var(--text);
  outline: none; transition: border-color .15s;
}
input:focus, select:focus, textarea:focus { border-color: var(--primary); box-shadow: 0 0 0 3px rgba(21,101,192,.12); }
.hidden { display: none !important; }

/* ---- 按钮 ---- */
.btn {
  display: inline-flex; align-items: center; gap: 6px;
  border: 1px solid var(--border); background: #fff; color: var(--text);
  border-radius: 7px; padding: 7px 14px; font-size: 13px;
  transition: all .15s; white-space: nowrap;
}
.btn:hover { border-color: var(--primary); color: var(--primary); }
.btn-primary { background: var(--primary); border-color: var(--primary); color: #fff; }
.btn-primary:hover { background: var(--primary-dark); color: #fff; }
.btn-ghost { border-color: transparent; background: transparent; color: var(--muted); }
.btn-danger { color: var(--danger); }
.btn-danger:hover { border-color: var(--danger); }
.btn-sm { padding: 4px 9px; font-size: 12px; border-radius: 6px; }
.btn-xs { padding: 2px 6px; font-size: 11px; border-radius: 5px; }
.btn-lg { padding: 12px 30px; font-size: 15px; border-radius: 9px; }
.btn-block { width: 100%; justify-content: center; }
.btn:disabled { opacity: .5; cursor: not-allowed; }

/* ---- 布局 ---- */
.topbar {
  position: sticky; top: 0; z-index: 50;
  background: #fff; border-bottom: 1px solid var(--border);
  display: flex; align-items: center; gap: 16px; padding: 0 24px; height: 56px;
}
.brand { display: flex; align-items: center; gap: 10px; font-weight: 700; font-size: 16px; color: var(--primary-dark); }
.brand .logo {
  width: 30px; height: 30px; border-radius: 8px; background: linear-gradient(135deg, var(--primary), #42A5F5);
  color: #fff; display: flex; align-items: center; justify-content: center; font-size: 15px;
}
.nav { display: flex; gap: 4px; flex: 1; }
.nav a {
  padding: 7px 14px; border-radius: 7px; color: var(--muted); font-size: 14px;
}
.nav a:hover { background: var(--primary-light); color: var(--primary); text-decoration: none; }
.nav a.active { background: var(--primary-light); color: var(--primary); font-weight: 600; }
.userbox { display: flex; align-items: center; gap: 10px; font-size: 13px; color: var(--muted); }
.avatar {
  width: 30px; height: 30px; border-radius: 50%; background: var(--primary-light);
  color: var(--primary); display: flex; align-items: center; justify-content: center; font-weight: 700; font-size: 13px;
}
/* V3.7.39：取消 1380px max-width 上限 → 编辑页在 ≤1699px 屏幕直接吃满视口
 * 仅在 ≥1700px 大屏保留 1640px 居中。理由：旧上限让中等屏 (1400-1699px)
 * 在 TOC padding-left:268px 推挤下，内容区只剩 ~1064px，材料表参数列被裁。
 * 取消上限后中等屏内容区扩到 ~1100-1380px，参数列不再被裁。 */
.container { margin: 0 auto; padding: 24px; }

/* ---- 登录页 ---- */
.login-wrap {
  min-height: 100vh; display: flex; align-items: center; justify-content: center;
  background: linear-gradient(160deg, #E3F2FD 0%, #F2F4F8 55%, #fff 100%);
}
.login-card {
  width: 380px; background: #fff; border-radius: 16px; box-shadow: var(--shadow);
  padding: 36px 32px;
}
.login-card .logo-big {
  width: 52px; height: 52px; border-radius: 14px;
  background: linear-gradient(135deg, var(--primary), #42A5F5);
  color: #fff; display: flex; align-items: center; justify-content: center;
  font-size: 26px; margin: 0 auto 14px;
}
.login-card h1 { font-size: 20px; text-align: center; margin-bottom: 4px; }
.login-card .sub { text-align: center; color: var(--muted); font-size: 13px; margin-bottom: 24px; }
.login-card label { display: block; font-size: 13px; color: var(--muted); margin: 14px 0 6px; }
.login-card input { width: 100%; padding: 9px 12px; font-size: 14px; }
.demo-accounts { margin-top: 20px; border-top: 1px dashed var(--border); padding-top: 14px; }
.demo-accounts .t { font-size: 12px; color: var(--muted); margin-bottom: 8px; text-align: center; }
.demo-accounts .row { display: flex; gap: 8px; }
.demo-accounts .btn { flex: 1; justify-content: center; font-size: 12px; }

/* ---- 页面标题 ---- */
.page-head { display: flex; align-items: center; justify-content: space-between; margin-bottom: 18px; gap: 12px; flex-wrap: wrap; }
.page-head h2 { font-size: 20px; }
.page-head .desc { color: var(--muted); font-size: 13px; margin-top: 2px; }
.toolbar { display: flex; gap: 10px; align-items: center; flex-wrap: wrap; }

/* V3.7.44：操作按钮固定（sticky）左上角 + 透明底色，滚动时也能保存/返回/刷新，不依赖顶部 page-head。
 * 置于内容列最左（TOC 在更左的固定栏，互不重叠），sticky 跟随滚动钉在顶栏下方。 */
.floating-actions {
  position: sticky; top: 60px; z-index: 55;
  display: flex; gap: 8px; align-items: center; flex-wrap: wrap;
  background: transparent; padding: 6px 0; margin-bottom: 6px;
}
.floating-actions .saved-hint { font-size: 12px; color: var(--muted); margin-left: 4px; }
/* 标题与固定操作条之间留小间距（仅带 has-floating 的页面头；操作条在文档流内，无需大让位） */
.page-head.has-floating { margin-top: 8px; }
/* 打印时隐藏固定操作条（仅供屏幕操作） */
@media print { .floating-actions { display: none !important; } }

/* V3.7.44：保存冲突横幅（乐观锁）与只读视图刷新提示——醒目浮层，置顶不随滚动消失 */
.conflict-banner, .refresh-banner {
  position: sticky; top: 0; z-index: 60;
  display: flex; align-items: center; gap: 8px; flex-wrap: wrap;
  padding: 10px 14px; margin-bottom: 8px; border-radius: var(--radius);
  font-size: 13px; line-height: 1.4;
}
.conflict-banner { background: #fff4f4; border: 1px solid #e5484d; color: #a4282c; }
.refresh-banner { background: #eef6ff; border: 1px solid #4a90e2; color: #1c4f80; }
.conflict-banner .btn, .refresh-banner .btn { margin-left: 4px; }
@media print { .conflict-banner, .refresh-banner { display: none !important; } }

/* ---- 卡片 & 表格 ---- */
.card { background: var(--card); border-radius: var(--radius); box-shadow: var(--shadow); padding: 20px; margin-bottom: 18px; }
.card-title { font-size: 15px; font-weight: 700; margin-bottom: 14px; display: flex; align-items: center; gap: 8px; }
.card-title .step {
  width: 22px; height: 22px; border-radius: 50%; background: var(--primary); color: #fff;
  font-size: 12px; display: inline-flex; align-items: center; justify-content: center; flex-shrink: 0;
}
table.list { width: 100%; border-collapse: collapse; font-size: 13px; table-layout: fixed; }
table.list th {
  text-align: left; color: var(--muted); font-weight: 600; font-size: 12px;
  padding: 8px 10px; border-bottom: 2px solid var(--border); white-space: nowrap;
}
table.list td { padding: 10px; border-bottom: 1px solid #F0F2F6; vertical-align: middle; }
/* V3.6.20.2：text-overflow: ellipsis 改为 opt-in（避免误裁 .btn 等子元素，造成"..."遮住删除图标） */
table.list td.ellipsis { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
table.list td.num { white-space: nowrap; }
/* V3.6.20.2：补 .no-wrap 工具类（之前遗漏，导致报价单列表「编号/状态/创建人/更新时间/操作」等单元格意外折行） */
.no-wrap { white-space: nowrap; }
table.list tr:hover td { background: #F8FAFC; }
table.list .num { text-align: right; font-variant-numeric: tabular-nums; }
table.list td.num { font-weight: 600; }

/* V3.6.9：阶梯表格对齐样式 —— th/td 同高度，helper 行固定 16px 让"实时值/手填"提示纵向对齐 */
.tier-table th { vertical-align: middle; }
.tier-table td { vertical-align: middle; }
.tier-table .tier-helper {
  font-size: 10px; line-height: 1.2; margin-top: 3px; min-height: 16px; color: var(--muted);
  font-variant-numeric: tabular-nums;
}
.tier-table input[type="number"] { padding: 5px 6px; box-sizing: border-box; }
/* V3.6.9.2：固定列宽——输入大金额时表头不随内容位移 */
.tier-table { table-layout: fixed; }
.tier-table th, .tier-table td { overflow: hidden; }
.tier-table th:nth-child(2), .tier-table td:nth-child(2),
.tier-table th:nth-child(3), .tier-table td:nth-child(3),
.tier-table th:nth-child(4), .tier-table td:nth-child(4) { width: 150px; }
.tier-table td.num { white-space: nowrap; text-overflow: ellipsis; }
.tier-table .tier-helper { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }

/* V3.7.1：主数量锁定行 + 可收起调整参数框 */
.tier-main-row { background: #F0F7FF; }
.tier-main-row td { font-weight: 600; color: var(--primary-dark); }
.tier-main-row .badge-primary { background: var(--primary); color: #fff; }
.tier-adv-row, .tier-adv-row td { overflow: visible !important; }
.tier-adv-box {
  background: #F8FAFC; border: 1px solid #E2E8F0; border-radius: 8px;
  padding: 12px 14px; margin: 6px 0 4px;
  max-height: 480px; overflow-y: auto;   /* 极限情况（多部件）超出高度上下滑动 */
}
.tier-adv-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 10px 18px; }
.tier-adv-cell { display: flex; flex-direction: column; gap: 3px; }
.tier-adv-cell label { font-size: 12px; color: var(--muted); font-weight: 500; }
.tier-adv-sel, .tier-adv-inp {
  padding: 5px 7px; border: 1px solid var(--border); border-radius: 6px;
  font-size: 13px; width: 100%; box-sizing: border-box; background: #fff;
}
.tier-adv-reset { margin-top: 10px; text-align: right; }
.btn-adv-on { background: var(--primary); color: #fff; border-color: var(--primary); }

/* V3.7.12：阶梯档数量 == 主数量 → 参数锁定（只允许在编辑页主参数区调整） */
.tier-row-mainlock { background: #FFFBEB; }
.tier-row-mainlock .tier-input-qty { border-color: #FCD34D; }
.btn-adv-locked { background: #F1F5F9; border-color: #E2E8F0; }
.btn-adv-locked:hover { background: #F1F5F9; }
.tier-adv-locked { background: #FFFBEB; border-color: #FDE68A; }

/* V3.7.43：阶梯调整参数 · 按部件单独损耗（紧凑、响应式） */
.tier-adv-sec-title { font-size: 12px; color: var(--muted); font-weight: 500; margin: 2px 0 8px; }
/* V3.7.44：一行放 4 个部件的损耗框（窄输入框）；窄屏降级为 2 列 / 1 列，避免横向滚动 */
.pl-wrap { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 8px; }
.pl-block { border: 0.5px solid var(--border); border-radius: 6px; padding: 6px 8px; background: #fff; min-width: 0; }
.pl-head { display: flex; align-items: baseline; gap: 6px; margin-bottom: 4px; }
.pl-name { font-size: 12px; font-weight: 500; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.pl-cap { font-size: 10px; color: var(--muted); white-space: nowrap; }
.pl-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 4px 6px; }
.pl-cell { display: flex; flex-direction: column; gap: 1px; min-width: 0; }
.pl-cell label { font-size: 10px; color: var(--muted); font-weight: 500; }
.pl-cell .tier-adv-sel, .pl-cell .tier-adv-inp { padding: 3px 4px; font-size: 11px; }
.pl-apply { margin: 8px 0 10px; font-size: 11px; }
.pl-apply a, .pl-apply a:visited { color: var(--danger); text-decoration: none; cursor: pointer; }
@media (max-width: 1100px) {
  .pl-wrap { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 640px) {
  .pl-wrap { grid-template-columns: 1fr; }
}

/* ---- 徽标 ---- */
.badge { display: inline-block; padding: 2px 9px; border-radius: 20px; font-size: 12px; font-weight: 600; white-space: nowrap; }
.badge-draft { background: #FFF7E0; color: var(--warn); }
.badge-submitted { background: #E3F2FD; color: var(--primary); }
.badge-exported { background: #E8F5E9; color: var(--ok); }

/* ---- 表单网格 ---- */
.form-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(230px, 1fr)); gap: 12px 16px; }
.field label { display: block; font-size: 12px; color: var(--muted); margin-bottom: 4px; }
.field input, .field select, .field textarea { width: 100%; }
.field .hint { font-size: 11px; color: #9CA3AF; margin-top: 3px; }
.field.span2 { grid-column: span 2; }
.field.span3 { grid-column: span 3; }

/* ---- 部件卡片 ---- */
.part-card { border: 1px solid var(--border); border-radius: var(--radius); margin-bottom: 14px; background: #FBFCFE; }
.part-head {
  display: flex; align-items: center; gap: 10px; padding: 10px 16px;
  background: #F3F7FC; border-bottom: 1px solid var(--border); border-radius: var(--radius) var(--radius) 0 0;
}
.part-head .idx {
  width: 24px; height: 24px; border-radius: 7px; background: var(--primary); color: #fff;
  display: flex; align-items: center; justify-content: center; font-size: 12px; font-weight: 700; flex-shrink: 0;
}
.part-head input.part-name { font-weight: 700; border: none; background: transparent; font-size: 14px; flex: 1; min-width: 120px; }
.part-head .part-total { font-weight: 700; color: var(--primary-dark); font-variant-numeric: tabular-nums; font-size: 14px; }
.part-body { padding: 14px 16px; }
.part-sub { font-size: 12px; font-weight: 700; color: var(--muted); margin: 12px 0 8px; }
.process-checks { display: flex; flex-wrap: wrap; gap: 8px; }
.chk {
  display: inline-flex; align-items: center; gap: 5px; font-size: 12.5px;
  border: 1px solid var(--border); background: #fff; border-radius: 20px; padding: 4px 11px; cursor: pointer;
}
.chk.on { background: var(--primary-light); border-color: var(--primary); color: var(--primary); font-weight: 600; }
.chk input { display: none; }
.cost-detail { display: flex; flex-wrap: wrap; gap: 6px 14px; margin-top: 10px; padding-top: 10px; border-top: 1px dashed var(--border); font-size: 12.5px; color: var(--muted); }
.cost-detail b { color: var(--text); font-variant-numeric: tabular-nums; }

/* V3.1 所有部件成本总价条 + 材料行单价/总价列 */
.parts-cost-grand {
  display: flex; align-items: center; justify-content: center; gap: 10px;
  background: linear-gradient(135deg, #EEF5FF, #F6FAFF); border: 1px dashed var(--primary);
  border-radius: 10px; padding: 12px 16px; margin: 4px 0 14px;
  font-size: 15px; font-weight: 700; color: var(--primary-dark); font-variant-numeric: tabular-nums;
}
.mat-unit, .mat-total { color: var(--primary-dark); font-weight: 600; font-variant-numeric: tabular-nums; white-space: nowrap; }

/* ---- 汇总栏（V3.6.6 上下排列版） ---- */
.summary-bar {
  position: sticky; bottom: 12px; z-index: 40;
  background: #fff; border: 1px solid var(--border); border-radius: 14px; box-shadow: 0 6px 24px rgba(15,23,42,.12);
  padding: 14px 20px; display: flex; flex-direction: column; gap: 12px;
}
.summary-bar .summary-items { display: flex; flex-direction: column; gap: 8px; width: 100%; }
/* 占比行：3 列横向 */
.summary-bar .summary-row { display: flex; align-items: center; gap: 16px; flex-wrap: wrap; }
.summary-bar .summary-row.summary-row-ratios .item { display: flex; flex-direction: column; gap: 2px; min-width: 90px; }
.summary-bar .summary-row.summary-row-ratios .item .k { font-size: 11px; color: var(--muted); }
.summary-bar .summary-row.summary-row-ratios .item .v { font-size: 14px; font-weight: 700; color: var(--text); font-variant-numeric: tabular-nums; }
/* 报价方式 */
.summary-bar .summary-row .item { display: flex; align-items: center; gap: 8px; }
.summary-bar .summary-row .item .k { font-size: 12px; color: var(--muted); }
.summary-bar .summary-row .item .v { font-size: 13px; font-weight: 500; color: var(--text); }
/* 阶梯汇总块（每档独立一行） */
.summary-bar .tier-summary-block { display: flex; flex-direction: column; gap: 6px; width: 100%; padding: 8px 0; border-top: 1px dashed var(--border); border-bottom: 1px dashed var(--border); }
.summary-bar .tier-summary-row { display: flex; align-items: center; gap: 12px; padding: 4px 0; }
.summary-bar .tier-summary-row .qty { flex: 0 0 140px; font-size: 13px; font-weight: 600; color: var(--primary-dark); font-variant-numeric: tabular-nums; }
.summary-bar .tier-summary-row .vals { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; flex: 1; }
.summary-bar .tier-summary-row .val-item { display: inline-flex; align-items: center; gap: 4px; padding: 4px 10px; background: #F8FAFC; border-radius: 6px; border: 1px solid var(--border); }
.summary-bar .tier-summary-row .val-item .vk { font-size: 10px; color: var(--muted); font-weight: 500; }
.summary-bar .tier-summary-row .val-item .vv { font-size: 14px; font-weight: 700; color: var(--text); font-variant-numeric: tabular-nums; }
.summary-bar .tier-summary-row .val-item.primary { background: #FFF7ED; border-color: #FED7AA; }
.summary-bar .tier-summary-row .val-item.primary .vv { color: var(--primary-dark); font-size: 15px; }
.summary-bar .tier-summary-row .val-sep { color: var(--muted); font-size: 12px; }
/* 操作按钮区：右侧常驻，永远不会被阶梯文案影响 */
.summary-bar .summary-actions { display: flex; align-items: center; justify-content: flex-end; gap: 10px; padding-top: 6px; }
.summary-bar .summary-actions .btn { min-width: 120px; }
/* V3.6.8：控件行 — 报价方式（左）+ 展开/收起阶梯明细按钮（右）同一行 */
.summary-bar .summary-row.summary-row-controls { display: flex; align-items: center; justify-content: flex-start; gap: 10px; padding: 6px 0 4px; flex-wrap: wrap; }
.summary-bar .summary-row.summary-row-controls .ctrl-left { display: inline-flex; align-items: center; gap: 8px; font-size: 12px; color: var(--muted); flex-shrink: 0; }
.summary-bar .summary-row.summary-row-controls .ctrl-left select { font-size: 12px; padding: 3px 6px; font-weight: 400; border: 1px solid var(--border); border-radius: 4px; background: #FFFFFF; color: var(--text); }
.summary-bar .summary-row.summary-row-controls .toggle-summary-btn { padding: 3px 10px; font-size: 12px; flex-shrink: 0; }
.summary-bar .summary-row.summary-row-controls .btn { padding: 3px 10px; font-size: 12px; flex-shrink: 0; }
/* V3.6.7：汇总栏草图 7 列折叠条 */
.summary-bar .summary-skel-wrap { padding: 2px 0; }
.summary-bar .skel { display: grid; grid-template-columns: 1fr 1fr .8fr .8fr .8fr .9fr .9fr 1fr; gap: 8px; align-items: stretch; }
.summary-bar .skel-col { display: flex; flex-direction: column; gap: 2px; padding: 7px 10px; border-radius: 6px; background: #F1F5F9; min-width: 0; }
.summary-bar .skel-lbl { font-size: 11px; line-height: 1.2; }
.summary-bar .skel-val { font-size: 15px; font-weight: 500; line-height: 1.3; font-variant-numeric: tabular-nums; display: flex; align-items: baseline; gap: 4px; flex-wrap: nowrap; white-space: nowrap; min-width: 0; }
.summary-bar .skel-sub { font-size: 11px; color: var(--muted); margin-left: 1px; flex-shrink: 0; }
.summary-bar .skel-col.c-red .skel-lbl { color: #A32D2D; } .summary-bar .skel-col.c-red .skel-val { color: #791F1F; }
.summary-bar .skel-col.c-pur .skel-lbl { color: #534AB7; } .summary-bar .skel-col.c-pur .skel-val { color: #3C3489; }
.summary-bar .skel-col.c-blu .skel-lbl { color: #185FA5; } .summary-bar .skel-col.c-blu .skel-val { color: #0C447C; }
.summary-bar .skel-col.c-grn .skel-lbl { color: #3B6D11; } .summary-bar .skel-col.c-grn .skel-val { color: #27500A; }
@media (max-width: 860px) {
  /* 折叠态草图条：8 项压成 4×2，字号/内边距收紧，整体高度砍半 */
  .summary-bar .skel { grid-template-columns: repeat(4, 1fr); gap: 4px; }
  .summary-bar .skel-col { padding: 3px 6px; background: #F4F7FA; }
  .summary-bar .skel-lbl { font-size: 10px; line-height: 1.15; }
  .summary-bar .skel-val { font-size: 12px; }
  .summary-bar .skel-sub { font-size: 9px; }
}
/* 兼容旧 item 类 */
.summary-bar .summary-items .item .v.primary { color: var(--primary-dark); font-size: 20px; }

/* ---- 弹层 ---- */
.lightbox {
  position: fixed; inset: 0; z-index: 100; background: rgba(15,23,42,.75);
  display: flex; align-items: center; justify-content: center; padding: 30px;
}
.lightbox img { max-width: 90%; max-height: 90%; border-radius: 10px; box-shadow: 0 20px 60px rgba(0,0,0,.4); }
.toast {
  position: fixed; top: 70px; left: 50%; transform: translateX(-50%); z-index: 200;
  background: #1F2937; color: #fff; padding: 10px 20px; border-radius: 10px; font-size: 13px;
  box-shadow: 0 8px 30px rgba(0,0,0,.25); animation: slideDown .25s ease;
}
.toast.ok { background: var(--ok); }
@keyframes slideDown { from { opacity: 0; transform: translate(-50%, -12px); } to { opacity: 1; transform: translate(-50%, 0); } }

/* ---- 材料管理 ---- */
.material-row { display: flex; align-items: center; gap: 12px; padding: 12px 14px; border: 1px solid var(--border); border-radius: 9px; margin-bottom: 8px; background: #fff; }
.material-row .info { flex: 1; }
.material-row .name { font-weight: 600; }
.material-row .meta { font-size: 12px; color: var(--muted); }
.price-chip { display: inline-flex; align-items: center; gap: 4px; background: var(--primary-light); color: var(--primary); border-radius: 6px; padding: 2px 8px; font-size: 12px; font-weight: 600; margin-right: 6px; }
.price-chip .src { font-weight: 400; color: var(--muted); font-size: 11px; }

/* ---- 材料管理：页签 + 内联表单（V3.7.21） ---- */
.tabs { display: flex; flex-wrap: wrap; gap: 6px; margin: 12px 0 4px; border-bottom: 1px solid var(--border); padding-bottom: 8px; }
.tab { border: 1px solid var(--border); background: #fff; color: var(--text); padding: 6px 14px; border-radius: 8px; cursor: pointer; font-size: 13px; font-weight: 600; transition: all .15s; }
.tab:hover { border-color: var(--primary); color: var(--primary); }
.tab.active { background: var(--primary); border-color: var(--primary); color: #fff; }
.tab-cnt { display: inline-block; min-width: 16px; text-align: center; font-size: 11px; opacity: .8; margin-left: 4px; }
.mat-form { margin: 10px 0; padding: 14px; border: 1px solid var(--primary); background: #F8FAFF; border-radius: 9px; }
.mat-form-title { font-weight: 700; margin-bottom: 10px; color: var(--primary-dark); }
.mat-form-grid { display: flex; flex-wrap: wrap; gap: 12px; }
.mat-form-field { display: flex; flex-direction: column; gap: 4px; }
.mat-form-field label { font-size: 12px; color: var(--muted); }
.mat-form-field input { width: 160px; padding: 7px 9px; border: 1px solid var(--border); border-radius: 7px; font-size: 13px; background: #fff; }
.mat-form-field input:focus { outline: none; border-color: var(--primary); box-shadow: 0 0 0 2px var(--primary-light); }

/* ---- 导出预览（内部版 / 客户版） ---- */
.doc {
  background: #fff; max-width: 820px; margin: 0 auto; padding: 40px 48px;
  border-radius: 4px; box-shadow: var(--shadow); font-size: 13px;
}
/* V3.7.47：统一抬头（用户 PNG 印章 + 蓝色公司名/地址），客户版 / 英文版 / 内部版共用 */
.letterhead { display: flex; align-items: center; gap: 18px; border-bottom: 2px solid var(--primary, #1565C0); padding-bottom: 12px; margin-bottom: 16px; color: var(--primary-dark, #0D47A1); }
.lh-seal-img { flex: 0 0 auto; height: 90px; width: auto; display: block; object-fit: contain; }
.lh-info { flex: 1 1 auto; min-width: 0; }
.lh-co { font-size: 24px; font-weight: 800; color: var(--primary-dark, #0D47A1); letter-spacing: 1px; line-height: 1.25; }
.lh-en { font-size: 14px; font-weight: 700; color: var(--primary-dark, #0D47A1); letter-spacing: 0.5px; margin-top: 4px; margin-bottom: 8px; text-transform: uppercase; }
.lh-addr { font-size: 12px; color: var(--primary-dark, #0D47A1); line-height: 1.6; }
.letterhead-doc-head { margin-bottom: 12px; }
.iq-doc-title { text-align: center; font-size: 16px; font-weight: 700; color: var(--primary-dark); margin: 12px 0 14px; letter-spacing: 2px; }
.doc h3 { font-size: 18px; text-align: center; margin: 18px 0 4px; }
.doc .meta { display: flex; flex-wrap: wrap; gap: 8px 26px; font-size: 12.5px; color: var(--text); margin-bottom: 16px; }
/* V3.7.5 #215：报价单双栏头部（客户/产品/加价率 等放左侧，报价单号/日期/有效期/创建人 等放右侧） */
.doc-meta-row { display: flex; justify-content: space-between; gap: 12px; margin: 6px 0; align-items: center; }
.doc-meta-left { flex: 1 1 auto; min-width: 0; }
/* V3.7.5 #222：右侧元信息用 flex 纵向等距排列，行间距均匀；与左侧（客户大字）垂直居中对齐 */
.doc-meta-right { flex: 0 0 auto; text-align: right; font-size: 12.5px; color: var(--muted);
  display: flex; flex-direction: column; justify-content: center; gap: 4px; line-height: 1.5; }
.doc-meta-right > div { line-height: 1.5; }
.doc-meta-right b { color: var(--text); }
.doc-customer { font-size: 18px; font-weight: 700; color: var(--primary-dark); line-height: 1.4; }
.doc-customer b { font-weight: 800; color: var(--primary-dark); }
.doc-product-row { display: flex; gap: 18px; flex-wrap: wrap; font-size: 13px; color: var(--text); align-items: baseline; }
/* V3.7.5 #217：分材料·工艺·手工模式：材料/工艺子标题行样式 */
.doc-cat-section { background: #F0F7FF; color: var(--primary-dark); font-weight: 700; padding: 6px 10px; }
.doc-cat-section td { border-bottom: 1px solid #DCE7F2 !important; }
/* V3.7.5 #fix-5：分材料·工艺·手工模式子项行（部件名+材料/工艺描述）—— 无 #、缩进、淡灰背景 */
.doc-cat-sub td { background: #FBFCFE; font-size: 12.5px; padding: 6px 10px; }
.doc table { width: 100%; border-collapse: collapse; margin-bottom: 16px; }
.doc table th, .doc table td { border: 1px solid var(--border); padding: 8px 10px; text-align: left; font-size: 12.5px; }
.doc table th { background: var(--primary-light); color: var(--primary-dark); font-weight: 700; }
.doc table .r { text-align: right; }
.doc .total-row td { font-weight: 700; background: #F8FAFC; }
.doc .sign { display: flex; justify-content: space-between; margin-top: 34px; font-size: 13px; color: var(--text); }
.doc .sign .line { width: 150px; border-bottom: 1px solid #999; display: inline-block; height: 22px; }

/* ---- 分享页（客户版） ---- */
.share-banner {
  background: linear-gradient(135deg, var(--primary), #1E88E5); color: #fff;
  padding: 30px 24px; text-align: center; margin-bottom: 20px; border-radius: 14px;
}
.share-banner h1 { font-size: 24px; margin-bottom: 4px; }
.share-banner .no { opacity: .85; font-size: 14px; }
.share-expired { text-align: center; padding: 80px 20px; color: var(--muted); }

/* ---- 详情网格 ---- */
.kv-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(180px, 1fr)); gap: 10px 20px; }
.kv-grid .kv .k { font-size: 12px; color: var(--muted); }
.kv-grid .kv .v { font-size: 14px; font-weight: 600; }

.empty { text-align: center; color: var(--muted); padding: 60px 20px; }
.empty .big { font-size: 40px; margin-bottom: 10px; }

/* ============================================================
 * V2.2 新增样式：内部审批版逐部件分区 + 费用分列 + 组装项目行
 * ============================================================ */
/* ---- 逐部件区块（内部审批版详情，禁止整体大表格） ---- */
.part-block {
  border: 1px solid var(--border); border-radius: var(--radius);
  margin-bottom: 16px; background: #fff; overflow: hidden;
  page-break-inside: avoid;
}
.part-block-head {
  display: flex; align-items: center; gap: 10px;
  background: var(--primary-light); padding: 10px 14px;
  border-bottom: 1px solid var(--border);
}
.part-block-head .idx {
  width: 24px; height: 24px; border-radius: 50%; background: var(--primary); color: #fff;
  display: flex; align-items: center; justify-content: center; font-size: 12px; font-weight: 700; flex: none;
}
.part-block-head .pname { font-size: 14px; font-weight: 700; color: var(--primary-dark); flex: 1; }
.part-block-head .pspec { font-weight: 400; color: var(--muted); font-size: 12px; margin-left: 8px; }
.part-block-head .ptotal { font-size: 14px; font-weight: 700; color: var(--primary-dark); font-variant-numeric: tabular-nums; }
.part-block-body { padding: 14px 16px; }

/* ---- 部件费用明细表（材料及价格 / 工艺及价格 / 部件小计） ---- */
.proc-table { width: 100%; border-collapse: collapse; margin: 10px 0 4px; }
.proc-table th, .proc-table td { border: 1px solid var(--border); padding: 7px 10px; font-size: 12.5px; text-align: left; }
.proc-table th { background: #F8FAFC; color: var(--muted); font-weight: 600; }
.proc-table .r { text-align: right; font-variant-numeric: tabular-nums; }
.proc-table .paper-row td { background: #F8FAFC; }
.proc-table .subtotal td { font-weight: 700; background: var(--primary-light); color: var(--primary-dark); }

/* ---- 汇总块（手工费 / 包装运输费 / 辅料费 分列） ---- */
.summary-block { margin-top: 6px; }
.summary-block .proc-table { max-width: 760px; }   /* V3.7.3 #201：合并表 5 列放宽 */
.summary-block .total-row td { font-weight: 700; background: #F8FAFC; font-size: 13px; }

/* V3.7.3 #201/#202：内部报价单末尾合并表的列头小字 + 阶梯数量小标题 */
.summary-block .proc-table th .th-sub { display: block; font-size: 10.5px; color: var(--muted); font-weight: 400; margin-top: 2px; }
.tier-title { font-size: 14px; color: var(--primary-dark); font-weight: 700; margin: 14px 0 6px; padding-left: 4px; border-left: 3px solid var(--primary); }

/* ---- 部件图片 / 排版图占位 ---- */
.part-img { margin-top: 12px; }
.part-img img { max-width: 220px; max-height: 160px; object-fit: contain; border: 1px solid var(--border); border-radius: 8px; background: #fff; }
.part-img-placeholder svg { width: 180px; height: 116px; border: 1px dashed var(--border); border-radius: 8px; background: #FBFCFE; }
.ph-label { display: block; font-size: 11.5px; color: var(--muted); margin-top: 4px; }

/* ---- 手工及成品材料报价行（编辑页步骤 3，V3.7.2 取消必报列） ---- */
#assembly-box { display: flex; flex-direction: column; gap: 8px; }
.assy-head {
  display: grid; grid-template-columns: 14px minmax(120px,1.2fr) 104px 104px 104px 74px 92px 30px;
  gap: 8px; align-items: center;
  padding: 0 12px; font-size: 11.5px; font-weight: 600; color: var(--muted);
}
.assy-row {
  display: grid; grid-template-columns: 14px minmax(120px,1.2fr) 104px 104px 104px 74px 92px 30px;
  gap: 8px; align-items: center;
  padding: 10px 12px; border: 1px solid var(--border); border-radius: 9px; background: #FBFCFE;
}
.assy-row input, .assy-row select { width: 100%; min-width: 0; }
.assy-total { text-align: right; font-weight: 700; color: var(--primary-dark); font-variant-numeric: tabular-nums; font-size: 13px; white-space: nowrap; }
.badge-required { background: #FDE8E8; color: var(--danger); font-size: 11px; padding: 2px 7px; border-radius: 999px; white-space: nowrap; }
.badge-optional { background: #EEF1F6; color: var(--muted); font-size: 11px; padding: 2px 7px; border-radius: 999px; white-space: nowrap; }
.chk-inline { display: inline-flex; align-items: center; justify-content: center; padding: 4px 10px; white-space: nowrap; }

/* ---- 响应式 ---- */
@media (max-width: 860px) {
  /* 底部留白：避免内容被固定汇总条遮挡（折叠态约 110px，留 96px 余量） */
  .container { padding: 14px 12px 96px; }
  .topbar { padding: 0 12px; gap: 8px; }
  .nav a { padding: 6px 9px; font-size: 13px; }
  .form-grid { grid-template-columns: 1fr; }
  .field.span2, .field.span3 { grid-column: span 1; }
  .doc { padding: 20px 16px; }
  /* 折叠态汇总条：贴底全宽、收内边距与间距，整体变矮（不再占半屏） */
  .summary-bar {
    position: fixed; left: 8px; right: 8px;
    bottom: calc(8px + env(safe-area-inset-bottom, 0px));
    gap: 8px; padding: 8px 12px; border-radius: 12px;
  }
  .summary-bar .summary-row-controls { gap: 6px; padding: 4px 0 2px; }
  .summary-bar .summary-row-controls .ctrl-left select { font-size: 13px; padding: 6px 8px; min-height: 34px; }
  .summary-bar .summary-row-controls .toggle-summary-btn,
  .summary-bar .summary-row-controls .btn { font-size: 12px; padding: 7px 10px; min-height: 34px; }
  .assy-row { grid-template-columns: 1fr 1fr; }
  .assy-row .assy-total { text-align: left; }
  .part-block-head { flex-wrap: wrap; }
  .part-block-head .ptotal { margin-left: 34px; }
  /* 触控优化：表单输入框/选择框字号≥16px（防 iOS 聚焦自动缩放导致页面跳动），
     点按区放大到 ≥42px，方便业务员手指操作 */
  .field input, .field select, .field textarea,
  .part-head input.part-name,
  .summary-bar .summary-row-controls select,
  .summary-bar .summary-row-controls input { font-size: 16px; min-height: 42px; }
  .btn { min-height: 42px; }
  .btn-sm { min-height: 36px; }
  .btn-lg { min-height: 48px; padding: 14px 30px; }
  .chk { padding: 8px 14px; font-size: 14px; }
  /* 部件标题行：窄屏自动换行，避免名称/按钮被挤压 */
  .part-head { flex-wrap: wrap; }
  .part-head input.part-name { min-width: 100%; order: 3; }
  .part-head .part-total { margin-left: auto; }
}

/* ============================================================
 * V2.3 新增样式：状态横幅 / 阶梯报价行 / 加价率环节确认 / 账号管理
 * ============================================================ */
/* ---- 状态横幅（确认后修改自动退回草稿提示） ---- */
.banner { padding: 10px 14px; border-radius: 8px; margin-bottom: 14px; font-size: 13px; line-height: 1.7; }
.banner-info { background: #E3F2FD; color: var(--primary-dark); border-left: 4px solid var(--primary); }
.banner-warn { background: #FFF7E0; color: var(--warn); border-left: 4px solid var(--accent); }
.draft-banner { display: flex; align-items: center; gap: 10px; flex-wrap: wrap; padding: 10px 14px; border-radius: 8px;
  margin-bottom: 14px; font-size: 13px; line-height: 1.6; background: #ECFDF5; color: #065F46; border: 1px solid #6EE7B7; }

/* ---- 阶梯报价 · 数量梯度行（编辑页步骤 4） ---- */
#tiers-box table.list td { padding: 7px 10px; }
.tier-row input { min-width: 0; }
.tier-row td.num { font-weight: 600; font-variant-numeric: tabular-nums; }

/* ---- 加价率逐环节确认（编辑页步骤 5 / 详情页分摊表） ---- */
.stage-row.ok td { background: #F0FDF4; }
.stage-row .chk { padding: 3px 11px; }
#stage-box table.list td { padding: 8px 10px; }

/* ---- 账号管理（V2.3） ---- */
#uf-username, #uf-real, #uf-pass, #uf-role, #uf-scope, #uf-status { width: 100%; }

/* ============================================================
 * V2.4 新增样式：材料行编辑表 / 部件成本明细展开 / 调价 / 公式行 / 占比
 * ============================================================ */
/* ---- 部件材料行编辑表（#28） ---- */
.mat-rows input, .mat-rows select { width: 100%; min-width: 0; }
.mat-rows td input[type="number"] { text-align: right; }
.mat-row td { vertical-align: middle; }
/* V3.6.1.3：保证数字输入框不被压成 2 位数 —— 浏览器 type=number 默认很窄，
 * 这里设置盒模型 + 最小宽度，使 3-4 位数（如 157g / 1331 / 2.50）能完整显示 */
.mat-rows td input { box-sizing: border-box; }
.mat-rows td input[type="number"] { min-width: 60px; }
.mat-rows td input[placeholder]::-webkit-input-placeholder { color: #C4C9D4; font-size: 11px; }

/* V3.7.1 材料行参数区：单行不折行；
 * V3.7.2 数字输入框统一固定宽度（不再 content-driven 自适应），
 *        类别/材料库/名称列已在 renderPartMaterials 加宽，此处保持 input 紧凑。 */
.mat-rows td.mat-params { display: flex; flex-wrap: nowrap; align-items: center; gap: 4px; overflow: hidden; }
.mat-rows td.mat-params .mp-lbl { font-size: 11px; color: var(--muted); white-space: nowrap; flex: 0 0 auto; }
.mat-rows td.mat-params input { width: 60px; min-width: 60px; max-width: 60px; flex: 0 0 60px; box-sizing: border-box; }
.mat-rows td.mat-params .mp-film { display: flex; flex-wrap: nowrap; align-items: center; gap: 3px; overflow: hidden; }
.mat-rows td.mat-params .mp-film label { font-size: 11px; color: var(--muted); white-space: nowrap; flex: 0 0 auto; }
.mat-rows td.mat-params .mp-film input { width: 52px; min-width: 52px; max-width: 52px; flex: 0 0 52px; box-sizing: border-box; }
.mat-rows td.mat-params .mp-film input.mp-wide { width: 88px; min-width: 88px; max-width: 88px; flex: 0 0 88px; }  /* V3.7.5 #226：吨价框收窄，比计费口径略窄 */
/* V3.6.1.3：保证数字输入框不被压成 2 位数 —— 浏览器 type=number 默认很窄，
 * 这里设置盒模型 + 最小宽度，使 3-4 位数（如 157g / 1331 / 2.50）能完整显示 */
.mat-rows td input { box-sizing: border-box; }
.mat-rows td input[type="number"] { min-width: 60px; }
.mat-rows td input[placeholder]::-webkit-input-placeholder { color: #C4C9D4; font-size: 11px; }

/* V3.6.1.4 拼版信息编辑块 — 紧凑表格，不喧宾夺主 */
.ganged-parts { width: 100%; border-collapse: collapse; font-size: 12.5px; margin-top: 4px; }
.ganged-parts th, .ganged-parts td { padding: 5px 6px; border-bottom: 1px solid #EDEFF2; }
.ganged-parts thead th { background: #F7F8FA; color: var(--muted); font-weight: 600; text-align: left; font-size: 11.5px; }
.ganged-parts td input { width: 100%; box-sizing: border-box; min-width: 50px; }
.ganged-parts td input[type="number"] { text-align: right; }
.ganged-parts .ganged-empty td { font-style: italic; }

/* 左侧目录父子结构（V3.6.1.4） */
.editor-toc .toc-item.toc-parent { font-weight: 600; color: var(--text); }
.editor-toc .toc-item.toc-child { font-size: 11.5px; color: var(--muted); padding-left: 28px; }
.editor-toc .toc-item.toc-child::before { content: "└ "; opacity: 0.7; }

/* ---- 部件成本明细展开（#32，步骤 5 部件成本环节下方） ---- */
.parts-expand td { padding: 0 !important; background: #FAFBFD; }
.pd-wrap { padding: 10px 14px; border: 1px dashed var(--border); border-radius: 8px; margin: 4px 0 8px; }
.pd-title { font-size: 12px; font-weight: 700; color: var(--muted); margin-bottom: 8px; }
.pd-part { margin-bottom: 10px; }
.pd-part:last-child { margin-bottom: 0; }
.pd-part-name { font-size: 13px; font-weight: 700; margin-bottom: 4px; }
.pd-sub { font-size: 11.5px; font-weight: 400; color: var(--muted); margin-left: 8px; font-variant-numeric: tabular-nums; }
.pd-row {
  display: grid; grid-template-columns: 190px minmax(200px,1fr) 92px 108px;
  gap: 8px; align-items: center; padding: 3px 0; font-size: 12.5px;
}
.pd-row.adjusted .pd-name, .pd-row.adjusted .pd-fee { color: var(--danger); font-weight: 700; }
.pd-name { color: var(--text); }
.pd-formula { color: var(--muted); font-size: 11.5px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.pd-fee { text-align: right; font-variant-numeric: tabular-nums; font-weight: 600; white-space: nowrap; }
.pd-row input { width: 100%; min-width: 0; }

/* ---- 环节调价行（#32） ---- */
.stage-row.adjusted td { background: #FFF8F0; }
.stage-row input[type="number"] { width: 100%; min-width: 0; }

/* ---- 公式行（#31 公式透出：详情页 / 客户版） ---- */
.formula-row {
  font-size: 11.5px; color: var(--muted); background: #F6F8FB;
  padding: 4px 10px; border-radius: 6px; margin: 2px 0 8px;
  font-variant-numeric: tabular-nums; line-height: 1.6;
}
.sec-label { font-size: 12px; font-weight: 700; color: var(--muted); margin: 10px 0 6px; }

/* ---- 响应式补充（V2.4） ---- */
@media (max-width: 860px) {
  .assy-head { display: none; }
  .assy-row { grid-template-columns: 1fr 1fr; }
  .assy-row .assy-total { text-align: left; }
  .pd-row { grid-template-columns: 1fr 92px; }
  .pd-formula { display: none; }
}

/* ============================================================
 * V2.5 新增样式：草图四段式编辑页 / 烫金 / 计算小结 / 部件占比栏 / 报价形式切换
 * ============================================================ */
/* ---- 部件计算小结（草图②损耗下方实时显示啤数/印数/烫金纸数） ---- */
.calc-summary {
  margin-top: 10px; padding: 8px 12px; background: #F0F7FF; border: 1px solid #D6E8FB; border-radius: 8px;
  font-size: 12.5px; color: var(--primary-dark); font-weight: 600;
  font-variant-numeric: tabular-nums;
}

/* ---- V3.7.2：材料合计行（编辑器 ④ 部件材料底部）—— 与"计算小结"同款样式 ---- */
.mat-summary {
  margin-top: 10px; padding: 8px 12px; background: #F0F7FF; border: 1px solid #D6E8FB; border-radius: 8px;
  font-size: 12.5px; color: var(--primary-dark); font-weight: 600;
  font-variant-numeric: tabular-nums; display: flex; align-items: center; flex-wrap: wrap; gap: 6px;
}
.mat-summary b { font-weight: 700; }
.mat-subtotals { display: inline-flex; flex-wrap: wrap; gap: 4px 14px; margin-left: 6px; }
.mat-sub { color: var(--primary); font-size: 12px; font-weight: 500; }

/* ---- 部件小计占比栏（草图③工艺路线下方：材料价格/材料占比/工艺价格/工艺占比/合计价格） ---- */
.part-ratio-bar {
  display: flex; flex-wrap: wrap; gap: 6px 18px; margin-top: 10px; padding: 9px 12px;
  background: #FBFCFE; border: 1px dashed var(--border); border-radius: 8px;
  font-size: 12.5px; color: var(--muted);
}
.part-ratio-bar b { color: var(--text); font-variant-numeric: tabular-nums; }

/* ---- V3.6：工艺可配置卡片（两个勾选框 + 说明，醒目卡片风格） ---- */
.proc-cap-row { grid-column: 1/-1; }
.proc-cap-row .proc-cap-grid {
  display: grid; grid-template-columns: 1fr 1fr; gap: 10px; margin-top: 6px;
}
.proc-cap-card {
  display: flex; align-items: flex-start; gap: 10px;
  padding: 12px 14px; border: 1.5px solid var(--border); border-radius: 10px;
  background: #FFF; cursor: pointer; user-select: none;
  transition: border-color .15s, background .15s, box-shadow .15s;
}
.proc-cap-card:hover { border-color: var(--primary); }
.proc-cap-card input[type=checkbox] {
  margin-top: 3px; width: 16px; height: 16px; accent-color: var(--primary); flex-shrink: 0;
}
.proc-cap-card .proc-cap-body { display: flex; flex-direction: column; gap: 2px; }
.proc-cap-card .proc-cap-title {
  font-size: 13px; font-weight: 600; color: var(--text);
}
.proc-cap-card .proc-cap-desc {
  font-size: 11.5px; color: var(--muted); line-height: 1.5;
}
.proc-cap-card.on {
  background: var(--primary-light); border-color: var(--primary);
  box-shadow: inset 3px 0 0 var(--primary);
}
.proc-cap-hint {
  margin-top: 8px; font-size: 11.5px; color: var(--muted); line-height: 1.5;
}
.part-ratio-bar b[data-rb="total"] { color: var(--primary-dark); font-size: 14px; }
/* V3.0 #36 材料单价外显：与合计同级的强调色 */
.part-ratio-bar b[data-rb="matunit"] { color: var(--primary-dark); font-size: 14px; }

/* ---- 未勾选「烫金」工艺时弱化烫金输入（草图②损耗区） ---- */
.foil-dim { opacity: .45; pointer-events: none; }

/* ---- 客户版报价形式切换器（只报总价 / 分部件 / 分材料·工艺·手工） ---- */
.qf-switch { display: inline-flex; border: 1px solid var(--border); border-radius: 8px; overflow: hidden; background: #fff; }
.qf-btn {
  border: none; background: #fff; color: var(--muted); font-size: 12px; padding: 6px 12px; cursor: pointer;
  border-right: 1px solid var(--border); transition: all .15s;
}
.qf-btn:last-child { border-right: none; }
.qf-btn:hover { color: var(--primary); }
.qf-btn.on { background: var(--primary); color: #fff; font-weight: 600; }

/* ---- 编辑页汇总栏报价方式下拉（V2.5） ---- */
#summary select[data-qf] { border: 1px solid var(--border); border-radius: 6px; }

/* ============================================================
 * V2.6 新增样式：工艺路线按工艺分组（一个工艺 = 参数 + 材料 + 价格小计）
 * ============================================================ */
.proc-blocks { display: flex; flex-direction: column; gap: 8px; margin-top: 8px; }
.proc-block {
  border: 1px solid var(--border); border-radius: 10px; overflow: hidden;
  background: #fff; transition: box-shadow .15s;
}
.proc-block.on { border-color: #C9E0F7; box-shadow: 0 1px 4px rgba(30,100,190,.08); }
.proc-block.accessory { background: #FFFBF3; border-color: #F0E0C0; }
.proc-head {
  display: flex; align-items: center; justify-content: space-between; gap: 8px;
  padding: 8px 12px; background: #F8FAFC; font-size: 13px; font-weight: 600;
}
.proc-block.on .proc-head { background: #EFF6FF; }
.proc-block.accessory .proc-head { background: #FFF6E8; }
.proc-block.off .proc-head { background: #FBFBFB; }
.proc-block.off .proc-head .chk { color: var(--muted); font-weight: 500; }
.proc-sum { font-size: 12.5px; color: var(--primary-dark); font-variant-numeric: tabular-nums; font-weight: 700; }
.proc-block.off .proc-sum { color: var(--muted); font-weight: 400; }
.proc-block.off .proc-head .chk { color: var(--muted); font-weight: 500; }
/* V2.7：工艺块勾选框可见（区别于组装项胶囊样式），点击块头 label 即可勾选工艺 */
.proc-head .chk input { display: inline-block; width: 15px; height: 15px; margin: 0; accent-color: var(--primary); cursor: pointer; }
.proc-block.disabled { border-style: dashed; opacity: .72; }
.proc-block.disabled .proc-head { background: repeating-linear-gradient(-45deg, #fafafa, #fafafa 6px, #f4f4f4 6px, #f4f4f4 12px); }
.proc-block.disabled .proc-head .chk { color: var(--muted); }
/* V3.6.20.6：报价单（内部/外部）工艺名称/备注文本
   注：编辑器侧「工艺名称」输入框已移入工艺参数区 .field 内，沿用普通输入框样式（不再需要自定义样式） */
.proc-note-text { font-size: 11.5px; color: var(--muted); margin-top: 2px; line-height: 1.4; }
.proc-body { padding: 10px 12px 4px; }
.proc-params { margin-bottom: 6px; }
.proc-mats .mat-rows thead th { font-size: 11px; padding: 5px 8px; }
.proc-mats .mat-row td { padding: 5px 8px; }
/* V3.6.20.4：自定义工艺块按材料类别分区块，区块间留白 + 小标题 */
.proc-mat-sub { margin-top: 8px; }
.proc-mat-sub:first-child { margin-top: 0; }
.proc-mat-subhead { font-size: 11.5px; font-weight: 600; color: var(--primary-dark); margin: 2px 0 4px; padding-left: 2px; border-left: 3px solid var(--primary); }
/* V3.6.20.5：自定义/非纸工艺块的「添加材料」<select>扮按钮 —— 抹平原生 select 与 button 视觉差异 */
.add-mat-select {
  cursor: pointer;
  appearance: none;
  -webkit-appearance: none;
  background-image: url("data:image/svg+xml;charset=UTF-8,%3csvg xmlns='http://www.w3.org/2000/svg' width='10' height='10' viewBox='0 0 10 10'%3e%3cpath fill='%23475569' d='M5 7L1 3h8z'/%3e%3c/svg%3e");
  background-repeat: no-repeat;
  background-position: right 8px center;
  padding-right: 24px !important;
}
.proc-total {
  padding: 7px 12px; font-size: 12.5px; color: var(--muted);
  background: #FAFBFD; border-top: 1px dashed var(--border);
  font-variant-numeric: tabular-nums;
}
.proc-total b { color: var(--text); font-weight: 700; }
.proc-total b[data-pjoin] { color: var(--primary-dark); font-size: 13.5px; }
.proc-grand {
  padding: 9px 12px; background: #EFF6FF; border: 1px solid #D6E8FB; border-radius: 10px;
  font-size: 13px; color: var(--primary-dark); font-weight: 600;
  display: flex; justify-content: space-between; align-items: center;
}
.proc-grand b { font-size: 15px; font-variant-numeric: tabular-nums; }
/* 工艺块内的参数网格更紧凑 */
.proc-block .form-grid { gap: 8px 12px; }
.proc-block .form-grid .field input, .proc-block .form-grid .field select { font-size: 12.5px; }
.proc-block .hint { font-size: 11px; }

/* V3.0 #38 多方案——方案页签（产品信息下面、部件清单前面） */
.scheme-tabs {
  display: flex; align-items: center; gap: 8px; padding: 6px 0;
  border-bottom: 2px solid #E5E7EB; margin-bottom: 12px;
  flex-wrap: wrap;
}
.scheme-tab {
  display: inline-block; padding: 8px 18px; cursor: pointer; user-select: none;
  border: 1px solid #E5E7EB; border-radius: 8px 8px 0 0;
  background: #F9FAFB; color: #6B7280; font-size: 13px; font-weight: 500;
  transition: all .15s ease;
}
.scheme-tab.on {
  background: var(--primary); color: #fff; border-color: var(--primary);
  box-shadow: 0 -2px 6px rgba(37, 99, 235, .15);
}
.scheme-tab.on::after { content: ""; }
.scheme-tab:hover:not(.on) { background: #F3F4F6; color: var(--primary); }
.scheme-del { margin-left: 6px; color: #F87171 !important; }
.scheme-del:hover { color: var(--danger) !important; border-color: var(--danger) !important; }

/* V3.1 左侧目录导航（需求 7）——宽屏 fixed，窄屏隐藏避免遮挡
 * V3.6.1.3：宽 132 → 192，避免「部件一（封面...）」被截断；左侧起点同步后移 12 → 8
 * V3.6.1.5：宽 192 → 240，目录变长后再加折叠折叠按钮（▾/▸）也需更多横向空间
 * V3.6.1.5 折叠：父行用 flex 布局容纳折叠按钮；子行 .collapsed { display:none } 由 tocCollapsed 控制 */
.editor-toc {
  position: fixed; left: 8px; top: 76px; width: 240px; z-index: 45;
  background: #fff; border: 1px solid var(--border); border-radius: 10px;
  box-shadow: 0 2px 10px rgba(15,23,42,.06);
  padding: 10px 0; display: flex; flex-direction: column; gap: 2px;
  max-height: calc(100vh - 100px); overflow-y: auto;
}
/* V3.7.29：超限使用整体竖向滚动条，不压缩子项
 * 原 .editor-toc 用 flex column + overflow-y:auto，flex-shrink:1(默认) 会让底部
 * 「手工及成品材料 / 报价确认」被压扁成细缝。改为子项全部 flex-shrink:0 保持原高，
 * 容器自然超出 max-height 触发滚动条。同时给滚动条加粗加色（webkit + Firefox）。 */
.editor-toc > * { flex-shrink: 0; }
.editor-toc::-webkit-scrollbar { width: 10px; }
.editor-toc::-webkit-scrollbar-track { background: #F0F1F3; border-radius: 5px; margin: 2px 0; }
.editor-toc::-webkit-scrollbar-thumb { background: #B8BCC4; border-radius: 5px; border: 2px solid #F0F1F3; }
.editor-toc::-webkit-scrollbar-thumb:hover { background: #9098A3; }
@media (max-width: 1399px) {
  /* 中等桌面 / 小笔记本：收紧容器内边距、表单网格更紧 */
  .container { padding: 18px; }
  .form-grid { grid-template-columns: repeat(auto-fill, minmax(200px, 1fr)); gap: 10px 14px; }
  .tier-adv-grid { grid-template-columns: repeat(2, 1fr); gap: 10px 14px; }
  /* 底部草图条 8 列压成 4×2，避免小屏塞不下 */
  .summary-bar { padding: 12px 16px; }
  .summary-bar .skel { grid-template-columns: repeat(4, 1fr); gap: 6px; }
  .summary-bar .skel-col { padding: 5px 8px; }
  .summary-bar .skel-val { font-size: 13px; }
  .summary-bar .skel-lbl { font-size: 10.5px; }
  /* 占比行各 item 最小宽度收缩，让 8 项能塞进中等宽度 */
  .summary-bar .summary-row.summary-row-ratios .item { min-width: 78px; }
  .summary-bar .summary-row.summary-row-ratios .item .v { font-size: 13px; }
  /* 报价方式控件行也收紧 */
  .summary-bar .summary-row { gap: 12px; }
  /* 部件块内边距收紧 */
  .part-block { padding: 14px; }
}
.editor-toc { scrollbar-width: thin; scrollbar-color: #B8BCC4 #F0F1F3; }
.editor-toc .toc-title { font-size: 12px; font-weight: 700; color: var(--muted); padding: 0 14px 6px; border-bottom: 1px solid #F0F1F3; margin-bottom: 4px; }
.editor-toc .toc-item {
  display: block; padding: 7px 14px; font-size: 12.5px; color: #4B5563;
  cursor: pointer; border-left: 3px solid transparent; text-decoration: none;
  overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
}
.editor-toc .toc-item:hover { background: var(--primary-light); color: var(--primary); border-left-color: var(--primary); text-decoration: none; }
/* V3.6.1.5 折叠父行：flex 行容纳 ▾/▸ 按钮 + 文本 */
.editor-toc .toc-parent { display: flex; align-items: center; gap: 4px; padding: 7px 14px; overflow: hidden; }
.editor-toc .toc-parent .toc-label { flex: 1; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.editor-toc .toc-toggle {
  display: inline-flex; align-items: center; justify-content: center;
  /* V3.6.2：放大折叠图标（原 16×16 / 10px 过小，用户反馈点不准）
   *   改 24×24 / 15px，加浅灰底+细边，点击区域更大、更清晰 */
  width: 24px; height: 24px; padding: 0; font-size: 15px; line-height: 1;
  border-radius: 5px; color: var(--text); background: #F2F4F8;
  border: 1px solid var(--border); cursor: pointer; flex-shrink: 0;
  transition: background .12s, color .12s, border-color .12s;
}
.editor-toc .toc-toggle:hover { background: var(--primary-light); color: var(--primary); border-color: var(--primary); }
/* V3.6.1.5 折叠子行：tocCollapsed[pid]=true 时整组子行加 .collapsed 隐藏 */
.editor-toc .toc-item.toc-child.collapsed { display: none; }
/* V3.7.22：父部件「排版」pill（右侧，与左侧 ▶/▼ 子部件折叠相互独立）+ 折叠明细块 */
.editor-toc .toc-layout-row { cursor: pointer; }
.editor-toc .toc-layout-pill {
  margin-left: auto; flex-shrink: 0;
  display: inline-flex; align-items: center; gap: 2px;
  padding: 1px 7px; font-size: 10.5px; line-height: 1.5; font-weight: 600;
  color: #7C3AED; background: #F3E8FF; border: 1px solid #E9D5FF; border-radius: 999px;
  cursor: pointer; transition: background .12s, color .12s, border-color .12s;
}
.editor-toc .toc-layout-pill:hover { background: #E9D5FF; color: #6D28D9; border-color: #D8B4FE; }
.editor-toc .toc-layout-detail {
  /* V3.7.28：去掉明细块自身的横向滚动条（整块不再 overflow-x:auto）。
   * 块右外边距从 10px 改为 0，明细整体宽度 +10px（≈一个滚动条宽），让单行不滚时尽量看全；
   * 整体目录栏仍由 .editor-toc 的 overflow-y:auto 提供纵向滚动。 */
  margin: 2px 0 6px 14px; padding: 7px 10px;
  background: #F7F8FA; border-left: 3px solid #7C3AED; border-radius: 0 6px 6px 0;
  font-family: "SFMono-Regular", Consolas, "Liberation Mono", Menlo, monospace;
  font-size: 11px; line-height: 1.7; color: #374151;
}
.editor-toc .toc-layout-detail.collapsed { display: none; }
.editor-toc .toc-ld-row {
  /* V3.7.28：单行超长时支持横向滚动（去掉省略号）；行内默认不折行（white-space:nowrap） */
  white-space: nowrap; overflow-x: auto; overflow-y: hidden;
}
@media (max-width: 1399px) { .editor-toc { display: none; } }
/* V3.7.36：≥1400px 编辑页：左侧 240px 目录栏 fixed 浮在 .container 上，会覆盖左上角
 * 「页头 h2 / 工具栏按钮 / 部件名」等核心区。给容器加 padding-left 让正文从目录栏右侧开始。
 * :has() 现代浏览器全可用；非编辑页（列表/登录等）没有 .editor-toc，规则自动失效。 */
@supports (selector(:has(*))) {
  @media (min-width: 1400px) {
    body:has(.editor-toc) .container {
      padding-left: 268px;   /* 240 目录栏宽 + 8 留白 + 20 原 padding */
    }
  }
}
/* V3.7.36：小桌面 / 1024px 笔记本适配 —— 把容器内边距/网格最小宽度/草图条再收紧 */
@media (max-width: 1199px) {
  .container { padding: 14px; }
  .topbar { padding: 0 14px; }
  /* 表单网格：min 200→170，让 1024px 屏能塞下 4~5 列不至于挤压 */
  .form-grid { grid-template-columns: repeat(auto-fill, minmax(170px, 1fr)); gap: 9px 12px; }
  /* 阶梯高级调整块：2×N 布局 */
  .tier-adv-grid { grid-template-columns: repeat(2, 1fr); }
  /* 草图条：8 项压成 4×2 已在上一个断点做；这里再收紧内边距与字号 */
  .summary-bar { padding: 10px 12px; }
  .summary-bar .skel { gap: 5px; }
  .summary-bar .skel-col { padding: 4px 6px; }
  .summary-bar .skel-val { font-size: 12px; }
  .summary-bar .skel-lbl { font-size: 10px; }
  .summary-bar .skel-sub { font-size: 10px; }
  /* 占比行各 item 最小宽度进一步收缩：8 项能塞进 1024px 屏 */
  .summary-bar .summary-row { gap: 10px; }
  .summary-bar .summary-row.summary-row-ratios .item { min-width: 68px; }
  .summary-bar .summary-row.summary-row-ratios .item .v { font-size: 12.5px; }
  .summary-bar .summary-row.summary-row-ratios .item .k { font-size: 10.5px; }
  /* 部件块内边距再收 */
  .part-block { padding: 12px; }
  /* 部件标题行：避免被挤压 */
  .part-head input.part-name { min-width: 160px; }
}

/* ============================================================
 * V3.7.39 编辑页宽度自适应（材料行表格）—— V3.7.38 进阶版
 * ============================================================
 * 根因：V3.7.38 用户实测反馈仍有裁剪。原因有三：
 *   ① `.container { max-width:1380px }` 在 1400-1699px 中等屏把编辑页强制收成 1380px 居中，
 *      再叠加 `body:has(.editor-toc) .container { padding-left:268px }` 推内容右移，
 *      内容区只剩 ~1064px。材料表 7 固定列 776px 吃掉后，「参数」flex 列只剩 ~280px，
 *      不够 4 输入框 + 标签 ≈ 350-380px。
 *   ② `.part-materials { overflow-x: auto }`（V3.7.38 加的）用户明确驳回——不要左右滑动条。
 *   ③ 极窄屏 (<860px) 即使拉宽容器也不够装下表格。
 *
 * 修复策略（按用户原话「要么折行，要么拉宽」）：
 *   1) 取消 `.container` 默认 1380px 上限 → 编辑页在 ≤1699px 屏幕直接吃满视口。
 *      ≥1700px 保留 1640px 上限居中。
 *   2) 中屏列宽保留收紧（700/614 px）—— 配合拉宽后参数列有 350+px，不再被裁。
 *   3) 极窄屏 (≤860px) 转 card layout：每条材料变卡片，每字段独占一行，列名前置；
 *      完全折行，无横向滚动条。
 * ============================================================ */

/* 1) 宽屏拉宽：大显示器上编辑页不再两侧留白；同时加上 max-width 上限做居中 */
@media (min-width: 1700px) {
  .container { max-width: 1640px; padding: 24px; }
}

/* 2) 中屏材料表列宽：默认 776px → 700px，省 76px 给「参数」flex 列 */
@media (max-width: 1699px) {
  .mat-rows th:nth-child(1), .mat-rows td:nth-child(1) { width: 100px !important; }
  .mat-rows th:nth-child(2), .mat-rows td:nth-child(2) { width: 132px !important; }
  .mat-rows th:nth-child(3), .mat-rows td:nth-child(3) { width: 156px !important; }
  .mat-rows th:nth-child(5), .mat-rows td:nth-child(5) { width: 96px !important; }
  .mat-rows th:nth-child(6), .mat-rows td:nth-child(6) { width: 72px !important; }
  .mat-rows th:nth-child(7), .mat-rows td:nth-child(7) { width: 88px !important; }
  .mat-rows th:nth-child(8), .mat-rows td:nth-child(8) { width: 56px !important; }
}

/* 2b) 小屏 (≤1399px) 再紧一档：700 → 614px，给「参数」留 400+px */
@media (max-width: 1399px) {
  .mat-rows th:nth-child(1), .mat-rows td:nth-child(1) { width: 88px !important; }
  .mat-rows th:nth-child(2), .mat-rows td:nth-child(2) { width: 112px !important; }
  .mat-rows th:nth-child(3), .mat-rows td:nth-child(3) { width: 130px !important; }
  .mat-rows th:nth-child(5), .mat-rows td:nth-child(5) { width: 90px !important; }
  .mat-rows th:nth-child(6), .mat-rows td:nth-child(6) { width: 64px !important; }
  .mat-rows th:nth-child(7), .mat-rows td:nth-child(7) { width: 80px !important; }
  .mat-rows th:nth-child(8), .mat-rows td:nth-child(8) { width: 50px !important; }
}

/* 3) 极窄屏（≤860px 移动端）让材料表折行 card layout —— 用户明确要求
 *   "如果宽度不够显示框，要么折行，要么拉宽"；本档拉宽已不够用（容器 < 800px），
 *   故转表格 → 卡片堆叠：每行材料变一张卡片，每字段独占一行，列名前置。
 *   原 V3.7.38 加的 `.part-materials { overflow-x: auto }` 用户已驳回——这里改为
 *   折行而非滚动。中屏 (861-1699px) 已被「取消 max-width 上限」+ 列宽收紧解决，
 *   本档专攻移动端极端情况。 */
@media (max-width: 860px) {
  .part-materials .mat-rows,
  .part-materials .mat-rows thead,
  .part-materials .mat-rows tbody,
  .part-materials .mat-rows tr,
  .part-materials .mat-rows td {
    display: block;
    width: auto !important;
    min-width: 0 !important;
    max-width: none !important;
    box-sizing: border-box;
  }
  .part-materials .mat-rows thead { display: none; }
  .part-materials .mat-rows tr.mat-row {
    margin-bottom: 10px;
    border: 1px solid var(--border);
    border-radius: 8px;
    padding: 10px 12px;
    background: #fff;
  }
  .part-materials .mat-rows tr.mat-empty {
    border: none;
    padding: 0;
    margin-bottom: 0;
  }
  .part-materials .mat-rows td {
    padding: 5px 0 !important;
    border: none !important;
    display: flex;
    align-items: flex-start;
    gap: 10px;
    flex-wrap: wrap;
  }
  .part-materials .mat-rows td input,
  .part-materials .mat-rows td select {
    flex: 1;
    min-width: 0;
    width: auto !important;
    max-width: none !important;
  }
  /* 列名前置：nth-child 对应 类别/材料库/名称/参数/计费口径/单价/总价/操作 */
  .part-materials .mat-rows tr.mat-row > td:nth-child(1)::before { content: "类别"; min-width: 64px; }
  .part-materials .mat-rows tr.mat-row > td:nth-child(2)::before { content: "材料库"; min-width: 64px; }
  .part-materials .mat-rows tr.mat-row > td:nth-child(3)::before { content: "名称"; min-width: 64px; }
  .part-materials .mat-rows tr.mat-row > td:nth-child(4)::before { content: "参数"; min-width: 64px; }
  .part-materials .mat-rows tr.mat-row > td:nth-child(5)::before { content: "计费口径"; min-width: 64px; }
  .part-materials .mat-rows tr.mat-row > td:nth-child(6)::before { content: "单价"; min-width: 64px; }
  .part-materials .mat-rows tr.mat-row > td:nth-child(7)::before { content: "总价"; min-width: 64px; }
  .part-materials .mat-rows tr.mat-row > td:nth-child(8)::before { content: ""; min-width: 0; }
  .part-materials .mat-rows tr.mat-row > td::before {
    font-weight: 600;
    color: var(--muted);
    font-size: 12px;
    display: inline-block;
    padding-top: 6px;
  }
  /* 操作列按钮横排 */
  .part-materials .mat-rows tr.mat-row > td:nth-child(8) {
    flex-direction: row;
    gap: 6px;
  }
  /* td.mat-params（参数列）字段横排自动换行 */
  .part-materials .mat-rows td.mat-params {
    flex-wrap: wrap !important;
  }
  .part-materials .mat-rows td.mat-params input {
    flex: 0 0 auto !important;
  }
}

/* ============================================================
 * V3.4 #56：导出 PDF / 打印专用样式（内部审批版 + 客户版）
 * 用法：点击「导出 PDF / 打印」→ 浏览器打印对话框选择「另存为 PDF」
 * 打印视图中隐藏整个应用界面（导航/按钮/交互控件），仅输出报价单文档
 * ============================================================ */
/* ===== 内部审批版报价单 v3（竖版 A4，浅色打印友好） ===== */
/* V3.7.30：套用客户版 .doc 卡片样式（白底·阴影·圆角·内边距）让屏幕观感对齐客户版报价单；
   打印时 @media print 重置为 A4 满版（padding:0 / shadow:none）。 */
.iq-doc {
  width: 100%;
  max-width: 820px;          /* 与客户版 .doc 一致：屏幕宽度 */
  margin: 16px auto;          /* 上下留白，水平居中 */
  padding: 28px 36px;         /* 卡片内边距——让内容不贴边（与客户版 .doc 同思路） */
  background: #fff;
  border-radius: 6px;
  box-shadow: var(--shadow);  /* 与客户版 .doc 用同一阴影变量 */
  color: var(--text);
  font-size: 12.5px;
  line-height: 1.55;
}
.iq-head { text-align: center; border-bottom: 2px solid #93C5FD; padding-bottom: 10px; margin-bottom: 14px; }
.iq-co { font-size: 19px; font-weight: 800; color: var(--primary-dark); letter-spacing: 2px; }
.iq-sub { color: var(--muted); font-size: 12px; margin-top: 4px; letter-spacing: 0.5px; }
/* meta：左=客户/产品信息，右=内部信息（两栏，参照外部报价单逻辑） */
.iq-meta { display: flex; border: 1px solid #BFDBFE; border-radius: 4px; padding: 0; background: #EFF6FF; overflow: hidden; margin-bottom: 12px; }
.iq-meta-col { flex: 1; min-width: 0; padding: 8px 12px; }
.iq-meta-col + .iq-meta-col { border-left: 1px solid #BFDBFE; }
.iq-meta-right { text-align: right; }
.iq-meta-row { display: flex; flex-wrap: wrap; gap: 4px 16px; font-size: 12.5px; color: var(--text); line-height: 1.7; }
.iq-meta-row + .iq-meta-row { margin-top: 2px; }
.iq-meta b { color: var(--primary-dark); font-weight: 600; }
  .iq-prod-imgs { display: flex; flex-wrap: wrap; gap: 6px; margin-top: 6px; }
  .iq-prod-imgs img { max-width: 63mm; max-height: 63mm; width: auto; height: auto; object-fit: contain; border: 1px solid #93C5FD; border-radius: 4px; background: #fff; }
  .iq-part { border: 1px solid #BFDBFE; border-radius: 4px; margin-top: 8px; overflow: hidden; break-inside: avoid; page-break-inside: avoid; }
  .iq-part-head { background: #DBEAFE; padding: 5px 10px; display: flex; align-items: center; gap: 10px; }
  .iq-pname { font-size: 13px; font-weight: 700; color: #1E3A8A; white-space: nowrap; }
  .iq-pspec { font-weight: 400; color: #2563EB; font-size: 11px; }
  .iq-playout { flex: 1; text-align: center; font-size: 11px; color: #2563EB; }
  .iq-ptotal { font-size: 12px; font-weight: 700; color: #1E3A8A; white-space: nowrap; }
  .iq-part-sub { background: #F0F9FF; padding: 3px 10px; font-size: 11px; color: #2563EB; border-bottom: 1px solid #BFDBFE; }
  /* 部件内 材料/工艺：同一行左右两列（原型 .part-body） */
  .iq-body { display: flex; }
  .iq-col { flex: 1; min-width: 0; }
  .iq-col-mat { border-right: 1px solid #BFDBFE; }
  .iq-col-title { font-size: 11.5px; font-weight: 700; color: #1E40AF; padding: 4px 10px 2px; border-bottom: 1.5px solid #93C5FD; margin: 2px 0 0; }
  .iq-mat, .iq-proc { padding: 2px 10px; }
  .iq-mrow, .iq-prow { display: flex; align-items: baseline; font-size: 11.5px; padding: 1.5px 0; }
  .iq-mname, .iq-pname2 { flex: 1; min-width: 0; }
  .iq-mprice { width: 64px; text-align: right; color: #1E3A8A; }
  /* V3.7.53：工艺行单价列改为「千张单价/单价」与「其他加」上下两行，固定列宽使同类型数值上下对齐；无其他加则不显示该行 */
  .iq-punit { flex: 0 0 auto; margin-left: 8px; display: flex; flex-direction: column; align-items: flex-end; justify-content: center; color: #475569; font-size: 10.5px; line-height: 1.35; }
  .iq-pu-line { display: flex; align-items: baseline; white-space: nowrap; }
  .iq-pu-l { width: 54px; text-align: right; margin-right: 4px; }
  .iq-pu-v { width: 56px; text-align: right; }
  /* V3.7.31：金额大时（¥50,786.13 等）单价与总价紧贴易看错——加 10px 左间距 + 收宽至 72px 容下 10 位数 */
  .iq-mamt, .iq-pamt { width: 72px; margin-left: 10px; text-align: right; font-weight: 600; color: #1E3A8A; }
  .iq-ext { color: #93C5FD; font-size: 10.5px; }
  .iq-badge { background: #BFDBFE; color: #1E40AF; font-size: 10px; padding: 0 4px; border-radius: 3px; }
  .iq-subs { background: #F0F9FF; padding: 3px 10px 4px 14px; }
  .iq-subrow { display: flex; font-size: 11px; align-items: baseline; gap: 10px; padding: 1px 0; }
  .iq-sname { color: #1E40AF; white-space: nowrap; }
  .iq-ssize { color: #1E3A8A; }
  .iq-sqty { color: #2563EB; margin-left: auto; }
  .iq-part-imgs { display: flex; flex-wrap: wrap; gap: 6px; margin: 6px 10px 8px; }
  .iq-part-imgs img { max-width: 63mm; max-height: 63mm; width: auto; height: auto; object-fit: contain; border: 1px solid #93C5FD; border-radius: 4px; background: #fff; }
  .iq-tier { margin-top: 10px; break-inside: avoid; page-break-inside: avoid; }
  .iq-tier-title { font-size: 12px; font-weight: 700; color: #1E3A8A; padding: 5px 10px; background: #DBEAFE; border: 1px solid #BFDBFE; border-bottom: none; border-radius: 4px 4px 0 0; }
  .iq-table { width: 100%; border-collapse: collapse; font-size: 11.5px; border: 1px solid #BFDBFE; }
  .iq-table th, .iq-table td { border: 1px solid #BFDBFE; padding: 3px 8px; text-align: right; }
  .iq-table .iq-first { text-align: left; color: #1E40AF; font-weight: 600; min-width: 110px; white-space: normal; }
  .iq-table thead th { background: #DBEAFE; color: #1E3A8A; font-weight: 700; }
  .iq-qty th, .iq-qty td { background: #BFDBFE; color: #1E3A8A; font-weight: 600; }
  .iq-pct { color: #1E3A8A; font-weight: 600; }
  .iq-total td { font-weight: 700; background: #EFF6FF; }
  .iq-quote td { font-weight: 700; background: #BFDBFE; color: #1E3A8A; }
  .iq-remark { font-size: 12px; color: #475569; margin-top: 8px; }
  .iq-sign { display: flex; justify-content: space-between; margin-top: 24px; font-size: 12px; color: #475569; }
  .iq-foot { text-align: center; padding: 10px; color: #60A5FA; font-size: 11px; }
  /* V3.7.x 手工及成品材料表（条件渲染） */
  .iq-assy { margin-top: 10px; break-inside: avoid; page-break-inside: avoid; }
  .iq-assy-table { width: 100%; border-collapse: collapse; font-size: 11.5px; border: 1px solid #BFDBFE; }
  .iq-assy-table th, .iq-assy-table td { border: 1px solid #BFDBFE; padding: 3px 8px; text-align: right; }
  .iq-assy-table .iq-first { text-align: left; color: #1E40AF; font-weight: 600; }
  .iq-assy-table thead th { background: #DBEAFE; color: #1E3A8A; font-weight: 700; }
  .iq-assy-name { text-align: left !important; color: #1E40AF; }
  .iq-assy-unit, .iq-assy-amt { color: #1E3A8A; }
  /* V3.7.x 阶梯成本&报价（双分类：材料费/人工费） */
  .iq-tier2 th { vertical-align: bottom; }
  .iq-tier2 td { white-space: nowrap; }
  .iq-tier2 .iq-total-cell { font-weight: 700; color: #1E3A8A; background: #EFF6FF; }
  .iq-sub-grey { display: block; font-weight: 400; font-size: 9.5px; color: #94A3B8; margin-top: 1px; line-height: 1.25; }
  /* V3.7.x 过胶工艺（仅展示·不重复计价） */
  .iq-proc-film { color: #0F766E; font-style: italic; }
  .iq-proc-film .iq-pname2 { color: #0F766E; }
  @media print {
    /* V3.7.30：打印时去掉卡片壳（padding/shadow/radius），让 A4 满版打印；max-width:none + margin:0 */
    .iq-doc { max-width: none; margin: 0; padding: 0; box-shadow: none; border-radius: 0; }
    .iq-part, .iq-tier { break-inside: avoid; page-break-inside: avoid; }
    .iq-table th, .iq-table td { font-size: 11px; padding: 4px 7px; }
  }

@page { size: A4; margin: 12mm; }

@media print {
  /* 隐藏应用界面元素 */
  .topbar,                  /* 顶部导航 */
  .page-head .toolbar,      /* 页头操作按钮（返回/编辑/导出/查看客户版） */
  .qf-switch,               /* 客户版报价形式切换按钮（交互控件） */
  .toast,                   /* 消息提示 */
  .btn,                     /* 所有按钮 */
  .editor-toc { display: none !important; }   /* 编辑页左侧目录 */

  /* 页面基础：白底黑字、去背景 */
  body { background: #fff !important; }
  .container { max-width: none !important; padding: 0 !important; margin: 0 !important; }
  .page-head { margin-bottom: 10px; }
  .page-head h2 { font-size: 16px; }

  /* 报价单文档：保留色块（浏览器需勾选「背景图形」，print-color-adjust 强制保留） */
  * { -webkit-print-color-adjust: exact; print-color-adjust: exact; }

  /* 分页控制：部件块/汇总块/表格整体避免在页中断裂 */
  .part-block, .summary-block, .share-banner, .letterhead { break-inside: avoid; page-break-inside: avoid; }
  .doc table { break-inside: auto; }
  .doc table thead { display: table-header-group; }   /* 跨页表头自动重复 */
  .doc table tr { break-inside: avoid; page-break-inside: avoid; }
  .part-block { box-shadow: none !important; border: 1px solid #CBD5E1 !important; }

  /* 文档区紧凑化：适配 A4 */
  .doc { padding: 0 !important; box-shadow: none !important; border: none !important; margin: 0 !important; }
  .doc table th, .doc table td { font-size: 11px; padding: 5px 7px; }
  .doc h3 { font-size: 16px; }
  .letterhead { padding-bottom: 8px; margin-bottom: 12px; border-bottom-color: var(--primary, #1565C0) !important; }
  .lh-seal-img { height: 70px; }
  .letterhead-co { font-size: 18px; }
  .letterhead-en { font-size: 11px; }
  .letterhead-addr { font-size: 10px; }
  .doc .meta { font-size: 11.5px; }
  .sign { margin-top: 22px !important; }

  /* 阶梯报价提示条：打印为简洁边框样式 */
  .banner { border: 1px solid #CBD5E1 !important; background: #fff !important; }

  /* V3.6.13：产品图 / 部件图在打印模式正常显示（图片不过滤） */
  .product-img, .part-img, .part-img-placeholder { display: block !important; visibility: visible !important; }
  .product-img img, .part-img img { max-width: 280px !important; max-height: 200px !important; page-break-inside: avoid; break-inside: avoid; }
}

/* V3.7.23：图片上传区 —— 拖拽高亮 + 可点击/拖拽/粘贴的视觉提示 */
.img-upload {
  border: 1.5px dashed var(--border, #CBD5E1);
  border-radius: 10px;
  padding: 10px 12px;
  background: #F8FAFC;
  transition: border-color .15s, background .15s;
}
.img-upload-drag {
  border-color: var(--primary, #2563EB);
  background: #EFF6FF;
}