/* ST 内部工作台 —— 员工专用界面。
   设计取向：沿用商城的排版节奏，但用「工具感」区分身份 —— 更紧凑的行距、
   更明确的状态标签，让员工一眼看出这是内部界面而不是客户看到的商城。 */

/* 账户页入口：员工独有，视觉上刻意比普通链接更重 */
.workbench-entry {
  display: flex;
  align-items: center;
  gap: 14px;
  width: 100%;
  margin: 0 0 12px;
  padding: 16px 18px;
  border: 1px solid color-mix(in srgb, var(--ink, #1c1c1c) 16%, transparent);
  border-radius: 14px;
  background: linear-gradient(135deg, color-mix(in srgb, var(--ink, #1c1c1c) 6%, transparent), transparent 70%);
  color: inherit;
  cursor: pointer;
  text-align: left;
  transition: border-color .2s ease, transform .2s ease;
}
.workbench-entry:hover { border-color: color-mix(in srgb, var(--ink, #1c1c1c) 34%, transparent); transform: translateY(-1px); }
.workbench-entry-mark {
  display: grid;
  place-items: center;
  flex: 0 0 42px;
  height: 42px;
  border-radius: 11px;
  background: var(--ink, #1c1c1c);
  color: var(--paper, #fff);
}
.workbench-entry-mark svg { width: 20px; height: 20px; }
.workbench-entry-copy { display: flex; flex-direction: column; gap: 3px; flex: 1 1 auto; min-width: 0; }
.workbench-entry-copy strong { font-size: 15px; letter-spacing: .01em; }
.workbench-entry-copy small { font-size: 12px; opacity: 1; }
.workbench-entry > i { display: grid; place-items: center; opacity: .5; }
.workbench-entry > i svg { width: 16px; height: 16px; }

/* 工作台整页：去掉商城的长文案节奏，改成工具型排版 */
.commerce-dialog.page-workbench .dialog-body { padding: 0 0 40px; }
.commerce-dialog.page-workbench .history-heading { padding: 22px 20px 4px; }
.commerce-dialog.page-workbench .history-heading h2 { font-size: 22px; line-height: 1.3; margin: 6px 0 6px; }
.commerce-dialog.page-workbench .history-heading p { font-size: 13px; opacity: 1; margin: 0 0 4px; }

/* 顶部标签导航 */

/* 总览宫格 */
.workbench-tiles { display: flex; flex-direction: column; gap: 10px; padding: 16px 20px 0; }
.workbench-tile {
  display: grid;
  grid-template-columns: 40px 1fr auto;
  grid-template-rows: auto auto;
  align-items: center;
  gap: 2px 14px;
  padding: 15px 16px;
  border: 1px solid color-mix(in srgb, var(--ink, #1c1c1c) 13%, transparent);
  border-radius: 12px;
  background: none;
  color: inherit;
  text-align: left;
  cursor: pointer;
  transition: border-color .2s ease, background .2s ease;
}
.workbench-tile:hover { border-color: color-mix(in srgb, var(--ink, #1c1c1c) 32%, transparent); background: color-mix(in srgb, var(--ink, #1c1c1c) 3%, transparent); }
.workbench-tile-mark { grid-row: 1 / span 2; display: grid; place-items: center; width: 40px; height: 40px; border-radius: 10px; background: color-mix(in srgb, var(--ink, #1c1c1c) 8%, transparent); }
.workbench-tile-mark svg { width: 19px; height: 19px; }
.workbench-tile strong { grid-column: 2; font-size: 15px; }
.workbench-tile small { grid-column: 2; font-size: 12px; line-height: 1.5; opacity: 1; }
.workbench-tile > i { grid-column: 3; grid-row: 1 / span 2; display: grid; place-items: center; opacity: .45; }
.workbench-tile > i svg { width: 16px; height: 16px; }

/* 报价助手 · 上传区 */
.quote-upload { padding: 16px 20px 0; }
/* 已经有识别结果时整个上传区隐藏 —— 不再占地方，续传入口改到原图对照面板底部。
   ⚠️ 用 display:none 而不是 visibility/高度归零：file input 仍可被 .click() 触发。 */
.quote-upload.is-hidden { display: none; }
.quote-upload input[type="file"] { position: absolute; width: 1px; height: 1px; opacity: 0; pointer-events: none; }
/* 🔴 原 `.quote-drop`（大拖拽区）已随「两个并列正方形」改版删除。
   它的角色被 `.quote-tile` 取代；保留这条注释是为了让下一个人知道
   「不要因为 .quote-drop 在别处还有引用就又加回来」。
   st-home-v1.css 里那两条 `.page-workbench .quote-drop` 高度规则现在是死代码
   （选择器不再匹配任何元素），本次不动它们，避免无谓的跨文件改动。 */
/* 「可一次多选」在说明里加重，员工一眼看到支持连选 */

/* ── 上传区：两个**并列正方形**入口（2026-09-29 第二轮改）─────────────────
   ❌ 上一版是「一个大拖拽区 + 下面两个小胶囊」共 3 个入口：大区还能点开相册，
      于是「相册」既有大的又有小的，「本地文件」却只有小的 —— 用户原话
      「有一个大的相册入口和一个小的相册入口，再加一个文件入口，明显不对称」。
   ✅ 现在只留两个**等大正方形卡**：拍照/相册、本地文件。
      为什么必须是两个独立按钮而不是一个按钮 + accept 里塞多种 MIME：
      微信 WebView 只要 accept 里出现 `image/*` 就一律唤起相机面板，
      文档选择器再也出不来 —— 所以「本地文件」必须是**独立按钮 + 纯净 accept**。
   ⚠️ 两个按钮在窄屏也保持并排（不换行）：换行后一上一下又会显得不对称。 */
.quote-upload-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 10px;
  width: min(420px, 100%);
  margin: 0 auto;
}
.quote-tile {
  /* 正方形：aspect-ratio 比写死高度更稳（宽度随容器走，手机上自适应） */
  aspect-ratio: 1 / 1;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 7px;
  padding: 12px;
  border: 1.5px dashed color-mix(in srgb, var(--ink, #1c1c1c) 26%, transparent);
  border-radius: 16px;
  background: transparent;
  color: inherit;
  text-align: center;
  cursor: pointer;
  transition: border-color .2s ease, background .2s ease, transform .2s ease;
}
.quote-tile:hover {
  border-color: var(--ink, #1c1c1c);
  background: color-mix(in srgb, var(--ink, #1c1c1c) 4%, transparent);
}
.quote-tile:active { transform: scale(.985); }
.quote-tile:focus-visible { outline: 2px solid var(--blue, #001c81); outline-offset: 2px; }
.quote-tile-mark {
  display: grid;
  place-items: center;
  width: 44px;
  height: 44px;
  border-radius: 50%;
  background: color-mix(in srgb, var(--ink, #1c1c1c) 8%, transparent);
}
.quote-tile-mark svg { width: 21px; height: 21px; }
.quote-tile strong { font-size: 13.5px; font-weight: 700; }
.quote-tile small { font-size: 11px; line-height: 1.4; opacity: 1; }

/* 两卡下面的一句总说明（原大拖拽区里的「可多选 / 可校对」信息不能丢） */
.quote-upload-multi {
  width: min(420px, 100%);
  margin: 10px auto 0;
  font-size: 11.5px;
  line-height: 1.6;
  text-align: center;
  opacity: 1;
}
.quote-upload-hint { min-height: 18px; margin: 10px 0 0; font-size: 12px; text-align: center; opacity: 1; }

/* 识别进度：明显的大转圈 + 主副文案。
   🔴 用户反馈「识别中提示做大一点、搞个转圈动画、明显一点」——
   原来是 12px 一行小字，现在做成一个居中的卡片状区块，圈用 22px。 */
.quote-upload-hint.is-busy { min-height: 0; margin: 14px 0 0; padding: 14px 16px; border-radius: 12px; background: color-mix(in srgb, var(--ink, #1c1c1c) 5%, transparent); opacity: 1; }
.quote-progress { display: flex; align-items: center; justify-content: center; gap: 13px; }
.quote-progress-spin {
  flex: 0 0 auto;
  width: 22px;
  height: 22px;
  border-radius: 50%;
  border: 2.6px solid color-mix(in srgb, var(--ink, #1c1c1c) 16%, transparent);
  border-top-color: var(--ink, #1c1c1c);
  animation: quote-spin .72s linear infinite;
}
.quote-progress-copy { display: flex; flex-direction: column; gap: 2px; text-align: left; min-width: 0; }
.quote-progress-copy strong { font-size: 14.5px; font-weight: 650; letter-spacing: .01em; }
.quote-progress-copy small { font-size: 12px; opacity: 1; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }

/* 报价助手 · 结果摘要与确认条 */
.quote-summary {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  margin: 18px 20px 0;
  padding: 12px 14px;
  border-radius: 11px;
  background: color-mix(in srgb, var(--ink, #1c1c1c) 5%, transparent);
  font-size: 13px;
}
.quote-summary small { opacity: 1; }
.quote-summary .button { padding: 9px 14px; font-size: 13px; }

/* 报价助手 · 逐行候选 */
.quote-lines { display: flex; flex-direction: column; gap: 12px; padding: 16px 20px 0; }
.quote-line {
  border: 1px solid color-mix(in srgb, var(--ink, #1c1c1c) 12%, transparent);
  border-radius: 12px;
  overflow: hidden;
}
.quote-line[data-state="confirmed"] { border-color: color-mix(in srgb, #1f8a4c 55%, transparent); }
.quote-line[data-state="none"] { border-color: color-mix(in srgb, #c2410c 45%, transparent); }
.quote-line-head { display: flex; align-items: flex-start; gap: 12px; padding: 13px 14px 11px; }
.quote-line-no { flex: 0 0 22px; display: grid; place-items: center; height: 22px; border-radius: 6px; background: color-mix(in srgb, var(--ink, #1c1c1c) 9%, transparent); font-size: 11px; font-weight: 600; }
.quote-line-badge { flex: 0 0 auto; max-width: 46%; font-size: 11px; padding: 4px 9px; border-radius: 999px; background: color-mix(in srgb, var(--ink, #1c1c1c) 7%, transparent); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.quote-line[data-state="confirmed"] .quote-line-badge { background: color-mix(in srgb, #1f8a4c 16%, transparent); color: #176b3a; }
.quote-line[data-state="none"] .quote-line-badge { background: color-mix(in srgb, #c2410c 14%, transparent); color: #c2410c; }
.quote-candidates { display: flex; flex-direction: column; border-top: 1px solid color-mix(in srgb, var(--ink, #1c1c1c) 8%, transparent); }
/* 「更多候选」展开按钮（第四轮反馈：候选列表需要能点击更多）。
   默认只显示前 3 条，点它在**原地**展开全部（不整页重渲染、不丢滚动位置）。 */
.quote-candidates-more {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 5px;
  padding: 8px 10px;
  border: 0;
  border-top: 1px dashed color-mix(in srgb, var(--ink, #1c1c1c) 14%, transparent);
  background: color-mix(in srgb, #092883 4%, transparent);
  color: #092883;
  font-size: 12px;
  font-weight: 600;
  font-family: inherit;
  cursor: pointer;
  transition: background .18s ease;
}
.quote-candidates-more:hover { background: color-mix(in srgb, #092883 9%, transparent); }
.quote-candidates-more svg { width: 12px; height: 12px; transition: transform .2s ease; }
.quote-candidates-more[aria-expanded="true"] svg { transform: rotate(180deg); }
.quote-candidate {
  display: grid;
  grid-template-columns: 46px 1fr auto;
  align-items: center;
  gap: 12px;
  padding: 10px 14px;
  border: 0;
  border-bottom: 1px solid color-mix(in srgb, var(--ink, #1c1c1c) 6%, transparent);
  background: none;
  color: inherit;
  text-align: left;
  cursor: pointer;
}
.quote-candidate:last-child { border-bottom: 0; }
.quote-candidate:hover { background: color-mix(in srgb, var(--ink, #1c1c1c) 3.5%, transparent); }
.quote-candidate[aria-pressed="true"] { background: color-mix(in srgb, #1f8a4c 9%, transparent); }
.quote-candidate img { width: 46px; height: 46px; object-fit: cover; border-radius: 8px; background: color-mix(in srgb, var(--ink, #1c1c1c) 5%, transparent); }
.quote-candidate-info { display: flex; flex-direction: column; gap: 3px; min-width: 0; flex: 1 1 auto; }
.quote-candidate-info strong { font-size: 13.5px; line-height: 1.3; }
.quote-candidate-info small { font-size: 11.5px; opacity: 1; }
/* 🔴 规格行必须**完整可读**：这是员工区分同系列候选（dn32 / dn40 / dn50）的
   唯一依据，绝不能单行省略号截断 —— 允许折到多行。
   已由 workbenchCandidateSpec() 剥掉品名前缀，剩下的就是差异部分。 */
.quote-candidate-spec {
  display: block;
  line-height: 1.4;
  word-break: break-word;
  overflow-wrap: anywhere;
  color: color-mix(in srgb, var(--ink, #1c1c1c) 78%, transparent);
  opacity: 1;
}
.quote-candidate-cat { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.quote-candidate-price { display: flex; flex-direction: column; align-items: flex-end; gap: 2px; font-size: 14px; font-weight: 600; white-space: nowrap; }
.quote-candidate-price small { font-size: 10.5px; font-weight: 400; opacity: 1; }
.quote-line-empty { margin: 0; padding: 12px 14px; border-top: 1px solid color-mix(in srgb, var(--ink, #1c1c1c) 8%, transparent); font-size: 12px; opacity: 1; }
.quote-line-foot { padding: 8px 14px 11px; }

/* 报价助手 · 识别结果可编辑（品名+规格合并为一个关键词框，与搜索栏同逻辑）
   输入即防抖重匹配，故不再需要「重新匹配」按钮；右侧留一个状态点表示正在匹配。 */
.quote-line-edit { flex: 1 1 auto; display: flex; flex-direction: column; gap: 3px; min-width: 0; font-size: 10.5px; letter-spacing: .02em; opacity: .92; }
.quote-line-edit-row { position: relative; display: flex; align-items: center; }
.quote-line-edit input {
  box-sizing: border-box;
  width: 100%;
  min-width: 0;
  height: 34px;
  padding: 0 34px 0 9px;
  border: 1px solid color-mix(in srgb, var(--ink, #1c1c1c) 18%, transparent);
  border-radius: 8px;
  background: color-mix(in srgb, var(--ink, #1c1c1c) 3%, transparent);
  color: inherit;
  font-size: 13px;
  font-family: inherit;
}
.quote-line-edit input:focus { outline: none; border-color: var(--ink, #1c1c1c); background: transparent; }
/* 匹配中指示：转圈的圆环，停手/完成后隐藏 */
.quote-line-edit-state { position: absolute; right: 9px; display: grid; place-items: center; width: 14px; height: 14px; pointer-events: none; opacity: 0; transition: opacity .15s ease; }
.quote-line-edit-state::before { content: ''; width: 12px; height: 12px; border-radius: 50%; border: 1.6px solid color-mix(in srgb, var(--ink, #1c1c1c) 22%, transparent); border-top-color: var(--ink, #1c1c1c); }
.quote-line[data-matching="true"] .quote-line-edit-state { opacity: .75; animation: quote-spin .7s linear infinite; }
@keyframes quote-spin { to { transform: rotate(360deg); } }
.quote-line-badge-row { display: flex; padding: 0 14px 10px; }
.quote-line-badge-row .quote-line-badge { max-width: 100%; }

/* 报价助手 · 单位 / 数量 / 价格档位 / 折扣 可改
   🔴🔴 这里踩了两个坑，都记下来：
   ①`select` 会被 st-select-v1.js 换成「隐藏原生 select（.st-select-native 1×1 绝对定位）
     + 可见触发器（button.st-select-trigger）」。而 st-workbench-v1.css **加载在
     st-select-v1.css 之后**，选择器特异度又是平手（`.quote-field select` vs
     `select.st-select-native` 同为 0-1-1）→ 后面的赢：我原本写的
     `width:100%;height:34px` 直接盖到那个 1×1 的隐藏 select 上，把它撑成整屏宽，
     于是**报价助手页出现横向滚动**（真浏览器实测 dialog scrollWidth 1924 > clientW 1280）。
     所以：**样式只能写给「触发器」和「真 input」，绝不能再写 `.quote-field select`**。
   ②原生 select 的高度由 UA 样式 + 行高决定，与 input 用相同 padding 仍会差 2~4px。
     做法：触发器与 input 共用同一套 height / box-sizing / padding / font-size，
     三者一致后高度才真正对齐。 */
.quote-line-fields { display: grid; grid-template-columns: 1fr 1fr 1.15fr 0.85fr; gap: 8px; padding: 10px 14px 2px; border-top: 1px solid color-mix(in srgb, var(--ink, #1c1c1c) 8%, transparent); }
.quote-field { display: flex; flex-direction: column; gap: 3px; min-width: 0; font-size: 10.5px; letter-spacing: .02em; opacity: 1; }
.quote-field input,
.quote-field .st-select-trigger {
  box-sizing: border-box;
  width: 100%;
  min-width: 0;
  height: 34px;
  min-height: 34px;
  padding: 0 9px;
  border: 1px solid color-mix(in srgb, var(--ink, #1c1c1c) 18%, transparent);
  border-radius: 8px;
  background: color-mix(in srgb, var(--ink, #1c1c1c) 3%, transparent);
  color: inherit;
  font-size: 13px;
  font-family: inherit;
  line-height: 32px;
}
/* 触发器是 button：要去掉 UA 的按钮外观，并让它和 input 完全同款 */
.quote-field .st-select-trigger {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 6px;
  text-align: left;
  cursor: pointer;
  border-radius: 8px;
  box-shadow: none;
  appearance: none;
  -webkit-appearance: none;
}
.quote-field .st-select-trigger .st-select-value { min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; line-height: 32px; }
.quote-field .st-select-trigger .st-select-chevron { flex: none; width: 11px; height: 11px; color: color-mix(in srgb, var(--ink, #1c1c1c) 45%, transparent); }
.quote-field .st-select-trigger:hover { border-color: color-mix(in srgb, var(--ink, #1c1c1c) 34%, transparent); }
.quote-field .st-select-trigger[aria-expanded="true"] { border-color: var(--ink, #1c1c1c); background: transparent; box-shadow: none; }
.quote-field .st-select-trigger:focus-visible { outline: none; border-color: var(--ink, #1c1c1c); }
.quote-field input:focus { outline: none; border-color: var(--ink, #1c1c1c); background: transparent; }
.quote-field input:disabled { opacity: .45; }
.quote-field .st-select-trigger:disabled,
.quote-field .st-select-trigger[aria-disabled="true"] { opacity: .45; cursor: not-allowed; }

/* 报价助手 · 客户信息表单里的下拉（结算币种）
   🔴 同一个坑的第二处：`.checkout-form ... select`（0-2-0）作用于原生 select，
   而用户真正看到的是 st-select-v1.js 生成的 button.st-select-trigger —— 它拿不到那条规则，
   于是触发器与旁边 input 的尺寸/内边距/圆角完全不一致（默认按钮外观）。
   ⚠️ 数值必须对齐 st-reference-v6.css 的**权威值**（那个文件加载最晚、选择器最深）：
      `.commerce-dialog .checkout-form input/textarea/select{min-height:42px;margin-top:6px;padding:9px 11px;border-radius:9px}`
    —— 不是 st-checkout-v2.css 里的 48px。写错了触发器就会比输入框高一截。 */
.page-workbench .quote-customer-form .st-select-trigger {
  box-sizing: border-box;
  width: 100%;
  font: inherit;
  font-size: 13px;
  color: var(--ink, #1c1c1c);
  min-height: 42px;
  margin-top: 6px;
  padding: 9px 11px;
  border: 1px solid transparent;
  border-radius: 9px;
  background:
    linear-gradient(180deg, #fff, #fbfcff) padding-box,
    linear-gradient(135deg, #dce2ec, #edf0f5 58%, #ead8c9) border-box;
  box-shadow: inset 0 1px 0 #fff, 0 3px 10px #10244d08;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
  text-align: left;
  cursor: pointer;
  appearance: none;
  -webkit-appearance: none;
}
.page-workbench .quote-customer-form .st-select-trigger .st-select-value { min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.page-workbench .quote-customer-form .st-select-trigger .st-select-chevron { flex: none; width: 15px; height: 15px; color: #89909b; }
.page-workbench .quote-customer-form .st-select-trigger:focus-visible { outline: 2px solid var(--blue, #001c81); outline-offset: 3px; }
/* 移动端与原生 select 同款放大（st-checkout-v2.css 里只写了 select） */
@media (max-width: 720px) {
  .page-workbench .quote-customer-form .st-select-trigger { font-size: 16px; }
}

/* ══ 报价助手 · 原图对照（悬浮跟随滚动） ══
   重新设计要点（2026-09-21 第三轮反馈）：
   ① **有设计感、与背景区分**：双层描边 + 品牌色顶栏 + 更强投影 + 毛玻璃背板；
   ② 顶栏承载「标题 / 计数 / 继续加图 / 收起」，**展开与收起位置完全一致**
      （原先按钮在底栏，收起后 flex 重排导致左右横跳）；
   ③ 缩略图改为**真图 + 序号角标**，点击即切（不再是「点不动的文字横线」）；
   ④ 收起/展开统一用「图标 + 文字」两者并存，不再一个图标一个文字。
   桌面：贴视口右侧；移动端：贴底部，且为「回到顶部」让位（见文末 media）。 */
.quote-preview {
  position: fixed;
  right: 20px;
  top: 96px;
  z-index: 41;
  width: 288px;
  /* 🔴 2026-09-22 用户反馈「原图对照区域和底部还有一点距离」：桌面侧原先
     `calc(100vh - 150px)`（顶 96 + 底留 54）→ 面板离视口底还有一大截。
     收到 126（底留 30px），跟右下角「回到顶部」按钮同一水平带，看起来是贴底的。 */
  max-height: calc(100vh - 126px);
  display: flex;
  flex-direction: column;
  border-radius: 16px;
  /* 品牌色渐变描边：外圈用 padding-box/border-box 双层，视觉上比单线更"立" */
  border: 1.5px solid transparent;
  background:
    linear-gradient(var(--paper, #fff), var(--paper, #fff)) padding-box,
    linear-gradient(150deg, #092883 0%, #3a5bc7 42%, #ee6e00 100%) border-box;
  box-shadow: 0 22px 48px -12px #0b265454, 0 4px 12px #0b265418, inset 0 1px 0 #ffffffb8;
  overflow: hidden;
}
/* 顶栏：品牌深色底 + 白色文字 → 一眼与页面内容区分开 */
.quote-preview-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
  padding: 8px 10px;
  background: linear-gradient(135deg, #092883 0%, #1b3a9e 55%, #2450b5 100%);
  color: #fff;
}
.quote-preview-title { display: inline-flex; align-items: center; gap: 6px; min-width: 0; font-size: 12px; font-weight: 650; letter-spacing: .04em; }
.quote-preview-title svg { width: 14px; height: 14px; opacity: .82; }
.quote-preview-counter { padding: 1px 7px; border-radius: 999px; background: #ffffff2b; font-size: 10.5px; font-weight: 600; letter-spacing: 0; }
.quote-preview-counter:empty { display: none; }
.quote-preview-actions { display: inline-flex; align-items: center; gap: 4px; flex: 0 0 auto; }
/* 「继续加图」：浅色胶囊底，在深色顶栏上清晰可辨；位置固定不随展开收起移动 */
.quote-preview-add {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  padding: 4px 9px 4px 6px;
  border: 1px solid #ffffff42;
  border-radius: 999px;
  background: #ffffff24;
  color: #fff;
  font-size: 11px;
  font-weight: 650;
  font-family: inherit;
  cursor: pointer;
  transition: background .18s ease;
}
.quote-preview-add:hover { background: #ffffff38; }
.quote-preview-add svg { width: 13px; height: 13px; }
/* 加载动画（第四轮反馈「继续加图没有加载动画」）：
   识别期间图标换成转圈、整钮降透明度，结束后由 JS 移除 is-busy 还原。 */
.quote-preview-add.is-busy { opacity: .78; pointer-events: none; }
.quote-preview-add.is-busy svg { display: none; }
.quote-preview-add.is-busy::before {
  content: '';
  width: 12px;
  height: 12px;
  margin: 1px 0;
  border: 2px solid #ffffff55;
  border-top-color: #fff;
  border-radius: 50%;
  animation: quote-preview-spin .8s linear infinite;
}
@keyframes quote-preview-spin { to { transform: rotate(360deg); } }
/* 收起/展开：图标 + 文字同时存在，两种状态表现一致 */
.quote-preview-toggle {
  display: inline-flex;
  align-items: center;
  gap: 3px;
  padding: 4px 7px;
  border: 0;
  border-radius: 999px;
  background: none;
  color: inherit;
  font-size: 11px;
  font-family: inherit;
  cursor: pointer;
  opacity: .85;
  transition: opacity .18s ease, background .18s ease;
}
.quote-preview-toggle:hover { opacity: 1; background: #ffffff26; }
.quote-preview-toggle svg { width: 14px; height: 14px; transition: transform .22s ease; }
.quote-preview.is-collapsed .quote-preview-toggle svg { transform: rotate(180deg); }

/* 缩略图条：**胶囊按钮**（第四轮反馈「不需要这么大按钮，胶囊就行，图多可横向滚动」）。
   60×60 大图块太占空间、还遮挡正文 → 收成 22px 高的序号胶囊，横向滚动、藏滚动条。 */
.quote-preview-thumbs {
  display: flex;
  gap: 6px;
  padding: 7px 10px;
  overflow-x: auto;
  border-bottom: 1px solid color-mix(in srgb, var(--ink, #1c1c1c) 9%, transparent);
  background: color-mix(in srgb, #092883 4%, var(--paper, #fff));
  scrollbar-width: none;
}
.quote-preview-thumbs::-webkit-scrollbar { display: none; }
.quote-preview-thumb {
  flex: 0 0 auto;
  min-width: 26px;
  height: 22px;
  padding: 0 9px;
  border: 1px solid color-mix(in srgb, var(--ink, #1c1c1c) 16%, transparent);
  border-radius: 999px;
  background: var(--paper, #fff);
  color: color-mix(in srgb, var(--ink, #1c1c1c) 72%, transparent);
  font-size: 11px;
  font-weight: 650;
  font-family: inherit;
  line-height: 20px;
  text-align: center;
  cursor: pointer;
  transition: border-color .18s ease, background .18s ease, color .18s ease;
}
.quote-preview-thumb:hover { border-color: #09288366; }
.quote-preview-thumb.is-active {
  border-color: transparent;
  background: linear-gradient(145deg, #092883, #2450b5);
  color: #fff;
}
/* 图片容器：touch-action:none 让双指 pinch 交给我们处理 */
.quote-preview-body {
  overflow: hidden;
  -webkit-overflow-scrolling: touch;
  touch-action: none;
  cursor: grab;
  flex: 1 1 auto;
  min-height: 0;
  background:
    repeating-conic-gradient(color-mix(in srgb, var(--ink, #1c1c1c) 4%, transparent) 0% 25%, transparent 0% 50%) 50% / 14px 14px,
    var(--paper, #fff);
}
.quote-preview-body.is-panning { cursor: grabbing; }
.quote-preview-body img { display: block; width: 100%; height: auto; transform-origin: center center; will-change: transform; user-select: none; -webkit-user-drag: none; }
.quote-preview-foot {
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 6px 10px;
  border-top: 1px solid color-mix(in srgb, var(--ink, #1c1c1c) 8%, transparent);
  background: color-mix(in srgb, #092883 3%, var(--paper, #fff));
}
.quote-preview-hint { font-size: 10.5px; opacity: 1; text-align: center; }

/* 收起态：只留顶栏（标题 + 计数 + 继续加图 + 展开），其余全部隐藏。
   底部按钮位置由顶栏固定承载 → 展开/收起都不移动。 */
.quote-preview.is-collapsed { width: auto; min-width: 0; }
.quote-preview.is-collapsed .quote-preview-body,
.quote-preview.is-collapsed .quote-preview-thumbs,
.quote-preview.is-collapsed .quote-preview-foot { display: none; }
/* 🔴 收起态**不改「继续加图」的尺寸**：
   用户反馈「展开收起时继续加图按钮位置不一致」—— 按钮已经挪进顶栏（位置固定了），
   但如果收起时把文字收成图标，按钮会变窄，左边缘仍会横移 51px，且顶栏高度差 1px
   连累旁边的「收起」按钮也抖 1px。所以收起时保持按钮原样，只隐藏 body/thumbs/foot。 */

/* ══ 报价助手 · 回到顶部 ══
   用户反馈「报价助手页面也加一个回到顶部，注意不要重叠」。
   `.st-back-to-top` 是全局常驻按钮（st-reference-v6.css），但 syncBackToTop()
   原本只认 page-inquiry 与首页/分类页 → 报价助手里根本不出现。
   现在补 `workbench` 上下文，并解决「不要重叠」：
   · z-index 42 > 面板 41 → 永远在最上层、可点；
   · 桌面：原图面板固定在右侧（288 宽 + 20 边距）→ 按钮左移到面板**左侧**；
   · 移动端：面板贴底 → 按钮抬到面板**上方**。 */
.st-back-to-top[data-context=workbench] { z-index: 42; }
body:has(.commerce-dialog.page-workbench .quote-preview) .st-back-to-top[data-context=workbench] {
  right: 326px;   /* 288 面板宽 + 20 面板右边距 + 18 间隙 */
  bottom: 28px;
}

/* 报价助手 · 客户信息确认 */
.quote-customer-form { padding: 20px 20px 0; border-top: 1px solid color-mix(in srgb, var(--ink, #1c1c1c) 10%, transparent); margin-top: 22px; }
.quote-customer-heading { margin: 0 0 14px; }
.quote-customer-heading h3 { margin: 4px 0 4px; font-size: 17px; }
.quote-customer-heading p { margin: 0; font-size: 12.5px; opacity: 1; }
/* ── 报价单预览框（2026-09-22 用户反馈：品名规格显示不全 / 没有总价 / 窄屏也要看全）──
   ① 品名+规格**允许换行**：原先写死 `nowrap + ellipsis`，窄屏直接把后半截吃掉；
   ② 金额列固定右侧、不参与换行，数量与单价各占一行更好读；
   ③ 末尾补「参考合计」；有行数量待填时显示「待填数量」——绝不把 0 当数量算进总价。
   🔴 选择器一律写成 `.quote-confirm-list .xxx`（0,2,0），
      否则会被上面的 `.quote-confirm-list > div` / `span`（0,1,1）压掉。 */
.quote-confirm-list { display: flex; flex-direction: column; gap: 9px; margin: 16px 0 0; padding: 14px; border-radius: 11px; background: color-mix(in srgb, var(--ink, #1c1c1c) 5%, transparent); font-size: 13px; }
.quote-confirm-list > div { display: flex; align-items: baseline; justify-content: space-between; gap: 4px 12px; }
.quote-confirm-list .quote-confirm-name { flex: 1 1 auto; min-width: 0; opacity: 1; overflow-wrap: anywhere; }
/* 金额：桌面**单行**（数量 · 单价并排，右对齐）——
   🔴 不要在这里用 column + align-items:flex-end：行是 `align-items:baseline` 的 flex，
      列方向子盒的 baseline 会算到整块底边，实测金额被压到品名下沿再低 23px，很别扭。
      真需要两行时交给下面 ≤430px 的规则去 stack。 */
.quote-confirm-list .quote-confirm-amount { flex: 0 0 auto; display: inline-flex; align-items: baseline; gap: 6px; white-space: nowrap; }
.quote-confirm-list .quote-confirm-amount b { font-weight: 600; white-space: nowrap; }
.quote-confirm-list .quote-confirm-amount em { font-style: normal; font-size: 12px; font-weight: 600; opacity: 1; white-space: nowrap; }
.quote-confirm-list .quote-confirm-amount em[hidden] { display: none; }
.quote-confirm-list .quote-confirm-total { margin-top: 1px; padding-top: 10px; border-top: 1px solid color-mix(in srgb, var(--ink, #1c1c1c) 14%, transparent); }
.quote-confirm-list .quote-confirm-total span { opacity: 1; font-size: 12.5px; }
.quote-confirm-list .quote-confirm-total strong { font-size: 15.5px; font-weight: 700; white-space: nowrap; }
.quote-confirm-list .quote-confirm-total strong.is-pending { font-size: 13px; font-weight: 600; opacity: 1; }
.quote-confirm-empty { margin: 0; font-size: 12.5px; opacity: 1; }

/* 「生成报价单」按钮**居中**（2026-09-22 用户反馈）。
   基础样式 `.checkout-actions{justify-content:space-between}` 是给「次要 + 主要」两个按钮
   设计的，报价助手这里只有一个按钮 → 会被顶到最左边。改居中，并让左右 padding 对称。 */
.commerce-dialog.page-workbench .quote-customer-form .checkout-actions { justify-content: center; margin-top: 14px; }
.commerce-dialog.page-workbench .quote-customer-form .checkout-actions .button { padding-left: 24px; padding-right: 24px; }

/* 报价助手 · 客户联想选择（输入姓名 → 下拉已有客户） */
.quote-customer-pick { position: relative; }
.quote-customer-suggest {
  position: absolute;
  z-index: 6;
  left: 0;
  right: 0;
  top: calc(100% + 4px);
  max-height: 220px;
  overflow-y: auto;
  border: 1px solid color-mix(in srgb, var(--ink, #1c1c1c) 16%, transparent);
  border-radius: 10px;
  background: var(--paper, #fff);
  box-shadow: 0 12px 28px #14234926;
}
.quote-customer-suggest[hidden] { display: none; }
.quote-customer-suggest button {
  display: flex;
  flex-direction: column;
  gap: 2px;
  width: 100%;
  padding: 9px 12px;
  border: 0;
  border-bottom: 1px solid color-mix(in srgb, var(--ink, #1c1c1c) 7%, transparent);
  background: none;
  color: inherit;
  text-align: left;
  cursor: pointer;
}
.quote-customer-suggest button:last-child { border-bottom: 0; }
.quote-customer-suggest button:hover { background: color-mix(in srgb, var(--ink, #1c1c1c) 5%, transparent); }
.quote-customer-suggest strong { font-size: 13.5px; }
.quote-customer-suggest small { font-size: 11.5px; opacity: 1; }
.quote-customer-suggest .quote-customer-empty { padding: 10px 12px; font-size: 12px; opacity: 1; }
.quote-pick-badge { margin-left: 6px; font-size: 10.5px; padding: 2px 7px; border-radius: 999px; background: color-mix(in srgb, #1f8a4c 16%, transparent); color: #176b3a; }

/* 报价助手 · 折扣 / 价格档位说明 */
.quote-field-price small,
.quote-field-discount small { font-size: 10px; opacity: 1; letter-spacing: 0; }
.quote-line-price-note { padding: 0 14px 4px; font-size: 11px; opacity: 1; }
.quote-line-price-note b { font-weight: 600; }
.quote-line-price-note s { opacity: 1; }

/* 报价助手 · 草稿恢复提示 */
.quote-draft-banner {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  margin: 14px 20px 0;
  padding: 11px 14px;
  border-radius: 11px;
  background: color-mix(in srgb, #b45309 13%, transparent);
  color: inherit;
  font-size: 12.5px;
  line-height: 1.5;
}
.quote-draft-banner .quote-draft-actions { display: flex; gap: 10px; flex: 0 0 auto; }
.quote-draft-banner button { border: 0; background: none; color: inherit; font-size: 12.5px; cursor: pointer; text-decoration: underline; padding: 0; }
.quote-draft-banner button.is-primary { font-weight: 600; }

/* ══ 移动端：原图对照贴在底部导航栏「之上」，并给内容留出安全距离 ══
   🔴 用户反馈「拉到最后原图对照完全挡住了底部按钮」——
      ① 面板原先 `bottom:10px` 直接压在底部导航栏和正文上 → 抬到导航栏之上；
      ② 只抬面板还不够：滚到最底时最后一个按钮（生成报价单）仍在面板底下
         → 给 .dialog-body 补一段「面板高度」的 padding-bottom，让按钮能滚上来。
   面板高度用变量统一声明：padding、回到顶部按钮都引用它，不会各写各的。 */
@media (max-width: 760px) {
  /* 第四轮反馈「留了一截空白」：38vh 预留过大（胶囊缩略图又把面板压矮了）
     → 收到 min(32vh, 264px)，padding 与回到顶部按钮都引用同一变量。 */
  :root { --quote-preview-mobile-h: min(32vh, 264px); }
  .quote-preview {
    right: 10px;
    left: 10px;
    top: auto;
    /* 🔴 2026-09-22 用户反馈「原图对照区域和底部还有一点距离」：
       原来这里额外 + 8px，面板跟底部导航条之间留了一条缝。
       改为**紧贴**导航条上沿（导航条自身已含 safe-area，不再重复加）。 */
    bottom: calc(var(--mobile-nav-height) + env(safe-area-inset-bottom, 0px));
    width: auto;
    max-height: var(--quote-preview-mobile-h);
  }
  .page-workbench .dialog-body:has(.quote-preview) {
    padding-bottom: calc(var(--mobile-nav-height) + env(safe-area-inset-bottom, 0px) + var(--quote-preview-mobile-h) + 26px);
  }
  /* 收起态面板只剩一条顶栏 → 不用再留 300px */
  .page-workbench .dialog-body:has(.quote-preview.is-collapsed) {
    padding-bottom: calc(var(--mobile-nav-height) + env(safe-area-inset-bottom, 0px) + 86px);
  }
  .quote-line-fields { grid-template-columns: 1fr 1fr; }
  /* 窄屏预览框：品名规格换行、金额靠右；极窄屏（≤430px）把金额整行下移，
     避免品名被挤成一列一个字。 */
  .commerce-dialog.page-workbench .quote-confirm-list { padding: 13px 12px; }
  /* 回到顶部：抬到原图面板上方（面板贴底时最容易被压住） */
  body:has(.commerce-dialog.page-workbench .quote-preview) .st-back-to-top[data-context=workbench] {
    right: 16px;
    bottom: calc(var(--mobile-nav-height) + env(safe-area-inset-bottom, 0px) + var(--quote-preview-mobile-h) + 22px);
  }
  body:has(.commerce-dialog.page-workbench .quote-preview.is-collapsed) .st-back-to-top[data-context=workbench] {
    bottom: calc(var(--mobile-nav-height) + env(safe-area-inset-bottom, 0px) + 64px);
  }
}

/* 极窄屏（≤430px，多数手机竖屏）：预览框改**上下两段**——品名规格占满一整行（可换行多行），
   数量·单价右对齐下移一行。这样品名不会被压成「一列一个字」。 */
@media (max-width: 430px) {
  .commerce-dialog.page-workbench .quote-confirm-list > div { flex-wrap: wrap; }
  .commerce-dialog.page-workbench .quote-confirm-list .quote-confirm-name { flex-basis: 100%; }
  .commerce-dialog.page-workbench .quote-confirm-list .quote-confirm-amount { flex: 1 1 100%; flex-direction: column; align-items: flex-end; gap: 0; }
  .commerce-dialog.page-workbench .quote-confirm-list .quote-confirm-total { flex-wrap: nowrap; }
  .commerce-dialog.page-workbench .quote-confirm-list .quote-confirm-total span { flex: 1 1 auto; }
}

/* 询价单总览 · 客户行 */
.history-customer { display: block; padding: 0 16px 8px; font-size: 12.5px; opacity: 1; }

/* 客户查询 */


/* ==================== 数据更新（飞书同步） ====================
   一律写 `.commerce-dialog.page-workbench` 深选择器：旧版样式表
   （st-reference-v6 / st-density-v5）的特异度更高，裸类名会被它们压掉。 */
.commerce-dialog.page-workbench .workbench-sync {
  margin: 20px 20px 0;
  padding: 16px;
  border: 1px solid color-mix(in srgb, var(--ink, #1c1c1c) 14%, transparent);
  border-radius: 14px;
  background: color-mix(in srgb, var(--ink, #1c1c1c) 3%, transparent);
}
.commerce-dialog.page-workbench .workbench-sync-head { display: flex; align-items: center; justify-content: space-between; gap: 12px; }
.commerce-dialog.page-workbench .workbench-sync-head h3 { margin: 4px 0 0; font-size: 17px; }
.commerce-dialog.page-workbench .workbench-sync-head .button { flex: 0 0 auto; }
.commerce-dialog.page-workbench .workbench-sync-head .button:disabled { opacity: .5; cursor: not-allowed; }
.commerce-dialog.page-workbench .workbench-sync-hint { margin: 10px 0 0; font-size: 12px; line-height: 1.6; opacity: 1; }
.commerce-dialog.page-workbench .workbench-sync-list { display: flex; flex-direction: column; gap: 8px; margin-top: 12px; }
.commerce-dialog.page-workbench .workbench-sync-loading { margin: 0; padding: 12px 0; font-size: 13px; opacity: .6; }
.commerce-dialog.page-workbench .workbench-sync-item {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 4px 12px;
  padding: 12px 14px;
  border-radius: 12px;
  background: color-mix(in srgb, var(--ink, #1c1c1c) 5%, transparent);
}
.commerce-dialog.page-workbench .workbench-sync-title { display: flex; align-items: baseline; gap: 8px; min-width: 0; }
.commerce-dialog.page-workbench .workbench-sync-title strong { font-size: 14px; }
.commerce-dialog.page-workbench .workbench-sync-title small { font-size: 11px; opacity: 1; overflow-wrap: anywhere; }
.commerce-dialog.page-workbench .workbench-sync-meta { grid-column: 1; display: flex; flex-direction: column; gap: 2px; min-width: 0; }
.commerce-dialog.page-workbench .workbench-sync-summary { font-size: 12px; line-height: 1.5; overflow-wrap: anywhere; }
.commerce-dialog.page-workbench .workbench-sync-note { font-size: 11px; line-height: 1.5; opacity: 1; overflow-wrap: anywhere; }
.commerce-dialog.page-workbench .workbench-sync-side { grid-column: 2; grid-row: 1 / span 2; display: flex; flex-direction: column; align-items: flex-end; gap: 3px; text-align: right; }
.commerce-dialog.page-workbench .workbench-sync-cost { font-size: 11px; opacity: 1; white-space: nowrap; }
.commerce-dialog.page-workbench .workbench-sync-time { font-size: 11px; opacity: 1; white-space: nowrap; }
.commerce-dialog.page-workbench .workbench-sync-go {
  margin-top: 3px;
  padding: 7px 16px;
  border: 1px solid color-mix(in srgb, var(--ink, #1c1c1c) 26%, transparent);
  border-radius: 999px;
  background: transparent;
  color: inherit;
  font-size: 12px;
  cursor: pointer;
  transition: background .2s ease, border-color .2s ease;
}
.commerce-dialog.page-workbench .workbench-sync-go:hover:not(:disabled) { background: color-mix(in srgb, var(--ink, #1c1c1c) 8%, transparent); border-color: color-mix(in srgb, var(--ink, #1c1c1c) 38%, transparent); }

/* ==================== 询价进度面板（员工侧「状态回路」） ====================
   位置：内部工作台 → 询价单总览 → 询价详情，夹在「参考合计」与「返回」之间。

   ⚠️ 为什么前缀写 `page-history` 而不是 `page-workbench`：
      员工的询价详情页与客户的「询价详情」**共用同一个标题**，而 page class 是按标题
      查 DIALOG_VIEWS 得来的（st-commerce-v2.js：'询价详情' → page:'history'）。
      ⇒ 员工进详情页时 page class 是 page-history，不是 page-workbench。
      用错前缀的后果是「样式一条都不生效」，而且完全不报错。
      （客户侧同样是 page-history，但那边没有 .wb-* 元素，不会误伤。）

   配色走 color-mix(--ink)；当前页面保持浅色表面，不随系统偏好反色。
   按实际背景检查文字对比度，不能仅按系统深色偏好提亮固定文字。 */
.commerce-dialog.page-history .wb-status-panel {
  margin: 22px 20px 0;
  padding: 16px 18px 14px;
  border: 1px solid color-mix(in srgb, var(--ink, #1c1c1c) 12%, transparent);
  border-radius: 14px;
  background: color-mix(in srgb, var(--ink, #1c1c1c) 3%, transparent);
}
.commerce-dialog.page-history .wb-status-head { display: flex; align-items: center; justify-content: space-between; gap: 12px; }
.commerce-dialog.page-history .wb-status-head h3 { margin: 0; font-size: 15px; }
.commerce-dialog.page-history .wb-status-row { display: flex; flex-wrap: wrap; gap: 8px; margin: 13px 0 0; }
.commerce-dialog.page-history .wb-status-btn {
  min-height: 34px;
  padding: 0 14px;
  border: 1px solid color-mix(in srgb, var(--ink, #1c1c1c) 16%, transparent);
  border-radius: 999px;
  background: transparent;
  color: inherit;
  font: inherit;
  font-size: 13px;
  font-weight: 600;
  cursor: pointer;
  transition: background .2s ease, border-color .2s ease;
}
.commerce-dialog.page-history .wb-status-btn:hover:not(:disabled) { background: color-mix(in srgb, var(--ink, #1c1c1c) 7%, transparent); }
.commerce-dialog.page-history .wb-status-btn[aria-pressed="true"] {
  border-color: color-mix(in srgb, var(--ink, #1c1c1c) 55%, transparent);
  background: color-mix(in srgb, var(--ink, #1c1c1c) 10%, transparent);
  font-weight: 700;
}
.commerce-dialog.page-history .wb-status-btn:disabled { opacity: .5; cursor: default; }
.commerce-dialog.page-history .wb-status-btn:focus-visible { outline: 2px solid var(--ink, #1c1c1c); outline-offset: 2px; }
.commerce-dialog.page-history .wb-draft { display: flex; flex-direction: column; gap: 6px; margin: 14px 0 0; }
.commerce-dialog.page-history .wb-draft > div { display: flex; align-items: baseline; gap: 10px; }
.commerce-dialog.page-history .wb-draft dt { flex: none; width: 88px; font-size: 12px; opacity: 1; }
.commerce-dialog.page-history .wb-draft dd { margin: 0; font-size: 13px; font-weight: 600; letter-spacing: .01em; overflow-wrap: anywhere; }
.commerce-dialog.page-history .wb-status-note { margin: 12px 0 0; font-size: 12px; line-height: 1.65; opacity: 1; }

@media (max-width: 720px) {
  .commerce-dialog.page-history .wb-status-panel { margin: 18px 16px 0; padding: 14px 15px 12px; }
  .commerce-dialog.page-history .wb-status-btn { min-height: 36px; padding: 0 13px; font-size: 13px; }
  .commerce-dialog.page-history .wb-draft dt { width: 76px; }
}
.commerce-dialog.page-workbench .workbench-sync-go:disabled { opacity: .45; cursor: not-allowed; }
.commerce-dialog.page-workbench .workbench-sync-foot { margin: 10px 0 0; font-size: 11px; opacity: 1; }

/* Business queue status: compact, read-only counters and explicit recovery actions. */
.commerce-dialog.page-workbench .wb-business-sync .workbench-sync-head { flex-direction: row; align-items: center; }
.commerce-dialog.page-workbench .wb-business-sync .workbench-sync-go { width: auto; flex: none; }
.commerce-dialog.page-workbench .wb-business-counts { display: flex; flex-wrap: wrap; gap: 8px 18px; margin: 12px 0; }
.commerce-dialog.page-workbench .wb-business-counts span { display: flex; align-items: baseline; gap: 5px; font-size: 12px; }
.commerce-dialog.page-workbench .wb-business-counts b { font-size: 19px; }
.commerce-dialog.page-workbench .wb-business-routing { margin: 6px 0; font-size: 11px; opacity: 1; }
.commerce-dialog.page-workbench .wb-business-jobs article { display: flex; gap: 12px; align-items: center; justify-content: space-between; padding: 10px 0; border-top: 1px solid color-mix(in srgb, var(--ink, #1c1c1c) 10%, transparent); }
.commerce-dialog.page-workbench .wb-business-jobs article > div { min-width: 0; }
.commerce-dialog.page-workbench .wb-business-jobs strong { font-size: 13px; }
.commerce-dialog.page-workbench .wb-business-jobs small { display: block; margin-top: 3px; font-size: 11px; line-height: 1.5; opacity: 1; overflow-wrap: anywhere; }
.commerce-dialog.page-workbench .wb-business-jobs .is-error { color: #b75b18; opacity: 1; }
.commerce-dialog.page-workbench .wb-business-resume { margin-top: 10px; }

/* 手机上右侧信息列会挤扁标题 → 改为单列堆叠，「更新」按钮靠左对齐 */
@media (max-width: 560px) {
  .commerce-dialog.page-workbench .workbench-sync { margin: 16px 16px 0; padding: 14px; }
  .commerce-dialog.page-workbench .workbench-sync-head { flex-direction: column; align-items: flex-start; }
  .commerce-dialog.page-workbench .workbench-sync-head .button { width: 100%; justify-content: center; }
  .commerce-dialog.page-workbench .workbench-sync-item { grid-template-columns: minmax(0, 1fr); }
  .commerce-dialog.page-workbench .workbench-sync-side { grid-column: 1; grid-row: auto; align-items: flex-start; text-align: left; margin-top: 6px; }
  .commerce-dialog.page-workbench .workbench-sync-go { width: 100%; justify-content: center; }
}

/* ══════════════════════════════════════════════════════════════════════
   2026-10-19 · 编制报价页返工（微信反馈 8 条）
   ① 识别进度改为全屏遮罩（原文案藏在 is-hidden 的上传区里，看不见）
   ② 已确认行收起候选列表（原来 19 行 × 3 候选 → 页面 5000px）
   ③ 底部常驻操作条（返回原询价 / 已确认计数 / 保存草稿）
   ④ 附件行统一成「文件名 … 按钮」单行，长短文件名不再错位
   ⑤ 移动端字段 2×2 排布，四列挤在一行时的贴边问题
   ══════════════════════════════════════════════════════════════════════ */

/* ① 识别遮罩：已抽成公共组件 st-busy-mask-v1.js（window.STBusyMask），
      样式由组件自己注入 <style>，不再依赖本文件 —— 扫码层没加载工作台样式也能用。
      这里刻意不留旧 .quote-mask 规则：两套样式并存迟早会打架。 */

/* ② 候选列表收起态的容器（.quote-candidates 原本是 flex，hidden 会被覆盖） */
.quote-candidates[hidden] { display: none; }

/* ③ 行脚：左「跳过/取消」右「换一个商品」 */
.quote-line-foot { display: flex; align-items: center; justify-content: space-between; gap: 10px; }
.quote-swap {
  padding: 4px 10px;
  border: 1px solid color-mix(in srgb, #001c81 22%, transparent);
  border-radius: 999px;
  background: color-mix(in srgb, #001c81 5%, transparent);
  color: #001c81;
  font: inherit;
  font-size: 11.5px;
  font-weight: 600;
  cursor: pointer;
}
.quote-swap:hover { background: color-mix(in srgb, #001c81 10%, transparent); }
.quote-swap[aria-expanded="true"] { background: color-mix(in srgb, #001c81 12%, transparent); }

/* ④ 添加一行商品 */
.quote-lines-actions { display: flex; padding: 12px 20px 0; }
.quote-add-product {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  width: 100%;
  justify-content: center;
  min-height: 44px;
  padding: 10px 14px;
  border: 1px dashed color-mix(in srgb, #001c81 30%, transparent);
  border-radius: 12px;
  background: color-mix(in srgb, #001c81 3%, transparent);
  color: #001c81;
  font: inherit;
  font-size: 13px;
  font-weight: 600;
  cursor: pointer;
}
.quote-add-product:hover { background: color-mix(in srgb, #001c81 7%, transparent); }
.quote-add-product svg { width: 14px; height: 14px; }

/* ⑤ 底部常驻操作条 = 真正的固定底栏（2026-10-19 反馈「这两部分位置互换」）
   · 贴视口底，不随内容滚动、不被 .dialog-body 的 padding 托到半空；
   · 左右不是 0 —— 由 syncQuoteBottomStack() 按内容区对齐后写 inline（桌面端 body 两侧有 ~90px 外边距）；
   · z-index 高于原图对照（41），所以抽屉永远压不到「保存」。
   原图对照抽屉改成浮在它上方的可移动浮层，见 bindWorkbenchPreviewDrag / syncQuoteBottomStack。 */
.quote-action-bar {
  position: fixed;
  bottom: 0;
  left: 0;
  right: 0;
  z-index: 50;
  display: flex;
  align-items: center;
  gap: 10px;
  margin: 0;
  padding: 10px 16px calc(10px + env(safe-area-inset-bottom, 0px));
  border-top: 1px solid color-mix(in srgb, #001c81 12%, transparent);
  /* 不透明背景：半透明会让卡片文字从操作条下面透出来，看着像被"割了一刀" */
  background: #fff;
  box-shadow: 0 -10px 24px -18px #04122c66;
}
.quote-action-back {
  flex: none;
  padding: 9px 12px;
  border: 1px solid color-mix(in srgb, #001c81 18%, transparent);
  border-radius: 10px;
  background: #fff;
  color: #001c81;
  font: inherit;
  font-size: 12.5px;
  cursor: pointer;
}
.quote-action-count { flex: 1 1 auto; min-width: 0; font-size: 11.5px; color: #6b7688; text-align: center; }
.quote-action-save { flex: none; padding: 10px 16px; font-size: 13px; }
/* 移动端：只收窄左右内边距。操作条已改成 fixed 底栏，
   滚到底时不会再有「浮在页面中间」的问题（那套 padding 推断已废弃）。 */
@media (max-width: 720px) {
  .quote-action-bar { padding-left: 14px; padding-right: 14px; }
}

/* 币种来源提示 */
.quote-field-hint { display: block; margin-top: 4px; font-size: 11px; color: #7b8794; }

/* ⑥ 附件行：长短文件名都不错位（原来 flex-wrap 会导致按钮一会儿在右一会儿换行） */
.page-workbench .project-quote-source .project-record-files article {
  display: flex;
  flex-wrap: nowrap;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  margin-top: 10px;
  padding-top: 10px;
  border-top: 1px solid #e6ecf7;
}
.page-workbench .project-quote-source .project-record-files article > strong {
  flex: 1 1 auto;
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  font-size: 12.5px;
  font-weight: 600;
}
.page-workbench .project-quote-source .project-record-files article > button { flex: none; white-space: nowrap; }

/* ⑦ 移动端字段 2×2：四列挤在 390px 里每个只有 ~78px，标签和值都贴边 */
@media (max-width: 560px) {
  .quote-line-fields { grid-template-columns: 1fr 1fr; row-gap: 10px; padding-bottom: 6px; }
  .quote-line-fields .quote-field-price { order: 3; }
  .quote-line-fields .quote-field-discount { order: 4; }
}

/* 保存草稿后高亮「发布报价」：一次性的注意引导，不做常驻动画 */
[data-flow-action="publish"].is-attention {
  animation: quote-publish-attention 1.3s ease-in-out 2;
  box-shadow: 0 0 0 3px color-mix(in srgb, #ee6e00 45%, transparent);
}
@keyframes quote-publish-attention {
  0%, 100% { box-shadow: 0 0 0 2px color-mix(in srgb, #ee6e00 22%, transparent); }
  50% { box-shadow: 0 0 0 5px color-mix(in srgb, #ee6e00 50%, transparent); }
}


/* ── 编制报价 · 「当前询价」卡片版式（2026-10-19） ──
   目标：首屏就能看到第一行商品。做法是把标题与返回入口并成一行、
   说明压成一行、附件行与文字清单之间的间距统一。 */
.page-workbench .project-quote-source {
  margin: 0 0 16px;
  padding: 16px 16px 14px;
  border: 1px solid #dce4f3;
  border-radius: 16px;
  background: linear-gradient(180deg, #f8faff, #f3f6fe);
}
.page-workbench .project-quote-head { display: flex; align-items: flex-start; justify-content: space-between; gap: 12px; }
.project-quote-head-copy { display: flex; flex-direction: column; gap: 3px; min-width: 0; }
.project-quote-head-copy small { font-size: 10.5px; letter-spacing: .08em; color: #7b8794; }
.project-quote-head-copy strong { font-size: 15px; font-weight: 700; color: #0b1a3a; }
.project-quote-back {
  flex: none;
  margin-top: 2px;
  padding: 4px 0;
  border: 0;
  background: none;
  color: #001c81;
  font: inherit;
  font-size: 12.5px;
  font-weight: 600;
  text-decoration: underline;
  text-underline-offset: 3px;
  cursor: pointer;
}
.page-workbench .project-quote-steps { margin: 8px 0 0; font-size: 12px; line-height: 1.6; color: #5a6678; }
.page-workbench .project-quote-list { display: block; margin-top: 14px; }
.page-workbench .project-quote-match { display: block; margin-top: 10px; }
.page-workbench .project-quote-tip { display: block; margin-top: 10px; font-size: 11px; line-height: 1.55; color: #7b8794; }
.page-workbench .project-quote-error { margin: 8px 0 0; font-size: 12px; color: #c2410c; }

/* 返回原询价是文字链接：必须压过 st-inquiry-flow.css 的
   `.page-workbench .project-quote-source button`（带边框的胶囊按钮） */
.page-workbench .project-quote-source .project-quote-back {
  padding: 4px 0;
  border: 0;
  border-radius: 0;
  background: none;
  color: #001c81;
  text-decoration: underline;
  text-underline-offset: 3px;
  min-height: 0;
}