/*!
 * ui-batch7.css —— 门户 UI 整改 第⑦批（2026-09-27）：**同排同类控件「等宽等高」全门户收口**
 * 由来：老板截图投诉「错位这么严重」——同一排里的同类控件（按钮/输入框）宽度不等。
 *       副总用 CDP 逐页量过，1440 宽下共 15 组不一致（见施工记录 116）。
 * 依据：《107-门户UI规范-20260927》§4 按钮（同排等宽 / 芯片 36px）、§1 间距 s1~s6、§9 窄屏
 * 变量：一律复用 /app/ui-tokens.css 的 var(--oa-*)，本文件不新增变量
 * 加载：被改页面在 assets/portal.css **之后**引入本文件；页面自有 <style> 里同名单类规则
 *       靠本文件的「双类/ID」选择器（特异性更高）盖过，不依赖加载顺序
 * 边界：只做版式；不动任何文案 / 字段名 / 接口调用 / 金额口径 / 按钮 id。
 *       不碰 trader、admin、workspace 目录，不改 portal.css。
 *
 * 两种等宽配方（107 §4「同排等宽」，都不靠调 padding 凑数）：
 *   ① .b7-eq     —— 紧凑型：`grid-auto-flow:column + grid-auto-columns:1fr + width:max-content`
 *                    列宽 = 组内最宽者的 max-content，全组同宽、不铺满（适合短芯片）
 *   ② .b7-eqfill —— 铺满型：`repeat(auto-fit, minmax(--b7-min, 1fr))`
 *                    等宽铺满容器，放不下整体换行；**换行后每一行仍是同一批列宽 → 跨行同宽**
 * 高度：一律给组内元素 `align-items:stretch`（②）/ 显式 `--oa-chip-h`（口径开关），
 *       保证同排等高；字号沿用第①批的 12px 下限，不改字号档位。
 */

/* ══════════════════════════════════════════════════════════════════════════
   A. 两种通用配方
   ══════════════════════════════════════════════════════════════════════════ */

/* ① 紧凑型：一行等宽，宽度取组内最宽者；放不下时用 max-width 兜底（不撑破页面） */
.b7-eq {
  display: grid;
  grid-auto-flow: column;
  grid-auto-columns: 1fr;
  width: max-content;
  max-width: 100%;
  gap: var(--oa-s2);
  align-items: stretch;
}

/* ② 铺满型：等宽铺满容器，超出后整体换行（每行同一批列宽，跨行同宽） */
.b7-eqfill {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(var(--b7-min, 8em), 1fr));
  gap: var(--oa-s2);
  align-items: stretch;
}

/* 组内元素：不许把文字挤出容器（107 §4：芯片文字不换行，放不下就整体换行） */
.b7-eq > button,
.b7-eqfill > button {
  min-width: 0;
  white-space: nowrap;
  text-align: center;
}

/* ══════════════════════════════════════════════════════════════════════════
   B. 价格口径开关（box / orders / statement / statements / workbench 五页共用 #taxSwitch）
      同第③批 proofing.html 口径：标签 auto + 两个芯片固定等宽（改前 65/97.2 或 74.5/107.9）
   ══════════════════════════════════════════════════════════════════════════ */
#taxSwitch {
  display: grid;
  grid-template-columns: auto repeat(2, 132px);   /* 132px ≥ 最宽芯片「含税（8%）」107.9 */
  gap: var(--oa-s2);
  align-items: center;
}
#taxSwitch > .pt-filter-chip {
  min-width: 0;
  min-height: var(--oa-chip-h);
  height: var(--oa-chip-h);
  padding: 0 var(--oa-s3);
  display: inline-flex;
  align-items: center;
  justify-content: center;
  white-space: nowrap;
  text-align: center;
}

/* ══════════════════════════════════════════════════════════════════════════
   C. 逐个「不一致组」的落地（页面 / 选择器 / 改前宽 → 见记录 116 逐行表）
   ══════════════════════════════════════════════════════════════════════════ */

/* C1. box.html ④额外要求（.pt-filters.b7-eqfill.b7-eq-extra）：
       覆膜 / 产品拍摄 / 拼版 / 糊合成型
       改前 96.9 / 143.8 / 178.1 / 78，且换行成 3+1（两行宽度还各不相同）
       min 184px ≥ 最宽者「拼版（4C 含出血 ¥40/套）」178.1 → 铺满型，整组同宽 */
.pt-filters.b7-eq-extra { --b7-min: 184px; }

/* C2. workbench.html 数量档（.qty-quick.b7-eqfill）：
       100/300/500/1000/2000/5000/10000
       改前 56.5×3 / 65.9 / 64 / 64 / 71.5，且换行成 5+2
       min 76px ≥ 最宽者「10000」71.5 → 铺满型，跨行同宽 */
.qty-quick.b7-eqfill { --b7-min: 76px; }

/* C3. workbench.html 展开视图分段开关（.wb-seg.b7-seg）：
       面纸层（印刷） / 灰板层  改前 113.5 / 63.5
       .wb-seg 是 inline 元素（页内 <style> 定 inline-flex），双类选择器盖过它 */
.wb-seg.b7-seg {
  display: inline-grid;
  grid-auto-flow: column;
  grid-auto-columns: 1fr;
  width: max-content;
  max-width: 100%;
  align-items: stretch;
  gap: 0;                       /* 分段控件：段间靠边框贴合，不留缝 */
}
.wb-seg.b7-seg > button { min-width: 0; white-space: nowrap; text-align: center; }

/* C4. profile.html 操作行（.pf-ops.b7-eq-ops）：提交并验证 / 重置  改前 108 / 66
       老板口径「同排就等宽」→ 主/次按钮也等宽；页内 <style> 的 .pf-ops{display:flex}
       靠双类特异性盖过，不依赖加载顺序 */
.pf-ops.b7-eq-ops {
  display: grid;
  grid-auto-flow: column;
  grid-auto-columns: 1fr;
  width: max-content;
  max-width: 100%;
  gap: var(--oa-s2);
  align-items: stretch;
}

/* C5. box.html 盒型款式芯片（#p-lid-type-*）：改前 117 / 130 / 91（差 39px）
   C6. box.html 结构工艺芯片（#btn-groove-*）：改前 128 / 156.3（差 28.3px）
   两处容器挂 .b7-eq 紧凑型配方；结构工艺容器内芯片被 <div style="display:contents">
   包裹，A 节的子选择器 .b7-eq > button 命中不到，这里用后代选择器兜底。
   间距沿用原实测 8px（var(--oa-s2)），不靠调 padding 凑宽。 */
.pt-filters.b7-eq > button,
.pt-filters.b7-eq .pt-filter-chip {
  min-width: 0;
  white-space: nowrap;
  text-align: center;
}

/* 其余各组直接用 A 节的两个配方（HTML 挂类即可，无需另写规则）：
   · box 3D 配色「牛皮/白卡/黑卡/红」  改前 46/46/46/**34** → .b7-eq（紧凑，四个都 46）
   · box ④表面工艺「哑胶/光胶/烫金/局部UV/无」（该页此块默认收起，一并收口）→ .b7-eq
   · workbench 3D 工具条「⤾ 视角复位 / 示例图贴面」改前 82.5 / 94 → .b7-eq
   · workbench 表面处理「表面处理(标签)/哑胶/光胶/烫金/局部UV」改前 48/48/48/**63.5** → .b7-eq */

/* ══════════════════════════════════════════════════════════════════════════
   D. 窄屏（≤900px，107 §9）
      原则：等宽规则保留；宽度不够时**整体换行/堆叠**，绝不出现横向滚动条
   ══════════════════════════════════════════════════════════════════════════ */
@media (max-width: 900px) {
  /* 长文案组：一行放不下 → 单列堆叠（每行 1 个，不会撑破卡片） */
  .pt-filters.b7-eq-extra { grid-template-columns: 1fr; }
  /* 口径开关：标签 + 两个芯片各占一行（同 proofing 第③批口径） */
  #taxSwitch { grid-template-columns: 1fr; }
  /* 分段开关：占满一行、文字允许折行（避免「E 坑（默认 · 细瓦楞）」这类长段撑破窄屏） */
  .wb-seg.b7-seg { width: 100%; }
  .wb-seg.b7-seg > button { white-space: normal; }
}

@media (max-width: 480px) {
  .qty-quick.b7-eqfill { --b7-min: 88px; }   /* 窄屏放大触控块，同时保证 5 位数字不溢出 */

  /* 紧凑型组改为「换行 + 等宽」：仍保证同排/跨行同宽，且每个芯片都留得下文字
     （窄屏芯片被 portal-mobile.css 放大到 14px/10px 16px，max-content 一行放不下时
      若仍强制单行，文字会被压出按钮外；这里改成铺满型，放不下整体换行） */
  .b7-eq {
    grid-auto-flow: row;
    grid-template-columns: repeat(auto-fit, minmax(var(--b7-min, 5.5em), 1fr));
    width: 100%;
  }
  /* 例外：workbench 的 3D 工具条是 position:absolute 定位（页内 <style>），
     给它 width:100% 会把盒子顶出视口（实测 390 宽出现 19px 横向溢出）→ 保持单行紧凑 */
  .stage-tools.b7-eq {
    width: max-content;
    grid-auto-flow: column;
    grid-template-columns: none;
  }

  /* 存量溢出（非本批引入，改前就有）：workbench 390 宽下 .flat-shell 的栅格项
     min-width:auto 被卡内表格的 min-content 顶到 395px，documentElement 横向可滚 19px。
     给栅格项 min-width:0 让 1fr 轨道按容器收窄（只动窄屏，桌面不受影响） */
  .flat-shell > .wb-card { min-width: 0; }
}
