/*!
 * ui-batch3.css —— 门户 UI 整改 第③批（2026-09-27）
 * 范围：只服务三个页面
 *   1) catalog.html  —— 工艺路线 / 盒型族 筛选按钮（同排等宽）
 *   2) login.html    —— 登录 / 注册 tab（同排等宽）
 *   3) proofing.html —— 操作行按钮（同排等宽等高、主次分明）
 * 依据：《107-门户UI规范-20260927》§1 间距 s1~s6、§2 字号 T1~T6、§3.1 标签上置、
 *       §4 按钮（同排等宽 / 44px / 芯片 36px≥64px / padding 0 16px / 圆角）、
 *       §5 表单控件 44px、§6.2 卡片内边距 s4=16px；《106》§2.1、§5 第三批
 * 变量：一律复用 /app/ui-tokens.css 的 var(--oa-*)，本文件不新增变量
 * 加载：各页在 portal.css **之后**引入本文件；页面自有 <style> 中与本文件重复的规则已一并移入此处
 * 边界：本文件不碰 .pt-navbar / 共享弹窗等跨页公共组件（那属全站口径，改动会牵动其余 11 页）
 */

/* ══════════════════════════════════════════════════════════════════════════
   A. 三页共用工具类（替代原内联 style；107 §2.6 禁止内联字号）
   ══════════════════════════════════════════════════════════════════════════ */

/* 页面上下留白 s5（原内联 padding-top:26px） */
.ui3-top { padding-top: var(--oa-s5); }

/* 页面主标题 h1 = T1 24px（原 catalog 30px / proofing 30px / login 27px 内联） */
.ui3-h1 {
  font-size: var(--oa-t1);
  line-height: var(--oa-t1-lh);
  font-weight: var(--oa-t1-fw);
  margin: var(--oa-s2) 0 var(--oa-s3);
}

/* 页面副标题 = T4 14px（原内联 margin-bottom:10px/6px） */
.ui3-sub {
  font-size: var(--oa-t4);
  line-height: var(--oa-t4-lh);
  margin-bottom: var(--oa-s3);
}

/* 分组标签（芯片组上方的小标题）= T5 13px/600；标签与组之间 s2 8px（107 §1.5/§3.1） */
.ui3-label {
  display: block;
  font-size: var(--oa-t5);
  line-height: var(--oa-t5-lh);
  font-weight: 600;
  color: var(--oa-ink-soft);
  margin: var(--oa-s3) 0 var(--oa-s2);
}

/* 卡片内边距统一 s4 16px（107 §6.2） */
.ui3-card { padding: var(--oa-s4); }

/* 说明条正文 = T4 14px（portal.css 原为 13.5px 的零碎字号；本条覆盖 login 的
   安全提醒、catalog 的路线说明条） */
.pt-banner.info { font-size: var(--oa-t4); line-height: 1.7; }
.pt-banner.info .b-ic { font-size: var(--oa-t4); line-height: 1; }

/* ══════════════════════════════════════════════════════════════════════════
   B. 标签上置（107 §3.1：不再用 <label>文字<input> 的包裹写法）
      纯 CSS 实现：label 变块级、控件移到下一行并满行宽，标签与控件间距 s2 8px
   ══════════════════════════════════════════════════════════════════════════ */
label:has(> input[type="text"], > input[type="tel"], > input[type="password"],
         > input[type="number"], > input[type="search"], > input[type="email"]) {
  display: block;
}
label:has(> input[type="text"], > input[type="tel"], > input[type="password"],
         > input[type="number"], > input[type="search"], > input[type="email"]) > input {
  display: block;
  width: 100%;
  margin: var(--oa-s2) 0 0;
}

/* ══════════════════════════════════════════════════════════════════════════
   C. catalog.html —— 筛选芯片：同排等宽等高
      改前（1440×960 实测）：工艺路线行 88 / 159.3 / 282.5 / 388.8（宽差 300.8）
                              盒型族行  74.5 / 98.9 / 98.9 / 85.4 / 98.9（宽差 24.4）
      改法：筛选组改成等分列的 grid —— 列宽由容器与芯片最小宽自动决定，
            同一行的芯片必然等宽；芯片最小宽 64px、高 36px（107 §4 芯片档）
   ══════════════════════════════════════════════════════════════════════════ */
[x-data="catalogApp()"] .pt-filters {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(var(--oa-chip-min-w), 1fr));
  gap: var(--oa-s2);
  align-items: stretch;
}
[x-data="catalogApp()"] .pt-filter-chip {
  min-width: var(--oa-chip-min-w);
  min-height: var(--oa-chip-h);
  padding: 0 var(--oa-s3);
  font-size: var(--oa-t5);
  display: inline-flex;
  align-items: center;
  justify-content: center;
  text-align: center;
  line-height: 1.35;
}
/* 工艺路线组：列宽上限 220px（原来的 388.8px 长条不再出现） */
[x-data="catalogApp()"] #btn-route-all { border-color: var(--oa-brand); }
[x-data="catalogApp()"] .pt-filters:has(#btn-route-all) {
  grid-template-columns: repeat(auto-fit, minmax(140px, 220px));
  justify-content: start;
}

/* 搜索行：控件 44px / T4 字（原 input 高 48.4px、字 15.5px；按钮 31.5px 不达 32px 下限） */
[x-data="catalogApp()"] .catalog-toolbar {
  display: flex;
  gap: var(--oa-s2);
  flex-wrap: wrap;
  align-items: center;
  margin: var(--oa-s4) 0;
}
[x-data="catalogApp()"] .catalog-toolbar input {
  margin: 0;
  max-width: 240px;
  min-height: var(--oa-ctrl-h);
  height: var(--oa-ctrl-h);
  font-size: var(--oa-t4);
  border-radius: var(--oa-r-field);
}
[x-data="catalogApp()"] .catalog-toolbar .pt-btn.sm {
  min-height: var(--oa-ctrl-h);
  height: var(--oa-ctrl-h);
  padding: 0 var(--oa-s4);
  font-size: var(--oa-t4);
  display: inline-flex;
  align-items: center;
  justify-content: center;
}
[x-data="catalogApp()"] .catalog-toolbar .pt-muted { margin-left: auto; font-size: var(--oa-t5); }
[x-data="catalogApp()"] .catalog-toolbar .pt-muted b { font-size: var(--oa-t5); }

/* 卡片网格与卡片内部：栅格列距 s4 16px（107 §3.4） */
[x-data="catalogApp()"] .pt-grid-cards { gap: var(--oa-s4); margin-top: var(--oa-s5); }
[x-data="catalogApp()"] .pt-box-card .top { gap: var(--oa-s2); }
[x-data="catalogApp()"] .pt-box-card .bx-hd { display: flex; gap: var(--oa-s2); align-items: center; }
[x-data="catalogApp()"] .pt-box-card .bx-name {
  font-size: var(--oa-t3); line-height: var(--oa-t3-lh); font-weight: var(--oa-t3-fw);
}
[x-data="catalogApp()"] .pt-box-card .pt-muted { font-size: var(--oa-t5); }
[x-data="catalogApp()"] .pt-box-card .foot { font-size: var(--oa-t5); }
[x-data="catalogApp()"] .pt-box-card .go { font-size: var(--oa-t4); }
[x-data="catalogApp()"] .pt-box-card .desc { font-size: var(--oa-t5); line-height: var(--oa-t5-lh); }
/* 族图标字形：22px → T1 24px（图标字号也走档位，避免多出第 7 档） */
[x-data="catalogApp()"] .pt-bx-ic { font-size: var(--oa-t1); }
[x-data="catalogApp()"] .pt-banner.info { margin: var(--oa-s2) 0 var(--oa-s4); }

/* ══════════════════════════════════════════════════════════════════════════
   D. login.html —— 登录 / 注册 tab：同排等宽
      改前实测：微信扫码登录 148.2 × 39 ／ 手机号 / 密码 123.8 × 39（宽差 24.4，高不达 44）
      次 tab（手机号登录 / 注册新账号）改前 85 × 27.5 —— 已等宽但低于 32px 触控下限
      改法：tab 组等分（flex:1 1 0），高度 44px（107 §4 次按钮）
   ══════════════════════════════════════════════════════════════════════════ */
[x-data="authApp()"] .auth-tab { display: flex; gap: var(--oa-s2); margin-bottom: var(--oa-s4); }
[x-data="authApp()"] .auth-tab button {
  flex: 1 1 0;
  min-width: 0;
  min-height: var(--oa-ctrl-h);
  height: var(--oa-ctrl-h);
  padding: 0 var(--oa-s3);
  border: 1px solid var(--oa-line);
  border-radius: var(--oa-r-chip);
  background: #fff;
  cursor: pointer;
  font-size: var(--oa-t4);
  color: var(--oa-ink-soft);
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: var(--oa-s1);
  white-space: nowrap;
}
[x-data="authApp()"] .auth-tab button.on {
  background: var(--oa-brand); color: #fff; border-color: var(--oa-brand); font-weight: 600;
}
/* 次 tab：等宽 + 36px（行内小按钮档） */
[x-data="authApp()"] .auth-sub { display: flex; gap: var(--oa-s2); margin: var(--oa-s2) 0 var(--oa-s3); }
[x-data="authApp()"] .auth-sub button {
  flex: 1 1 0;
  min-width: 0;
  min-height: var(--oa-btn-sm-h);
  height: var(--oa-btn-sm-h);
  padding: 0 var(--oa-s3);
  display: inline-flex; align-items: center; justify-content: center;
  border: 1px solid transparent;
  border-radius: var(--oa-r-btn);
  background: transparent;
  color: var(--oa-muted);
  font-size: var(--oa-t5);
  cursor: pointer;
}
[x-data="authApp()"] .auth-sub button.on {
  background: var(--oa-brand-soft); color: var(--oa-brand-deep); font-weight: 600;
}

/* 登录卡：内边距 s4 16px（原内联 26px）；表单行距 s3 12px（107 §1.4） */
[x-data="authApp()"] .auth-card { padding: var(--oa-s4); }
[x-data="authApp()"] .auth-form label {
  font-size: var(--oa-t4);
  color: var(--oa-ink);
  margin: 0 0 var(--oa-s3);
}
[x-data="authApp()"] .auth-form input {
  min-height: var(--oa-ctrl-h);
  height: var(--oa-ctrl-h);
  font-size: var(--oa-t4);
  border-radius: var(--oa-r-field);
}
[x-data="authApp()"] .auth-form .pt-grid2 { gap: var(--oa-s3); }
/* 提交主按钮：44px 满行宽、T4（原内联 font-size:15px + padding:11px） */
[x-data="authApp()"] #btn-login,
[x-data="authApp()"] #btn-register {
  width: 100%;
  min-height: var(--oa-ctrl-h);
  height: var(--oa-ctrl-h);
  padding: 0 var(--oa-s4);
  font-size: var(--oa-t4);
  display: inline-flex; align-items: center; justify-content: center;
  border-radius: var(--oa-r-btn);
}
/* 左侧说明栏：零碎字号收到 T4/T5（原 14.5px / 13.5px 内联） */
[x-data="authApp()"] .auth-aside h1 { font-size: var(--oa-t1); line-height: var(--oa-t1-lh); font-weight: var(--oa-t1-fw); margin: var(--oa-s2) 0 var(--oa-s3); }
[x-data="authApp()"] .auth-aside p { font-size: var(--oa-t4); line-height: 1.8; }
[x-data="authApp()"] .auth-aside ul { font-size: var(--oa-t5); line-height: 2; }
[x-data="authApp()"] .inv-ic { font-size: var(--oa-t3); line-height: 1.5; }
[x-data="authApp()"] .wx-link { font-size: var(--oa-t5); }
[x-data="authApp()"] .wx-step { font-size: var(--oa-t5); }
[x-data="authApp()"] .wx-hint { font-size: var(--oa-t6); }
[x-data="authApp()"] .inv-mini { font-size: var(--oa-t6); line-height: var(--oa-t6-lh); }

/* ══════════════════════════════════════════════════════════════════════════
   E. proofing.html —— 操作行按钮：同排等宽等高、主次分明
      改前：操作行按钮各自按内容宽（31.5px 高，不达 32px 下限）；价格口径芯片 74.5 / 107.9（宽差 33.4）
      改法：操作行改等分列 grid，三个动作按钮同宽（160~220px）× 44px；
            主推进 = 实填（brand 绿 / primary 橙），补样 = ghost 描边（107 §4.1/§7.1）
   ══════════════════════════════════════════════════════════════════════════ */
[x-data="proofingApp()"] .pf-acts {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(160px, 220px));
  justify-content: start;
  gap: var(--oa-s4);
  align-items: end;
  margin-top: var(--oa-s3);
  padding-top: var(--oa-s3);
  border-top: 1px dashed var(--oa-line);
}
[x-data="proofingApp()"] .pf-acts .pt-muted { grid-column: 1 / -1; }
/* 三个动作按钮（确认样板 OK / 转生产单 / 补样）同宽 220px × 高 44px —— 选择器带 .sm，
   否则会被下面「行内小按钮 .pt-btn.sm 36px」按文档顺序盖掉 */
[x-data="proofingApp()"] .pf-acts .pt-btn.sm {
  width: 100%;
  min-height: var(--oa-ctrl-h);
  height: var(--oa-ctrl-h);
  padding: 0 var(--oa-s3);
  font-size: var(--oa-t4);
  margin: 0;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: var(--oa-s1);
  border-radius: var(--oa-r-btn);
}
/* 转生产单块：标签上置 + 控件满行宽 + 提示与按钮间距 s2 */
[x-data="proofingApp()"] .pf-transfer { display: flex; flex-direction: column; gap: var(--oa-s2); min-width: 0; }
[x-data="proofingApp()"] .pf-transfer label {
  font-size: var(--oa-t4); font-weight: 600; color: var(--oa-ink); margin: 0;
}
[x-data="proofingApp()"] .pf-transfer input {
  width: 100%; min-height: var(--oa-ctrl-h); height: var(--oa-ctrl-h);
  margin: 0; font-size: var(--oa-t4); border-radius: var(--oa-r-field);
}
[x-data="proofingApp()"] .pf-hint { font-size: var(--oa-t5); color: var(--oa-brand-deep); }
[x-data="proofingApp()"] .pf-reissue { display: flex; flex-direction: column; gap: var(--oa-s2); min-width: 0; }
[x-data="proofingApp()"] .pf-reissue-msg { font-size: var(--oa-t6); }

/* 卡片内其余文字与控件：零碎字号收到 T5/T6，控件 36~44px */
[x-data="proofingApp()"] .pt-card { padding: var(--oa-s4); border-radius: var(--oa-r-card); }
[x-data="proofingApp()"] .pf-body { display: flex; flex-direction: column; gap: var(--oa-s4); }
[x-data="proofingApp()"] .pf-topbar {
  display: flex; gap: var(--oa-s3); align-items: center; flex-wrap: wrap;
  padding: var(--oa-s4); margin: var(--oa-s4) 0;
}
/* 顶栏「刷新 / ＋ 新打样（选盒型）」同排等宽（107 §4：同排按钮必须等宽等高），
   定宽 150px（内容最宽 146px）＋内容居中，主按钮靠右 */
[x-data="proofingApp()"] .pf-topbar .pt-btn {
  width: 150px;
  justify-content: center;
  white-space: nowrap;
}
[x-data="proofingApp()"] .pf-fee { margin-left: auto; font-size: var(--oa-t5); }
[x-data="proofingApp()"] .pf-newbtn { margin-left: auto; }
[x-data="proofingApp()"] .pf-taxerr { font-size: var(--oa-t5); }
/* portal.css 里 .pt-muted 是 12.5px（零碎字号），页内统一拽回 T5=13px；
   覆盖 顶栏「共 N 张打样单」/ 工序步 / 订单条 / 费用提示 */
[x-data="proofingApp()"] .pt-muted { font-size: var(--oa-t5); line-height: var(--oa-t5-lh); }
[x-data="proofingApp()"] .pf-head { display: flex; align-items: center; flex-wrap: wrap; }
[x-data="proofingApp()"] .pf-meta { color: var(--oa-ink-soft); }
[x-data="proofingApp()"] .pf-orders { color: var(--oa-ink-soft); }
[x-data="proofingApp()"] .pf-head { gap: var(--oa-s2); }
[x-data="proofingApp()"] .pf-no { font-size: var(--oa-t3); line-height: var(--oa-t3-lh); font-weight: var(--oa-t3-fw); }
[x-data="proofingApp()"] .pf-meta { font-size: var(--oa-t5); line-height: var(--oa-t5-lh); }
[x-data="proofingApp()"] .pf-steps { display: flex; flex-wrap: wrap; gap: var(--oa-s2); margin-top: var(--oa-s3); }
[x-data="proofingApp()"] .pf-step {
  flex: 1;
  min-width: 96px;
  border: 1px solid var(--oa-line);
  background: #fff;
  padding: var(--oa-s2) var(--oa-s3);
  font-size: var(--oa-t5);
  border-radius: var(--oa-r-btn);
}
[x-data="proofingApp()"] .pf-orders { margin-top: var(--oa-s3); font-size: var(--oa-t5); }
[x-data="proofingApp()"] .pf-acts-muted { font-size: var(--oa-t5); }
[x-data="proofingApp()"] .pf-label-soft { font-size: var(--oa-t5); }
[x-data="proofingApp()"] .pf-msg { font-size: var(--oa-t6); }
[x-data="proofingApp()"] .pf-img-block { margin-top: var(--oa-s2); }
/* 行内小按钮（刷新 / 新打样 / 查看 3D 款式图 / 文件展开）统一 36px（107 §4 小按钮） */
[x-data="proofingApp()"] .pt-btn.sm {
  min-height: var(--oa-btn-sm-h);
  height: var(--oa-btn-sm-h);
  padding: 0 var(--oa-s3);
  font-size: var(--oa-t5);
  display: inline-flex; align-items: center; justify-content: center; gap: var(--oa-s1);
  border-radius: var(--oa-r-btn);
}
[x-data="proofingApp()"] #btn-refresh-proofing { margin-left: var(--oa-s2); }
[x-data="proofingApp()"] .pt-files-toggle { min-height: var(--oa-btn-sm-h); }
[x-data="proofingApp()"] .pt-file-btn { min-height: var(--oa-btn-sm-h); height: var(--oa-btn-sm-h); font-size: var(--oa-t5); }
/* 价格口径芯片组：两个芯片等宽（改前 74.5 / 107.9） */
[x-data="proofingApp()"] #taxSwitch {
  display: grid;
  grid-template-columns: auto repeat(2, 132px);
  gap: var(--oa-s2);
  align-items: center;
  margin: 0;
}
[x-data="proofingApp()"] #taxSwitch .pt-filter-chip {
  min-width: var(--oa-chip-min-w);
  min-height: var(--oa-chip-h);
  height: var(--oa-chip-h);
  padding: 0 var(--oa-s3);
  font-size: var(--oa-t5);
  display: inline-flex; align-items: center; justify-content: center;
  line-height: 1.35;
}

/* ══════════════════════════════════════════════════════════════════════════
   F. 窄屏（≤900px）：等宽规则保留，改成单列堆叠，避免挤压（107 §9）
      注：portal-mobile.css 在本文件之后加载，其 !important 规则（44px 触控/字号）继续生效
   ══════════════════════════════════════════════════════════════════════════ */
@media (max-width: 900px) {
  [x-data="catalogApp()"] .pt-filters,
  [x-data="catalogApp()"] .pt-filters:has(#btn-route-all) {
    grid-template-columns: repeat(auto-fit, minmax(var(--oa-chip-min-w), 1fr));
    justify-content: stretch;
  }
  [x-data="proofingApp()"] .pf-acts { grid-template-columns: 1fr; }
  [x-data="proofingApp()"] #taxSwitch { grid-template-columns: 1fr; }
}