/* ============================================================
   迎客货商平台 - 响应式样式
   断点：≤768px 手机布局（底部导航 + 卡片），>768px PC 布局（侧栏 + 表格）
   ============================================================ */
:root {
  --primary: #1a7f5a;
  --primary-dark: #14664a;
  --primary-light: #e6f4ee;
  --bg: #f4f6f8;
  --card: #ffffff;
  --text: #22262a;
  --text-2: #6b7480;
  --line: #e6e9ed;
  --red: #d9463e;
  --orange: #e8842c;
  --radius: 10px;
}
* { margin: 0; padding: 0; box-sizing: border-box; }
html, body { height: 100%; }
body { font-family: "Microsoft YaHei", "PingFang SC", -apple-system, sans-serif;
  background: var(--bg); color: var(--text); font-size: 14px; }
.hidden { display: none !important; }
a { text-decoration: none; color: inherit; cursor: pointer; }

/* ---------------- 品牌 LOGO ----------------
   「迎客」=品牌标记（绿底白字徽标），「货商平台」=产品名，两者用间隙分开，
   绝不再拼成一串「迎客货商平台」。纯 CSS 实现，无需图片资源。 */
.logo-mark { display: inline-flex; align-items: center; justify-content: center;
  background: linear-gradient(140deg, #2aa075 0%, #1a7f5a 55%, #14664a 100%);
  color: #fff; font-weight: 700; font-size: 12.5px; line-height: 1;
  letter-spacing: 1px; text-indent: 1px; padding: 5px 5px 5px 6px; border-radius: 7px;
  box-shadow: 0 2px 6px rgba(20,102,74,.22); }
.logo-word { font-weight: 600; letter-spacing: .8px; color: var(--primary-dark); }

/* ---------------- 登录页 ---------------- */
.login-wrap { min-height: 100vh; display: flex; align-items: center; justify-content: center;
  background: linear-gradient(135deg, #14664a 0%, #1a7f5a 55%, #2aa075 100%); padding: 16px; }
.login-card { background: var(--card); border-radius: 14px; padding: 36px 30px;
  width: 100%; max-width: 380px; box-shadow: 0 18px 50px rgba(0,0,0,.25); text-align: center; }
.login-logo { display: flex; justify-content: center; }
/* 登录页大徽标：迎客 二字独立成块，下方才是产品名 */
.logo-mark-xl { font-size: 21px; letter-spacing: 4px; text-indent: 4px;
  padding: 13px 12px 13px 14px; border-radius: 15px;
  box-shadow: 0 8px 22px rgba(20,102,74,.30); }
.login-card h1 { font-size: 20px; letter-spacing: 1px; margin: 14px 0 4px; }
.login-sub { color: var(--text-2); font-size: 13px; margin-bottom: 24px; }
.field { text-align: left; margin-bottom: 14px; }
.field label { display: block; font-size: 13px; color: var(--text-2); margin-bottom: 6px; }
.field input { width: 100%; padding: 11px 12px; border: 1px solid var(--line);
  border-radius: 8px; font-size: 15px; outline: none; }
.field input:focus { border-color: var(--primary); box-shadow: 0 0 0 3px var(--primary-light); }
.login-msg { color: var(--red); font-size: 13px; margin-top: 12px; min-height: 18px; }

/* v1.70 统一登录：角色页签（货商 / 采购）——两个系统共用一个网址，登录时先选身份 */
.role-seg { display: flex; gap: 0; background: #eef2f4; border-radius: 10px;
  padding: 3px; margin: 0 0 18px; }
.role-seg button { flex: 1; border: none; background: transparent; padding: 9px 0;
  font-size: 13.5px; color: var(--text-2); border-radius: 8px; cursor: pointer; }
.role-seg button.on { background: var(--primary); color: #fff; font-weight: 700; }
.role-seg button:not(.on):hover { color: var(--text); }

/* v1.88d 采购入口卡片：采购端的登录在 buyer.html 自己那一页做（全屏手势只在同一页有效），
   这里只放一个明显的入口，不再收账号密码 */
.be-card { display: flex; align-items: center; gap: 12px; width: 100%; box-sizing: border-box;
  padding: 14px 16px; margin: 2px 0 10px; border: 1px solid var(--primary); border-radius: 12px;
  background: #f2faf6; text-decoration: none; color: inherit; }
.be-card:active { background: #e6f5ec; }
.be-ic { font-size: 22px; line-height: 1; }
.be-txt { flex: 1; min-width: 0; text-align: left; }
.be-txt b { display: block; font-size: 15px; color: var(--primary-dark); }
.be-txt i { display: block; font-style: normal; font-size: 12px; color: var(--text-2); margin-top: 3px; }
.be-go { font-size: 18px; color: var(--primary); font-weight: 700; }
.be-note { font-size: 12px; color: var(--text-2); line-height: 1.65; margin: 0 0 12px; text-align: left; }

/* ---------------- 按钮 ---------------- */
.btn { border: none; border-radius: 8px; padding: 10px 18px; font-size: 14px; cursor: pointer; }
.btn-primary { background: var(--primary); color: #fff; }
.btn-primary:active, .btn-primary:hover { background: var(--primary-dark); }
.btn-block { width: 100%; padding: 12px; font-size: 15px; }
.btn-ghost { background: #fff; border: 1px solid var(--line); color: var(--text-2); }
/* v1.148 运费报表「返回单据列表」：实色醒目键（原来灰描边缩在左边，一眼找不到） */
.btn-back-strong { background: var(--primary); color: #fff !important; border: 1px solid var(--primary-dark);
  font-weight: 700; box-shadow: 0 2px 8px rgba(26,127,90,.30); transition: transform .15s, box-shadow .15s, background .15s; }
.btn-back-strong:hover { background: var(--primary-dark); box-shadow: 0 3px 10px rgba(26,127,90,.38); transform: translateY(-1px); }
.btn-back-strong:active { transform: translateY(0); box-shadow: 0 1px 4px rgba(26,127,90,.30); }
.btn-danger { background: var(--red) !important; color: #fff !important; }   /* v1.67 破坏性操作（删图）用红键 */
.btn-danger:active, .btn-danger:hover { background: #b93a33 !important; }
.btn-sm { padding: 6px 12px; font-size: 13px; border-radius: 6px; }
/* v1.317 统一「查询」按钮：🔍 + 品牌绿胶囊 + 点按反馈（所有页面的查询/搜索/刷新统一成这个）。
   点下去 :active 缩放压暗 = 明确的按压反馈；带 data-fb 时点完再弹一条轻提示。 */
.btn-q { display: inline-flex; align-items: center; justify-content: center; gap: 6px;
  height: 32px; padding: 0 16px; border: none; border-radius: 999px;
  background: var(--primary); color: #fff; font-size: 13px; font-weight: 600;
  cursor: pointer; transition: transform .12s ease, filter .15s ease, box-shadow .15s ease;
  box-shadow: 0 2px 8px rgba(26, 127, 90, .22); white-space: nowrap; }
.btn-q .qi { font-size: 14px; line-height: 1; }
.btn-q:hover { filter: brightness(1.06); box-shadow: 0 3px 12px rgba(26, 127, 90, .32); }
.btn-q:active { transform: scale(.92); filter: brightness(.94); }
.btn-q:focus-visible { outline: 2px solid var(--primary); outline-offset: 2px; }
.btn-q.btn-q-sm { height: 28px; padding: 0 12px; font-size: 12.5px; }

/* ---------------- 主布局 ---------------- */
.app { min-height: 100vh; }
.sidebar { display: none; }
.topbar { display: flex; align-items: center; justify-content: space-between;
  background: var(--primary); color: #fff; padding: 12px 16px;
  position: sticky; top: 0; z-index: 20; }
/* 标题允许被压缩：窄屏上让按钮永远完整显示，宁可标题先出省略号 */
.topbar-title { font-size: 16px; font-weight: 600; flex: 0 1 auto; min-width: 0;
  display: inline-flex; align-items: center; gap: 7px;
  overflow: hidden; white-space: nowrap; }
/* 绿底顶栏上用反白徽标：白底绿字，远看清爽 */
.topbar .logo-mark { background: #fff; color: var(--primary); box-shadow: none;
  font-size: 11.5px; padding: 4px 4px 4px 5px; border-radius: 6px; }
.topbar .logo-word { color: #fff; font-size: 14.5px; letter-spacing: .6px;
  overflow: hidden; text-overflow: ellipsis; }
/* 右侧：供应商名 + 显示大小 + 全屏 + 退出。名字不够位就省略号，别把按钮挤出去 */
.topbar-right { flex: 0 0 auto; min-width: 0; display: flex; align-items: center;
  justify-content: flex-end; gap: 8px; }
.topbar-user { font-size: 13px; opacity: .9; max-width: none; min-width: 0; overflow: hidden;
  text-overflow: ellipsis; white-space: nowrap; flex: 0 1 auto; }
/* v1.56 手机端登录信息条：顶栏正下方，v1.56c 紧凑自适应——
   小字号 + 信息段流式排列：一行放得下就一行，放不下整段自动折到下一行（段内不拆行）。
   电脑端在下方 PC 媒体查询里隐藏（电脑用户看左下角侧栏面板，内容一致） */
.topbar-info { padding: 3px 10px 2px; font-size: 11px; line-height: 1.6; color: var(--text-2);
  background: var(--surface, #fff); border-bottom: 1px solid var(--line); }
.topbar-info .ti-seg { display: inline-block; white-space: nowrap; margin-right: 10px; }
.topbar-info b { color: var(--text); font-weight: 600; }
.fs-btn { flex: 0 0 auto; border: 1px solid rgba(255,255,255,.45); background: rgba(255,255,255,.12);
  color: #fff; border-radius: 8px; width: 30px; height: 28px; font-size: 15px; line-height: 1;
  display: inline-flex; align-items: center; justify-content: center; cursor: pointer; padding: 0; }
.fs-btn:active { background: rgba(255,255,255,.28); }
/* 「显示」按钮首次出现时的引导高亮：白圈脉冲，明确告诉用户"点这里" */
.ui-hint { animation: uiHint 1.1s ease-in-out 4; }
@keyframes uiHint {
  0%, 100% { box-shadow: 0 0 0 0 rgba(255,255,255,0); background: rgba(255,255,255,.12); }
  50% { box-shadow: 0 0 0 6px rgba(255,255,255,.35); background: rgba(255,255,255,.34); }
}
/* 「显示大小」按钮：文字按钮，宽度自适应、字加粗，一眼能看到、手指好点 */
.fs-btn.ui-size-btn { width: auto; min-width: 42px; padding: 0 8px; font-size: 13px; font-weight: 700;
  white-space: nowrap; }
/* 「退出」按钮：和显示大小一样是文字按钮，边框实一点，跟其它按钮区分开 */
.fs-btn.topbar-exit { width: auto; min-width: 40px; padding: 0 8px; font-size: 13px; font-weight: 600;
  white-space: nowrap; border-color: rgba(255,255,255,.65); }
/* 「横屏 / 竖屏」也是文字按钮（原来是 ⛶ 图标，看不出干什么），宽度必须自适应 */
.fs-btn.fs-btn-text { width: auto; min-width: 40px; padding: 0 7px; font-size: 12.5px; font-weight: 600;
  white-space: nowrap; }
/* 已经在横屏里：按钮反白，一眼知道"再点一下就转回来" */
.fs-btn.is-on { background: rgba(255,255,255,.92); color: var(--primary); border-color: #fff; }
.content { padding: 14px; padding-bottom: calc(70px + env(safe-area-inset-bottom)); }
.bottomnav { position: fixed; bottom: 0; left: 0; right: 0; z-index: 20;
  display: flex; background: #fff; border-top: 1px solid var(--line);
  padding-bottom: env(safe-area-inset-bottom); }
/* 底部导航：点开哪个菜单，那一项就用「绿色指示条 + 淡绿底 + 图标放大 + 文字加粗变绿」标出来，
   一眼就能看出「我现在正在哪个菜单里」（v1.23） */
.bottomnav a { position: relative; flex: 1; text-align: center; font-size: 11px; color: var(--text-2);
  padding: 7px 0 6px; text-decoration: none; cursor: pointer;
  transition: color .16s, background .16s; -webkit-tap-highlight-color: transparent; }
.bottomnav a span { display: block; font-size: 20px; margin-bottom: 1px;
  transition: transform .16s; }
.bottomnav a.active { color: var(--primary-dark); font-weight: 700;
  background: linear-gradient(180deg, #d9f0e6 0%, #f0faf6 100%); }
/* 顶部指示条：压在导航上边框位置，比整块变绿更醒目 */
.bottomnav a.active::before { content: ''; position: absolute; top: 0; left: 50%;
  transform: translateX(-50%); width: 34px; height: 4px; border-radius: 0 0 4px 4px;
  background: var(--primary); }
.bottomnav a.active span { transform: translateY(-1px) scale(1.12); }

/* PC 布局 */
@media (min-width: 769px) and (pointer: fine), (min-width: 769px) and (min-height: 521px) {
  .topbar, .topbar-info, .bottomnav { display: none; }
  .app { display: flex; align-items: flex-start; }
  .sidebar { display: flex; flex-direction: column; width: 220px; height: 100vh;
    background: #fff; border-right: 1px solid var(--line); position: sticky; top: 0;
    overflow-y: auto; flex: 0 0 220px; z-index: 15; }
  .side-logo { display: flex; align-items: center; gap: 8px; padding: 22px 20px 16px; }
  .side-logo .logo-word { font-size: 15px; }
  .sidebar nav { flex: 1; }
  .sidebar nav a { display: block; padding: 12px 20px; color: var(--text-2); font-size: 14px;
    border-left: 3px solid transparent; text-decoration: none; cursor: pointer; }
  .sidebar nav a:hover { background: var(--primary-light); color: var(--primary); }
  .sidebar nav a.active { background: var(--primary-light); color: var(--primary);
    border-left-color: var(--primary); font-weight: 600; }
  /* v1.68 侧栏分组：菜单多了（13 项）一长条看不清层次，给「采购业务」「财务」各加一条细分隔线。
     用伪元素铺满整行，不改 DOM 结构，权限隐藏某组时线跟着那一项一起消失 */
  .sidebar nav a.nav-sep { margin-top: 9px; }
  .sidebar nav a.nav-sep::before { content: ''; display: block; height: 1px;
    background: var(--line); margin: -9px -20px 9px; }
  .side-user { padding: 16px 20px; border-top: 1px solid var(--line); font-size: 13px; }
  .side-user-name { font-weight: 600; }
  .side-user-no { color: var(--text-2); margin: 2px 0 0; }
  .side-user-acc { color: var(--text-2); margin: 2px 0 8px; }   /* v1.50 用户编码/用户名行 */
  .side-logout { color: var(--red); font-size: 13px; }
  .content { flex: 1; padding: 22px; max-width: 1500px; min-width: 0; }
}

/* ---------------- 卡片与网格 ---------------- */
.grid { display: grid; gap: 12px; }
.grid-4 { grid-template-columns: repeat(2, 1fr); }
@media (min-width: 769px) and (pointer: fine), (min-width: 769px) and (min-height: 521px) { .grid-4 { grid-template-columns: repeat(4, 1fr); } }
.stat-card { background: var(--card); border-radius: var(--radius); padding: 14px 16px;
  border: 1px solid var(--line); }
.stat-card .label { color: var(--text-2); font-size: 12px; margin-bottom: 6px; }
.stat-card .value { font-size: 20px; font-weight: 700; }
.stat-card .value.amt { color: var(--primary); }
.stat-card .sub { font-size: 12px; color: var(--text-2); margin-top: 4px; }
/* v1.57b 老板看台：统计卡上方的小节标题（独立模块，普通用户需授权才可见） */
.boss-head { margin: 2px 0 8px; font-size: 13px; font-weight: 700; color: var(--text-2);
  display: flex; align-items: center; gap: 6px; }
.boss-head::before { content: ''; width: 4px; height: 13px; border-radius: 2px; background: var(--primary); }
.boss-head + .grid-4 { margin-top: 0; }

.panel { background: var(--card); border: 1px solid var(--line); border-radius: var(--radius);
  padding: 14px 16px; margin-bottom: 14px; }
.panel h3 { font-size: 15px; margin-bottom: 12px; }
.page-title { font-size: 18px; font-weight: 700; margin-bottom: 14px; }

/* ---------------- 筛选条 ---------------- */
.filter { display: flex; flex-wrap: wrap; gap: 8px; margin-bottom: 12px; }
.filter input, .filter select { padding: 8px 10px; border: 1px solid var(--line);
  border-radius: 8px; font-size: 13px; outline: none; background: #fff; }
.filter input[type=text] { flex: 1; min-width: 140px; }
/* v1.80 搜索框 + 📷 + 「模糊查」的分组容器：
   电脑端 display:contents —— 盒子本身不生成，三个控件照旧各自参与外层 flex 排布（视觉零变化）；
   手机端（补货页）才变成一行 flex，见下方 .rep-filter 规则。 */
.flt-kw { display: contents; }

/* ---------------- 表格 ---------------- */
.table-wrap { background: var(--card); border: 1px solid var(--line);
  border-radius: var(--radius); overflow-x: auto; }
table { width: 100%; border-collapse: collapse; font-size: 13px; min-width: 560px; }
th { background: #f8fafb; color: var(--text-2); font-weight: 600; text-align: left;
  padding: 10px 12px; white-space: nowrap; border-bottom: 1px solid var(--line); }
td { padding: 10px 12px; border-bottom: 1px solid #f0f2f5; white-space: nowrap; }
tr:last-child td { border-bottom: none; }
tbody tr:hover { background: #fafcfd; }
.num { text-align: right; font-variant-numeric: tabular-nums; }
th.num { text-align: right; }

/* 采购员管理 · 「商品编辑」列（v1.93e）
   以前把 9 项全名塞进 max-width:160px 的 11px 小字里 → 折成 3~4 行、
   行距紧、贴着单元格边，看着像一团重叠的文字。改成「徽章 + 分类计数」：
   徽章一行，下面按类别收拢（名称 · 价格 4 · 图片 2 · 资料 · 开关），
   每类做成小灰胶囊、行间距与项间距各 5px，明细走 title 悬停（点「编辑」也能逐项看） */
td.bi-perm { white-space: normal; }
/* 该列在 1360 宽下只有 142px，放不下 5 个带底色的胶囊（实测会折成 3 行、行高反涨）。
   改成单行小字 + 淡点分隔：10.5px / 600 字重，5 类合计约 105px，一行放得下 */
.bi-perm .bi-pcats {
  display: flex; flex-wrap: wrap; justify-content: center;
  margin-top: 5px; font-size: 10.5px; line-height: 1.5;
  font-weight: 600; letter-spacing: .1px; color: var(--text-2);
}
.bi-perm .bi-pcats span { white-space: nowrap; }
/* 项间用淡点分隔，不加就会读成「名称 价格 4 图片 2」一长串，数不清有哪几类 */
.bi-perm .bi-pcats span:not(:last-child)::after {
  content: '·'; margin: 0 3px; color: #c8ced6; font-weight: 400;
}

/* 手机端：缩小表格字号与内边距，配合 .table-wrap 横向滚动查看 */
@media (max-width: 768px), (orientation: landscape) and (max-height: 520px) and (pointer: coarse) {
  table { font-size: 12px; min-width: 500px; }
  th, td { padding: 8px 9px; }
  .page-title { font-size: 16px; }
  .panel { padding: 12px; }
  .filter input, .filter select { padding: 9px 10px; font-size: 14px; }
  /* 防止 iPhone 聚焦输入框时页面自动放大 */
  .pick-item input { font-size: 16px; }
}

/* 状态标签 */
.tag { display: inline-block; padding: 2px 10px; border-radius: 20px; font-size: 12px; }
.tag.ok { background: #e6f4ee; color: var(--primary); }
.tag.pending { background: #fdf1e3; color: var(--orange); }
.tag.ret { background: #fdecec; color: var(--red); }
.tag.pri { background: #eef2ff; color: #3b5bdb; }
/* v1.64 配送/单据三态：正在处理（蓝）、待发货（橙同 pending 色系但字面区分） */
.tag.proc { background: #e7f0fc; color: #1c7ed6; }
.tag.warn { background: #fff3e0; color: #d97706; }
/* v1.84 物流签收结果：三选一按钮（签收 / 拒收 / 异常）
   口径见 app.js 的 dlvFlow()：运送 → 完成 / 拒收 / 异常 */
.sign-pick { display: grid; grid-template-columns: repeat(3, 1fr); gap: 8px; }
.sign-opt { display: flex; flex-direction: column; align-items: center; gap: 1px;
  padding: 11px 4px 9px; border: 1px solid var(--line); border-radius: 10px;
  background: #fff; cursor: pointer; font-family: inherit; transition: .15s; }
.sign-opt i { font-style: normal; font-size: 19px; line-height: 1.15; }
.sign-opt b { font-size: 13px; color: var(--text); font-weight: 700; }
.sign-opt span { font-size: 11px; color: var(--text-2); }
.sign-opt:hover { border-color: #b9d8cb; }
.sign-opt.on { border-color: var(--primary); background: var(--primary-light); }
.sign-opt.on b { color: var(--primary-dark); }
.sign-opt.on[data-v="reject"] { border-color: var(--red); background: #fdecec; }
.sign-opt.on[data-v="reject"] b { color: var(--red); }
.sign-opt.on[data-v="abnormal"] { border-color: var(--orange); background: #fff3e0; }
.sign-opt.on[data-v="abnormal"] b { color: #b45309; }
/* 操作条上的物流状态胶囊：轻虚线下边，暗示「点得动」 */
.flow-tag { border-bottom: 1px dashed rgba(0, 0, 0, .18); }
/* v1.121 双签：弹窗顶部「货商 / 门店」两行对照（谁签了、什么时候签、还差谁） */
.sign-dual { margin-top: 10px; border: 1px solid var(--line); border-radius: 8px; overflow: hidden; }
.sign-dual .sd-row { display: flex; align-items: center; gap: 8px; padding: 7px 11px;
  font-size: 12.5px; background: #fff; }
.sign-dual .sd-row + .sd-row { border-top: 1px dashed var(--line); }
.sign-dual .sd-row b { flex: none; width: 34px; font-weight: 700; color: var(--text);
  background: var(--primary-light); border-radius: 5px; text-align: center; padding: 1px 0; font-size: 12px; }
.sign-dual .sd-row span { color: var(--text-2); }
/* v1.64 订单配送：物流时间轴 */
.dlv-sum { background: #f6f9f6; border: 1px solid var(--line); border-radius: 8px;
  padding: 8px 12px; font-size: 13px; display: flex; gap: 12px; flex-wrap: wrap; align-items: center; }
.dlv-sum .dlv-dim { color: var(--text-2); font-size: 12px; }
.dlv-tl { margin: 12px 0 4px; padding-left: 4px; max-height: 46vh; overflow: auto; }
.dlv-node { position: relative; padding: 0 0 16px 26px; }
.dlv-node::before { content: ''; position: absolute; left: 7px; top: 18px; bottom: -2px;
  width: 2px; background: var(--line); }
.dlv-node:last-child::before { display: none; }
.dlv-node .dot { position: absolute; left: 0; top: 3px; width: 14px; height: 14px;
  border-radius: 50%; background: #1c7ed6; border: 3px solid #e7f0fc; box-sizing: border-box; }
.dlv-node .dot.sys { background: #9aa7b5; border-color: #eef1f4; }
.dlv-node b { font-size: 13.5px; margin-right: 8px; }
.dlv-node .dlv-dim { font-size: 12px; color: var(--text-2); }
.dlv-node .dlv-det { font-size: 12.5px; color: var(--text-2); margin-top: 2px; white-space: pre-wrap; }
.dlv-add { border-top: 1px dashed var(--line); padding-top: 10px; margin-top: 6px;
  display: flex; gap: 6px; flex-wrap: wrap; align-items: center; }
.dlv-add input { flex: 1; min-width: 150px; padding: 6px 9px; }
/* v1.65 拍照留底：缩略图网格 + 放大查看 */
.dlv-pics { margin-top: 10px; }
.dlv-pics-head { display: flex; align-items: center; gap: 8px; margin-bottom: 8px; font-weight: 600; font-size: 13.5px; }
.dlv-pics-head label.btn { margin-left: auto; cursor: pointer; }
.dlv-pics-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(86px, 1fr)); gap: 8px; }
.dlv-ph { position: relative; aspect-ratio: 1; border-radius: 8px; overflow: hidden;
  background: #eef1f4; border: 1px solid var(--line); }
.dlv-ph img { width: 100%; height: 100%; object-fit: cover; display: block; cursor: zoom-in; }
.dlv-ph .del { position: absolute; top: 3px; right: 3px; width: 20px; height: 20px; border-radius: 50%;
  background: rgba(0,0,0,.55); color: #fff; font-size: 13px; line-height: 20px; text-align: center;
  cursor: pointer; font-style: normal; }
.dlv-ph .del:hover { background: #e03131; }
.dlv-big { margin-top: 8px; }
.dlv-big img { max-width: 100%; max-height: 60vh; border-radius: 8px; cursor: zoom-out; display: block; margin: 0 auto; }
/* v1.122 运费块：主行（谁承担 / 谁登记 / 何时）+ 展开的编辑行（付款方胶囊 + 金额 + 原因） */
.dlv-ft { gap: 10px; }
.dlv-ft b { font-size: 14px; }
.dlv-ft .btn { margin-left: auto; }
.dlv-ft-edit { display: flex; gap: 8px; flex-wrap: wrap; align-items: center;
  background: #fbfcfb; border: 1px solid var(--line); border-radius: 8px;
  padding: 8px 12px; margin-top: 6px; }
.dlv-ft-edit input { flex: 1 1 130px; min-width: 104px; }
.ft-payers { display: flex; gap: 6px; }
.ft-pay { font-size: 12px; padding: 4px 10px; border-radius: 999px; cursor: pointer;
  border: 1px solid var(--line); background: #fff; color: var(--text-2); user-select: none; white-space: nowrap; }
.ft-pay.on { background: var(--primary); border-color: var(--primary); color: #fff; font-weight: 600; }
/* 发货弹窗里「运费金额 + 付款方」同一行 */
.ft-row { display: flex; gap: 8px; }
.ft-row input { flex: 1; }
.ft-row select { width: 110px; flex: 0 0 110px; }

/* v1.142 运费「暂不登记」默认项：胶囊组允许换行（变成 4 个），提示文字独占一行 */
.ft-payers { flex-wrap: wrap; }
.ft-none-tip { flex: 1 1 100%; font-size: 12px; color: #9a6b33; line-height: 1.45;
  background: #fdf6ea; border: 1px dashed #f0d3a8; border-radius: 6px; padding: 5px 8px; }
.field .ft-none-tip { margin-top: 6px; }

/* 运费凭证角标（与现场照区分开，一眼看出这张是运费单） */
.dlv-ph.ph-freight { border-color: #e8a33d; }
.dlv-ph .ph-tag { position: absolute; left: 3px; bottom: 3px; font-size: 11px; font-weight: 600;
  background: rgba(232, 163, 61, .93); color: #fff; padding: 1px 6px; border-radius: 6px; }
/* v1.66a 配送总览：单号可点击预览明细；统计卡可点击筛选 */
.a-no { color: var(--primary); cursor: pointer; text-decoration: none; }
.a-no:hover { text-decoration: underline; }
/* v1.68 配送总览统计卡：真正的卡片。
   坑：v1.66a 给这几张卡套了 .tbox —— 那是「表格滚动容器」（min-height:180px + overflow），
   结果卡片被撑成 180px 高的大白框、边框背景全被吃掉，手机上白占一屏。这里彻底分开。 */
.da-stats { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 10px; margin-bottom: 12px; }
/* v1.124 配送总览/订单配送：卡数变 7 张（6 张单据卡 + 1 张运费报表入口），要一行放下，
   所以单独给 .cols7 七等分。顺带把内边距/图标/字号收一点，否则 190px 一格里标题会顶到省略号。
   注意：下面 @media 里已经补了 .da-stats.cols7 的 2 列回落——多类选择器优先级比单类高，不补会 7 列挤在手机上。 */
.da-stats.cols7 { grid-template-columns: repeat(7, minmax(0, 1fr)); gap: 8px; }
.da-stats.cols7 .da-stat { grid-template-columns: 26px minmax(0, 1fr); column-gap: 7px; padding: 10px 10px 9px 12px; }
.da-stats.cols7 .da-ico { width: 26px; height: 26px; font-size: 14px; border-radius: 8px; }
.da-stats.cols7 .da-k { font-size: 12px; }
.da-stats.cols7 .da-v { font-size: 19px; }
.da-stats.cols7 .da-h { font-size: 11px; margin-top: 5px; padding-top: 5px; }
/* 运费报表那张是「入口」不是「数量」：数字位放「打开 ›」，图标淡蓝区分 */
.da-stat.da-entry .da-ico { background: #e8f2ff; }
.da-open { font-size: 16px; font-weight: 600; color: var(--primary); letter-spacing: .3px; }
.da-stat.da-entry:hover .da-open { text-decoration: underline; }
.da-stat { position: relative; display: grid; grid-template-columns: 30px minmax(0, 1fr);
  align-items: center; column-gap: 9px; row-gap: 1px; padding: 12px 13px 11px 15px;
  background: #fff; border: 1px solid var(--line); border-radius: var(--radius); cursor: pointer;
  -webkit-tap-highlight-color: transparent;
  transition: border-color .16s, box-shadow .16s, background .16s, transform .16s; }
/* v1.70e 悬停动作加大：明显向上跳出（比普通卡片浮起高很多，鼠标划过一眼可辨） */
.da-stat:hover { border-color: #9fd6c1; box-shadow: 0 12px 22px rgba(20, 102, 74, .18); transform: translateY(-6px); }
.da-stat:active { transform: translateY(-2px); }
/* 左侧竖条：平时透明，选中才亮（不占位，切换时不跳动） */
.da-stat::before { content: ''; position: absolute; left: 0; top: 10px; bottom: 10px; width: 3px;
  border-radius: 0 3px 3px 0; background: transparent; transition: background .16s; }
.da-ico { grid-row: 1 / span 2; width: 30px; height: 30px; border-radius: 9px; background: #f1f5f4;
  display: flex; align-items: center; justify-content: center; font-size: 15px; }
.da-k { font-size: 12.5px; color: var(--text-2); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.da-v { font-size: 21px; font-weight: 700; line-height: 1.15; font-variant-numeric: tabular-nums; }
.da-v i { font-style: normal; font-size: 11.5px; font-weight: 500; color: var(--text-2); margin-left: 3px; }
.da-h { grid-column: 1 / -1; margin-top: 7px; padding-top: 6px; border-top: 1px dashed var(--line);
  font-size: 11.5px; color: var(--text-2); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.da-ck { position: absolute; top: 8px; right: 9px; width: 15px; height: 15px; border-radius: 50%;
  background: var(--primary); color: #fff; font-size: 10px; font-style: normal; line-height: 15px;
  text-align: center; transform: scale(0); transition: transform .16s; }
/* 选中态：绿边框 + 淡绿渐变 + 左侧竖条 + 数字变绿 + 右上角 ✓ —— 一眼看出「列表现在筛的是哪一类」 */
.da-stat.on { border-color: #9fd6c1; background: linear-gradient(180deg, #f1fbf6 0%, #fff 78%);
  box-shadow: 0 4px 14px rgba(26,127,90,.10); }
.da-stat.on::before { background: var(--primary); }
.da-stat.on .da-ico { background: #d8efe4; }
.da-stat.on .da-k { color: var(--primary-dark); font-weight: 600; }
.da-stat.on .da-v { color: var(--primary-dark); }
.da-stat.on .da-ck { transform: scale(1); }
/* 待办类（待门店发货 / 在途）有单时数字转橙，提示还有活没干 */
.da-stat.warn .da-v { color: var(--orange); }
.da-stat.warn.on .da-v { color: var(--primary-dark); }
/* v1.68 配送总览列表：定宽 + 省略号，物流与时间各占一格两行（11 列压到 9 列），
   这样 1280 宽下「操作」列不会被切到屏幕外 */
.dla-tbl { width: 100%; table-layout: fixed; }
.dla-tbl th, .dla-tbl td { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.dla-tbl td:last-child { white-space: normal; overflow: visible; }   /* 操作列两个标签要能并排 */
.dla-tbl .tag { padding: 2px 8px; }   /* 定宽列里标签收窄 4px，避免刚好被省略号截掉 */
.dla-tbl .dlv-cell { font-size: 12.5px; }
.dlv-cell em { display: block; font-style: normal; font-size: 11.5px; color: var(--text-2);
  overflow: hidden; text-overflow: ellipsis; }
/* 中间宽度（平板 / 小笔记本）7 列放不下，回落 4 列；PC 大屏（>1180）才走一行 7 格 */
@media (min-width: 769px) and (max-width: 1180px) {
  .da-stats.cols7 { grid-template-columns: repeat(4, minmax(0, 1fr)); }
}
@media (max-width: 768px), (orientation: landscape) and (max-height: 520px) and (pointer: coarse) {
  .da-stats, .da-stats.cols7 { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 8px; }
  .da-stats.cols7 .da-stat { grid-template-columns: 26px minmax(0, 1fr); padding: 10px 11px 10px 13px; }
  .da-stat { padding: 10px 11px 10px 14px; }
  .da-stats.cols7 .da-v, .da-v { font-size: 19px; }
  .da-h { display: none; }   /* 手机上省掉说明行，2×2 一屏放得下 */
}
/* v1.57 「管理员」徽章（账号列表/侧栏面板/手机信息条通用） */
.tag.roleadm { background: #fff3d6; color: #a8770a; border: 1px solid #f0dca4; font-weight: 600; }
/* v1.57 用户管理菜单：只对供应商机构管理员显示 */
body.supadmin .nav-sua { display: block !important; }
body.supadmin .bottomnav .nav-sua { display: flex !important; }
/* v1.57 权限弹窗 + 用户管理页 */
.perm-role { margin-bottom: 10px; display: flex; flex-direction: column; gap: 6px; }
.perm-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(120px, 1fr)); gap: 6px 10px;
  border: 1px solid var(--line); border-radius: 8px; padding: 10px; }
.perm-item { display: flex; align-items: center; gap: 6px; font-size: 13px; cursor: pointer; }
.perm-item input { width: auto !important; }
.perm-note { font-size: 12px; color: var(--text-2); margin: 8px 0 0; }
/* v1.62 权限弹窗左右选项卡：用户权限 / 品类权限 */
.perm-tabs { display: flex; gap: 6px; border-bottom: 1px solid var(--line); margin-bottom: 12px; }
.perm-tab { padding: 7px 16px 8px; font-size: 13.5px; font-weight: 600; color: var(--text-2);
  cursor: pointer; border-bottom: 2px solid transparent; user-select: none; }
.perm-tab:hover { color: var(--primary-dark); }
.perm-tab.on { color: var(--primary-dark); border-bottom-color: var(--primary); }
/* 品类权限里的复制条 */
.perm-copy { display: flex; align-items: center; gap: 8px; margin: 10px 0; flex-wrap: wrap; }
.perm-copy .pc-lab { font-size: 13px; color: var(--text); }
.perm-copy select { max-width: 260px; padding: 5px 8px; }
.perm-copy .pc-sep { width: 1px; height: 20px; background: var(--line); margin: 0 2px; }
.users-add { max-width: 420px; }
.pg-sub { font-size: 12.5px; color: var(--text-2); font-weight: 400; margin-left: 8px; }
.tag { cursor: pointer; }

/* 分页 */
/* 分页条：字号与按钮放大，方便点击与阅读 */
.pager { display: flex; align-items: center; justify-content: flex-end; gap: 12px;
  margin-top: 12px; font-size: 15px; color: var(--text-2); }
.pager span { font-size: 15px; color: var(--text); }
.pager .btn { min-height: 36px; padding: 8px 18px; font-size: 15px; }

/* ---------------- 补货下单 ---------------- */
.pick-item { display: flex; align-items: center; gap: 10px; padding: 10px 2px;
  border-bottom: 1px solid #f0f2f5; }
.pick-item .info { flex: 1; min-width: 0; }
.pick-item .name { font-weight: 600; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.pick-item .meta { font-size: 12px; color: var(--text-2); margin-top: 2px; }
.pick-item input { width: 86px; padding: 7px; border: 1px solid var(--line);
  border-radius: 6px; text-align: right; font-size: 14px; }
.cart-bar { position: sticky; bottom: 0; background: #fff; border-top: 1px solid var(--line);
  padding: 10px 14px; display: flex; align-items: center; gap: 12px; z-index: 10;
  margin: 0 -16px -14px; border-radius: 0 0 var(--radius) var(--radius); }
@media (min-width: 769px) and (pointer: fine), (min-width: 769px) and (min-height: 521px) { .cart-bar { margin: 0 -16px -14px; } }
.cart-bar .sum { flex: 1; font-size: 13px; color: var(--text-2); }
.cart-bar .sum b { color: var(--primary); font-size: 17px; }

/* ---------------- 补货下单（表格 + 右侧步骤/清单） ---------------- */
.rep-filter { position: sticky; top: 0; z-index: 12; margin-bottom: 12px; }

.rep-grid { display: grid; grid-template-columns: minmax(0, 1fr) 340px; gap: 14px; align-items: start; }
@media (max-width: 1180px) { .rep-grid { grid-template-columns: minmax(0, 1fr); } }

/* 明细表格：表头冻结 + 独立滚动 */
.rep-table-wrap { max-height: calc(100vh - 285px); overflow: auto; }
/* 手机端补货明细：卡片式列表（一列一卡，不用左右拖动） */
.rep-cards { display: flex; flex-direction: column; gap: 8px; padding: 8px 8px 2px; }
.rep-card { background: #fff; border: 1px solid var(--line); border-radius: 10px;
  padding: 10px 12px 11px; }
.rep-card.row-in-cart { border-color: #8ecfb4; background: #f5fdf9;
  box-shadow: inset 3px 0 0 var(--primary); }
.rc-head { display: flex; align-items: center; gap: 7px; }
.rc-no { flex: 0 0 auto; min-width: 20px; height: 20px; padding: 0 5px;
  border-radius: 10px; background: #eef3f7; color: var(--text-2);
  font-size: 11px; display: inline-flex; align-items: center; justify-content: center; }
.rc-name { flex: 1; min-width: 0; font-size: 14.5px; font-weight: 600;
  overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.rc-meta { display: flex; flex-wrap: wrap; align-items: center; gap: 5px;
  font-size: 12px; color: var(--text-2); margin: 6px 0 9px; }
.rc-itemno { font-family: Consolas, monospace; color: #8a94a0; }
.rc-dot { font-style: normal; color: #c6cdd5; }
.rc-stock { color: var(--primary); font-weight: 600; }
.rc-stock.rc-zero { color: var(--red); }
.rc-amt { margin-left: auto; flex: 0 0 auto; color: var(--red); font-weight: 700; font-size: 13.5px; }
.rc-act { display: flex; align-items: center; gap: 8px; }
.rc-label { font-size: 12px; color: var(--text-2); flex: 0 0 auto; }
.rc-act .qty-step { flex: 0 0 auto; }
/* 卡片里的数量框必须有固定宽度，否则原生 number 输入框会撑到 150px 把加入按钮挤出屏幕 */
.rc-act .qty-input { width: 54px; height: 34px; font-size: 15px; border-radius: 0;
  border: 1px solid var(--line); background: #fff; font-weight: 600; padding: 0 2px;
  border-left: none; border-right: none; text-align: center; }
.rc-act .qty-input:focus { border-color: var(--primary); outline: none; }
.rc-act .qty-step .qs-btn { width: 36px; height: 34px; font-size: 21px; }
.rc-act .c-act { margin-left: auto; flex: 0 0 auto; }
.rc-act .c-act .btn { padding: 9px 14px; font-size: 13.5px; border-radius: 8px; }
.rep-cards-foot { text-align: center; font-size: 12px; color: var(--text-2); padding: 10px 0 4px; }
.m-toolbar { display: none; }   /* 仅手机端显示（见下方媒体查询） */
.m-fold-btn { display: none; }  /* 手机端"筛选 ▾"折叠按钮，PC 不显示 */
/* 手机端：筛选区紧凑化，把屏幕让给商品卡片（提示行在手机上没有"回车跳行"场景，隐藏） */
@media (max-width: 768px), (orientation: landscape) and (max-height: 520px) and (pointer: coarse) {
  /* 顶栏收紧：腾出地方放「显示大小 / 全屏 / 退出」三个按钮（padding 9+9 + 按钮 28 = 46px 高，
     正好等于下面 .m-head 的 top，冻结区不会盖住顶栏也不会留缝） */
  .topbar { padding: 9px 10px; gap: 6px; }
  .topbar-title { font-size: 15px; }
  .topbar-right { gap: 5px; }
  .topbar-user { font-size: 12px; max-width: 68px; }
  .fs-btn { height: 28px; }
  .fs-btn.ui-size-btn { min-width: 40px; padding: 0 7px; font-size: 12.5px; }
  .fs-btn.topbar-exit { min-width: 38px; padding: 0 7px; font-size: 12.5px; }
  .fs-btn.fs-btn-text { min-width: 38px; padding: 0 6px; font-size: 12.5px; }

  .rep-filter { padding: 10px 12px; }
  .rep-filter input, .rep-filter select { font-size: 13px; padding: 8px 10px; }
  .rep-filter .filter { gap: 8px; }
  .mode-tip { display: none; }
  .page-title { font-size: 16px; }

  /* 顶部整块（标题+模式+步骤/清单+筛选）永久冻结：滚动商品卡片时操作区始终在眼前 */
  .m-head { position: sticky; top: var(--toph, 46px); z-index: 13; background: var(--bg);
    margin: -14px -14px 10px; padding: 14px 14px 10px;
    box-shadow: 0 4px 10px rgba(0, 0, 0, .05); }
  .m-head .rep-filter { position: static; margin-bottom: 0; }
  .m-toolbar { position: static; margin-bottom: 8px; }

  /* 「筛选 ▾」：一键收起筛选区，屏幕全留给商品卡片（默认展开，选择会记住） */
  .m-fold-btn { display: inline-flex; align-items: center; gap: 3px; margin-left: auto;
    border: 1px solid var(--line); background: #fff; color: var(--text-2);
    border-radius: 999px; padding: 5px 11px; font-size: 12.5px; cursor: pointer; }
  .m-head .rep-filter { max-height: 460px; overflow: hidden;
    transition: max-height .22s ease, opacity .18s ease, padding .22s ease; }
  .m-head.folded .rep-filter { max-height: 0; opacity: 0; padding-top: 0; padding-bottom: 0; border-width: 0; }

  /* 顶部工具条：三步提示（自动换行不截断）+ 醒目清单按钮 */
  .m-toolbar { display: flex; align-items: center; gap: 10px;
    background: linear-gradient(180deg, #fffdf8 0%, #fff6ea 100%);
    border: 1px solid #f5d7b0; border-radius: 10px; padding: 7px 10px;
    box-shadow: 0 2px 8px rgba(232, 132, 44, .10); }
  .m-steps { flex: 1; min-width: 0; font-size: 11px; line-height: 1.5; color: #9a6b33;
    white-space: normal; word-break: break-word; }
  .m-steps i { font-style: normal; color: #dcbf9b; margin: 0 2px; }
  .m-cart-btn { flex: 0 0 auto; border: none; border-radius: 999px; padding: 9px 14px;
    background: var(--primary); color: #fff; font-size: 13.5px; font-weight: 700;
    display: inline-flex; align-items: center; gap: 4px; cursor: pointer;
    box-shadow: 0 2px 8px rgba(26, 127, 90, .28); white-space: nowrap; }
  .m-cart-btn b { font-size: 15px; line-height: 1; }
  .m-cart-btn.has { background: var(--orange); box-shadow: 0 2px 10px rgba(232, 132, 44, .42); }

  /* 手机端不再显示右侧侧栏（三步走大卡片 + 常驻购物车），改由顶部按钮弹出 */
  .rep-rail { display: none !important; }
  #rpMemo { display: none; }                 /* 备注移到清单弹窗里填 */

  /* 筛选区重排成 3 行（v1.80：搜索框 / 📷 / 模糊查 必须同一行，之前用双列网格
     又没给这两个小控件排顺序，它们被挤到了第一行最前面，跟搜索框隔着一整行）：
       ① 搜索框 + 📷 + 模糊查    ② 搜索 + 品类
       ③ 每页条数 + 本页全部加入 + 一键复购 */
  /* v1.81 「收货分店」中文标签手机上保留（原来这行把它藏了，用户反馈分店下拉前没有中文） */
  .rep-filter > div:first-child > span { flex: 0 0 auto; white-space: nowrap; }
  #rpBranch { flex: 1; max-width: none; }
  .rep-filter .filter { display: flex; flex-wrap: wrap; gap: 8px; }
  .rep-filter .filter > .flt-kw { order: 1; flex: 1 1 100%; display: flex; gap: 6px; align-items: center; min-width: 0; }
  .rep-filter .filter > .flt-kw > .kw-capsule { flex: 1 1 auto; min-width: 0; width: auto; }
  /* 第 2 行：搜索（按文字宽，不被压扁）+ 品类（吃剩余）+ 每页条数（定宽）
     全都用 flex:1 会把「搜索」压成「搜」、把品类卡片压成一个小箭头 */
  .rep-filter .filter > #rpSearchBtn { order: 2; flex: 0 0 auto; min-width: 0; padding: 9px 14px; }
  .rep-filter .filter > #rpCls { order: 3; flex: 1 1 auto; min-width: 0; }
  .rep-filter .filter > #rpSize { order: 4; flex: 0 0 100px; min-width: 0; }
  /* 第 3 行：两个操作按钮各占一半，放不下就各占一整行 */
  .rep-filter .filter > #rpAddPageBtn { order: 5; flex: 1 1 44%; min-width: 0; }
  .rep-filter .filter > #rpBuyAgainBtn { order: 6; flex: 1 1 44%; min-width: 0; }
  .rep-filter .filter > button { font-size: 12.5px; padding: 9px 8px; white-space: nowrap;
    overflow: hidden; text-overflow: ellipsis; }
}
/* 手机端清单弹窗样式 */
.cs-list { max-height: 46vh; overflow-y: auto; margin: -4px 0 0; }
.cs-item { display: flex; align-items: center; gap: 8px; padding: 9px 0;
  border-bottom: 1px dashed #eef1f4; }
.cs-info { flex: 1; min-width: 0; }
.cs-name { font-size: 13.5px; font-weight: 600; overflow: hidden;
  text-overflow: ellipsis; white-space: nowrap; }
.cs-meta { font-size: 11.5px; color: var(--text-2); margin-top: 2px; }
.cs-amt { min-width: 66px; text-align: right; font-size: 13px; font-weight: 700; color: var(--red); }
.cs-memo { margin-top: 12px; }
.cs-memo input { width: 100%; padding: 10px 12px; border: 1px solid var(--line);
  border-radius: 8px; font-size: 14px; outline: none; }
.cs-memo input:focus { border-color: var(--primary); }
.cs-foot { display: flex; align-items: center; gap: 10px; flex-wrap: wrap; margin-top: 14px; }
.cs-total { font-size: 14px; color: var(--text-2); }
.cs-total b { font-size: 19px; color: var(--red); margin: 0 4px; }
.cs-total span { font-size: 12px; }
.cs-btns { margin-left: auto; display: flex; gap: 8px; }
.rep-table { min-width: 720px; font-size: 13px; }
.rep-table thead th { position: sticky; top: 0; z-index: 3; background: #f4f7f9;
  box-shadow: inset 0 -1px 0 var(--line); white-space: nowrap; }
.rep-table td { padding: 7px 10px; }
.rep-table th { padding: 9px 10px; }
.rep-table .c-no { width: 52px; text-align: center; color: var(--text-2);
  font-variant-numeric: tabular-nums; position: sticky; left: 0; background: #fff; z-index: 2;
  box-shadow: 1px 0 0 #f0f2f5; }
.rep-table thead th.c-no { background: #f4f7f9; z-index: 5; }
.rep-table tr.row-in-cart td.c-no { background: #f2fbf7; }
.rep-table .c-key { font-weight: 600; }
.rep-table .c-name { min-width: 190px; white-space: normal; }
.rep-table .c-act { width: 108px; text-align: center; }

/* ============ 列表页通用「行号」窄列（库存 / 销售，v1.30）============
   与补货页同款：窄列、居中、灰字、等宽数字，不占地方；
   第 2 页从 51 起连续编号，方便电话里报"第几行"核对。 */
.tbox table .c-no { width: 46px; min-width: 46px; text-align: center; color: var(--text-2);
  font-size: 12px; font-variant-numeric: tabular-nums; background: #fbfcfd; }
.tbox table thead th.c-no { background: #f4f7f9; font-weight: 600; }
/* 手机紧凑表：行号缩成货号前面的一枚灰色小号牌，几乎不占宽度 */
.tbl-cmp .rn { display: inline-block; min-width: 16px; margin-right: 4px; padding: 0 3px;
  border-radius: 4px; background: #eef2f4; color: var(--text-2);
  font-size: 10px; font-style: normal; font-weight: 600; line-height: 15px;
  text-align: center; vertical-align: 1px; font-variant-numeric: tabular-nums; }
.rep-table tr.row-in-cart td { background: #f2fbf7; }
.rep-table .qty-input { width: 60px; height: 32px; padding: 0 4px; border: 1px solid var(--line);
  border-radius: 0; border-left: none; border-right: none; text-align: center; font-size: 15px;
  font-weight: 600; background: #fff; }
.rep-table .qty-input:focus { border-color: var(--primary); outline: none; }

/* 大号加减按钮：替代原生数字框里过小的上下三角 */
.qty-step { display: inline-flex; align-items: stretch; vertical-align: middle; }
.qty-step .qs-btn { width: 32px; height: 32px; border: 1px solid var(--line); background: #f7f9fa;
  color: #2b3138; font-size: 20px; font-weight: 700; line-height: 1; cursor: pointer; padding: 0;
  display: inline-flex; align-items: center; justify-content: center; user-select: none;
  transition: background .12s, color .12s; }
.qty-step .qs-btn:first-child { border-radius: 7px 0 0 7px; }
.qty-step .qs-btn:last-child { border-radius: 0 7px 7px 0; }
.qty-step .qs-btn:hover { background: var(--primary-light); color: var(--primary); border-color: #bfe3d3; }
.qty-step .qs-btn:active { background: var(--primary); color: #fff; }
/* 隐藏原生数字框的上下三角（太小且无法放大） */
.qty-input::-webkit-outer-spin-button,
.qty-input::-webkit-inner-spin-button,
.ci-qty::-webkit-outer-spin-button,
.ci-qty::-webkit-inner-spin-button { -webkit-appearance: none; margin: 0; }
.qty-input, .ci-qty { -moz-appearance: textfield; appearance: textfield; }

/* 预览清单里的小号版本 */
.qty-step-sm .qs-btn { width: 26px; height: 28px; font-size: 17px; }
.qty-step-sm .ci-qty { width: 44px; height: 28px; border-radius: 0; border-left: none;
  border-right: none; text-align: center; font-size: 13px; }

/* 手机端：点按区域再放大一点 */
@media (max-width: 768px), (orientation: landscape) and (max-height: 520px) and (pointer: coarse) {
  .qty-step .qs-btn { width: 36px; height: 34px; font-size: 21px; }
  .rep-table .qty-input { height: 34px; width: 62px; font-size: 15px; }
  .qty-step-sm .qs-btn { width: 32px; height: 32px; font-size: 19px; }
  .qty-step-sm .ci-qty { height: 32px; width: 50px; }
}
.rep-tip { font-size: 12px; color: var(--text-2); margin-top: 8px; }

.btn-mini { padding: 4px 9px; font-size: 12px; border-radius: 6px; }
.btn-ok { background: #e6f4ee; color: var(--primary); border: 1px solid #bfe3d3; }

/* 右侧栏：步骤指引 + 预览清单（跟随滚动） */
.rep-rail { position: sticky; top: 12px; display: flex; flex-direction: column; gap: 8px; }  /* v1.141 卡间距 12→8，竖向空间多留给清单 */
@media (max-width: 1180px) { .rep-rail { position: static; } }

/* v1.141 PC 端把这张提示卡压扁：原来 3 条各占两行、吃掉右侧近 1/3 竖向空间，
   导致下方「全预览清单」只能看两三条；文案已缩短，此处同步收紧内边距/字号/编号圈 */
.step-card { border-radius: 8px; padding: 8px 11px;
  background: linear-gradient(135deg, #fff6e8 0%, #ffe9cc 100%);
  border: 1px solid #f5c98d; box-shadow: 0 1px 4px rgba(232, 131, 58, .06); }
.step-title { font-size: 12px; font-weight: 700; color: #a4551a; margin-bottom: 5px; }
.steps { list-style: none; margin: 0; padding: 0; }
.steps li { display: flex; gap: 6px; align-items: flex-start; margin: 3px 0;
  font-size: 11.5px; line-height: 1.4; color: #7a4a10; }
.steps li b { color: #c2580c; }
.step-no { flex: 0 0 15px; width: 15px; height: 15px; border-radius: 50%; background: #e8833a;
  color: #fff; font-size: 10px; font-weight: 700; font-style: normal;
  display: inline-flex; align-items: center; justify-content: center; margin-top: 1px; }

.cart-card { background: var(--card); border: 1px solid var(--line); border-radius: 10px;
  display: flex; flex-direction: column; max-height: calc(100vh - 330px); }
.cart-head { display: flex; align-items: center; gap: 4px; padding: 9px 12px 9px 14px;
  border-bottom: 1px solid var(--line); font-size: 14px; font-weight: 700; }
.cart-head span { color: var(--primary); }
/* v1.143 「清空」原来是右边一行刺眼红字（和大标题同排、像报错）：改成轻量胶囊，
   平时浅灰不抢眼，悬停才转红；清单为空时淡出且不可点（没东西可清） */
.cart-clear { margin-left: auto; flex: 0 0 auto; display: inline-flex; align-items: center;
  padding: 4px 10px; border-radius: 999px; border: 1px solid #e2e8ef; background: #f4f7fa;
  font-size: 12px; font-weight: 500; line-height: 1.2; color: #5b6775; cursor: pointer;
  white-space: nowrap; user-select: none;
  transition: color .18s, background .18s, border-color .18s, box-shadow .18s, opacity .18s; }
.cart-clear:hover { color: var(--red); border-color: #f2c9c9; background: #fef5f5; box-shadow: 0 1px 4px rgba(214, 72, 72, .12); }
.cart-clear:active { transform: scale(.96); }
.cart-clear.off { opacity: 0; pointer-events: none; }
.cart-body { flex: 1; overflow-y: auto; padding: 6px 0; min-height: 90px; }
/* 预览清单空状态：醒目引导卡片（原来只有一行灰小字，用户看不清下一步做什么） */
.cart-body.is-empty { display: flex; }        /* 空间大时让引导卡片垂直居中 */
.cart-empty { text-align: center; padding: 14px 10px 15px; margin: auto; width: calc(100% - 16px);
  line-height: 1.6; border: 1px dashed #f0c48e; border-radius: 10px;
  background: linear-gradient(180deg, #fffdf8 0%, #fff6ea 100%); }
.ce-icon { font-size: 26px; line-height: 1; margin-bottom: 4px; }
.ce-title { font-size: 15px; font-weight: 700; color: #b45309; letter-spacing: .5px; }
.ce-flow { display: flex; flex-direction: column; align-items: center; gap: 4px;
  margin-top: 9px; }
.ce-step { display: inline-flex; align-items: center; gap: 6px; background: #fff;
  border: 1px solid #f3c78e; border-radius: 999px; padding: 5px 13px 5px 5px;
  font-size: 13px; color: #7c4a10; font-weight: 600;
  box-shadow: 0 1px 3px rgba(232, 132, 44, .18); }
.ce-step i { display: inline-flex; align-items: center; justify-content: center;
  width: 18px; height: 18px; border-radius: 50%; background: var(--orange);
  color: #fff; font-style: normal; font-size: 11px; font-weight: 700; }
.ce-step em { font-style: normal; color: var(--red); font-weight: 700; }
.ce-arrow { color: var(--orange); font-size: 13px; line-height: 1; transform: rotate(90deg); }
.ce-foot { margin-top: 9px; font-size: 11.5px; color: #a1733c; }
.cart-item { display: flex; align-items: center; gap: 8px; padding: 7px 12px;
  border-bottom: 1px dashed #f0f2f5; }
.cart-item:last-child { border-bottom: none; }
.ci-info { flex: 1; min-width: 0; }
.ci-name { font-size: 13px; font-weight: 600; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.ci-meta { font-size: 11px; color: var(--text-2); margin-top: 2px; }
.ci-qty { width: 58px; padding: 4px 6px; border: 1px solid var(--line); border-radius: 6px;
  text-align: right; font-size: 13px; }
.ci-amt { width: 66px; text-align: right; font-size: 13px; font-variant-numeric: tabular-nums; }
.ci-del { color: #c0c7cf; cursor: pointer; font-size: 13px; padding: 0 2px; }
.ci-del:hover { color: var(--red); }
.cart-foot { border-top: 1px solid var(--line); padding: 10px 12px; display: flex;
  align-items: center; gap: 10px; }
.cart-foot .sum { flex: 1; font-size: 13px; color: var(--text-2); }
.cart-foot .sum b { color: var(--primary); font-size: 17px; }

/* 明细模式 / 标准模式切换（仿原系统顶部按钮） */
.mode-switch { display: inline-flex; border: 1px solid var(--line); border-radius: 8px;
  overflow: hidden; background: #fff; }
.ms-btn { border: 0; background: #fff; padding: 6px 16px; font-size: 13px; cursor: pointer;
  color: var(--text-2); font-family: inherit; }
.ms-btn + .ms-btn { border-left: 1px solid var(--line); }
.ms-btn:hover { background: #f4f8fb; }
.ms-btn.active { background: var(--primary); color: #fff; font-weight: 600; }
.mode-tip { font-size: 12px; color: var(--text-2); }
.mode-tip b { color: var(--primary); }

/* 标准模式表格：列固定、数量点开矩阵、底部合计 */
.std-table th, .std-table td { white-space: nowrap; }
.std-table .c-code { font-weight: 600; }
.std-qty-cell { padding: 4px 6px !important; }
.std-qty { display: inline-block; min-width: 74px; padding: 4px 10px; border: 1px dashed #b9c7d4;
  border-radius: 6px; color: #8b9aa8; text-decoration: none; cursor: pointer;
  font-variant-numeric: tabular-nums; }
.std-qty:hover { border-color: var(--primary); color: var(--primary); background: #f2f8ff; }
.std-qty.has { border-style: solid; border-color: var(--primary); color: var(--primary);
  font-weight: 700; background: #eaf4ff; }
.std-table tfoot td { background: #f6f9fc; font-weight: 600; }
.std-sum-label { text-align: right; color: var(--text-2); }

/* 花色尺码数量弹窗 */
.spec-top { display: flex; align-items: center; gap: 12px; flex-wrap: wrap; margin-bottom: 10px; }
.spec-by { padding: 6px 10px; border: 1px solid var(--line); border-radius: 8px; font-size: 13px; }
.spec-batch { display: flex; align-items: center; gap: 8px; font-size: 13px; color: var(--text-2);
  margin-left: auto; flex-wrap: wrap; }
.spec-batch label { display: inline-flex; align-items: center; gap: 4px; cursor: pointer; }
.spec-batch-input { width: 80px; padding: 5px 8px; border: 1px solid var(--line); border-radius: 6px;
  font-size: 13px; }
.spec-wrap { border: 1px solid var(--line); border-radius: 8px; overflow: auto; max-height: 36vh; }
.spec-table { width: 100%; min-width: 0; font-size: 13px; }
.spec-table th, .spec-table td { border: 1px solid var(--line); padding: 3px 6px; text-align: center; }
.spec-table thead th { background: #f4f7f9; position: sticky; top: 0; z-index: 2; }
.spec-corner { text-align: left; color: var(--text-2); white-space: nowrap; }
.spec-rowhead { background: #f9fbfd; font-weight: 600; text-align: left; white-space: nowrap; }
.spec-cell { padding: 2px !important; }
.spec-cell.sel { background: #eaf4ff; }
.spec-input { width: 74px; padding: 5px 6px; border: 1px solid transparent; border-radius: 6px;
  text-align: center; font-size: 13px; font-family: inherit; }
.spec-input:focus { border-color: var(--primary); outline: none; background: #f2f8ff; }
.spec-total { background: #f6f9fc; font-weight: 700; color: var(--primary); }
.spec-sub { margin-top: 12px; }
.spec-sub-title { font-size: 13px; font-weight: 600; margin-bottom: 6px; color: var(--text-2); }
.spec-sub-table { width: 100%; min-width: 0; font-size: 12.5px; }
.spec-sub-table th { background: #f4f7f9; }
.spec-foot { display: flex; align-items: center; gap: 10px; margin-top: 14px; }
.spec-sum { font-size: 13px; color: var(--text-2); }
.spec-sum b { color: var(--primary); font-size: 18px; }
/* v1.136 矩阵窗底部补「加入清单」后变成三个按钮：一律不换行、不被挤压；
   窄屏（手机）合计独占一行，按钮统一靠右排满，避免「加入/清单」竖着折成两行 */
.spec-grow { flex: 1; }
.spec-foot .btn { flex: 0 0 auto; white-space: nowrap; }
@media (max-width: 560px) {
  .spec-foot { flex-wrap: wrap; gap: 8px; }
  .spec-foot .spec-sum { flex: 1 0 100%; margin-bottom: 2px; }
  .spec-foot .spec-grow { display: none; }
  .spec-foot .btn { flex: 1 1 auto; min-width: 0; padding-left: 6px; padding-right: 6px; }
}

/* 列表菜单设置弹窗 */
.colset-tip { font-size: 12px; color: var(--text-2); margin-bottom: 10px; line-height: 1.7; }
.colset-hint { font-size: 13px; line-height: 1.7; margin-bottom: 10px; padding: 9px 12px;
  border-radius: 8px; background: #fff7e6; border: 1px dashed #f5a623; color: #b25e00; }
.colset-hint b { color: #d46b00; }
.drag-cell { text-align: center; }
.drag-handle { display: inline-block; cursor: grab; font-size: 16px; color: #98a7b3;
  user-select: none; padding: 2px 6px; border-radius: 6px; line-height: 1; }
.drag-handle:hover { background: #eef3f7; color: var(--primary); cursor: grab; }
.drag-handle:active { cursor: grabbing; }
.colset-table tr[draggable="true"]:hover { background: #f7fbff; }
.colset-table tr.dragging { opacity: 0.45; background: #eaf4ff !important; }
.colset-table tr.drag-over td { border-top: 2px solid var(--primary); }
.colset-wrap { max-height: 52vh; overflow: auto; border: 1px solid var(--line); border-radius: 8px; }
.colset-table { min-width: 0; width: 100%; font-size: 13px; }
.colset-table thead th { position: sticky; top: 0; z-index: 2; background: #f4f7f9; }
.colset-table td { padding: 6px 10px; }
.colset-input { width: 100%; padding: 5px 8px; border: 1px solid var(--line); border-radius: 6px; font-size: 13px; }
.colset-foot { display: flex; gap: 10px; margin-top: 14px; align-items: center; }
@media (max-width: 768px), (orientation: landscape) and (max-height: 520px) and (pointer: coarse) { .colset-foot { flex-wrap: wrap; } }

/* 补货页 PC 端：整页固定高度，标题/筛选/表头不随滚动消失，只有明细区滚动 */
@media (min-width: 769px) and (pointer: fine), (min-width: 769px) and (min-height: 521px) {
  .content.page-fixed { height: 100vh; box-sizing: border-box; overflow: hidden;
    display: flex; flex-direction: column; padding-top: 16px; padding-bottom: 10px; }
  .content.page-fixed > .page-title { flex: 0 0 auto; margin-bottom: 10px; }
  .content.page-fixed .rep-filter { position: static; flex: 0 0 auto; margin-bottom: 10px; }
  .content.page-fixed .rep-grid { flex: 1 1 0; min-height: 0;
    align-items: stretch; grid-auto-rows: minmax(0, 1fr); }
  .content.page-fixed .rep-main { display: flex; flex-direction: column; min-height: 0; }
  /* #rpTable 是 rep-main 的直接子项，必须参与 flex 分配，否则内部表格会整块撑出可视区 */
  .content.page-fixed #rpTable { flex: 1 1 0; min-height: 0;
    display: flex; flex-direction: column; }
  .content.page-fixed .rep-table-wrap { max-height: none; flex: 1 1 0; min-height: 0; }
  .content.page-fixed #rpPager { flex: 0 0 auto; padding-bottom: 4px; }
  /* 提示行与分页条信息重复（分页里已显示总条数），PC 下隐藏以腾出空间给分页完整显示 */
  .content.page-fixed .rep-tip { display: none; }
  .content.page-fixed .rep-rail { position: static; height: 100%; min-height: 0; }
  .content.page-fixed .cart-card { flex: 1 1 auto; min-height: 0; max-height: none; }

  /* v1.68 订单配送（供应商端 #dvBody / 门店端 #dlaBody）整页冻结：
     标题 + 筛选 + 统计卡固定不动，只有下方列表滚动（统计卡在 .list-head 内，手机端也跟着吸顶） */
  .content.dlv-fixed { height: 100vh; box-sizing: border-box; overflow: hidden;
    display: flex; flex-direction: column; padding-top: 16px; padding-bottom: 10px; }
  .content.dlv-fixed .list-head { flex: 0 0 auto; margin-bottom: 10px; }
  .content.dlv-fixed #dvBody, .content.dlv-fixed #dlaBody { flex: 1 1 0; min-height: 0;
    display: flex; flex-direction: column; overflow: hidden; }
  .content.dlv-fixed #dvBody .tbox, .content.dlv-fixed #dlaBody .tbox {
    flex: 1 1 0; min-height: 120px; max-height: none; }
  /* 供应商端订单配送 5 张卡（门店端 4 张用默认 4 列；手机端回落到 .da-stats 的 2 列） */
  .content.dlv-fixed .da-stats.cols5 { grid-template-columns: repeat(5, minmax(0, 1fr)); }
}

/* ---------------- 图表（v1.31 重做：宽度自适应，手机/电脑都清晰） ---------------- */
.chart-box svg { width: 100%; height: auto; display: block; overflow: visible; }
.ch-head { display: flex; align-items: baseline; justify-content: space-between;
  gap: 6px 12px; flex-wrap: wrap; margin-bottom: 10px; }
.ch-head h3 { margin: 0; font-size: 15px; }
.ch-sum { font-size: 12px; color: var(--text-2); white-space: nowrap; }
.ch-sum b { font-size: 15px; font-weight: 700; color: var(--text); margin-left: 2px;
  font-variant-numeric: tabular-nums; }
.ch-sum i { font-style: normal; margin-left: 10px; color: var(--red); }
.legend { display: flex; flex-wrap: wrap; gap: 8px 16px; font-size: 12px;
  color: var(--text-2); margin-top: 10px; }
.legend i { display: inline-block; width: 9px; height: 9px; border-radius: 2px; margin-right: 5px; }
/* v1.93c 紧凑趋势图（销售页在用）：图例进标题行右侧、标题旁可挂一行说明；
   明细表独立成卡片，和图表分开——之前图+表挤在一块，看着像同一个区域 */
.ch-head .ch-meta { display: flex; align-items: center; margin-left: auto; }
.ch-head .ch-meta .legend { margin-top: 0; }
.ch-note { font-style: normal; font-weight: 400; font-size: 12px; color: var(--text-2); margin-left: 10px; }
.ch-note a { color: var(--primary); cursor: pointer; text-decoration: none; border-bottom: 1px dashed currentColor; }
.sl-chart { padding-bottom: 10px; }
.sl-detail { margin-top: 12px; }
.sl-detail .m-head { margin-bottom: 6px; }
.sl-na { color: var(--text-2); }
.sl-lock { color: var(--orange); }
/* v1.94 未授权价格的占位星号：进价永远显示，其它价格权限没勾才出现它 */
.sl-star { display: inline-block; min-width: 10px; color: var(--text-2); font-weight: 700; cursor: help;
  letter-spacing: .5px; }
/* 卡片里跟数字同高，否则星号字形本身偏小，看着像排版漏了 */
.stat-card .value .sl-star { font-size: 32px; line-height: 26px; vertical-align: -6px; letter-spacing: 0; }
body.ui-s .stat-card .value .sl-star { font-size: 28px; vertical-align: -5px; }
body.ui-xs .stat-card .value .sl-star { font-size: 24px; vertical-align: -4px; }
/* v1.94b 图表被价格权限挡住时的占位（不画空图，避免误以为没数据） */
.ch-lock { display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 4px;
  min-height: 118px; color: var(--text-2); font-size: 13px; }
.ch-lock span { font-size: 22px; font-weight: 700; color: var(--text-2); line-height: 1; }
.ch-lock em { font-style: normal; font-size: 12px; color: var(--text-2); opacity: .8; }
@media (max-width: 768px) {
  .ch-note { display: block; margin: 2px 0 0; }
  .ch-head .ch-meta { margin-left: 0; }
  .sl-detail .m-head { margin-bottom: 4px; }
}
/* 手机上：图表矮一点、标题和合计同一行也放得下，图例字号略小 */
@media (max-width: 768px), (orientation: landscape) and (max-height: 520px) and (pointer: coarse) {
  .chart-box { padding: 12px 12px 10px; }
  .ch-head { margin-bottom: 8px; }
  .ch-head h3 { font-size: 14px; }
  .ch-sum { font-size: 11.5px; }
  .ch-sum b { font-size: 14px; }
  .legend { margin-top: 8px; font-size: 11.5px; }
}

/* ---------------- 弹窗 ---------------- */
.modal { position: fixed; inset: 0; z-index: 50; }
.modal-mask { position: absolute; inset: 0; background: rgba(0,0,0,.45); }
.modal-card { position: relative; background: #fff; border-radius: 12px; margin: 6vh auto;
  width: min(860px, calc(100% - 24px)); max-height: 86vh; display: flex; flex-direction: column; }
.modal-head { display: flex; justify-content: space-between; align-items: center;
  padding: 14px 18px; border-bottom: 1px solid var(--line); font-weight: 700; }
/* v1.113 PC 端弹窗可拖拽（fs.js 通用能力）：标题栏显示移动光标，按钮仍是手型 */
@media (pointer: fine) {
  .modal-head { cursor: move; }
  .modal-head a, .modal-head button, .modal-head input, .modal-head label { cursor: pointer; }
}
.modal-head-act { display: flex; align-items: center; gap: 14px; }
.modal-print-btn { font-size: 13px; font-weight: 600; color: #fff; background: var(--primary);
  padding: 5px 14px; border-radius: 6px; cursor: pointer; }
.modal-print-btn:hover { background: var(--primary-dark); }
.modal-actions { margin-top: 14px; display: flex; gap: 10px; justify-content: flex-end; }
.modal-close { font-size: 18px; color: var(--text-2); padding: 2px 6px; }
.modal-body { padding: 16px 18px; overflow-y: auto; }

/* v1.60 新品申请弹窗：手机端全屏（.modal-fs 由 npModal 挂上、ui.closeModal 摘掉）
   关闭 ✕ 保持透明背景、加大点按区，浮在标题行右侧随时可关
   v1.60c：手机端头部/内边距压缩，把空间留给商品信息 */
.modal-fs .modal-close { background: transparent; padding: 8px 10px; font-size: 20px; }
@media (max-width: 768px), (orientation: landscape) and (max-height: 520px) and (pointer: coarse) {
  .modal-fs .modal-card { margin: 0; width: 100%; max-width: 100%; max-height: none;
    height: 100vh; height: 100dvh; border-radius: 0; }
  .modal-fs .modal-head { padding: calc(7px + env(safe-area-inset-top)) 12px 7px; font-size: 15px; }
  .modal-fs .modal-close { padding: 4px 8px; font-size: 18px; }
  .modal-fs .modal-body { padding: 9px 12px calc(16px + env(safe-area-inset-bottom)); }
  /* 款号 / 自编码整行铺满，不再挤在半格宽度里 */
  .np-row3 .np-full { grid-column: 1 / -1; }
}
.kv { display: grid; grid-template-columns: repeat(2, 1fr); gap: 8px 16px;
  font-size: 13px; margin-bottom: 14px; }
.kv div span { color: var(--text-2); margin-right: 6px; }

/* ---------------- Toast ---------------- */
.toast { position: fixed; top: 14%; left: 50%; transform: translateX(-50%); z-index: 99;
  background: rgba(20,20,20,.85); color: #fff; padding: 10px 20px; border-radius: 8px;
  font-size: 14px; max-width: 80vw; }
/* 手机端：提示条移到屏幕下方（底部导航上方）。
   原因：补货页顶部有一整块冻结区，提示弹在 14% 位置会正好把「三步提示 / 清单按钮」遮住。
   必须写在 .toast 基础规则之后，否则会被上面的 top:14% 覆盖。 */
@media (max-width: 768px), (orientation: landscape) and (max-height: 520px) and (pointer: coarse) {
  .toast { top: auto; bottom: calc(76px + env(safe-area-inset-bottom));
    width: max-content; max-width: 86vw; text-align: center; line-height: 1.5; }
}
.empty { text-align: center; color: var(--text-2); padding: 40px 0; font-size: 13px; }

/* ---------------- 界面大小开关（顶栏 Aa → 标准/小号/特小） ----------------
   核心目的：让补货列表一屏多看几个商品。压缩顺序：顶栏 → 冻结区 → 工具条 → 卡片 → 底部导航。
   必须放在文件末尾：和前面手机端媒体查询同优先级时，写在后面的才生效。 */
.uisize-h { font-size: 13.5px; font-weight: 600; color: var(--text-2); margin-bottom: 8px;
  display: flex; align-items: baseline; gap: 6px; flex-wrap: wrap; }
.uisize-h i { font-style: normal; font-size: 11.5px; color: #9aa4ae; font-weight: 400; }
.uisize-list { display: flex; flex-direction: column; gap: 8px; }
.uisize-item { display: flex; align-items: center; gap: 12px; padding: 11px 14px;
  border: 1.5px solid var(--line); border-radius: 10px; cursor: pointer; background: #fff; }
.uisize-item:active { background: #f4f8fb; }
.uisize-item.on { border-color: var(--primary); background: #f2faf6; }
.us-demo { flex: 0 0 auto; width: 34px; height: 34px; border-radius: 8px; background: #eef3f7;
  color: var(--text-2); display: inline-flex; align-items: center; justify-content: center;
  font-weight: 700; }
.us-demo.us-m { font-size: 16px; }
.us-demo.us-s { width: 30px; height: 30px; font-size: 14px; }
.us-demo.us-xs { width: 26px; height: 26px; font-size: 12px; }
.us-txt { flex: 1; min-width: 0; display: flex; flex-direction: column; gap: 2px; }
.us-txt b { font-size: 14px; }
.us-txt i { font-style: normal; font-size: 12px; color: var(--text-2); }
.us-check { flex: 0 0 auto; font-size: 12.5px; color: var(--primary); font-weight: 700; }
/* 弹窗里的「全屏显示」按钮 + 浏览器不支持时的说明 */
.uisize-full { width: 100%; border: 1.5px solid var(--primary); background: #f2faf6; color: var(--primary);
  border-radius: 10px; padding: 12px; font-size: 14px; font-weight: 700; font-family: inherit; cursor: pointer; }
.uisize-full:active { background: #e3f5ec; }
.uisize-note { background: #f7f9fb; border: 1px dashed var(--line); border-radius: 10px;
  padding: 11px 13px; font-size: 12.5px; line-height: 1.6; color: var(--text-2); }

/* —— 小号：整体小一号 —— */
@media (max-width: 768px), (orientation: landscape) and (max-height: 520px) and (pointer: coarse) {
  /* 顶栏 8+8 + 按钮 25 = 41px，冻结区吸附位置跟着改（--toph） */
  body.ui-s { --toph: 41px; }
  /* v1.87：T9 看板统计卡也跟着「显示大小」缩，否则小号档首页数字仍顶着 20px */
  body.ui-s .stat-card .value { font-size: 18px; }
  body.ui-s .stat-card .value small { font-size: 11px; }
  body.ui-s .topbar { padding: 8px 10px; gap: 6px; }
  body.ui-s .topbar-title { font-size: 14.5px; }
  body.ui-s .topbar .logo-word { font-size: 14px; }
  body.ui-s .topbar-right { gap: 4px; }
  body.ui-s .fs-btn { width: 27px; height: 25px; font-size: 13px; }
  /* 「显示大小」/「退出」是文字按钮，宽度要自适应，不能跟着 ⛶ 图标按钮被压成竖排（.fs-btn 优先级别更高，必须显式覆盖） */
  body.ui-s .fs-btn.ui-size-btn { width: auto; min-width: 44px; height: 25px; padding: 0 7px; font-size: 12px; }
  body.ui-s .fs-btn.topbar-exit { width: auto; min-width: 36px; height: 25px; padding: 0 6px; font-size: 12px; }
  body.ui-s .fs-btn.fs-btn-text { width: auto; min-width: 34px; height: 25px; padding: 0 5px; font-size: 12px; }
  body.ui-s .topbar-user { font-size: 12px; max-width: 56px; }
  body.ui-s .content { padding: 10px 10px calc(62px + env(safe-area-inset-bottom)); }
  body.ui-s .m-head { margin: -10px -10px 8px; padding: 10px 10px 8px; }
  body.ui-s .page-title { font-size: 14px; }
  body.ui-s .page-title span > span { font-size: 11px; }
  body.ui-s .ms-btn { padding: 5px 11px; font-size: 12px; }
  body.ui-s .m-fold-btn { padding: 4px 9px; font-size: 11.5px; }
  body.ui-s .m-toolbar { padding: 5px 8px; margin-bottom: 6px; gap: 8px; }
  body.ui-s .m-steps { font-size: 10px; }
  body.ui-s .m-cart-btn { padding: 6px 11px; font-size: 12px; }
  body.ui-s .m-cart-btn b { font-size: 13.5px; }
  body.ui-s .rep-filter { padding: 8px 10px; }
  body.ui-s .rep-filter input, body.ui-s .rep-filter select { font-size: 12px; padding: 6px 8px; }
  body.ui-s .rep-filter .filter { gap: 6px; }
  body.ui-s .rep-filter .btn-sm { padding: 6px 9px; font-size: 12px; }
  /* 搜索按钮被 `.rep-filter .filter > #rpSearchBtn`（含 ID，特异性更高）压着，必须同级别覆盖 */
  body.ui-s .rep-filter .filter > #rpSearchBtn { padding: 6px 10px; }
  body.ui-s .rep-cards { gap: 6px; padding: 6px 6px 2px; }
  body.ui-s .rep-card { padding: 7px 10px 8px; }
  body.ui-s .rc-no { height: 18px; font-size: 10px; }
  body.ui-s .rc-name { font-size: 13.5px; }
  body.ui-s .rc-amt { font-size: 12.5px; }
  body.ui-s .rc-meta { font-size: 11px; margin: 4px 0 6px; gap: 4px; }
  body.ui-s .rc-label { font-size: 11px; }
  body.ui-s .rc-act { gap: 6px; }
  body.ui-s .rc-act .qty-input { width: 48px; height: 30px; font-size: 14px; }
  body.ui-s .rc-act .qty-step .qs-btn { width: 32px; height: 30px; font-size: 18px; }
  body.ui-s .rc-act .c-act .btn { padding: 7px 11px; font-size: 12.5px; }
  body.ui-s .rep-cards-foot { font-size: 11px; }
  body.ui-s .bottomnav a { font-size: 10px; padding: 5px 0 4px; }
  body.ui-s .bottomnav a span { font-size: 17px; }

  /* —— 特小：再小一号 —— */
  /* 顶栏 7+7 + 按钮 23 = 37px */
  body.ui-xs { --toph: 37px; }
  body.ui-xs .stat-card .value { font-size: 16px; }
  body.ui-xs .stat-card .value small { font-size: 10.5px; }
  body.ui-xs .topbar { padding: 7px 8px; gap: 5px; }
  body.ui-xs .topbar-title { font-size: 13px; gap: 5px; }
  /* 特小号顶栏：徽标和产品名各缩一号，保证右侧按钮不被挤 */
  body.ui-xs .topbar .logo-mark { font-size: 10.5px; padding: 3.5px 3.5px 3.5px 4.5px; border-radius: 5px; }
  body.ui-xs .topbar .logo-word { font-size: 13px; letter-spacing: .4px; }
  body.ui-xs .topbar-right { gap: 4px; }
  body.ui-xs .topbar-user { font-size: 11px; max-width: 48px; }
  body.ui-xs .fs-btn { width: 25px; height: 23px; font-size: 12px; }
  body.ui-xs .fs-btn.ui-size-btn { width: auto; min-width: 42px; height: 23px; padding: 0 5px; font-size: 11px; }
  body.ui-xs .fs-btn.topbar-exit { width: auto; min-width: 32px; height: 23px; padding: 0 5px; font-size: 11px; }
  body.ui-xs .fs-btn.fs-btn-text { width: auto; min-width: 30px; height: 23px; padding: 0 4px; font-size: 11px; }
  body.ui-xs .content { padding: 8px 8px calc(56px + env(safe-area-inset-bottom)); }
  body.ui-xs .m-head { margin: -8px -8px 6px; padding: 8px 8px 6px; }
  body.ui-xs .page-title { font-size: 13px; }
  body.ui-xs .page-title span > span { font-size: 10px; }
  body.ui-xs .ms-btn { padding: 4px 9px; font-size: 11px; }
  body.ui-xs .m-fold-btn { padding: 3px 8px; font-size: 10.5px; }
  body.ui-xs .m-toolbar { padding: 4px 7px; margin-bottom: 5px; gap: 6px; }
  body.ui-xs .m-steps { font-size: 9.5px; }
  body.ui-xs .m-cart-btn { padding: 5px 9px; font-size: 11px; }
  body.ui-xs .m-cart-btn b { font-size: 12.5px; }
  /* 筛选区：框更小、字更小，但字加粗 —— 小了还看得清（这是用户要的重点） */
  body.ui-xs .rep-filter { padding: 5px 7px; }
  body.ui-xs .rep-filter > div:first-child { margin-bottom: 6px !important; gap: 6px !important; }
  body.ui-xs .rep-filter > div:first-child > select { padding: 4px 6px !important; border-radius: 6px !important; }
  body.ui-xs .rep-filter input,
  body.ui-xs .rep-filter select { font-size: 10.5px; font-weight: 600; padding: 4px 6px; border-radius: 6px; }
  body.ui-xs .rep-filter .filter { gap: 5px; }
  body.ui-xs .rep-filter .btn-sm { padding: 4px 6px; font-size: 10.5px; font-weight: 600; border-radius: 6px; }
  /* 同上：搜索按钮里有 ID，特异性更高，要同级别压 */
  body.ui-xs .rep-filter .filter > #rpSearchBtn { padding: 5px 7px; }
  body.ui-xs .rep-cards { gap: 5px; padding: 5px 5px 2px; }
  body.ui-xs .rep-card { padding: 6px 8px 7px; }
  body.ui-xs .rc-no { height: 16px; font-size: 9.5px; min-width: 17px; }
  body.ui-xs .rc-name { font-size: 12.5px; }
  body.ui-xs .rc-amt { font-size: 11.5px; }
  body.ui-xs .rc-meta { font-size: 10.5px; margin: 3px 0 5px; gap: 3px; }
  body.ui-xs .rc-label { font-size: 10px; }
  body.ui-xs .rc-act { gap: 5px; }
  body.ui-xs .rc-act .qty-input { width: 44px; height: 27px; font-size: 13px; }
  body.ui-xs .rc-act .qty-step .qs-btn { width: 30px; height: 27px; font-size: 16px; }
  body.ui-xs .rc-act .c-act .btn { padding: 6px 9px; font-size: 11.5px; }
  body.ui-xs .rep-cards-foot { font-size: 10.5px; padding: 6px 0 2px; }
  body.ui-xs .bottomnav a { font-size: 9.5px; padding: 4px 0 3px; }
  body.ui-xs .bottomnav a span { font-size: 16px; }
}
/* PC 端也支持小号（顶栏按钮只在手机显示，但万一以后开放也给规则留好） */
body.ui-s { font-size: 13.5px; }
body.ui-xs { font-size: 13px; }

/* ============ 手机横屏（点了顶栏「横屏」或把手机横过来）============
   横屏宽度约 888px、高度只有 400px 左右，两个变化：
   ① 商品卡片改双列——横屏横向空间大，单列会拉成很长的一条，白白浪费
   ② 底部导航压薄一点，把高度让给商品
   注意：顶栏和冻结区不在这里改，沿用当前界面大小档位（标准/小号/特小），
   这样 --toph 与顶栏实际高度始终一致，冻结区不会盖住顶栏。 */
@media (orientation: landscape) and (max-height: 520px) and (pointer: coarse) {
  .rep-cards { display: grid; grid-template-columns: 1fr 1fr; align-items: start; }
  .rc-head { gap: 6px; }
  .rc-name { font-size: 12.5px; }
  .rc-amt { font-size: 12px; }
  .rc-meta { font-size: 10.5px; margin: 3px 0 5px; }
  .rc-act { gap: 5px; }
  .rc-act .qty-input { width: 44px; height: 28px; font-size: 13px; }
  .rc-act .qty-step .qs-btn { width: 28px; height: 28px; font-size: 16px; }
  .rc-act .c-act .btn { padding: 6px 10px; font-size: 11.5px; }
  .rep-cards-foot { font-size: 10.5px; padding: 6px 0 2px; }
  .bottomnav a { font-size: 9.5px; padding: 3px 0 2px; }
  .bottomnav a span { font-size: 15px; }
  .content { padding: 8px 12px calc(52px + env(safe-area-inset-bottom)); }
  /* 横屏高度只有 400 左右：筛选区即使展开也限高，超出的在框内滚动，别把商品全挤没了
     （.m-head.folded .rep-filter 的 max-height:0 特异性更高，折叠动画不受影响） */
  .m-head .rep-filter { max-height: 132px; overflow-y: auto; -webkit-overflow-scrolling: touch; }
  /* 冻结区里横向排开，减少折行：三步提示和清单按钮同一行 */
  .m-toolbar { padding: 4px 8px; margin-bottom: 5px; gap: 8px; }
  .m-steps { font-size: 10px; }
}

/* ============ 加购 / 改数量的动效 ============
   原则：只用 transform + opacity（GPU 合成，不触发重排重绘），一次只有一个飞球，
   列表 50 条也不会卡；动画结束立刻移除节点，不留垃圾。 */
/* 从「加入购物车」飞向清单的小绿球 */
.fly-dot { position: fixed; z-index: 60; width: 13px; height: 13px; margin: -6.5px 0 0 -6.5px;
  border-radius: 50%; background: var(--primary); pointer-events: none;
  box-shadow: 0 0 0 3px rgba(26,127,90,.16);
  transition: transform .44s cubic-bezier(.32,-.15,.36,1), opacity .44s ease; }

/* 清单数字弹一下 */
@keyframes cartBump {
  0% { transform: scale(1); } 35% { transform: scale(1.22); }
  65% { transform: scale(.95); } 100% { transform: scale(1); }
}
.m-cart-btn.bump { animation: cartBump .42s ease; }
#cartCnt.bump { display: inline-block; animation: cartBump .42s ease; }

/* 新品表单内的「预览新品清单」悬浮钮：钉在操作栏上方右侧，不随表单滚动。
   加入一款就弹一下（cartBump），有清单才显示 */
.np-fab { position: absolute; right: 16px; bottom: 76px; z-index: 6;
  display: inline-flex; align-items: center; gap: 6px; padding: 9px 16px;
  border: none; border-radius: 999px; cursor: grab;
  font-size: 13px; font-weight: 700; color: #fff;
  background: linear-gradient(135deg, var(--primary) 0%, var(--primary-dark) 100%);
  box-shadow: 0 6px 16px rgba(20, 102, 74, .35);
  touch-action: none;   /* v1.80 可拖拽：不禁掉浏览器手势，手机上拖它会连带滚动表单 */
  user-select: none; -webkit-user-select: none; -webkit-touch-callout: none; }
.np-fab i { font-style: normal; font-size: 15px; }
.np-fab .np-fab-n { font-size: 14px; }
.np-fab span { font-weight: 400; opacity: .85; }
.np-fab:active { filter: brightness(.94); }
/* 拖拽中：抬起来的手感——放大一点、阴影拉长、光标变抓握 */
.np-fab.dragging { cursor: grabbing; transform: scale(1.06);
  box-shadow: 0 14px 30px rgba(20, 102, 74, .45); }
.np-fab.bump { animation: cartBump .42s ease; }

/* 卡片被加进清单时轻轻一缩，像"被拿起来" */
@keyframes cardPop { 0% { transform: scale(1); } 40% { transform: scale(.984); } 100% { transform: scale(1); } }
.rep-card.pop, .rep-table tbody tr.pop { animation: cardPop .3s ease; }

/* 数量数字弹一下 */
@keyframes qtyFlash {
  0% { transform: scale(1); } 45% { transform: scale(1.08); color: var(--primary); } 100% { transform: scale(1); }
}
.qty-input.qty-flash { animation: qtyFlash .26s ease; }

/* 金额闪一下（金额跟着数量变，给个提示） */
@keyframes amtFlash {
  0% { transform: scale(1); } 40% { transform: scale(1.06); color: var(--primary); } 100% { transform: scale(1); }
}
.rc-amt.amt-flash, .amt-cell.amt-flash { display: inline-block; animation: amtFlash .34s ease; }

/* 弹窗里「登录后自动全屏」开关的图标 */
.us-demo.us-auto { font-size: 16px; background: #fff7e6; }

/* 系统开了「减少动态效果」：全部关掉（无障碍设置要尊重） */
@media (prefers-reduced-motion: reduce) {
  .fly-dot { display: none !important; }
  .m-cart-btn.bump, #cartCnt.bump, .rep-card.pop, .rep-table tbody tr.pop,
  .qty-input.qty-flash, .rc-amt.amt-flash, .amt-cell.amt-flash {
    animation: none !important; transition: none !important;
  }
}

/* ============ 日期输入框 + 年月日选择面板 ============
   左边直接手打（2026-09-25），右边 📅 点选（年/月/日三段 + 日历） */
.dp-wrap { display: inline-flex; align-items: stretch; min-width: 128px;
  border: 1px solid var(--line); border-radius: 8px; background: #fff; overflow: hidden; }
.dp-wrap:focus-within { border-color: var(--primary); }
/* 用 .dp-wrap .dp-text 提高优先级，压掉 .filter input 的边框/内边距 */
.dp-wrap .dp-text { flex: 1 1 auto; min-width: 0; width: 100%; border: none; outline: none;
  padding: 8px 10px; font-size: 13px; color: var(--text); background: transparent;
  border-radius: 0; box-shadow: none; }
.dp-wrap .dp-text.bad { background: #fff3f3; color: var(--red); }
.dp-btn { flex: 0 0 auto; border: none; border-left: 1px solid var(--line); background: #f3f7fa;
  padding: 0 9px; cursor: pointer; font-size: 15px; line-height: 1; }
.dp-btn:active { background: #e6eef4; }

/* 面板：手机从底部弹出，PC 居中 */
.dp-mask { position: fixed; inset: 0; background: rgba(15,20,25,.42); z-index: 82;
  display: none; align-items: flex-end; justify-content: center; }
.dp-mask.show { display: flex; }
.dp-sheet { width: 100%; max-width: 460px; background: #fff; border-radius: 14px 14px 0 0;
  padding: 14px 16px calc(14px + env(safe-area-inset-bottom)); box-shadow: 0 -8px 30px rgba(0,0,0,.18);
  animation: dpUp .22s ease; }
@keyframes dpUp { from { transform: translateY(26px); opacity: .55; } to { transform: none; opacity: 1; } }
.dp-head { display: flex; align-items: center; justify-content: space-between; margin-bottom: 10px; }
.dp-head b { font-size: 15px; }
.dp-x { border: none; background: none; font-size: 18px; color: var(--text-2); cursor: pointer; padding: 0 4px; }
.dp-selects { display: grid; grid-template-columns: 1.15fr 1fr 1fr; gap: 8px; margin-bottom: 10px; }
.dp-selects select { width: 100%; padding: 8px; border: 1px solid var(--line); border-radius: 8px;
  font-size: 14px; background: #fff; outline: none; }
.dp-grid { display: grid; grid-template-columns: repeat(7, 1fr); gap: 2px; text-align: center; }
.dp-grid .dp-w { font-size: 11px; color: var(--text-2); padding: 4px 0; }
.dp-grid .dp-d { padding: 9px 0; border-radius: 8px; font-size: 13.5px; cursor: pointer; }
.dp-grid .dp-d:active { background: #eef4f8; }
.dp-grid .dp-d.today { color: var(--primary); font-weight: 700; }
.dp-grid .dp-d.on { background: var(--primary); color: #fff; font-weight: 700; }
.dp-foot { display: flex; align-items: center; gap: 8px; margin-top: 12px; }
@media (min-width: 769px) {
  .dp-mask { align-items: center; }
  .dp-sheet { border-radius: 14px; max-width: 400px; }
}

/* ============ 开始日期 ～ 结束日期：左右并排一行 ============
   原来两个日期框各占一行（上下堆），现在排成一行：左＝开始日期，右＝结束日期，
   中间一个「～」。手机上两格平分宽度，仍够显示 2026-09-25 这样的日期 */
.dp-range { display: inline-flex; align-items: center; gap: 6px; flex: 1 1 300px; min-width: 0; }
.dp-range .dp-wrap { flex: 1 1 0; min-width: 0; }
.dp-range .dp-sep { flex: 0 0 auto; font-style: normal; font-size: 13px; color: var(--text-2); }
/* 压掉 .filter input[type=text] 的 min-width:140px，否则窄屏下两格会挤出屏幕 */
.dp-range .dp-wrap .dp-text { min-width: 0; }

/* ============ 「筛选」一键收起（库存 / 销售 / 订单 / 收货 / 退货 / 对账 通用） ============
   按钮放在页面标题行右侧：展开时不多占高度；点一下把日期、分店、关键字、查询按钮
   全部藏起来，把屏幕让给数据；标题下面补一行灰色条件摘要，随时知道查的是什么条件 */
.pt-row { display: flex; align-items: center; justify-content: space-between; gap: 10px; }
.pt-row > span:first-child { min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.flt-btn { flex: 0 0 auto; display: inline-flex; align-items: center; gap: 3px;
  border: 1px solid var(--line); background: #fff; color: var(--text-2);
  border-radius: 999px; padding: 5px 12px; font-size: 12.5px; font-weight: 600;
  line-height: 1.2; white-space: nowrap; cursor: pointer; }
.flt-btn:active { background: #eef4f8; }
.flt-btn.on { color: var(--primary); border-color: var(--primary); background: var(--primary-light); }
.flt-sum-row { display: none; }
/* v1.68 页面标题下的一行说明：以前塞在标题括号里，手机上被挤成省略号看不全 */
.pg-hint { font-size: 12.5px; color: var(--text-2); margin: -8px 0 12px; line-height: 1.5; }
.flt-sum-row.show { display: block; margin: -6px 0 10px; }
.flt-sum-row > span { display: block; font-size: 12px; color: var(--text-2);
  overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
/* 收起后条件区整块隐藏（!important 压过 .rep-filter .filter 等网格规则） */
.filter.folded { display: none !important; }
/* v1.88 采购端筛选面板折叠（申请单/单据查询/货品查询的 .b-card.b-flt） */
.b-flt.folded { display: none !important; }

/* 手机端：日期两格整行平分，字号略收、📅 按钮窄一点，保证 320px 窄屏也放得下 */
@media (max-width: 768px), (orientation: landscape) and (max-height: 520px) and (pointer: coarse) {
  .dp-range { flex: 1 1 100%; gap: 5px; }
  .dp-range .dp-wrap .dp-text { padding: 8px 6px; font-size: 13px; }
  .dp-range .dp-btn { padding: 0 6px; font-size: 14px; }
  .pt-row { margin-bottom: 10px; }
  .flt-btn { padding: 5px 10px; font-size: 12px; }
  .flt-sum-row.show { margin: -4px 0 8px; }
  .flt-sum-row > span { font-size: 11.5px; }
}
/* 小号 / 特小档：筛选按钮与条件摘要跟着收一档 */
body.ui-s .flt-btn { padding: 4px 9px; font-size: 11.5px; }
body.ui-s .flt-sum-row > span { font-size: 11px; }
body.ui-xs .flt-btn { padding: 3px 8px; font-size: 10.5px; }
body.ui-xs .flt-sum-row > span { font-size: 10.5px; }
body.ui-xs .dp-range .dp-wrap .dp-text { font-size: 12px; padding: 7px 5px; }
body.ui-xs .dp-range .dp-btn { padding: 0 4px; font-size: 12.5px; }

/* ============ 页面内确认框（.ask） ============
   原生 confirm()/alert() 在全屏状态下会被浏览器强制顶掉全屏（点「提交补货单」掉回竖屏就是这个），
   所以所有确认都改成这张页面内的卡片：全屏里照用不误，样式也和平台统一。
   手机上从底部弹出，电脑上居中。 */
.ask-mask { position: fixed; inset: 0; z-index: 86; display: flex; align-items: flex-end;
  justify-content: center; background: rgba(15,20,25,0); transition: background .18s ease; }
.ask-mask.show { background: rgba(15,20,25,.45); }
.ask-card { width: 100%; max-width: 420px; background: #fff; border-radius: 14px 14px 0 0;
  padding: 18px 18px calc(16px + env(safe-area-inset-bottom)); box-shadow: 0 -8px 30px rgba(0,0,0,.2);
  transform: translateY(20px); opacity: .6; transition: transform .2s ease, opacity .2s ease; }
.ask-mask.show .ask-card { transform: none; opacity: 1; }
.ask-title { font-size: 16px; font-weight: 700; margin-bottom: 10px; color: var(--text); }
.ask-body { font-size: 13.5px; color: var(--text-2); line-height: 1.7; }
.ask-body > div { word-break: break-word; }
.ask-btns { display: flex; gap: 10px; margin-top: 16px; }
.ask-btns .btn { flex: 1; padding: 12px; font-size: 15px; border-radius: 10px; }
@media (min-width: 769px) and (pointer: fine), (min-width: 769px) and (min-height: 521px) {
  .ask-mask { align-items: center; }
  .ask-card { border-radius: 14px; max-width: 400px; transform: translateY(8px) scale(.98); }
  .ask-mask.show .ask-card { transform: none; }
}

/* 掉出全屏时浮出的「回到全屏」小药丸：点一下立刻回全屏，12 秒后自己消失 */
.fs-back { position: fixed; right: 12px; bottom: calc(78px + env(safe-area-inset-bottom)); z-index: 78;
  display: none; align-items: center; gap: 4px; padding: 9px 14px; border: none; border-radius: 999px;
  background: var(--primary); color: #fff; font-size: 13px; font-weight: 700;
  font-family: inherit; box-shadow: 0 4px 14px rgba(26,127,90,.38); cursor: pointer; }
.fs-back.show { display: inline-flex; animation: fsBackIn .2s ease; }
@keyframes fsBackIn { from { transform: translateY(8px); opacity: 0; } to { transform: none; opacity: 1; } }

/* ============ 单据列表 · 手机卡片版（v1.20）============
   原来手机上是一张 6 列宽表，必须左右拖动才能点到「明细 / 打印」。
   改成卡片后，一屏之内就能看到：单号 + 状态、日期 + 分店、金额 + 明细/打印（+ 撤回），
   不用再左右滑。电脑端仍用表格。 */
.sh-cards { display: flex; flex-direction: column; gap: 8px; }
.sh-card { background: var(--card); border: 1px solid var(--line); border-radius: 10px;
  padding: 9px 11px; }
.sc-l1 { display: flex; align-items: center; gap: 8px; }
.sc-no { font-size: 13.5px; font-weight: 700; min-width: 0; letter-spacing: .2px;
  overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.sc-l1 .tag { flex: 0 0 auto; margin-left: auto; }
.sc-l2 { display: flex; align-items: center; gap: 6px; margin-top: 3px;
  font-size: 11.5px; color: var(--text-2); }
.sc-date { flex: 0 0 auto; font-variant-numeric: tabular-nums; }
.sc-br { flex: 1 1 auto; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.sc-l3 { display: flex; align-items: center; gap: 8px; margin-top: 7px; }
.sc-amt { flex: 1 1 auto; min-width: 0; font-size: 14.5px; font-weight: 700;
  font-variant-numeric: tabular-nums; }
/* 三个按钮要大一点好点：明细 / 打印 / 撤回 */
.sc-l3 .tag { flex: 0 0 auto; padding: 5px 13px; font-size: 12.5px; border-radius: 999px; }
/* 手机横屏：宽度有 888，卡片排两列，一屏能看十来个单据 */
@media (orientation: landscape) and (max-height: 520px) and (pointer: coarse) {
  .sh-cards { display: grid; grid-template-columns: 1fr 1fr; gap: 8px; }
}
/* 小号 / 特小档：整体再收一档 */
body.ui-s .sh-card { padding: 8px 10px; }
body.ui-s .sc-no { font-size: 12.5px; }
body.ui-s .sc-l3 .tag { padding: 4px 11px; font-size: 12px; }
body.ui-xs .sh-card { padding: 7px 9px; border-radius: 9px; }
body.ui-xs .sc-no { font-size: 12px; }
body.ui-xs .sc-l2 { font-size: 10.5px; margin-top: 2px; }
body.ui-xs .sc-amt { font-size: 13px; }
body.ui-xs .sc-l3 { margin-top: 6px; gap: 6px; }
body.ui-xs .sc-l3 .tag { padding: 4px 10px; font-size: 11.5px; }

/* ============ 列表页头部冻结（v1.21）============
   库存 / 销售 / 单据(订单·收货·退货) / 我的补货单 / 对账：
   标题 + 「筛选」按钮 + 条件摘要 + 筛选区整块钉在顶栏下面，
   往下翻卡片/表格时随时能点「筛选」展开常用功能，不用滚回页面顶部。
   注意：只影响手机布局；电脑端 .list-head 就是个普通容器，视觉不变。
   top 用 --toph（顶栏高度，随界面大小档位 46/41/37 变），不会盖住顶栏也不留缝。 */
@media (max-width: 768px), (orientation: landscape) and (max-height: 520px) and (pointer: coarse) {
  .list-head { position: sticky; top: var(--toph, 46px); z-index: 12; background: var(--bg);
    margin: -14px -14px 10px; padding: 14px 14px 2px;
    box-shadow: 0 4px 10px rgba(0, 0, 0, .05); }
  .list-head .page-title { margin-bottom: 8px; }
  .list-head .filter { margin-bottom: 8px; }
  .list-head .flt-sum-row.show { margin: -2px 0 8px; }
}
/* 手机横屏：内容区 padding 变成 8/12，负边距要跟着改，否则会横向溢出 */
@media (orientation: landscape) and (max-height: 520px) and (pointer: coarse) {
  .list-head { margin: -8px -12px 8px; padding: 8px 12px 2px; }
  .list-head .page-title { margin-bottom: 6px; }
}

/* ============ 补货明细 · 标准模式表格的手机适配（v1.21）============
   默认列改成「款号 / 品名 / 数量 / 单价」四列后，手机上把行高与列宽压紧，
   一屏就能放下，不用再左右拖；勾了更多列时才会横向滚动（用户自己选的）。 */
@media (max-width: 768px), (orientation: landscape) and (max-height: 520px) and (pointer: coarse) {
  /* 压掉 table{min-width:500px} / .rep-table{min-width:720px}，让表格按内容自适应 */
  .rep-table.std-table { min-width: 0; font-size: 12px; }
  .std-table th, .std-table td { padding: 6px 5px; }
  .std-table .c-no { width: 26px; padding: 6px 2px; font-size: 11px; }
  .std-table .c-act { width: 60px; padding: 6px 2px; }
  .std-table .c-act .btn { padding: 5px 5px; font-size: 11px; border-radius: 6px; width: 100%; }
  .std-table .c-name { min-width: 70px; white-space: normal; word-break: break-word; line-height: 1.35; }
  .std-table .std-qty { min-width: 44px; padding: 3px 5px; font-size: 12px; }
  .std-table .std-qty-cell { padding: 4px 2px !important; }
  .std-table .c-sub, .std-table .c-code { font-size: 11.5px; }
  .std-table tfoot td { padding: 6px 5px; }
  .std-table .std-sum-label { font-size: 11px; white-space: normal; }
}

/* ============ 表格：表头冻结 + 手机「两行式」紧凑表（v1.22）============
   用户反馈：①分店列太占地方 ②表头滚上去就没了 ③希望不用左右滑就能看到主要信息。
   做法：
   · .tbox —— 表格在自己容器里滚动，thead 用 sticky 钉在容器顶部。
     这样不管页面怎么往下翻，列名一直在，一眼就知道每列是什么。
   · .tbl-cmp —— 手机上把「货号 / 商品 / 分店 / 品类」合成一列两行显示，
     数字列放右侧，整张表零横向滚动；分店只显示名称不再带 6 位编号。 */
.tbox { max-height: calc(100dvh - 300px); min-height: 180px; overflow: auto;
  -webkit-overflow-scrolling: touch; }
.tbox > table > thead > tr > th { position: sticky; top: 0; z-index: 3;
  background: #f8fafb; box-shadow: inset 0 -1px 0 var(--line); }
/* 电脑端：头部矮一些，表格可以多给点高度 */
@media (min-width: 769px) and (min-height: 521px) {
  .tbox { max-height: calc(100vh - 250px); }
}
/* 手机横屏：纵向空间紧张，按视口高度留够头部与底部导航 */
@media (orientation: landscape) and (max-height: 520px) and (pointer: coarse) {
  .tbox { max-height: calc(100dvh - 170px); min-height: 150px; }
}

/* 紧凑表（手机端各查询结果共用） */
.tbl-cmp { min-width: 0; font-size: 13px; }
.tbl-cmp th, .tbl-cmp td { padding: 8px 9px; vertical-align: middle; }
.tbl-cmp thead th { font-size: 12px; }
.tbl-cmp .c-main { white-space: normal; word-break: break-word; line-height: 1.3; }
.tbl-cmp .c-main b { font-weight: 600; font-variant-numeric: tabular-nums; }
.tbl-cmp .c-main span { margin-left: 6px; }
/* 第三行小字：分店 · 品类 / 在途 / 单数 等补充信息 */
.tbl-cmp .c-main i, .tbl-cmp .c-num em {
  display: block; font-style: normal; font-weight: 400; font-size: 11.5px;
  color: var(--text-2); margin-top: 2px;
  overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.tbl-cmp .c-num { text-align: right; white-space: nowrap; font-variant-numeric: tabular-nums; }
.tbl-cmp .c-num b { font-size: 14px; }
.tbl-cmp .c-act { width: 54px; padding: 8px 4px; }
.tbl-cmp .c-act .tag { padding: 5px 9px; font-size: 12px; }
/* 特小档再收一点 */
body.ui-xs .tbl-cmp { font-size: 12.5px; }
body.ui-xs .tbl-cmp .c-main i, body.ui-xs .tbl-cmp .c-num em { font-size: 11px; }

/* 标题行右侧可以放两个药丸按钮（如「库存预警」+「筛选」） */
.pt-btns { flex: 0 0 auto; display: inline-flex; align-items: center; gap: 6px; }
/* 库存页筛选：手机上关键字、分店各占一行，「品类 + 每页 + 查询」挤一行（v1.30） */
@media (max-width: 768px), (orientation: landscape) and (max-height: 520px) and (pointer: coarse) {
  #flt-stock #stKw { flex: 1 1 100%; }
  #flt-stock #stBranch { flex: 1 1 100%; min-width: 0; width: auto; }
  #flt-stock #stCls { flex: 1 1 0; min-width: 0; width: auto; }
  #flt-stock #stSize { flex: 0 0 104px; width: auto; }
  #flt-stock .btn-primary { flex: 0 0 auto; }
}

/* 单据页「今天 / 近7天 / 近30天」快捷区间：手机上三个并排平分一行 */
.quick-rng { display: inline-flex; align-items: center; gap: 8px; }
@media (max-width: 768px), (orientation: landscape) and (max-height: 520px) and (pointer: coarse) {
  .quick-rng { flex: 1 1 100%; gap: 6px; }
  .quick-rng .btn { flex: 1 1 0; min-width: 0; padding: 7px 0; font-size: 12.5px; }
  /* 分店 + 状态两个下拉并排各一半，省一行 */
  #flt-sheet #shBranch, #flt-sheet #shStatus { flex: 1 1 0; min-width: 0; }
  /* 销售页：关键字与查询同一行 */
  #flt-sales #slKw { flex: 1 1 auto; min-width: 0; max-width: none !important; }
}

/* 一组并排的筛选控件（如 分店 + 状态）：手机上独占一行、两格各一半 */
.f-half { display: inline-flex; align-items: center; gap: 8px; }
@media (max-width: 768px), (orientation: landscape) and (max-height: 520px) and (pointer: coarse) {
  /* min-width:0 必须写——不写的话 flex 的自动最小尺寸 = 内容宽度，
     整行会被撑到 600px 把后半截（单号搜索）顶到屏幕外（v1.68 修复） */
  .f-half { flex: 1 1 100%; min-width: 0; flex-wrap: wrap; }
  .f-half > * { flex: 1 1 calc(50% - 4px); min-width: 0; max-width: none !important; }
  /* 单号搜索与「查询」同一行 */
  #flt-sheet #shKw { flex: 1 1 auto; min-width: 0; max-width: none !important; width: auto; }
}

/* v1.87 筛选区尾部组（订单配送页）：电脑端 display:contents 不生成盒子，
   查询按钮与快捷区间各按原位排；手机端两者并成一行，省掉「查询」独占一行。 */
.f-tail { display: contents; }
@media (max-width: 768px), (orientation: landscape) and (max-height: 520px) and (pointer: coarse) {
  .f-tail { display: flex; flex: 1 1 100%; gap: 6px; align-items: stretch; min-width: 0; }
  .f-tail > .btn { flex: 0 0 auto; padding: 9px 14px; }
  .f-tail > .quick-rng { flex: 1 1 auto; min-width: 0; }
  .f-tail > .quick-rng .btn { flex: 1 1 0; min-width: 0; padding: 8px 0; font-size: 12.5px; }
}

/* ============ 库存预警：就地填数量 + 加入清单 + 直接提交（v1.24）============
   用户反馈：预警页只有一个「+ 补货」，只能按建议量加、还得跳到补货页才能提交。
   现在改成同一页完成：每行填数量 → 加入清单 → 点右上角 🛒 核对 → 直接提交补货单。 */
.al-tools { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; margin: 0 0 10px; }
.al-lab { font-size: 13px; color: var(--text-2); }
.al-br { padding: 7px 8px; border: 1px solid var(--line); border-radius: 8px;
  background: #fff; font-size: 13px; min-width: 150px; max-width: 240px; }
/* 购物车药丸：0 项时是绿色，有商品后变橙色提醒（和补货页「清单」按钮一致的语言） */
.al-cart { border: none; border-radius: 999px; padding: 8px 14px; cursor: pointer;
  background: var(--primary); color: #fff; font-size: 13px; font-weight: 700;
  display: inline-flex; align-items: center; gap: 4px; white-space: nowrap;
  box-shadow: 0 2px 8px rgba(26, 127, 90, .28); }
.al-cart b { font-size: 15px; line-height: 1; }
.al-cart.has { background: var(--orange); box-shadow: 0 2px 10px rgba(232, 132, 44, .42); }
/* 表格里的数量步进器：比补货卡片里更紧凑，390px 屏也放得下（合计 100px） */
.al-tbl .qty-step { flex: 0 0 auto; }
.al-tbl .qty-step .qs-btn { width: 28px; height: 30px; font-size: 18px; }
.al-tbl .qty-input { width: 44px; height: 30px; padding: 0 2px; font-size: 14px; font-weight: 700;
  text-align: center; background: #fff; border: 1px solid var(--line);
  border-left: none; border-right: none; border-radius: 0; }
.al-tbl .qty-input:focus { border-color: var(--primary); outline: none; }
.al-tbl .c-act { width: 60px; }
.al-tbl .c-act .tag { display: inline-block; min-width: 48px; padding: 5px 6px;
  font-size: 11.5px; text-align: center; white-space: nowrap; }
.al-tbl .al-add.on { background: var(--primary); border-color: var(--primary); color: #fff; }
.al-tip { font-size: 12px; color: var(--text-2); margin-top: 8px; line-height: 1.7; }
.al-tip .tag { margin-left: 4px; }
@media (max-width: 768px), (orientation: landscape) and (max-height: 520px) and (pointer: coarse) {
  .al-lab { display: none; }                 /* 手机上省掉「补货分店」四个字，下拉本身看得懂 */
  .al-br { flex: 1 1 auto; min-width: 0; max-width: none; }
  .al-cart { flex: 0 0 auto; padding: 7px 12px; }
  .al-tbl .qty-step .qs-btn { width: 30px; height: 32px; font-size: 19px; }
  .al-tbl .qty-input { width: 46px; height: 32px; font-size: 14.5px; }
}

/* 预警模式：库存页的筛选区（关键字/分店/查询）先收起，避免和「补货到」下拉混淆 */
body.st-alert #flt-stock { display: none !important; }

/* 预警表固定列宽：不靠内容撑，长品名 / 小字都不会把表格撑出屏幕（手机 + 特小档实测溢出 0） */
.al-tbl.tbl-cmp { table-layout: fixed; }
.al-tbl.tbl-cmp thead th:nth-child(2) { width: 110px; }
.al-tbl.tbl-cmp thead th:nth-child(3) { width: 60px; }
.al-tbl.tbl-cmp .c-main { min-width: 0; }

/* ============ 销售页三档切换 + 畅销/滞销榜单（v1.25）============ */
/* 分段控件：三格等宽，选中深绿底白字（与底栏高亮同一语言） */
.seg3 { display: flex; gap: 0; background: #eef2f4; border-radius: 10px; padding: 3px; margin: 0 0 10px; }
.seg3 button { flex: 1; border: none; background: transparent; padding: 8px 0; font-size: 13px;
  color: var(--text-2); border-radius: 8px; cursor: pointer; transition: all .15s; }
.seg3 button.on { background: var(--primary); color: #fff; font-weight: 700;
  box-shadow: 0 2px 6px rgba(26, 127, 90, .3); }

/* ============ v1.325 / D-140 变更审批：两张并列卡片 ============
   原来是挤在一条浅灰底里的两格分段，未选中的那格几乎和背景融为一体，
   操作人员常常没注意到右边还有「资料变更」。现在两张各有白底、边框、
   图标和说明，选中的用品牌绿描边 + 左侧色条 + 勾选圆点标出。 */
.ca-seg { display: flex; gap: 12px; flex-wrap: wrap; margin: 2px 0 12px; }
.ca-card { flex: 1 1 240px; min-width: 218px; display: flex; align-items: center; gap: 11px;
  padding: 11px 14px; text-align: left; cursor: pointer; position: relative;
  background: #fff; border: 1.5px solid #d8e2e6; border-radius: 12px;
  box-shadow: 0 1px 3px rgba(20, 50, 40, .06); transition: all .16s ease; }
.ca-card:hover { border-color: var(--primary); transform: translateY(-1px);
  box-shadow: 0 4px 12px rgba(26, 127, 90, .14); }
.ca-card:active { transform: scale(.985); }
.ca-card.on { background: var(--primary-light); border-color: var(--primary);
  box-shadow: 0 3px 10px rgba(26, 127, 90, .16); }
.ca-card.on::before { content: ''; position: absolute; left: 0; top: 10px; bottom: 10px;
  width: 4px; border-radius: 0 4px 4px 0; background: var(--primary); }
.ca-ico { flex: 0 0 38px; width: 38px; height: 38px; display: flex; align-items: center;
  justify-content: center; font-size: 20px; border-radius: 10px; background: #f1f6f4; }
.ca-card.on .ca-ico { background: #fff; }
.ca-txt { display: flex; flex-direction: column; gap: 2px; min-width: 0; }
.ca-txt b { font-size: 14.5px; font-weight: 700; color: var(--text); white-space: nowrap; }
.ca-card.on .ca-txt b { color: var(--primary-dark); }
.ca-txt small { font-size: 11.5px; color: var(--text-2); white-space: nowrap; }
.ca-tick { margin-left: auto; flex: 0 0 auto; width: 20px; height: 20px; border-radius: 50%;
  border: 1.5px solid #cfd9dd; color: transparent; font-size: 12px; font-weight: 700;
  display: flex; align-items: center; justify-content: center; }
.ca-card.on .ca-tick { background: var(--primary); border-color: var(--primary); color: #fff; }
@media (max-width: 560px) {
  .ca-seg { gap: 8px; }
  .ca-card { flex: 1 1 46%; min-width: 0; padding: 9px 10px; gap: 8px; }
  .ca-ico { flex-basis: 32px; width: 32px; height: 32px; font-size: 17px; }
  .ca-txt b { font-size: 13px; }
  .ca-txt small { font-size: 10.5px; }
}
/* 筛选区里的排法切换（按销售额 / 按销量）：双格药丸 */
.f-seg { display: inline-flex; background: #eef2f4; border-radius: 9px; padding: 3px; gap: 2px; }
.f-seg button { border: none; background: transparent; padding: 6px 12px; font-size: 12.5px;
  color: var(--text-2); border-radius: 7px; cursor: pointer; }
.f-seg button.on { background: #fff; color: var(--primary-dark); font-weight: 700;
  box-shadow: 0 1px 4px rgba(0,0,0,.12); }
/* 榜单 */
.rank-wrap { margin-bottom: 14px; }
.rank-head { font-size: 13px; color: var(--text-2); margin: 2px 0 8px; }
.rank-head b { color: var(--primary-dark); }
.rank-head .rank-sub { margin-left: 8px; font-size: 12px; color: var(--text-2); }
.rank-more { text-align: center; padding: 10px 0 2px; }
.rank-more .tag { cursor: pointer; }
/* 名次徽章 */
.rank-tbl .rk, .c-main .rk { display: inline-block; min-width: 21px; height: 21px; line-height: 21px;
  text-align: center; border-radius: 6px; font-size: 12px; font-weight: 700;
  background: #e8edf0; color: var(--text-2); margin: 0 7px 0 0; vertical-align: middle; }
.rank-tbl .c-main .rk { margin-right: 7px; }
.rank-tbl .rk1 { background: linear-gradient(135deg, #f0a52e, #d97706); color: #fff; }
.rank-tbl .rk2 { background: linear-gradient(135deg, #94a3b8, #64748b); color: #fff; }
.rank-tbl .rk3 { background: linear-gradient(135deg, #c98d5e, #a06428); color: #fff; }
/* 榜单表：手机上和紧凑表同一套（tbl-cmp），名次徽章嵌在第一列里 */
@media (max-width: 768px), (orientation: landscape) and (max-height: 520px) and (pointer: coarse) {
  .rank-tbl.tbl-cmp { table-layout: fixed; }
  .rank-tbl.tbl-cmp th:nth-child(2) { width: 64px; }
  .rank-tbl.tbl-cmp th:nth-child(3) { width: 92px; }
  .rank-tbl.tbl-cmp .c-main .rk { margin: 0 6px 0 0; }
  .rank-tbl.tbl-cmp .c-main b { margin-left: 0; }
}

/* ============ 我的账单：应收 / 应付 / 月账汇总（v1.26）============ */
/* 账龄条：一条彩色横条 + 四段图例，一眼看出钱卡在哪个账龄段 */
.aging { background: var(--card); border: 1px solid var(--line); border-radius: var(--radius);
  padding: 12px 14px; margin-bottom: 12px; }
.aging-title { font-size: 13px; font-weight: 600; margin-bottom: 8px; color: var(--text); }
.aging-title span { font-weight: 400; font-size: 12px; color: var(--text-2); margin-left: 6px; }
.aging-bar { display: flex; height: 9px; border-radius: 6px; overflow: hidden; background: #eef2f4; }
.aging-bar i { display: block; height: 100%; min-width: 0; }
.aging-bar .ag0 { background: #3aa981; }
.aging-bar .ag1 { background: #e8b04b; }
.aging-bar .ag2 { background: #e8842c; }
.aging-bar .ag3 { background: #d9534f; }
.aging-legend { display: grid; grid-template-columns: 1fr 1fr; gap: 7px 18px; margin-top: 9px; }
.ag-item { font-size: 12px; color: var(--text-2); display: flex; align-items: center; gap: 5px; }
.ag-item .ag-dot { width: 8px; height: 8px; border-radius: 2px; display: inline-block; flex: 0 0 auto; }
.ag-item .ag-dot.ag0 { background: #3aa981; }
.ag-item .ag-dot.ag1 { background: #e8b04b; }
.ag-item .ag-dot.ag2 { background: #e8842c; }
.ag-item .ag-dot.ag3 { background: #d9534f; }
.ag-item b { margin-left: auto; color: var(--text); font-variant-numeric: tabular-nums; }
/* 账单表：手机固定列宽，单号不会把表格撑出屏幕 */
@media (max-width: 768px), (orientation: landscape) and (max-height: 520px) and (pointer: coarse) {
  .bill-tbl.tbl-cmp { table-layout: fixed; }
  .bill-tbl.tbl-cmp thead th:nth-child(2) { width: 92px; }
  .bill-tbl.tbl-cmp thead th:nth-child(3) { width: 86px; }
  .bill-tbl.tbl-cmp .c-act .tag { padding: 4px 6px; font-size: 11px; }
  .bill-tbl.tbl-cmp .c-main b { font-size: 12.5px; }
  .aging-legend { gap: 7px 12px; }
}
/* 电脑端备注列不撑宽 */
.bill-tbl .bill-memo { max-width: 240px; overflow: hidden; text-overflow: ellipsis; }

/* 可点击的单据行（账单等列表）：手型 + 悬停高亮，单号加下划线示意可点开明细 */
.row-link { cursor: pointer; }
.row-link:hover { background: rgba(58, 169, 129, .08); }
.row-link td u { text-underline-offset: 3px; text-decoration-thickness: 1px; }
/* 账单筛选区：日期并排 + 状态，手机上一行放得下 */
@media (max-width: 768px), (orientation: landscape) and (max-height: 520px) and (pointer: coarse) {
  #flt-bill .dp-range { flex: 1 1 100%; }
  #flt-bill .dp-wrap { flex: 1 1 0; min-width: 0; }
}

/* 账单：单据过多时的提示条 */
.bill-tip { font-size: 12px; color: var(--text-2); margin-top: 8px; line-height: 1.6; }

/* 月账表：累计未结是百万级金额，第三列要更宽，否则数字会被挤出表格（13px） */
@media (max-width: 768px), (orientation: landscape) and (max-height: 520px) and (pointer: coarse) {
  .bill-month-tbl.tbl-cmp thead th:nth-child(2) { width: 90px; }
  .bill-month-tbl.tbl-cmp thead th:nth-child(3) { width: 108px; }
  .bill-month-tbl.tbl-cmp .c-num b { font-size: 13px; letter-spacing: -.2px; }
}

/* 账单筛选区：月账档只有「分店 + 月数 + 查询」，压成一行，别让查询单独占一行 */
@media (max-width: 768px), (orientation: landscape) and (max-height: 520px) and (pointer: coarse) {
  #flt-bill #billPeriod { flex: 1 1 auto; min-width: 0; width: auto; }
  /* 分店下拉收成可压缩，好让「状态 + 查询」和它挤在同一行，别把查询顶到下一行 */
  #flt-bill #billBranch { flex: 1 1 0; min-width: 0; width: auto; }
  #flt-bill #billStatus { flex: 0 0 96px; }
  #flt-bill .btn-primary { flex: 0 0 auto; }
  /* 月账档只剩「分店 + 月数 + 查询」，三样压成一行 */
  body.bill-month #flt-bill #billBranch { flex: 1 1 0; min-width: 0; }
  body.bill-month #flt-bill #billMonths { flex: 0 0 104px; }
  body.bill-month #flt-bill .btn-primary { flex: 0 0 auto; }
}

/* 电脑端：三档切换别拉满整行（1400px 下三格各 460px 太笨），收成一块 */
@media (min-width: 769px) and (min-height: 521px) {
  .seg3 { max-width: 420px; }
}

/* ============ 全预览清单：整单取消（v1.29）============
   弹窗底部原来只有「继续选购 / 提交补货单」，想放弃整张清单只能一个个点 ✕。
   现在左边多一个红字「整单取消」，点了会先确认再清空。 */
.cs-btns { display: flex; align-items: center; gap: 8px; margin-left: auto; }
.cs-cancel-all { flex: 0 0 auto; font-size: 13px; color: var(--red); cursor: pointer;
  padding: 7px 6px; white-space: nowrap; text-decoration: none; border-radius: 6px; }
.cs-cancel-all:active { background: #fdecec; }
/* 手机：合计独占一行，三个按钮排下一行（整单取消靠左，主按钮靠右撑满剩余） */
@media (max-width: 768px), (orientation: landscape) and (max-height: 520px) and (pointer: coarse) {
  .cs-foot { gap: 8px; }
  .cs-foot .cs-total { flex: 1 1 100%; }
  .cs-btns { margin-left: 0; width: 100%; gap: 6px; }
  .cs-btns .btn { flex: 1 1 0; min-width: 0; padding: 9px 6px; font-size: 13px; }
  .cs-btns .cs-cancel-all { padding: 9px 4px; }
}

/* ============================================================
   v1.31 新品申请（新品申请 / 审核 / 账号管理）
   ============================================================ */
/* 角色菜单显隐：专员/管理员只看自己的菜单，供应商菜单整组隐藏 */
body.role-reviewer .nav-sup, body.role-admin .nav-sup { display: none !important; }
body.role-reviewer .nav-rev { display: block !important; }
body.role-admin .nav-rev, body.role-admin .nav-adm { display: block !important; }
body.role-reviewer .bottomnav, body.role-admin .bottomnav { display: none !important; }

/* 新品申请表单 */
.np-form .field { margin-bottom: 10px; }
.np-row2 { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; }
.np-row3 { display: grid; grid-template-columns: 1fr 1fr 1fr; gap: 10px; }
.np-chips { display: flex; flex-wrap: wrap; gap: 6px; }
.np-chip { padding: 4px 12px; border: 1px solid var(--line); border-radius: 14px;
  cursor: pointer; font-size: 12px; background: var(--card); user-select: none; }
.np-chip.on { background: var(--primary); color: #fff; border-color: var(--primary); font-weight: 700; }
.np-br-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(150px, 1fr)); gap: 6px; }
.np-br { display: flex; align-items: center; gap: 6px; padding: 6px 8px; font-size: 12px;
  border: 1px solid var(--line); border-radius: 8px; background: var(--card); cursor: pointer; }
.np-br.on { border-color: var(--primary); background: #e6f4ee; }
.np-hint { font-size: 12px; color: var(--text-2); margin: -2px 0 10px; }
.np-det { font-size: 13px; line-height: 1.7; }
.np-det-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 2px 14px;
  font-size: 12px; color: var(--text-2); margin-top: 6px; }
.np-warn { font-size: 12px; color: var(--red); background: #fdecec;
  border-radius: 8px; padding: 8px 10px; margin: 10px 0; }
@media (max-width: 768px) {
  .np-row3 { grid-template-columns: 1fr; }
  .np-row2 { grid-template-columns: 1fr; }
  .np-br-grid { grid-template-columns: repeat(auto-fill, minmax(120px, 1fr)); }
}

/* v1.33 新品表单扩展：开关项行 + 紧凑栅格 */
.np-flags { display: flex; flex-wrap: wrap; gap: 4px 14px; align-items: center;
  border: 1px solid var(--line); border-radius: 8px; padding: 7px 10px; background: var(--card); }
.np-flag { display: inline-flex; align-items: center; gap: 4px; font-size: 12px; cursor: pointer; white-space: nowrap; }
.np-flag input { accent-color: var(--primary); margin: 0; }
.np-form .field { margin-bottom: 8px; }
.np-form .field label { font-size: 11px; }
.np-form .field input, .np-form .field select { padding: 5px 8px; }
.np-row3 { display: grid; grid-template-columns: 1fr 1fr 1fr; gap: 8px; }
@media (max-width: 768px) {
  .np-row3 { grid-template-columns: 1fr 1fr; }
  .np-form .field label { font-size: 12px; }
}

/* ---------------- v1.65 新品商品图片（≤3 张：拍照 / 相册，客户端已压缩） ---------------- */
.np-photos { display: flex; gap: 10px; flex-wrap: wrap; }
.np-ph { position: relative; width: 86px; height: 86px; border-radius: 8px; overflow: hidden;
  border: 1px solid var(--line); background: #f7f9fa; box-sizing: border-box; }
.np-ph img { width: 100%; height: 100%; object-fit: cover; display: block; cursor: zoom-in; }
.np-ph-del { position: absolute; top: 2px; right: 2px; width: 20px; height: 20px; padding: 0;
  border: none; border-radius: 50%; background: rgba(0,0,0,.55); color: #fff; font-size: 11px;
  line-height: 1; cursor: pointer; display: flex; align-items: center; justify-content: center; }
.np-ph-add { display: flex; flex-direction: column; align-items: center; justify-content: center;
  gap: 4px; border: 1px dashed #b9c4cc; color: var(--text-2); font-size: 12px;
  cursor: pointer; background: #fbfcfd; user-select: none; }
.np-ph-add:active { background: var(--primary-light); color: var(--primary); }
.np-ph-add input { display: none; }   /* label 代点，输入框本身不占位 */
.np-ph-err { display: flex; align-items: center; justify-content: center; width: 100%; height: 100%;
  font-size: 11px; color: var(--red); }
.np-pic-mask { position: fixed; inset: 0; z-index: 300; background: rgba(0,0,0,.82);
  display: flex; align-items: center; justify-content: center; cursor: zoom-out; }
.np-pic-mask img { max-width: 94vw; max-height: 92vh; border-radius: 6px; }
.np-pic-mask span { color: #fff; font-size: 14px; }

/* ---------------- v1.67 统一图片查看器（相册式：滑动切图 / 缩放 / 下拉关闭） ----------------
   层级 84：压过普通弹窗(50)，但让确认框(86)/提示条(99)仍然盖在它上面——
   查看器里的「删除这张」要先弹 askConfirm，确认框必须在最上面。 */
.picv { position: fixed; inset: 0; z-index: 84; background: #0b0d0c;
  display: flex; flex-direction: column; opacity: 0; transition: opacity .2s;
  -webkit-tap-highlight-color: transparent; }
.picv.show { opacity: 1; }
/* v1.94a 刘海屏/全屏机型：顶栏留出安全区，否则 ✕ 会被状态栏压住一半点不中（关不掉） */
.picv-hd { display: flex; align-items: center; gap: 10px;
  padding: calc(12px + env(safe-area-inset-top)) 14px 12px;
  color: #fff; flex: 0 0 auto; }
.picv-title { font-size: 14px; font-weight: 600; }
.picv-idx { font-size: 13px; opacity: .7; font-variant-numeric: tabular-nums; margin-right: auto; }
.picv-x { border: none; background: rgba(255,255,255,.14); color: #fff; width: 42px; height: 42px;
  border-radius: 50%; font-size: 18px; line-height: 1; cursor: pointer; }
.picv-x:active { background: rgba(255,255,255,.3); }
.picv-stage { flex: 1 1 auto; overflow: hidden; touch-action: none; position: relative; }
.picv-track { display: flex; height: 100%; will-change: transform; }
.picv-it { flex: 0 0 100%; min-width: 0; display: flex; align-items: center; justify-content: center; }
.picv-it img { max-width: 100%; max-height: 100%; object-fit: contain; user-select: none;
  -webkit-user-drag: none; will-change: transform; }
.picv-load { color: rgba(255,255,255,.65); font-size: 13px; }
.picv-nav { position: absolute; top: 50%; transform: translateY(-50%); width: 46px; height: 68px;
  border: none; background: rgba(255,255,255,.1); color: #fff; font-size: 32px; line-height: 1;
  cursor: pointer; z-index: 2; }
.picv-nav.prev { left: 0; border-radius: 0 8px 8px 0; }
.picv-nav.next { right: 0; border-radius: 8px 0 0 8px; }
.picv-nav:hover { background: rgba(255,255,255,.24); }
.picv-ft { flex: 0 0 auto; display: flex; flex-direction: column; align-items: center; gap: 12px;
  padding: 12px 14px calc(14px + env(safe-area-inset-bottom)); }
.picv-dots { display: flex; gap: 7px; }
.picv-dots i { width: 7px; height: 7px; border-radius: 50%; background: rgba(255,255,255,.32); }
.picv-dots i.on { background: #fff; }
.picv-del { border: none; border-radius: 22px; padding: 11px 32px; font-size: 14px;
  background: rgba(217,70,62,.92); color: #fff; cursor: pointer; }
.picv-del:active { background: #b93a33; }
.picv-del.hidden { display: none; }

/* 添加图位：手机拆成「拍照 / 相册」两个半格；PC 一整块「选择图片」 */
.np-ph-add.two { flex-direction: row; padding: 0; }
.np-ph-slot { flex: 1 1 50%; align-self: stretch; display: flex; flex-direction: column;
  align-items: center; justify-content: center; gap: 3px; font-size: 12px; cursor: pointer; }
.np-ph-slot + .np-ph-slot { border-left: 1px dashed #d4dbe1; }
.np-ph-slot:active { background: var(--primary-light); }
/* 上传中的占位格（转圈） */
.np-ph-up { display: flex; align-items: center; justify-content: center;
  border: 1px dashed #b9c4cc; background: #fbfcfd; }
.np-ph-up::after { content: ''; width: 22px; height: 22px; border-radius: 50%;
  border: 2.5px solid #cfd8de; border-top-color: var(--primary); animation: phspin .8s linear infinite; }
@keyframes phspin { to { transform: rotate(360deg); } }

/* 手机端图片网格：三等分大图 + 更大的删除热区；列表缩略图/拍照键也加大方便手指点 */
@media (max-width: 768px) {
  .np-photos { display: grid; grid-template-columns: repeat(3, 1fr); gap: 8px; }
  .np-ph { width: auto; height: auto; min-height: 88px; aspect-ratio: 1 / 1; border-radius: 10px; }
  .np-ph img { border-radius: 0; }
  .np-ph-del { width: 27px; height: 27px; font-size: 13px; top: 0; right: 0;
    border-radius: 0 9px 0 10px; background: rgba(0,0,0,.5); }
  /* 一张图都没有时，添加格铺满整行（大按钮更好点），不会留 2/3 空白 */
  .np-ph-add.wide { grid-column: 1 / -1; aspect-ratio: auto; min-height: 78px; }
  .gd-thumb, .gd-cam { /* 手机端尺寸在 v1.66 段落后的媒体查询里统一调 */ }
  .picv-nav { display: none; }   /* 手机用滑动手势，箭头按钮只留给 PC */
}

/* ---------------- v1.66 我的货品（列表缩略图 / 拍照按钮 / 最近采购） ---------------- */
.gd-img { display: inline-flex; align-items: center; justify-content: center; }
.gd-thumb { width: 38px; height: 38px; border-radius: 6px; object-fit: cover; border: 1px solid var(--line);
  cursor: zoom-in; display: block; }
.gd-noimg { font-size: 11px; color: #a8b0b8; }
.gd-cam { border: 1px solid var(--line); background: #fff; border-radius: 6px; width: 26px; height: 26px;
  font-size: 13px; line-height: 1; cursor: pointer; padding: 0; margin-top: 4px; }
.gd-cam:active { background: var(--primary-light); }
td .gd-cam { margin-top: 0; }
td.num em, .c-num em { display: block; font-style: normal; font-size: 11px; color: var(--text-2); }
/* v1.67 手机端列表缩略图/拍照键加大，方便手指点准 */
@media (max-width: 768px) {
  .gd-thumb { width: 46px; height: 46px; }
  .gd-cam { width: 34px; height: 34px; font-size: 17px; }
}

/* ---------------- v1.68 我的货品列表排版 ----------------
   电脑端：10 列定宽 + table-layout:fixed，超长品名省略号，不再横向溢出（原来最后一列被切掉）
   手机端：款号 / 品名 / 品类·库存·价 三行固定结构，品名一行省略，行高整齐不参差；
           图片整格是一个按钮（有图 = 缩略图 + 张数角标，没图 = 虚线相机），点一下进图片管理 */
.gd-tbl-pc { width: 100%; table-layout: fixed; }
.gd-tbl-pc th, .gd-tbl-pc td { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.gd-tbl-pc .gd-img { display: block; }   /* 不是 inline-flex 才能被 text-align:center 居中 */
.gd-tbl-pc td:last-child { overflow: visible; }
.gd-tbl-pc td.c-no { color: #a8b0b8; font-size: 12px; }
.gd-tbl-pc th.c-pic, .gd-tbl-pc td.c-pic { text-align: center; padding-left: 4px; padding-right: 4px; }
.gd-tbl-pc .gd-thumb { margin: 0 auto; }
.gd-tbl-pc .c-goods b { display: block; font-weight: 600; font-variant-numeric: tabular-nums; }
.gd-tbl-pc .c-goods span { display: block; font-size: 12.5px; color: var(--text-2);
  overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.gd-tbl-pc td .gd-noimg { display: block; text-align: center; }
.gd-pbtn { width: 30px; height: 26px; border: 1px solid var(--line); background: #fff; border-radius: 6px;
  font-size: 13px; line-height: 1; cursor: pointer; padding: 0; }
.gd-pbtn:hover { border-color: #bfe3d3; background: var(--primary-light); }
.gd-tbl { table-layout: fixed; }
.gd-tbl .c-main { white-space: nowrap; overflow: hidden; }
.gd-tbl .c-main b { display: block; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.gd-tbl .c-main .gd-nm { display: block; margin: 1px 0 0; overflow: hidden;
  text-overflow: ellipsis; white-space: nowrap; color: var(--text); }
.gd-tbl .c-num { font-size: 12px; }
.gd-tbl .c-num em { font-size: 10px; letter-spacing: -.2px; }
.gd-tbl td { padding: 7px 9px; }
.gd-tbl .c-pic { width: 52px; padding: 6px 3px; text-align: right; }
.gd-pic { position: relative; width: 46px; height: 46px; padding: 0; border: 1px solid var(--line);
  border-radius: 9px; background: #fff; cursor: pointer; display: inline-flex;
  align-items: center; justify-content: center; overflow: hidden; -webkit-tap-highlight-color: transparent; }
.gd-pic .gd-thumb { width: 100%; height: 100%; border: none; border-radius: 0; cursor: pointer; }
.gd-pic-n { position: absolute; right: 2px; bottom: 2px; min-width: 15px; height: 15px; padding: 0 3px;
  border-radius: 8px; background: rgba(20,102,74,.86); color: #fff; font-size: 10px;
  line-height: 15px; text-align: center; font-weight: 600; }
.gd-pic.empty { border-style: dashed; border-color: #c9d2d8; background: #fbfcfd;
  color: #93a0aa; font-size: 18px; }
.gd-pic:active { transform: scale(.96); }
/* 新品申请列表的图片列 / 手机卡片上的「📷 2」角标 */
.np-lt { width: 34px; height: 34px; border-radius: 6px; object-fit: cover;
  border: 1px solid var(--line); cursor: zoom-in; display: block; margin: 0 auto; }
.np-list-tbl .c-pic { width: 56px; text-align: center; }
.np-list-tbl td .gd-noimg { display: block; text-align: center; }
.tag.pic { background: #e9f4ef; color: var(--primary-dark); cursor: default; }

/* v1.33b 新品表单手机端优化：顶部引导 + 核心字段高亮 + 分节标题 */
.np-guide { display: flex; align-items: center; gap: 6px; white-space: nowrap; overflow-x: auto;
  background: linear-gradient(135deg, #fff6e8 0%, #ffe9cc 100%); border: 1px solid #f5c98d;
  border-radius: 10px; padding: 8px 12px; font-size: 12px; color: #a4551a; margin-bottom: 12px;
  -webkit-overflow-scrolling: touch; }
.np-guide b { color: #c2580c; }
.np-guide i { color: #d9a05b; font-style: normal; margin: 0 2px; }
.np-g-no { flex: 0 0 18px; width: 18px; height: 18px; border-radius: 50%; background: #e8833a;
  color: #fff; display: inline-flex; align-items: center; justify-content: center;
  font-weight: 700; font-size: 11px; }
.np-top { background: linear-gradient(180deg, #f2faf6 0%, #e9f5ef 100%);
  border: 1px solid #cbe6da; border-radius: 10px; padding: 10px 10px 0; margin-bottom: 4px; }
.np-top .field label { color: var(--primary-dark); font-weight: 700; }
.np-sec { display: flex; align-items: center; gap: 8px; font-size: 11px; font-weight: 700;
  color: var(--primary-dark); margin: 14px 0 8px; letter-spacing: 1px; }
.np-sec::before { content: ''; width: 3px; height: 12px; border-radius: 2px; background: var(--primary); }
.np-sec::after { content: ''; flex: 1; height: 1px; background: var(--line); }

/* v1.34 新品申请清单：清单按钮药丸（与补货购物车同款视觉） */
.np-cart-btn.on { background: #e6f4ee; border-color: var(--primary); color: var(--primary-dark); font-weight: 700; }
.cs-list .cs-meta { font-size: 11px; color: var(--text-2); margin-top: 2px; }

/* v1.35 工作台「功能菜单」磁贴：全部主功能入口，清新配色 */
.menu-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(92px, 1fr)); gap: 10px; }
.menu-tile { display: flex; flex-direction: column; align-items: center; gap: 7px;
  padding: 13px 4px 11px; border: 1px solid var(--line); border-radius: 12px; background: #fff;
  cursor: pointer; transition: transform .15s, box-shadow .15s, border-color .15s;
  -webkit-tap-highlight-color: transparent; user-select: none; }
.menu-tile:hover { transform: translateY(-2px); box-shadow: 0 4px 12px rgba(20, 102, 74, .10); border-color: #bfe3d4; }
.menu-tile:active { transform: translateY(0); }
.menu-tile .mi { width: 40px; height: 40px; border-radius: 12px; display: flex;
  align-items: center; justify-content: center; font-size: 20px; }
.menu-tile .mt { font-size: 12px; color: var(--text); line-height: 1.2; }
/* v1.57b 未授权模块：与可用磁贴明显区分——虚线框 + 右上角小锁 + 整体压灰，点击只提示不进入 */
.menu-tile.off { position: relative; cursor: not-allowed; background: #eef0f2;
  border: 1px dashed #cfd3d9; opacity: .6; }
.menu-tile.off::after { content: '🔒'; position: absolute; top: 4px; right: 6px;
  font-size: 10px; opacity: .5; }
.menu-tile.off .mi { filter: grayscale(1) contrast(.7); opacity: .25; background: #e2e5e9 !important; }
.menu-tile.off .mt { color: #a2a8b0; }
.menu-tile.off:hover { transform: none; box-shadow: none; border-color: #cfd3d9; }
@media (max-width: 768px) {
  .menu-grid { grid-template-columns: repeat(4, 1fr); gap: 8px; }
  .menu-tile { padding: 10px 2px 9px; border-radius: 10px; }
  .menu-tile .mi { width: 36px; height: 36px; font-size: 18px; border-radius: 10px; }
  .menu-tile .mt { font-size: 11px; }
}

/* ============================================================
   v1.37 多员工账号：登录提示 + 账号管理（供应商员工 / 内部账号）
   ============================================================ */
/* v1.86b：.login-hint（登录按钮下方的说明文字）已按用户要求删除，规则一并移除 */

/* ============================================================
   SSO 集成模式（v1.38）：经原系统菜单桥接进来（body.sso-mode）
   左下角用户面板（角色/登录名/修改密码/退出登录）整体隐藏——
   能进菜单的原系统用户默认就是平台超管，身份与密码归原系统管
   ============================================================ */
body.sso-mode .side-user { display: none !important; }
body.sso-mode .topbar-exit { display: none !important; }  /* 手机顶栏的退出按钮同理 */

/* v1.68b/v1.70 品牌徽章：「供应链」后挂「・卖场 / ・货商 / ・采购」底色胶囊。
   徽章写在 HTML 里（.lw-badge），SSO 徽章在 .lw-sso 段内、货商徽章在 .lw-self 段内，
   随双态切换一起显隐。.lw-dot 单独放大圆点。 */
.lw-badge {
  display: inline-block;
  margin-left: 7px;
  padding: 2px 9px 2.5px;
  font-size: 11px;
  font-weight: 600;
  letter-spacing: 1px;
  line-height: 1.5;
  color: var(--primary-dark);
  background: var(--primary-light);
  border: 1px solid rgba(26, 127, 90, .45);
  border-radius: 999px;
  vertical-align: 2px;
}
.lw-badge .lw-dot {                 /* 居中大圆点，单独放大 */
  font-style: normal;
  font-size: 14.5px;
  font-weight: 400;
  letter-spacing: 0;
  margin-right: 1px;
  vertical-align: -1.5px;
}
body.sso-mode .topbar .lw-badge {           /* 手机顶栏：绿底上换白字浮标 */
  color: #fff;
  background: rgba(255, 255, 255, .16);
  border-color: rgba(255, 255, 255, .55);
}

/* v1.68c 品牌文案双态（2026-10-26 用户定）：
   · 经原系统（8088）内嵌进来 → 显示「供应链」，与原系统侧栏菜单名一致
   · 供应商自己直接登录 → 显示「供应链・货商」
   两段文字都写在 HTML 里，用纯 CSS 切换：不靠 JS 改文本，首屏就不会先闪一下
   （body.sso-mode 在 showMain() 之前就加好了，侧栏/顶栏那时还没显示）。 */
.logo-word .lw-sso { display: none; }
body.sso-mode .logo-word .lw-sso { display: inline; }
body.sso-mode .logo-word .lw-self { display: none; }

/* 账号管理·供应商列表头部总数条（v1.38c） */
.adm-sup-head { padding: 8px 12px; font-size: 12px; color: var(--text-2); background: var(--bg-2, #f6f8f7); border-bottom: 1px solid var(--line); }
.adm-sup-head b { color: var(--pri, #17865a); }

/* ============================================================
   v1.39 注册授权与单会话互踢
   ============================================================ */
/* 登录页授权提示条：醒目红条（到期 / 未开通 / 平台授权无效） */
.lic-banner { margin-top: 14px; background: #fdecec; color: var(--red);
  border: 1px solid #f5b9b6; border-radius: 10px; padding: 10px 12px;
  font-size: 13px; line-height: 1.6; text-align: left; }
.lic-banner b { font-weight: 700; }

/* 登录冲突弹窗：全屏遮罩 + 白卡片（与登录页同风格，手机/电脑自适应） */
.conflict-mask { position: fixed; inset: 0; z-index: 3000; background: rgba(10, 40, 30, .55);
  display: flex; align-items: center; justify-content: center; padding: 20px; }
.conflict-mask.hidden { display: none; }
.conflict-card { background: #fff; border-radius: 16px; width: 400px; max-width: 100%;
  padding: 26px 24px 18px; text-align: center; animation: cfPop .22s ease-out; }
@keyframes cfPop { from { transform: scale(.9); opacity: 0; } to { transform: scale(1); opacity: 1; } }
.cf-icon { width: 58px; height: 58px; border-radius: 50%; background: #fdf3dd;
  display: flex; align-items: center; justify-content: center; margin: 0 auto 13px; }
.cf-title { font-size: 17px; font-weight: 700; color: #22262a; margin: 0 0 6px; }
.cf-sub { font-size: 13px; color: #6b7480; margin: 0 0 16px; }
.cf-sub b { color: var(--primary); }
.cf-device { background: #f2f5f4; border-radius: 10px; padding: 11px 14px;
  display: flex; align-items: center; gap: 11px; text-align: left; margin-bottom: 18px; }
.cf-dev-ic { width: 38px; height: 38px; border-radius: 9px; background: #e6f4ee;
  display: flex; align-items: center; justify-content: center; font-size: 19px; flex: 0 0 auto; }
.cf-dev-info { flex: 1; min-width: 0; }
.cf-dev-name { margin: 0; font-size: 13.5px; font-weight: 700; color: #22262a; }
.cf-dev-meta { margin: 0; font-size: 12px; color: #8a949e; margin-top: 2px; }
.cf-badge { font-size: 11px; color: #17865a; background: #e6f4ee; border-radius: 20px;
  padding: 3px 10px; flex: 0 0 auto; }
.cf-badge.off { color: #8a949e; background: #eceff1; }
.cf-btns { display: flex; gap: 10px; }
.cf-btns .btn { flex: 1; }
.cf-btns .cf-ok { flex: 1.7; background: var(--primary); color: #fff;
  border: 1px solid var(--primary); font-weight: 700; }
.cf-btns .cf-ok:active, .cf-btns .cf-ok:hover { background: var(--primary-dark); }
.cf-note { margin: 13px 0 0; font-size: 12px; color: #8a949e; }

/* ============================================================
   v1.39 账号管理 · 视觉重构
   布局：左「选供应商」→ 右「填员工信息」→ 下「已有账号」
   目标：一眼看清 3 步，不再是一堆说明文字
   ============================================================ */
.adm-note { font-size: 12px; color: var(--text-2); font-weight: 400; line-height: 1.6; }
.adm-hd-stat { font-size: 12px; color: var(--text-2); font-weight: 400; white-space: nowrap; }
.adm-hd-stat b { color: var(--primary); font-size: 13px; font-variant-numeric: tabular-nums; }

/* 两栏骨架（iframe 窄于 960 时自动堆叠成一列） */
.adm-wrap { display: grid; grid-template-columns: 320px minmax(0, 1fr) minmax(0, 320px); gap: 12px; align-items: stretch; }
/* v1.171 授权用户数管理卡片（③ 区）：席位 = 同时在线人数，账号个数不限 */
.seat-sum { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 8px; }
.seat-cell { background: #f7faf8; border: 1px solid #e3efe9; border-radius: 10px; padding: 9px 8px; text-align: center; }
.seat-cell .sv { font-size: 20px; font-weight: 700; color: var(--primary-dark); line-height: 1.2; font-variant-numeric: tabular-nums; }
.seat-cell .sl { font-size: 11.5px; color: #6b7480; margin-top: 3px; line-height: 1.3; }
.seat-cell.warn .sv { color: #c0453a; }
/* v1.256 费用ID汇总卡：圆润亮色，状态彩色胶囊（替代原来的灰字长条） */
.seat-cur { border: 1px solid #d5ecdf; border-radius: 14px; padding: 12px 14px; margin-top: 10px;
  background: linear-gradient(135deg, #f7fcf9, #eef7f2); box-shadow: 0 2px 10px rgba(26, 127, 90, .08); }
.seat-cur .sc-t { font-size: 12.5px; color: #6b7480; line-height: 1.7; }
.seat-cur .sc-n { font-size: 13.5px; font-weight: 700; color: #26303a; }
.fee-pills { display: flex; flex-wrap: wrap; align-items: center; gap: 6px; margin-top: 9px; }
.fee-pill { display: inline-flex; align-items: center; gap: 5px; height: 27px; padding: 0 12px;
  border-radius: 999px; font-size: 12px; font-weight: 600; white-space: nowrap;
  background: #fff; border: 1px solid #e0e6ec; color: #4a5560; box-shadow: 0 1px 4px rgba(38, 48, 58, .05); }
.fee-pill b { font-size: 13.5px; font-weight: 700; font-variant-numeric: tabular-nums; }
.fee-pill .fp-dot { display: inline-block; width: 8px; height: 8px; border-radius: 50%; flex: 0 0 8px; }
.fee-pill.fp-main { background: linear-gradient(135deg, #2aa075, #14664a); border-color: transparent;
  color: #fff; box-shadow: 0 2px 8px rgba(20, 102, 74, .28); }
.fee-pill.fp-main b { color: #fff; }
.fee-pill.fp-green { background: #eaf8f1; border-color: #b5e0ca; color: #12614a; }
.fee-pill.fp-green b { color: #0e8a5f; }
.fee-pill.fp-green .fp-dot { background: #0e8a5f; }
.fee-pill.fp-blue { background: #eaf3fd; border-color: #bed9f2; color: #1d5aa8; }
.fee-pill.fp-blue b { color: #2a72c9; }
.fee-pill.fp-blue .fp-dot { background: #2a72c9; }
.fee-pill.fp-orange { background: #fff4e6; border-color: #f3d9b0; color: #a8600c; }
.fee-pill.fp-orange b { color: #d97b06; }
.fee-pill.fp-orange .fp-dot { background: #d97b06; }
.fee-pill.fp-red { background: #fdeeee; border-color: #f0c6c1; color: #b03a30; }
.fee-pill.fp-red b { color: #d24a3e; }
.fee-pill.fp-red .fp-dot { background: #d24a3e; }
.fee-pill.fp-amber { background: #fdf3e6; border-color: #f0d9b4; color: #8a5a10; }
.fee-pill.fp-amber b { color: #b96a10; }
.fee-pill.fp-dim { background: #f6f7f8; border-color: #e3e8ee; color: #8a939d; box-shadow: none; }
.fee-pill.fp-dim b { color: #a6aeb7; }
.seat-ctl { display: flex; gap: 8px; align-items: center; margin-top: 8px; flex-wrap: wrap; }
/* v1.190 控制条内所有按钮统一 30px 盒子，保存/全部收回严格同高对齐 */
.seat-ctl .btn { height: 30px; min-height: 30px; padding: 0 14px; border-radius: 8px; display: inline-flex; align-items: center; justify-content: center; line-height: 1; }
.seat-ctl input { width: 74px; padding: 7px 9px; border: 1px solid var(--line); border-radius: 8px;
  font-size: 13.5px; text-align: center; outline: none; }
.seat-ctl input:focus { border-color: var(--primary); box-shadow: 0 0 0 3px var(--primary-light); }
.seat-list { max-height: 138px; overflow: auto; border: 1px solid var(--line); border-radius: 9px; margin-top: 6px; }
.seat-row { display: flex; align-items: center; gap: 7px; padding: 6px 10px; border-bottom: 1px solid #f2f4f6; font-size: 12.5px; }
.seat-row:last-child { border-bottom: none; }
.seat-row .sr-n { font-weight: 600; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.seat-row .sr-s { margin-left: auto; color: var(--primary-dark); font-weight: 700; white-space: nowrap; }
/* v1.202 已分配明细：一行式查询工具（复用 .adm-search / .adm-mode） */
.seat-q-hd { display: flex; align-items: center; gap: 8px; margin: 10px 0 2px; }
.seat-q-hd .seat-q-t { flex: 0 0 auto; font-size: 12px; font-weight: 700; color: #6b7480; white-space: nowrap; }
.seat-q-hd .adm-search { flex: 1 1 auto; min-width: 0; gap: 5px; }
.seat-q-hd .adm-search input { padding: 6px 9px; font-size: 12px; }
.seat-q-hd .adm-mode { height: 28px; min-width: 44px; font-size: 10.5px; }
.seat-q-hd .btn { flex: 0 0 auto; height: 28px; min-height: 28px; padding: 0 9px; font-size: 11.5px; border-radius: 7px; }
.seat-q-note { font-size: 11.5px; color: #8a939d; margin: 5px 0 2px; display: flex; align-items: center; gap: 4px; flex-wrap: wrap; }
.seat-q-note b { color: var(--primary-dark); }
/* v1.203 当前选中供应商：统一绿色胶囊按钮（名称加粗 + 编号徽章，点它回①换一家） */
.sup-chip { display: inline-flex; align-items: center; gap: 6px; height: 32px; max-width: 100%; box-sizing: border-box;
  padding: 0 11px 0 7px; border: 1px solid #a8d9c1; border-radius: 999px; vertical-align: middle;
  background: linear-gradient(135deg, #eaf8f1, #d5efe1); color: #125f45; font-size: 13px; font-weight: 700;
  white-space: nowrap; box-shadow: 0 2px 7px rgba(26, 127, 90, .16); cursor: pointer; }
.sup-chip:hover { border-color: var(--primary); box-shadow: 0 3px 11px rgba(26, 127, 90, .24); }
.sup-chip .sc-ico { flex: 0 0 18px; width: 18px; height: 18px; border-radius: 50%; font-style: normal;
  background: linear-gradient(140deg, #2aa075, #14664a); color: #fff; font-size: 10px; line-height: 1;
  display: inline-flex; align-items: center; justify-content: center; }
.sup-chip .sc-lb { font-style: normal; font-size: 10.5px; font-weight: 600; color: #4c7a66; letter-spacing: .2px; }
.sup-chip b { max-width: 150px; overflow: hidden; text-overflow: ellipsis; }
.sup-chip .sc-no { font-size: 11px; font-weight: 600; color: #4c7a66; background: #fff;
  border: 1px solid #cde7d9; border-radius: 6px; padding: 1px 5px; }
.sup-chip.off { background: #f6f7f8; border-color: #e3e8ee; color: #8a939d; box-shadow: none; cursor: default; }
.sup-chip.off .sc-ico { background: #c9d1d9; }
.sup-chip.off:hover { border-color: #e3e8ee; box-shadow: none; }
.sup-chip.sm { height: 27px; padding: 0 9px 0 5px; font-size: 12px; gap: 5px; }
.sup-chip.sm .sc-ico { flex-basis: 16px; width: 16px; height: 16px; font-size: 9px; }
.sup-chip.sm .sc-lb { font-size: 10px; }
.sup-chip.sm .sc-no { font-size: 10px; }
.sup-chip-wrap { display: inline-flex; align-items: center; margin-left: auto; flex: 0 0 auto; }
.seat-mod-hd { display: flex; align-items: center; gap: 8px; }
/* v1.284 ③区主入口 CTA：提到标题行右侧，明亮渐变 + 圆润饱满 + 悬浮上浮 */
.seat-buy-cta { display: inline-flex; align-items: center; gap: 6px; flex: 0 0 auto;
  height: 34px; padding: 0 20px; border: none; border-radius: 999px; cursor: pointer;
  background: linear-gradient(135deg, #ff9f43 0%, #f57c00 60%, #ef6c00 100%);
  color: #fff; font-size: 13px; font-weight: 700; letter-spacing: .3px; white-space: nowrap;
  box-shadow: 0 3px 10px rgba(239, 108, 0, .32), inset 0 1px 0 rgba(255, 255, 255, .35);
  transition: transform .15s ease, box-shadow .15s ease, filter .15s ease; }
.seat-buy-cta:hover { transform: translateY(-1px); filter: brightness(1.05); box-shadow: 0 6px 16px rgba(239, 108, 0, .42), inset 0 1px 0 rgba(255, 255, 255, .35); }
.seat-buy-cta:active { transform: translateY(0); filter: brightness(.97); box-shadow: 0 2px 6px rgba(239, 108, 0, .35); }
/* v1.321 小号变体：产品分组头部「买这个产品」等次要购买入口 */
.seat-buy-cta.sm { height: 28px; padding: 0 14px; font-size: 12px; gap: 5px; letter-spacing: 0; }
@media (max-width: 960px) { .seat-buy-cta { height: 30px; padding: 0 14px; font-size: 12px; } }
/* v1.343 / D-158 钉钉群通知：右栏随选中状态动态切换成一个主按钮（去选 / 去购买） */
.ding-cta { display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 12px; padding: 38px 14px; text-align: center; }
.ding-cta .dcta-ico { width: 56px; height: 56px; border-radius: 18px; display: flex; align-items: center; justify-content: center; font-size: 28px; background: var(--primary-light, #eaf6f0); }
.ding-cta .dcta-t { font-size: 14px; font-weight: 700; color: var(--text, #1f2937); }
.ding-cta .dcta-s { font-size: 11.5px; color: var(--text-2, #7b8794); }
.dcta-btn { height: 38px; padding: 0 24px; font-size: 14px; animation: dctaPulse 2.2s ease-in-out infinite; }
.dcta-btn:hover, .dcta-btn:active { animation: none; }
@keyframes dctaPulse {
  0%, 100% { box-shadow: 0 3px 10px rgba(239, 108, 0, .32), inset 0 1px 0 rgba(255, 255, 255, .35); }
  50% { box-shadow: 0 3px 10px rgba(239, 108, 0, .32), 0 0 0 7px rgba(255, 159, 67, .16), inset 0 1px 0 rgba(255, 255, 255, .35); }
}
@media (prefers-reduced-motion: reduce) { .dcta-btn { animation: none; } }
.ding-buy { display: flex; align-items: center; gap: 10px; flex-wrap: wrap; margin: 0 0 10px; padding: 12px 14px; border: 1px solid #ffd8a8; border-radius: 12px; background: linear-gradient(135deg, #fff8ee 0%, #fff1dd 100%); }
.ding-buy .db-t { flex: 1 1 100%; font-size: 13.5px; font-weight: 700; color: #a04a00; }
.ding-buy .db-s { flex: 1 1 auto; font-size: 11.5px; color: #96663a; }
@keyframes dingFlash { 0%, 100% { box-shadow: 0 0 0 0 rgba(26, 127, 90, 0); } 35% { box-shadow: 0 0 0 5px rgba(26, 127, 90, .22); } }
.ding-flash { animation: dingFlash 1.4s ease-out 1; border-radius: 12px; }
.adm-box-hd .sup-chip-wrap { margin-left: 0; }
.adm-box-hd .sup-chip.sm { height: 27px; }
@keyframes chipFlash { 0%, 100% { box-shadow: 0 0 0 0 rgba(26, 127, 90, 0); } 30% { box-shadow: 0 0 0 4px rgba(26, 127, 90, .18); } }
.chip-flash { animation: chipFlash 1.2s ease-out 1; border-radius: 12px; }
.seat-q-link { margin-left: 8px; border: none; background: none; padding: 0; font-size: 11.5px; color: var(--primary); cursor: pointer; text-decoration: underline; }
.seat-row.qpick { cursor: pointer; }
.seat-row.qpick:hover { background: #f7fbf9; }
.seat-row.on { background: #f2f8f5; }
@media (max-width: 960px) { .seat-q-hd { flex-wrap: wrap; } .seat-q-hd .adm-search { flex: 1 1 100%; } }
@media (max-width: 1240px) { #seatBox { grid-column: 1 / -1; } }
@media (max-width: 1240px) and (min-width: 961px) { .seat-list { max-height: 168px; } }
/* v1.171 采购员席位（S1 全功能 / S2 只读）：与授权用户数卡片同一套数字格子 */
.seat-2col { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; margin: 10px 0 2px; }
@media (max-width: 960px) { .seat-2col { grid-template-columns: 1fr; } }
.seat-line { border: 1px solid #e3efe9; border-radius: 10px; padding: 10px 11px; background: #fbfdfc; }
.seat-line .sl-hd { display: flex; align-items: baseline; gap: 6px; font-size: 13px; font-weight: 700; color: #26303a; }
.seat-line .sl-d { font-size: 11.5px; font-weight: 400; color: #8a939d; }
.seat-line .sl-warn { font-size: 11.5px; color: #b96a10; margin-top: 6px; }
/* v1.249 采购员管理：新计费版席位（费用ID账本）卡片与绑定表 */
/* v1.281 查询栏 + 费用ID账本 + 采购员账号 合并成一个盒子（用户 11-08：合并到上面一处） */
.bys-onebox { background: #fff; border: 1px solid var(--line); border-radius: 12px; padding: 12px 14px 14px; margin-top: 12px; }
.bys-onebox .filter { flex-wrap: wrap; }
.bys-onebox .table-wrap { margin-top: 2px; }
.seat-line .sl-note { font-size: 11.5px; color: #6b7480; line-height: 1.65; margin-top: 6px; }
.bys-fee-add { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; margin: 10px 0 4px; font-size: 12.5px; color: #4a5560; }
.bys-fee-hd { display: flex; flex-wrap: wrap; align-items: baseline; gap: 8px; margin: 12px 0 6px; font-size: 13px; }
.bys-fee-tip { font-size: 11.5px; color: #8a939d; font-weight: 400; }
/* v1.258 合并版费用ID账本：待支付/已到期提醒条 */
.bys-fee-warn { display: flex; flex-wrap: wrap; gap: 8px 18px; margin: 0 0 8px; padding: 8px 12px;
  border: 1px solid #f3d9b0; border-radius: 10px; background: #fff8ee; font-size: 12px; color: #8a5a10; }
.bys-fee-warn b { color: #b45309; }
.bys-fee-warn .ret-side { border-color: #f0c6c1; background: #fdf1f0; color: #b03a30; }
/* v1.283 合并表操作列：账号操作一行 + 席位操作一行，链接不换行错位 */
.bys-ops { font-size: 12px; line-height: 1.9; white-space: nowrap; }
.bys-ops .a-no { margin: 0 1px; }
/* v1.249 绑定席位弹层（与购买服务页同款行样式） */
.urow { display: flex; gap: 10px; align-items: center; padding: 8px 10px; border: 1px solid var(--line); border-radius: 8px; margin-bottom: 6px; cursor: pointer; font-size: 12.5px; }
.urow:hover { border-color: var(--primary); background: #f7faf8; }
.urow .c { width: 92px; font-weight: 700; color: var(--primary); }
.urow .n { flex: 1; }
.urow .r { color: #8a939d; font-size: 11.5px; }
/* v1.180 采购员席位选择卡片（弹窗里「席位类型」单选） */
.seat-choice { display: flex; flex-direction: column; gap: 3px; border: 1.5px solid #e3e8ee; border-radius: 10px; padding: 10px 11px; cursor: pointer; background: #fbfcfd; transition: border-color .15s, background .15s; }
.seat-choice input { display: none; }
.seat-choice b { font-size: 13.5px; color: #26303a; }
.seat-choice i { font-style: normal; font-size: 11.5px; color: #8a939d; line-height: 1.45; }
.seat-choice.on { border-color: var(--primary); background: #f2f8f5; }
.seat-choice.on b { color: var(--primary-dark); }
.seat-choice.on i { color: #4a7d66; }
/* v1.204 该类席位无可用额度：灰显不可选，避免选中后保存必被服务端拒绝 */
.seat-choice.off { opacity: .48; cursor: not-allowed; filter: grayscale(.55); }
.seat-choice.off:hover { border-color: #e3e8ee; }
#byQuotaTip { color: #6b7480; }

/* ============================================================
   v1.184 账号管理重排（用户 11-04：③区太挤，整页重排、紧凑能用）
   原：三栏 320/1fr/320（桌面 430/1fr/340），③只有 340px —— 席位按钮换行、
       模块行（名称+共/已分/剩+给这家+输入+保存）被挤爆。
   现：①选供应商 | ②填员工信息 两栏（②表单限宽不空旷），
       ③席位+模块额度 独占一整行，卡片内部再分左右两栏。
   注意：只作用于 npadmin（.np-wrap 修饰类），钉钉群页(.ding-wrap)的
   .adm-wrap 三栏行为保持原样；≤960 由后面 .app .adm-wrap 单列规则接管。
   ============================================================ */
.adm-wrap.np-wrap { grid-template-columns: minmax(300px, 380px) minmax(0, 1fr); }
.np-wrap #seatBox { grid-column: 1 / -1; }
#admForm { max-width: 720px; }
.seat-cols { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 12px 22px; align-items: stretch; }
.seat-col { min-width: 0; display: flex; flex-direction: column; }
.seat-mod-hd { font-size: 13px; font-weight: 700; color: #2f3a45; margin: 0 0 7px; }
.seat-mod-sub { font-size: 11.5px; color: #8a939d; margin-bottom: 7px; line-height: 1.65; }
/* v1.189 席位有效期徽章：琥珀色胶囊，一眼看到到期日 */
.seat-exp { margin-left: auto; font-size: 12px; color: #8a5a10; background: #fdf3e6; border: 1px solid #f3dfc0; border-radius: 999px; padding: 3px 11px; font-weight: 500; white-space: nowrap; }
.seat-exp b { color: #b96a10; font-weight: 700; }
/* v1.187 功能模块额度列表：去 138px 小滚动框，整列铺满（跟随左栏高度拉伸） */
.seat-modlist { flex: 1; border: 1px solid var(--line); border-radius: 9px; margin-top: 2px; }
.seat-modlist .seat-row { padding: 8px 10px; }
/* v1.188 模块额度步进器：− / 输入 / + 一体，按钮 30px 好点 */
.mod-step { display: inline-flex; align-items: stretch; border: 1px solid #cfdfe5; border-radius: 8px; overflow: hidden; background: #fff; flex: none; }
.mod-step button { width: 32px; height: 30px; border: none; background: #eef7f2; color: var(--primary-dark); font-size: 16px; line-height: 30px; cursor: pointer; padding: 0; }
.mod-step button:hover { background: #dceee3; }
.mod-step button:active { background: var(--primary); color: #fff; }
.mod-step input { width: 54px; height: 30px; border: none; text-align: center; font-size: 13.5px; font-weight: 600; color: #26303a; padding: 0; }
.mod-step input::-webkit-outer-spin-button, .mod-step input::-webkit-inner-spin-button { -webkit-appearance: none; margin: 0; }
/* ③ 内部两栏在窄容器（≤1120，此时整行约 <870px）退回上下堆叠，保证每段都有完整行宽 */
@media (max-width: 1120px) { .seat-cols { grid-template-columns: 1fr; } }
@media (max-width: 1240px) and (min-width: 1121px) { .seat-cols { gap: 12px 16px; } }
/* v1.184 标题行防溢出：窄 iframe（≈960~1120）时右侧工具组换行，不再把「去配钉钉群」挤出屏幕 */
@media (max-width: 1120px) {
  .pt-row { flex-wrap: wrap; row-gap: 6px; }
  .pt-row .pt-right { flex-wrap: wrap; row-gap: 6px; }
}

/* 区块卡片：编号 + 标题 + 右侧说明 */
.adm-box { background: #fff; border: 1px solid var(--line); border-radius: 12px; overflow: hidden; }
.adm-box-hd { display: flex; align-items: center; gap: 8px; padding: 10px 14px;
  border-bottom: 1px solid var(--line); background: #fbfcfd; font-size: 13.5px; font-weight: 700; }
.adm-box-hd .n { flex: 0 0 19px; width: 19px; height: 19px; border-radius: 50%; background: var(--primary);
  color: #fff; font-size: 11.5px; font-weight: 700; display: inline-flex;
  align-items: center; justify-content: center; }
.adm-box-hd .hd-note { margin-left: auto; font-size: 11.5px; font-weight: 400; color: var(--text-2);
  overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.adm-box-bd { padding: 12px 14px; }

/* 搜索框 */
.adm-search { display: flex; gap: 6px; align-items: center; }
.adm-search input { flex: 1 1 auto; min-width: 0; padding: 9px 11px; border: 1px solid var(--line);
  border-radius: 8px; font-size: 13.5px; outline: none; }
.adm-search input:focus { border-color: var(--primary); box-shadow: 0 0 0 3px var(--primary-light); }
.adm-search .btn { flex: 0 0 auto; }

/* v1.46 精准 / 模糊 切换（贴合搜索框右侧的小钮，点了就地切换）
   虚线边框 + 浅字，刻意和「全部/正常/停用」那种实心分档区分开 */
.adm-mode { flex: 0 0 auto; display: inline-flex; align-items: center; justify-content: center;
  min-width: 46px; height: 34px; padding: 0 7px; box-sizing: border-box; cursor: pointer;
  user-select: none; white-space: nowrap; font-size: 11px; line-height: 1;
  color: #8a939d; background: #fff; border: 1px dashed #cfd6dd; border-radius: 8px; letter-spacing: -.2px; }
.adm-mode:hover { border-style: solid; border-color: var(--primary); color: var(--primary); }
.adm-mode.exact { background: var(--primary-light); border: 1px solid #b9dfcd;
  color: var(--primary-dark); font-weight: 700; }
.adm-tools .adm-mode { height: 32px; margin-right: 2px; }
.adm-tools .adm-seg { margin-left: 4px; }
/* v1.52a：商品搜索框旁的模糊/精准钮（库存/销售/补货筛选行复用同一颗样式） */
.filter .adm-mode, .m-head .adm-mode { margin-left: 2px; }

/* 供应商行：第一行 名称+编号+开户数，第二行 手机号 */
.adm-sup-list { max-height: 250px; overflow: auto; border: 1px solid var(--line); border-radius: 9px;
  margin-top: 9px; background: #fff; }
.adm-sup-row { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 1px 8px;
  padding: 7px 10px; cursor: pointer; border-bottom: 1px solid #f2f4f6;
  border-left: 3px solid transparent; }
.adm-sup-row:last-child { border-bottom: none; }
.adm-sup-row:hover { background: #f6faf8; }
.adm-sup-row.on { background: var(--primary-light); border-left-color: var(--primary);
  box-shadow: inset 3px 0 0 var(--primary); }
.adm-sup-row .as-l1 { grid-column: 1; grid-row: 1; display: flex; align-items: baseline; gap: 6px; min-width: 0; }
.adm-sup-row .as-l1 b { font-size: 13.5px; font-weight: 600; overflow: hidden;
  text-overflow: ellipsis; white-space: nowrap; }
.adm-sup-row .as-l1 i { font-style: normal; font-size: 11.5px; color: var(--text-2); flex: 0 0 auto; }
.adm-sup-row .as-sub { grid-column: 1; grid-row: 2; font-size: 11.5px; color: #8a939d; font-variant-numeric: tabular-nums; }
.adm-sup-row .as-cnt { grid-column: 2; grid-row: 1; align-self: center; font-size: 11px; padding: 1px 8px;
  border-radius: 20px; background: #f1f3f5; color: var(--text-2); white-space: nowrap; }
.adm-sup-row .as-cnt.has { background: var(--primary-light); color: var(--primary-dark); }
.adm-sup-row.on .as-cnt.has { background: #fff; }
/* v1.61b：「已开 N 个」可点 → 跳到③已有账号只看这家 */
.adm-sup-row .as-cnt.lnk { cursor: pointer; transition: background .15s, transform .15s; }
.adm-sup-row .as-cnt.lnk:hover { background: var(--primary-dark); color: #fff; transform: translateY(-1px); }
.adm-list-note { padding: 7px 12px; font-size: 11.5px; color: var(--text-2); background: #fbfcfd;
  border-top: 1px solid var(--line); line-height: 1.65; }
.adm-list-note b { color: var(--primary); }

/* 未选供应商时的占位提示 */
.adm-empty { text-align: center; color: var(--text-2); font-size: 13px; padding: 28px 10px;
  display: flex; flex-direction: column; justify-content: center; min-height: 180px; }
.adm-empty .ae-t { font-size: 13.5px; color: var(--text); font-weight: 600; }
.adm-empty small { display: block; margin-top: 7px; font-size: 11.5px; opacity: .85; line-height: 1.7; }

/* 已选供应商条 */
.adm-picked { display: flex; align-items: center; gap: 10px; padding: 10px 12px;
  background: var(--primary-light); border: 1px solid #cfe8db; border-radius: 9px; margin-bottom: 13px; }
.adm-picked .ap-ico { flex: 0 0 30px; width: 30px; height: 30px; border-radius: 8px; background: #fff;
  color: var(--primary); display: flex; align-items: center; justify-content: center; font-size: 15px; }
.adm-picked .ap-name { font-size: 14px; font-weight: 700; overflow: hidden;
  text-overflow: ellipsis; white-space: nowrap; }
.adm-picked .ap-name i { font-style: normal; font-size: 11.5px; color: var(--text-2);
  font-weight: 400; margin-left: 6px; }
.adm-picked .ap-meta { font-size: 11.5px; color: var(--text-2); margin-top: 2px; }

/* 员工信息表单 */
.adm-fields { display: grid; gap: 11px; }
.adm-field label { display: flex; align-items: baseline; gap: 5px; font-size: 12px;
  color: var(--text-2); margin-bottom: 5px; }
.adm-field label b { color: var(--red); font-weight: 400; }
.adm-field label em { font-style: normal; font-size: 11px; color: #9aa3ad; }
.adm-field input { width: 100%; padding: 9px 11px; border: 1px solid var(--line);
  border-radius: 8px; font-size: 14px; outline: none; }
.adm-field input:focus { border-color: var(--primary); box-shadow: 0 0 0 3px var(--primary-light); }
.adm-field input.mono { font-variant-numeric: tabular-nums; letter-spacing: .6px; }
.adm-submit { display: flex; align-items: center; gap: 10px; flex-wrap: wrap; margin-top: 13px; }
.adm-submit .btn { flex: 0 0 auto; }
.adm-tip { font-size: 11.5px; color: var(--text-2); line-height: 1.6; }

/* ============================================================
   v1.45 已有账号：查询工具栏（搜索 + 状态三档 + 供应商快捷筛选）
   ============================================================ */
.adm-tools { display: flex; align-items: center; gap: 8px; flex-wrap: wrap;
  padding: 10px 12px; border-bottom: 1px solid var(--line); background: #fff; }
.adm-tools .adm-search { flex: 1 1 240px; min-width: 0; }
.adm-tools .adm-search input { padding: 7px 11px; font-size: 12.5px; border-radius: 8px; }
.adm-seg { flex: 0 0 auto; display: inline-flex; border: 1px solid var(--line);
  border-radius: 8px; overflow: hidden; background: #fff; }
.adm-seg a { padding: 6px 12px; font-size: 12.5px; color: var(--text-2); cursor: pointer;
  border-right: 1px solid var(--line); white-space: nowrap; line-height: 1.5; }
.adm-seg a:last-child { border-right: none; }
.adm-seg a:hover { background: #f6faf8; color: var(--primary); }
.adm-seg a.on { background: var(--primary-light); color: var(--primary-dark); font-weight: 700; }
.adm-tools-cnt { margin-left: auto; font-size: 12px; color: var(--text-2); white-space: nowrap;
  font-variant-numeric: tabular-nums; }
.adm-tools-cnt b { color: var(--primary); font-size: 13px; }
.adm-tools-reset { flex: 0 0 auto; padding: 5px 10px; font-size: 12px; color: var(--text-2);
  border: 1px dashed var(--line); border-radius: 7px; cursor: pointer; white-space: nowrap; }
.adm-tools-reset:hover { color: var(--red); border-color: var(--red); background: #fff7f7; }
/* 点供应商名 = 只看这家 */
.adm-tbl .c-sup .c-sup-lnk { cursor: pointer; }
.adm-tbl .c-sup .c-sup-lnk:hover b { color: var(--primary); text-decoration: underline; }
.adm-tbl .c-sup .c-cnt { display: inline-block; margin-left: 6px; padding: 0 7px; border-radius: 20px;
  background: var(--primary-light); color: var(--primary-dark); font-size: 10.5px;
  font-style: normal; font-weight: 400; vertical-align: 1px; }
@media (max-width: 768px) {
  .adm-tools { padding: 9px 12px; gap: 7px; }
  .adm-tools .adm-search { flex: 1 1 100%; }
  /* 手机：计数文案藏起来（底部「筛选出 N 个 / 共 M 个」已有），让清空和分段同一行 */
  .adm-tools-cnt { display: none; }
  .adm-tools-reset { margin-left: auto; }
  .adm-seg a { padding: 6px 11px; }
}

/* 已有账号表 */
.adm-tbl { font-size: 13px; }.adm-tbl td, .adm-tbl th { white-space: nowrap; }
.adm-tbl .c-login { font-weight: 700; font-variant-numeric: tabular-nums; letter-spacing: .3px; }
.adm-tbl .c-sup b { font-weight: 600; }
.adm-tbl .c-sup span { display: block; font-size: 11px; color: var(--text-2); }
.adm-tbl .c-time { font-size: 12px; color: var(--text-2); }
.adm-lnk { display: inline-block; padding: 3px 9px; margin-right: 6px; border-radius: 6px;
  border: 1px solid var(--line); font-size: 12px; color: var(--text-2); }
.adm-lnk:hover { border-color: var(--primary); color: var(--primary); }
.adm-lnk.danger:hover { border-color: var(--red); color: var(--red); }
.adm-sub { display: block; font-size: 11px; color: var(--text-2); }

/* 手机端账号卡片 */
.adm-card { background: #fff; border: 1px solid var(--line); border-radius: 10px;
  padding: 10px 12px; margin: 0 12px 8px; }
.adm-card:first-child { margin-top: 12px; }
.adm-card .ac-top { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; font-size: 14px; }
.adm-card .ac-top b { font-size: 15px; font-variant-numeric: tabular-nums; }
.adm-card .ac-line { font-size: 12.5px; margin-top: 3px; color: var(--text); }
.adm-card .ac-dim { color: var(--text-2); font-size: 12px; }
.adm-card .ac-btns { display: flex; gap: 8px; margin-top: 8px; }
.adm-card .ac-btns .tag { padding: 3px 11px; }

/* v1.61i 账号列表点行高亮：PC 表格行 + 手机卡片统一选中态 */
.acc-row { cursor: pointer; }
.acc-row td { transition: background .12s; }
.acc-row:hover td { background: #f4faf7; }
.acc-row.sel td { background: #e6f4ee; }
.acc-row.sel td:first-child { box-shadow: inset 3px 0 0 var(--primary); }
.acc-row.sel .c-login { color: var(--primary-dark); font-weight: 700; }
.adm-card { cursor: pointer; }
.adm-card.sel { border-color: var(--primary); background: #e6f4ee;
  box-shadow: inset 3px 0 0 var(--primary); }

/* 原系统内嵌 iframe 通常只有 780px 左右，扣掉平台侧栏放不下两栏 → 堆叠 */
@media (max-width: 960px) {
  .adm-wrap { grid-template-columns: 1fr; }
  .adm-sup-list { max-height: 208px; }
}
@media (max-width: 768px) {
  .adm-box-hd .hd-note { display: none; }
  .adm-box-bd { padding: 11px 12px; }
  .adm-field label em { margin-left: 0; }
}

/* ============================================================
   v1.39 新品申请表单 · 视觉重构
   顶部主色引导条 + 分区卡片 + 折叠「更多资料」+ 吸底操作栏
   ============================================================ */
.np-guide { display: flex; align-items: center; gap: 6px; white-space: nowrap; overflow-x: auto;
  background: var(--primary-light); border: 1px solid #cfe8db; border-radius: 9px;
  padding: 8px 12px; font-size: 12px; color: var(--primary-dark); margin-bottom: 13px;
  -webkit-overflow-scrolling: touch; scrollbar-width: none; }
.np-guide::-webkit-scrollbar { display: none; }
.np-guide b { font-weight: 700; }
.np-step { display: inline-flex; align-items: center; gap: 6px; white-space: nowrap; }
.np-guide i { font-style: normal; color: #7fb3a0; margin: 0 1px; }
.np-g-no { flex: 0 0 17px; width: 17px; height: 17px; border-radius: 50%; background: var(--primary);
  color: #fff; display: inline-flex; align-items: center; justify-content: center;
  font-size: 10.5px; font-weight: 700; }

.np-block { background: #fbfcfd; border: 1px solid var(--line); border-radius: 10px;
  padding: 11px 12px 3px; margin-bottom: 12px; }
.np-block .field { margin-bottom: 9px; }
.np-form .field label .req { color: var(--red); font-style: normal; margin-left: 2px; }
.np-form .field label { font-size: 11.5px; }
.np-form .field input, .np-form .field select { font-size: 13px; }

/* 分节标题 + 右侧工具（全选/清空/计数） */
.np-sec { margin: 14px 0 8px; }
.np-sec::after { flex: 1; order: 1; }
.np-sec > span:first-child { order: 0; }
.np-sec-tools { order: 2; display: flex; align-items: center; gap: 9px; font-size: 11.5px;
  font-weight: 400; letter-spacing: 0; color: var(--text-2); }
.np-sec-tools a { color: var(--primary); }
.np-sec-tools b { color: var(--primary); font-variant-numeric: tabular-nums; }

/* 折叠块 */
.np-fold { border: 1px solid var(--line); border-radius: 10px; margin-bottom: 10px;
  background: #fff; overflow: hidden; }
.np-fold > summary { list-style: none; cursor: pointer; padding: 10px 12px; font-size: 12.5px;
  font-weight: 700; color: var(--text-2); display: flex; align-items: center; gap: 7px;
  user-select: none; -webkit-tap-highlight-color: transparent; }
.np-fold > summary::-webkit-details-marker { display: none; }
.np-fold > summary::before { content: '▸'; color: var(--primary); font-size: 11px; }
.np-fold[open] > summary::before { content: '▾'; }
.np-fold > summary:hover { background: #f7faf9; }
.np-fold[open] > summary { border-bottom: 1px solid var(--line); color: var(--text); }
.np-fold > summary .fd-note { margin-left: auto; font-weight: 400; font-size: 11.5px; color: #9aa3ad; }
.np-fold-bd { padding: 11px 12px 3px; }

/* 花色 / 尺码 药丸：选中加主色底 + 勾 */
.np-chip { padding: 5px 13px; font-size: 12.5px; background: #fff; border-radius: 999px;
  transition: background .12s, border-color .12s; }
.np-chip:hover { border-color: #bfe3d4; }
.np-chip.on { box-shadow: 0 2px 6px rgba(26, 127, 90, .22); }

/* 分店 tile：文字单行省略，不撑破格子 */
.np-br-grid { grid-template-columns: repeat(auto-fill, minmax(176px, 1fr)); gap: 7px; }
.np-br { padding: 7px 9px; font-size: 12.5px; }
.np-br > span { flex: 1 1 auto; min-width: 0; overflow: hidden;
  text-overflow: ellipsis; white-space: nowrap; }
.np-br:hover { border-color: #bfe3d4; }
.np-br.on { color: var(--primary-dark); font-weight: 600; }
/* 勾选框别被 .field input{width:100%} 撑满整格（否则文字被挤没了） */
.np-form .field input[type="checkbox"] { width: auto; padding: 0; flex: 0 0 auto; }
.np-br input { flex: 0 0 auto; }
.np-hint { background: #f7faf9; border-radius: 7px; padding: 6px 10px; margin: 2px 0 10px; }

/* 操作栏：JS 渲染后挪到弹窗壳底部，固定在下方不遮挡表单 */
.np-acts { position: sticky; bottom: -16px; z-index: 2; margin: 4px -18px -16px;
  padding: 11px 18px; display: flex; gap: 8px; justify-content: flex-end;
  background: #fff; border-top: 1px solid var(--line); }
.modal-card > .np-acts { position: static; margin: 0; border-radius: 0 0 12px 12px; }
.modal-body.has-acts { flex: 1 1 auto; min-height: 0; }
.modal-card > .np-acts { justify-content: flex-end; }
.modal-card > .np-acts .btn { flex: 0 0 auto; min-width: 104px; }
@media (max-width: 768px) {
  .np-acts { bottom: -12px; margin: 4px -12px -12px; padding: 10px 12px; }
  .modal-card > .np-acts { padding: 10px 12px; }
  .modal-card > .np-acts .btn-primary { flex: 1 1 auto; }
  .modal-card > .np-acts .btn-ghost { flex: 0 0 auto; }
  /* 手机端引导条换成两行，别被横向滚动切断 */
  .np-guide { flex-wrap: wrap; white-space: normal; row-gap: 4px; overflow-x: visible; }
  .np-chip { padding: 6px 14px; }
  .np-br-grid { grid-template-columns: 1fr 1fr; }
}

/* v1.60d 价格框拖拽排序：按住标签拖动，锁定后禁止 */
.np-price-field > label { touch-action: none; user-select: none; -webkit-user-select: none; }
.np-price-field.np-dragging { opacity: .55; outline: 2px dashed var(--primary); outline-offset: 2px; border-radius: 8px; }
.np-sec-tools em { font-style: normal; color: #9aa3ad; margin-right: 8px; }
.np-sec-tools a { cursor: pointer; }

/* 新品申请页标题副说明（手机隐藏，省一行） */
.np-title-sub { font-size: 12px; color: var(--text-2); font-weight: 400; }
@media (max-width: 768px) { .np-title-sub { display: none; } }

/* 新品详情弹窗：字段分块，避免一坨小字 */
.np-dt-hd { display: flex; align-items: baseline; gap: 8px; flex-wrap: wrap;
  font-size: 15px; margin-bottom: 8px; }
.np-dt-hd b { font-variant-numeric: tabular-nums; }
.np-kv3 { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 5px 14px;
  font-size: 12px; color: var(--text-2); }
.np-kv3 b { color: var(--text); font-weight: 600; }
@media (max-width: 768px) { .np-kv3 { grid-template-columns: 1fr 1fr; } }

/* 新品详情弹窗补充块（v1.39） */
.np-dt-flags { display: flex; flex-wrap: wrap; gap: 4px 14px; font-size: 12px;
  color: var(--text-2); margin-top: 9px; padding-top: 9px; border-top: 1px dashed var(--line); }
.np-dt-rej { margin-top: 8px; font-size: 12px; color: var(--red); background: #fdecec;
  border-radius: 7px; padding: 6px 10px; line-height: 1.6; }
.np-dt-memo { margin-top: 8px; font-size: 12px; color: var(--text-2); line-height: 1.6; }
.np-dt-sku { margin-top: 8px; font-size: 12px; color: var(--text-2); line-height: 1.7; }

/* ============================================================
   账号管理 v1.38c 优化：
   ① 左栏（选供应商）加宽 ② 名称/编号区分更明显
   ③ 表单紧凑 ④ 供应商列表分页条
   ============================================================ */
@media (min-width: 769px) {   /* 仅桌面加宽，手机保持单列（isMobile 与 CSS 断点一致） */
.adm-wrap { grid-template-columns: 430px minmax(0, 1fr) minmax(0, 340px); }
.adm-sup-list { max-height: 340px; }
}
/* 编号做成浅底描边小徽章，和加粗的供应商名称一眼区分 */
.adm-sup-row .as-l1 i { font-style: normal; font-size: 11px; color: #5c6670;
  background: #f2f5f4; border: 1px solid var(--line); border-radius: 6px;
  padding: 1px 7px; white-space: nowrap; flex: 0 0 auto; }
.adm-sup-row .as-l1 b { font-size: 14px; }
/* 填员工信息窗口收紧一点 */
.adm-box-bd { padding: 10px 12px; }
.adm-fields { gap: 8px; }
.adm-field input { padding: 7px 10px; }
.adm-picked { padding: 8px 10px; gap: 8px; }
.adm-picked .ap-ico { flex: 0 0 26px; width: 26px; height: 26px; font-size: 14px; }
.adm-picked .ap-name { font-size: 13.5px; }
.adm-picked .ap-name i { font-style: normal; font-size: 11px; color: #5c6670;
  background: #f2f5f4; border: 1px solid var(--line); border-radius: 6px;
  padding: 1px 7px; margin-left: 6px; }
.adm-picked .ap-meta { margin-top: 1px; }
/* 用户名只读展示（系统自动生成，不可改） */
.adm-username { padding: 7px 10px; border: 1px dashed var(--line); border-radius: 8px;
  background: #f7faf9; color: var(--primary-dark, #14664a); font-size: 13px;
  letter-spacing: .6px; font-variant-numeric: tabular-nums; }
/* 供应商列表分页条 */
.adm-pager { display: flex; align-items: center; gap: 8px; flex-wrap: wrap;
  padding: 8px 2px 0; font-size: 12px; color: var(--text-2); }
.adm-pager .pg-btn { border: 1px solid var(--line); background: #fff; border-radius: 7px;
  padding: 4px 10px; font-size: 12px; cursor: pointer; color: var(--text); }
.adm-pager .pg-btn:hover:not(:disabled) { border-color: var(--primary); color: var(--primary); }
.adm-pager .pg-btn:disabled { opacity: .45; cursor: default; }
.adm-pager .pg-info b { color: var(--primary); }
.adm-pager .pg-size { margin-left: auto; display: inline-flex; align-items: center; gap: 5px; }
.adm-pager .pg-size input { width: 58px; padding: 4px 7px; border: 1px solid var(--line);
  border-radius: 7px; font-size: 12px; text-align: center; }
.adm-pager .pg-size input:focus { border-color: var(--primary); outline: none; }
/* v1.326 / D-141：数量手输，不要上下增减箭头（输入框已是纯文本框，这里再兜一层） */
.adm-pager .pg-size input { appearance: none; -moz-appearance: textfield; }
.adm-pager .pg-size input::-webkit-inner-spin-button,
.adm-pager .pg-size input::-webkit-outer-spin-button { -webkit-appearance: none; margin: 0; }
/* ①区列表按 5 家收缩后，「每页…确定」贴到盒子底部，与②区底边齐平；③区随之上移 */
.np-wrap #admSupBox .adm-box-bd { display: flex; flex-direction: column; }
.np-wrap #admSupBox #admSupList { flex: 0 0 auto; }
.np-wrap #admSupBox #admPager { margin-top: auto; }

/* 窄屏（原系统内嵌 iframe 约 780px）两栏放不下 → 强制单列堆叠
   用 .app .adm-wrap 提高特异性，避免被后面追加的 430px 两栏定义覆盖 */
@media (max-width: 960px) {
  .app .adm-wrap { grid-template-columns: minmax(0, 1fr); }
  .app .adm-sup-list { max-height: 208px; }
}

/* ================================================================
   v1.39c 新品审核：批量操作条 + 行勾选
   ================================================================ */
.np-rv-bar { display: flex; align-items: center; gap: 10px; flex-wrap: wrap;
  margin: 0 0 10px; padding: 8px 12px; background: var(--card);
  border: 1px solid var(--line); border-radius: 10px; font-size: 13px; }
.np-rv-bar b { color: var(--pri, #0e7a4e); }
.np-rv-tip { font-size: 12px; color: var(--text-2); }
.np-batch-rej { background: var(--red); color: #fff; border: none; }
/* v1.61g 批量删除：描边红，比驳回（实底红）轻一档，同样醒目 */
.np-batch-del { background: #fff; color: var(--red); border: 1px solid var(--red); }
.np-batch-del:hover { background: #fdecec; }
.np-sel-lb { display: inline-flex; align-items: center; gap: 3px; font-size: 12px; color: var(--text-2); cursor: pointer; }
.np-sel-lb input { width: auto; margin: 0; }
.np-batch-rej-bd { min-width: 320px; }

/* 表单标签旁的灰色小注（默认值说明 / 快捷提示，v1.41） */
.np-form .field label em { font-style: normal; margin-left: 5px; font-size: 11px; color: #9aa3ad; font-weight: 400; }

/* 新品清单的删除按钮：加大成圆形描边按钮，鼠标/手指都好点（v1.43） */
.cs-del { flex: 0 0 auto; width: 32px; height: 32px; border-radius: 50%;
  display: inline-flex; align-items: center; justify-content: center;
  border: 1px solid #d5dde6; color: #6f7a87; font-size: 15px; line-height: 1;
  background: #fbfcfd; cursor: pointer; transition: border-color .15s, color .15s, background .15s, transform .12s; }
.cs-del:hover { border-color: #f3bdb8; color: var(--red); background: #fdecec; }
.cs-del:active { transform: scale(.94); }
@media (max-width: 768px) { .cs-del { width: 34px; height: 34px; font-size: 16px; } }

/* ================================================================
   v1.47 手机扫码查询：搜索框旁 📷 按钮 + 全屏扫码取景层
   桌面隐藏（只在手机/触屏小屏显示，断点与 isMobile 逐字一致）
   ================================================================ */
.scan-btn { display: none; width: 34px; height: 34px; flex: 0 0 34px;
  align-items: center; justify-content: center; font-size: 16px;
  border: 1px solid var(--line); border-radius: 8px; background: var(--card);
  cursor: pointer; padding: 0; line-height: 1; }
.scan-btn:active { background: var(--line); }
@media (max-width: 768px), (orientation: landscape) and (max-height: 520px) and (pointer: coarse) {
  .scan-btn { display: inline-flex; }
}
#scanWrap { position: fixed; inset: 0; z-index: 9999; background: #000; }
#scanWrap video { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }
#scanWrap .scan-mask { position: absolute; inset: 0; background: rgba(0,0,0,.45); }
#scanWrap .scan-frame { position: absolute; left: 50%; top: 38%; transform: translate(-50%,-50%);
  width: 76vw; max-width: 340px; height: 46vw; max-height: 220px;
  border: 2px solid #4ade80; border-radius: 12px; box-shadow: 0 0 0 9999px rgba(0,0,0,.45); }
#scanWrap .scan-frame::before, #scanWrap .scan-frame::after { content: ''; position: absolute; left: 50%; transform: translateX(-50%);
  width: 60%; height: 2px; background: #4ade80; }
#scanWrap .scan-frame::before { top: 12px; } #scanWrap .scan-frame::after { bottom: 12px; }
#scanWrap .scan-tip { position: absolute; left: 0; right: 0; top: calc(38% + 24vw + 26px);
  text-align: center; color: #fff; font-size: 14px; text-shadow: 0 1px 3px rgba(0,0,0,.8); }
#scanWrap .scan-close { position: absolute; left: 50%; transform: translateX(-50%); bottom: max(36px, env(safe-area-inset-bottom));
  padding: 10px 26px; border: none; border-radius: 22px; background: rgba(255,255,255,.92);
  color: #111; font-size: 15px; font-weight: 600; cursor: pointer; }

/* ================================================================
   v1.88 标准扫码输入（web/scan.js 的 SCN.field 生成，两端共用）
   输入框 + 内嵌 📷 按钮：手动输入和扫码识别并排，电脑 / 手机都显示
   ================================================================ */
.scn-field { display: flex; gap: 6px; align-items: stretch; }
.scn-field input { flex: 1; min-width: 0; }
.scn-field .scn-go { width: 38px; flex: 0 0 38px; align-self: stretch;
  display: inline-flex; align-items: center; justify-content: center;
  font-size: 17px; border: 1px solid var(--line); border-radius: 8px;
  background: var(--primary-light, var(--card)); cursor: pointer; padding: 0; line-height: 1; }
.scn-field .scn-go:active { background: var(--line); }

/* ================================================================
   v1.49 账号管理：供应商钉钉群 webhook 配置区
   ================================================================ */
.ding-row { display: flex; align-items: center; gap: 10px; padding: 9px 2px;
  border-bottom: 1px solid #f2f4f6; }
.ding-row:last-of-type { border-bottom: none; }
.ding-main { flex: 1 1 auto; min-width: 0; }
.ding-url { font-family: Consolas, Menlo, monospace; font-size: 11.5px; color: var(--text);
  overflow: hidden; text-overflow: ellipsis; white-space: nowrap; direction: rtl;
  text-align: left; }   /* rtl 截断：超长时保留尾部（access_token 在尾部），一眼能分辨不同群 */
.ding-meta { display: flex; align-items: center; gap: 8px; margin-top: 3px;
  font-size: 11.5px; color: var(--text-2); flex-wrap: wrap; }
.ding-badge { font-size: 11px; border-radius: 20px; padding: 1px 9px; white-space: nowrap; }
.ding-badge.ok { background: var(--primary-light); color: var(--primary-dark); }
.ding-badge.warn { background: #fff3e0; color: #b06f00; }
.ding-rk { color: var(--text); font-weight: 600; }
.ding-lnk { flex: 0 0 auto; font-size: 12.5px; color: var(--primary); cursor: pointer;
  text-decoration: none; white-space: nowrap; }
.ding-lnk:hover { text-decoration: underline; }
.ding-lnk.del { color: var(--red); }
.ding-add { display: flex; gap: 6px; margin-top: 10px; flex-wrap: wrap; }
.ding-add input { flex: 1 1 220px; min-width: 0; padding: 9px 11px; border: 1px solid var(--line);
  border-radius: 8px; font-size: 12.5px; font-family: Consolas, Menlo, monospace; outline: none; }
.ding-add input:focus { border-color: var(--primary); box-shadow: 0 0 0 3px var(--primary-light); }
.ding-add .btn { flex: 0 0 auto; }
.ding-tip { margin-top: 9px; padding: 8px 11px; border-radius: 8px; background: #fbfcfd;
  border: 1px solid #f0f3f5; font-size: 11.5px; color: var(--text-2); line-height: 1.7; }
.ding-tip b { color: var(--primary); }

/* v1.51 快捷区间钮点选高亮（销售/单据页 今天/近7天/近30天/近90天） */
.quick-rng button.on { background: var(--primary); color: #fff; font-weight: 700; border-color: var(--primary); }
.quick-rng button.on:hover { background: var(--primary-dark, var(--primary)); }

/* v1.52 新品审核：列表可点开详情 + 审核弹窗顶部摘要 */
.np-lnk { color: var(--primary-dark); cursor: pointer; text-decoration: none; }
.np-lnk:hover { text-decoration: underline; }
tr.np-row { cursor: pointer; }
tr.np-row:hover td { background: #f7fbf9; }
.np-rv-top { display: flex; flex-wrap: wrap; gap: 6px 14px; align-items: center;
  font-size: 12.5px; color: var(--text-2); margin-bottom: 10px; padding: 8px 10px;
  background: #fbfcfd; border: 1px solid var(--line); border-radius: 10px; }
.np-rv-top b { color: var(--text); font-weight: 700; }
.np-rv-brs { flex: 1 1 100%; }
@media (max-width: 768px) {
  .np-rv-top { font-size: 12px; gap: 4px 10px; padding: 7px 9px; }
}
/* v1.52 审核弹窗：审核意见区（放顶部，驳回时不用滚到底） */
.np-rv-opin { margin: 0 0 10px; }
.np-rv-opin textarea { width: 100%; box-sizing: border-box; padding: 7px 9px; font-size: 13px;
  border: 1px solid var(--line); border-radius: 8px; resize: vertical; font-family: inherit; }
.np-rv-opin textarea:focus { outline: none; border-color: var(--primary); box-shadow: 0 0 0 3px rgba(26,127,90,.1); }

/* ================= v1.53 钉钉群通知独立菜单 ================= */
/* 标题行右侧容器：统计文字 + 「去配钉钉群」入口排一起，别被 space-between 拉散 */
.pt-right { display: flex; align-items: center; gap: 10px; min-width: 0; }
.adm-pg-link { flex: 0 0 auto; cursor: pointer; font-size: 12.5px; font-weight: 600;
  color: var(--primary); background: #f0f8f4; border: 1px solid #cfe6db;
  border-radius: 999px; padding: 3px 11px; white-space: nowrap; }
.adm-pg-link:hover { background: #e4f2ea; border-color: var(--primary); }
/* 选中供应商条上的「🔔 钉钉群」入口：靠右，不挤压供应商名 */
.adm-picked .adm-lnk { white-space: nowrap; }
@media (max-width: 768px) {
  .pt-right { gap: 8px; }
  .adm-pg-link { font-size: 12px; padding: 2px 9px; }
}
/* 钉钉页：右栏内容比左栏短，卡片按自身高度收，不拉到底留大白 */
.adm-wrap.ding-wrap { align-items: start; }

/* ================= v1.54 刷新更新入口：只放三个管理页的标题行 ================= */
/* 原来挂在侧栏底部，迎客货商平台也会看到；现在只给「新品审核 / 账号管理 / 钉钉群通知」三页 */
/* v1.95 醒目按钮化：从灰边胶囊升级为主题色实心按钮（右上角一眼能看到） */
.pg-refresh { flex: 0 0 auto; cursor: pointer; font-size: 12.5px; font-weight: 700;
  color: #fff; background: var(--primary); border: 1px solid var(--primary);
  border-radius: 999px; padding: 4px 14px; white-space: nowrap;
  box-shadow: 0 2px 8px rgba(26, 127, 90, .30); transition: background .15s, border-color .15s, box-shadow .15s; }
.pg-refresh:hover { color: #fff; border-color: var(--primary-dark); background: var(--primary-dark);
  box-shadow: 0 3px 12px rgba(26, 127, 90, .45); }
/* v1.54b 动效：图标单独包一层，悬停转半圈示意；点击后（.busy）持续旋转表示进行中，
   真正重载时 body.pg-reloading 兜底让旋转保持到页面重建 */
.pg-refresh .pg-ico { display: inline-block; transition: transform .35s ease; }
.pg-refresh:hover .pg-ico { transform: rotate(180deg); }
@keyframes pgSpin { to { transform: rotate(360deg); } }
.pg-refresh.busy .pg-ico, body.pg-reloading .pg-refresh .pg-ico {
  transform: none; transition: none; animation: pgSpin .8s linear infinite; }
/* v1.94 「3 秒自转提醒」框架标准：让用户知道这个按钮能点、平台有新版本可取。
   做法：⟳ 图标每 3 秒自转一整圈（动画只占周期前 18%，其余时间静止，不吵）。
   收口在 .pg-refresh 上 —— 凡是 refreshBtn() 生成的按钮（新品审核/账号管理/钉钉群/盘点/配送总览…）
   自动获得，新模块直接调 refreshBtn() 即可，不用写任何额外 CSS/JS。
   悬停时关掉自转、回到 v1.54b 的「转半圈」；点击后 .busy / body.pg-reloading 的持续旋转
   优先级更高（0-3-0 > 0-2-0），盖过本动画，行为不变。 */
@keyframes pgHintSpin {
  0% { transform: rotate(0); }
  18% { transform: rotate(360deg); }
  100% { transform: rotate(360deg); }
}
.pg-refresh .pg-ico { animation: pgHintSpin 3s ease-in-out infinite; }
.pg-refresh:hover .pg-ico { animation: none; }
@media (prefers-reduced-motion: reduce) { .pg-refresh .pg-ico { animation: none; } }
/* 新品审核标题行：标题在左，切档 + 刷新在右；窄屏自动换行 */
.npr-hd { display: flex; align-items: center; gap: 10px; flex-wrap: wrap; }
.npr-hd .page-title { margin-bottom: 0; }
.npr-hd-r { display: flex; align-items: center; gap: 10px; margin-left: auto; }
.npr-hd-r .seg3 { margin: 0; flex: 0 0 220px; }   /* 定宽：seg3 里的按钮是 flex:1 1 0，作为 flex 子项不定宽会被压成竖排字 */
.npr-hd-r .seg3 button { white-space: nowrap; }
@media (max-width: 768px) {
  .npr-hd { gap: 8px; }
  .npr-hd-r { margin-left: 0; width: 100%; }
  .npr-hd-r .seg3 { flex: 1 1 auto; max-width: none !important; }
  .pg-refresh { font-size: 12px; padding: 3px 11px; }
}

/* ================= v1.95b 新品审核菜单徽标：有新待审时红色数字角标 ================= */
#nav a[data-page="npreview"] { position: relative; }
.np-badge { position: absolute; right: 10px; top: 50%; transform: translateY(-50%);
  min-width: 18px; height: 18px; line-height: 18px; padding: 0 5px;
  background: var(--red); color: #fff; font-style: normal;
  font-size: 11px; font-weight: 700; border-radius: 999px; text-align: center;
  box-shadow: 0 1px 4px rgba(217, 70, 62, .4); }

/* ================= v1.63b 盘点弹窗：仓库/品类清单式勾选 ================= */
/* 单列上下排列，每行 = 勾选框 + 编码(定宽) + 名称；编码对齐一眼可扫 */
.stn-list { max-height: 200px; overflow: auto; border: 1px solid var(--line);
  border-radius: 8px; padding: 4px 6px; background: #fff; }
.stn-row { display: flex; align-items: center; gap: 8px; padding: 5px 4px;
  border-bottom: 1px dashed var(--line); cursor: pointer; font-size: 13px; }
.stn-row:last-child { border-bottom: none; }
.stn-row:hover { background: #f6faf8; }
.stn-row input[type="checkbox"] { width: auto; flex: 0 0 auto; margin: 0; vertical-align: middle; }
.stn-code { flex: 0 0 62px; font-weight: 600; color: var(--primary); font-size: 12.5px;
  font-family: Consolas, monospace; }
.stn-name { flex: 1 1 auto; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.stn-cnt { font-size: 12px; color: var(--text-2); }
@media (max-width: 760px) {
  .stn-list { max-height: 160px; }
  .stn-code { flex-basis: 54px; }
}

/* ---------------- v1.69 采购员管理：分店范围多选芯片 ---------------- */
.adm-chip { display: inline-block; border: 1px solid var(--line); background: #fff;
  border-radius: 20px; padding: 4px 12px; font-size: 12.5px; color: var(--text-2);
  cursor: pointer; user-select: none; margin: 0 6px 6px 0; }
.adm-chip.on { background: var(--primary-light); border-color: var(--primary);
  color: var(--primary-dark); font-weight: 600; }
.b-scope-chips { max-height: 200px; overflow-y: auto; border: 1px solid var(--line);
  border-radius: 8px; padding: 8px; }

/* ============================================================
   v1.70 导航重构：侧栏分类入口 + 分类卡片页 + 工作台双选项卡
   背景：侧栏原来 13 项一长条（PC 窄高窗口要滚动），采购类 6 项混在中间看不出层次。
   现在侧栏只留「工作台 + 采购/商品/账务/管理」，点分类进卡片页（卡片从左到右排）。
   ============================================================ */
/* 侧栏分类项：图标 + 名称（v1.70b 用户要求去掉右侧数量徽章，.nc-c 规则一并清掉） */
.sidebar nav a.nav-cat { display: flex; align-items: center; gap: 9px; }
.sidebar nav a.nav-cat .nc-i { font-size: 15px; width: 18px; text-align: center; flex: 0 0 18px; }
.sidebar nav a.nav-cat .nc-n { flex: 1; font-weight: 600; }

/* 分类页：标题下说明 + 卡片网格（PC 自适应列数，从左到右依次排列） */
.cat-sub { font-size: 12px; color: var(--text-2); margin: -4px 0 12px; }
.cat-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(230px, 1fr)); gap: 12px; }
.cat-card { display: flex; align-items: center; gap: 12px; padding: 14px; background: #fff;
  border: 1px solid var(--line); border-radius: 12px; text-decoration: none; color: var(--text);
  transition: transform .15s, box-shadow .15s, border-color .15s; -webkit-tap-highlight-color: transparent; }
.cat-card:hover { transform: translateY(-2px); box-shadow: 0 6px 16px rgba(20, 102, 74, .10); border-color: #bfe3d4; }
.cat-card:active { transform: translateY(0); }
/* 当前所在模块的卡片高亮（从分类页再点进模块后返回时会命中） */
.cat-card.active { border-color: var(--primary); background: var(--primary-light); }
.cat-card .cc-ico { width: 40px; height: 40px; border-radius: 12px; display: flex; align-items: center;
  justify-content: center; font-size: 19px; flex: 0 0 40px; }
.cat-card .cc-txt { flex: 1; min-width: 0; display: flex; flex-direction: column; gap: 2px; }
.cat-card .cc-txt b { font-size: 14px; font-weight: 600; }
.cat-card .cc-txt i { font-style: normal; font-size: 11.5px; color: var(--text-2);
  overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.cat-card .cc-go { color: #b9c2bf; font-size: 18px; flex: 0 0 auto; }
/* v1.162 系统设置中转页：两张大卡片（删除数据 / 特殊操作密码），圆润、居中排布 */
.sysset-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(280px, 1fr));
  gap: 14px; max-width: 720px; margin-top: 12px; }
.sysset-grid .cat-card { padding: 18px 16px; gap: 14px; border-radius: 14px; }
.sysset-grid .cat-card .cc-ico { width: 46px; height: 46px; border-radius: 14px; font-size: 22px; flex-basis: 46px; }
.sysset-grid .cat-card .cc-txt b { font-size: 15px; }
.sysset-grid .cat-card .cc-txt i { white-space: normal; line-height: 1.5; }
.sysset-grid .cat-card .cc-go { font-size: 20px; color: var(--primary); font-weight: 700; }

/* 工作台顶部快捷入口（用户在「快捷菜单设置」里勾的那些） */
.wk-quick { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 14px; align-items: center; }
.wk-quick .wq-item { display: inline-flex; align-items: center; gap: 6px; padding: 7px 13px 7px 10px;
  background: #fff; border: 1px solid var(--line); border-radius: 999px; font-size: 13px;
  color: var(--text); text-decoration: none;
  transition: border-color .15s, box-shadow .15s, transform .15s; }
.wk-quick .wq-item:hover { border-color: #bfe3d4; box-shadow: 0 3px 10px rgba(20, 102, 74, .10); transform: translateY(-1px); }
.wk-quick .wq-i { font-size: 14px; }
.wk-quick .wq-none { font-size: 12.5px; color: var(--text-2); }
.wk-quick .wq-set { border: 1px dashed #cfd8d4; background: transparent; color: var(--text-2);
  font-size: 12px; padding: 6px 11px; border-radius: 999px; cursor: pointer; font-family: inherit; }
.wk-quick .wq-set:hover { color: var(--primary); border-color: #bfe3d4; }

/* 工作台并列选项卡：功能菜单 / 快捷菜单设置 */
.wk-tabs { display: flex; gap: 6px; border-bottom: 1px solid var(--line); margin: -2px 0 14px; }
.wk-tab { position: relative; border: 0; background: transparent; font-family: inherit; cursor: pointer;
  font-size: 13.5px; color: var(--text-2); padding: 9px 14px 11px; border-radius: 8px 8px 0 0; }
.wk-tab:hover { color: var(--primary); background: var(--primary-light); }
.wk-tab.on { color: var(--primary-dark); font-weight: 700; }
.wk-tab.on::after { content: ''; position: absolute; left: 12px; right: 12px; bottom: -1px; height: 2.5px;
  border-radius: 2px 2px 0 0; background: var(--primary); }
/* 功能菜单按分类分组 */
.mod-group + .mod-group { margin-top: 16px; }
.mg-head { display: flex; align-items: center; gap: 6px; font-size: 13px; font-weight: 600;
  color: var(--text); margin: 0 0 9px; }
.mg-head .mg-i { font-size: 14px; }
.mg-head .mg-c { font-size: 11px; font-weight: 400; color: var(--text-2); background: #f2f5f4;
  border-radius: 999px; padding: 1px 7px; }

/* 快捷菜单设置：勾选胶囊 */
.qk-tip { font-size: 12px; color: var(--text-2); margin: -2px 0 14px; line-height: 1.6; }
.qk-group + .qk-group { margin-top: 14px; }
.qk-head { font-size: 12.5px; color: var(--text-2); margin-bottom: 8px; }
.qk-list { display: flex; flex-wrap: wrap; gap: 8px; }
.qk-item { display: inline-flex; align-items: center; gap: 6px; padding: 7px 13px 7px 9px;
  border: 1px solid var(--line); border-radius: 10px; background: #fff; font-size: 13px;
  cursor: pointer; transition: border-color .15s, background .15s, color .15s; user-select: none;
  -webkit-tap-highlight-color: transparent; }
.qk-item:hover { border-color: #bfe3d4; }
.qk-item .qk-ck { width: 15px; height: 15px; border-radius: 4px; border: 1.5px solid #cfd8d4;
  display: flex; align-items: center; justify-content: center; font-size: 10px; color: #fff;
  line-height: 1; flex: 0 0 15px; }
.qk-item.on { border-color: var(--primary); background: var(--primary-light); color: var(--primary-dark); font-weight: 600; }
.qk-item.on .qk-ck { background: var(--primary); border-color: var(--primary); }
.qk-item .qk-i { font-size: 13px; }

@media (max-width: 768px) {
  .cat-grid { grid-template-columns: 1fr 1fr; gap: 9px; }
  .cat-card { padding: 11px 10px; gap: 9px; }
  .cat-card .cc-ico { width: 34px; height: 34px; border-radius: 10px; font-size: 16px; flex-basis: 34px; }
  .cat-card .cc-txt b { font-size: 12.5px; }
  .cat-card .cc-txt i, .cat-card .cc-go { display: none; }
  .wk-tabs { gap: 2px; }
  .wk-tab { padding: 8px 11px 10px; font-size: 13px; }
  .wk-quick { gap: 7px; }
  .wk-quick .wq-item { padding: 6px 11px 6px 9px; font-size: 12.5px; }
  .qk-item { padding: 6px 11px 6px 8px; font-size: 12.5px; }
}

/* ============================================================
   v1.72 采购员「分店范围」改单列行式
   背景：原来是自动换行的胶囊（.adm-chip），18 个仓库挤成 4~5 列，
         名称被压缩看不清；且勾「全部分店」时整块列表直接隐藏，
         用户看不到到底包含哪些仓库。现在列表常显 + 一行一家。
   ============================================================ */
.b-scope-chips { max-height: 264px; }          /* 单列后行数多，容器略高一点，超出滚动 */
.bsc-row { display: flex; align-items: center; gap: 9px; padding: 8px 10px;
  border: 1px solid transparent; border-radius: 8px; font-size: 13px; color: var(--text);
  cursor: pointer; user-select: none; -webkit-tap-highlight-color: transparent;
  transition: background .12s, border-color .12s; }
.bsc-row + .bsc-row { margin-top: 3px; }
.bsc-row:hover { background: #f5f9f7; }
.bsc-row.on { background: var(--primary-light); border-color: var(--primary); color: var(--primary-dark); font-weight: 600; }
.bsc-row .bsc-ck { width: 16px; height: 16px; border-radius: 4px; border: 1.5px solid #cfd8d4;
  display: flex; align-items: center; justify-content: center; font-size: 11px; line-height: 1;
  color: transparent; flex: 0 0 16px; }
.bsc-row.on .bsc-ck { background: var(--primary); border-color: var(--primary); color: #fff; }
.bsc-row .bsc-no { flex: 0 0 66px; color: var(--text-2); font-variant-numeric: tabular-nums; font-weight: 400; }
.bsc-row.on .bsc-no { color: var(--primary-dark); }
.bsc-row .bsc-nm { flex: 1; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
@media (max-width: 768px) {
  .bsc-row { padding: 9px 8px; font-size: 13px; }
  .bsc-row .bsc-no { flex-basis: 62px; }
  .b-scope-chips { max-height: 240px; }
}

/* ============ v1.73 电脑端：分类页紧凑模式 + 分类冻结条 ============
   ① 分类页（#cat-purchase 等）标题与卡片整体做小一档（紧凑模式）；
   ② 进入模块页后，#catBar 出现一排紧凑功能卡片并 position:sticky 钉住，
      滚动不消失（冻结），当前模块高亮，点其他卡片在下方切换功能页；
   ③ 条子挂在 #content 外面，页面整块 innerHTML 刷新也冲不掉它。 */
:root { --cbh: 78px; }   /* 冻结条高度（整页冻结布局扣高度用，实测卡片条 77px + 1px 边框） */
.content-col { min-width: 0; }
.cat-head { display: flex; align-items: baseline; gap: 10px; margin: 0 0 12px; }
.cat-head b { font-size: 18px; font-weight: 700; }
.cat-head span { font-size: 12px; color: var(--text-2); }
/* v1.75 冻结条 = 置顶的分类卡片：复用 .cat-card 外观，钉住不滚动，当前模块 .on 高亮 */
.cat-bar { position: sticky; top: 0; z-index: 15; display: flex; flex-wrap: wrap; gap: 9px;
  padding: 10px 22px 12px; background: var(--bg); border-bottom: 1px solid var(--line); }
.cat-bar .cat-card { flex: 1 1 0; min-width: 122px; max-width: 230px; padding: 9px 11px; gap: 9px;
  border-radius: 10px; }
.cat-bar .cat-card:hover { transform: none; box-shadow: 0 3px 10px rgba(20, 102, 74, .10); }
/* v1.116 选中态加强：原来只有淡绿底+1px 边，跟未选中的白卡分不清；
   现在补上主色描边、标题主色加粗、箭头变实心主色，扫一眼就知道在哪个模块 */
.cat-bar .cat-card.on { border-color: var(--primary); background: var(--primary-light);
  box-shadow: inset 0 0 0 1px var(--primary), 0 2px 8px rgba(20, 102, 74, .12); }
.cat-bar .cat-card.on .cc-txt b { color: var(--primary-dark); font-weight: 700; }
.cat-bar .cat-card.on .cc-txt i { color: var(--primary-dark); opacity: .8; }
.cat-bar .cat-card.on .cc-go { color: var(--primary); font-weight: 700; }
.cat-bar .cat-card .cc-ico { width: 30px; height: 30px; border-radius: 9px; font-size: 15px; flex-basis: 30px; }
.cat-bar .cat-card .cc-txt b { font-size: 13px; }
.cat-bar .cat-card .cc-txt i { font-size: 11px; }
.cat-bar .cat-card .cc-go { font-size: 15px; }

@media (min-width: 769px) and (pointer: fine), (min-width: 769px) and (min-height: 521px) {
  /* #content 外面套了一层 .content-col，弹性宽度由它接管 */
  .content-col { flex: 1 1 auto; max-width: 1500px; }
  .content { max-width: none; }
  /* 分类页紧凑模式：标题、卡片整体做小 */
  .cat-head { margin-bottom: 8px; }
  .cat-head b { font-size: 15px; }
  .cat-head span { font-size: 11.5px; }
  .cat-grid { grid-template-columns: repeat(auto-fill, minmax(185px, 1fr)); gap: 9px; }
  .cat-card { padding: 9px 11px; gap: 9px; border-radius: 10px; }
  .cat-card .cc-ico { width: 30px; height: 30px; border-radius: 9px; font-size: 15px; flex-basis: 30px; }
  .cat-card .cc-txt b { font-size: 13px; }
  .cat-card .cc-txt i { font-size: 11px; }
  .cat-card .cc-go { font-size: 15px; }
  /* 冻结条出现时，整页冻结布局（补货下单/订单配送）高度要减去条高，否则底部被顶出屏幕 */
  body.catbar-on .content.page-fixed,
  body.catbar-on .content.dlv-fixed { height: calc(100vh - var(--cbh)); }
}

/* v1.73 钉钉页「外链状态」徽章：隧道掉线时变红，避免群里点开空白 */
.dlk-badge { display: inline-flex; align-items: center; gap: 5px; font-size: 12px; line-height: 1;
  padding: 5px 10px; border-radius: 999px; border: 1px solid var(--line); background: #fff;
  color: var(--text-2); cursor: pointer; max-width: 340px; overflow: hidden;
  white-space: nowrap; text-overflow: ellipsis; user-select: none; }
.dlk-badge:hover { border-color: #cfd8d4; }
.dlk-badge.ok { background: var(--primary-light); border-color: #bfe3d4; color: var(--primary-dark); }
.dlk-badge.bad { background: #fdecec; border-color: #f0c9c9; color: #b03a3a; }
@media (max-width: 768px) { .dlk-badge { max-width: 100%; font-size: 11.5px; } }

/* ============ v1.73c PC 端模块页头部紧凑：给下方订单列表让空间 ============
   只动电脑端：标题/说明行/筛选行/统计卡整体收一档（手机布局不变）。
   电脑端 .list-head 是普通容器（冻结条在更上方的 #catBar），这里只压缩高度。 */
@media (min-width: 769px) and (pointer: fine), (min-width: 769px) and (min-height: 521px) {
  .list-head .page-title { font-size: 15px; margin-bottom: 6px; }
  .pg-hint { font-size: 11px; margin: -4px 0 6px; }
  .filter { gap: 6px; margin-bottom: 8px; }
  .filter .btn-sm { padding: 5px 10px; font-size: 12.5px; }
  /* 统计卡：数字/图标/说明行同步收小，悬停浮动幅度减半（不挡下方列表视线） */
  .da-stats { gap: 8px; margin-bottom: 8px; }
  .da-stat { padding: 7px 10px 7px 13px; column-gap: 8px; }
  .da-stat:hover { transform: translateY(-2px); box-shadow: 0 6px 14px rgba(20, 102, 74, .14); }
  .da-stat::before { top: 7px; bottom: 7px; }
  .da-ico { width: 24px; height: 24px; border-radius: 7px; font-size: 13px; }
  .da-k { font-size: 11.5px; }
  .da-v { font-size: 17px; }
  .da-h { margin-top: 3px; padding-top: 3px; font-size: 10.5px; }
  .da-ck { top: 6px; right: 8px; }
}

/* ============================================================
   v1.73b 窄屏品牌字收口（钉钉截图暴露）
   问题：「供应链・货商」需要 112px，390 宽只有 105px、360 宽只有 75px →
         被省略号截成「供应链…」，看起来像半截。
   做法：只压徽章的留白和字号（气泡仍然完整），不砍文字、不改文案；
         360 以下再去掉气泡前的圆点，把最后一点空间让给文字。
   ============================================================ */
@media (max-width: 430px) {
  .topbar .logo-word { font-size: 13px; letter-spacing: 0; }
  .topbar .logo-word .lw-badge { margin-left: 4px; padding: 1px 6px 1.5px; font-size: 10px; letter-spacing: 0; }
  .topbar .logo-word .lw-badge .lw-dot { font-size: 12px; margin-right: 0; }
}
@media (max-width: 370px) {
  .topbar .logo-word { font-size: 12.5px; }
  .topbar .logo-word .lw-badge { padding: 1px 5px; margin-left: 3px; }
  .topbar .logo-word .lw-badge .lw-dot { display: none; }
}

/* ============ v1.77 手机端统一「品类选择」：胶囊 / 卡片 + 底部抽屉 ============
   所有 data-pk 的 <select> 在手机端被视觉隐藏（仍保留 value/change 语义），
   旁边插入一颗胶囊（筛选行）或一张卡片（表单），点开弹出底部抽屉。
   尺寸全部比着相邻控件做：胶囊对齐 .filter input（8px 10px / 13px），
   卡片对齐 .np-form .field input（5px 8px / 13px），保证同一行上下边缘齐平。 */
/* 原 select：绝对定位隐藏，不占位、不影响 .filter 的 flex 排布
   （必须 !important + 复合选择器：.filter input, .filter select 的 padding 特异性更高，
   不加会被撑到 20px 宽、白占一格） */
select.pk-sel, .pk-sel { position: absolute !important; width: 1px !important; min-width: 0 !important;
  height: 1px !important; padding: 0 !important; margin: -1px !important; border: 0 !important;
  opacity: 0 !important; pointer-events: none; overflow: hidden; }

/* ① 筛选行胶囊：品类 全部 ▾（固定 36px，与 .filter 输入框同高；居中对齐不随行拉伸） */
.pk-chip { display: inline-flex; align-items: center; justify-content: center; gap: 6px;
  box-sizing: border-box; height: 36px; align-self: center;
  padding: 0 10px; background: #fff; border: 1px solid var(--line); border-radius: 8px;
  font-size: 13px; color: var(--text); font-family: inherit; cursor: pointer; line-height: 1;
  -webkit-tap-highlight-color: transparent; transition: border-color .15s, background .15s; }
.pk-chip .pk-l { color: var(--text-2); font-size: 12px; }
.pk-chip .pk-v { font-weight: 600; max-width: 9em; overflow: hidden;
  text-overflow: ellipsis; white-space: nowrap; }
.pk-chip .pk-go { color: #a9b3b0; font-size: 11.5px; line-height: 1; }
.pk-chip:active { border-color: var(--primary); }
.pk-chip.on { border-color: #bfe3d4; background: var(--primary-light); }
.pk-chip.on .pk-v { color: var(--primary-dark); }

/* ② 表单卡片：🏷️ 品类名 / 编码 › */
.pk-card { display: flex; align-items: center; gap: 8px; width: 100%; min-height: 40px;
  padding: 4px 10px 4px 4px; background: #fff; border: 1px solid var(--line);
  border-radius: 8px; font-family: inherit; color: var(--text); text-align: left;
  cursor: pointer; -webkit-tap-highlight-color: transparent;
  transition: border-color .15s, box-shadow .15s; }
.pk-card:active { border-color: var(--primary); box-shadow: 0 0 0 3px var(--primary-light); }
.pk-card .pk-i { width: 26px; height: 26px; flex: 0 0 26px; border-radius: 7px;
  background: var(--primary-light); display: flex; align-items: center; justify-content: center; font-size: 13px; }
.pk-card .pk-b { flex: 1; min-width: 0; display: flex; flex-direction: column; gap: 0; }
.pk-card .pk-t { font-size: 13px; font-weight: 600; line-height: 1.35;
  overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.pk-card .pk-s { font-style: normal; font-size: 10.5px; line-height: 1.3; color: var(--text-2);
  overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.pk-card.empty .pk-t { color: #9aa3ad; font-weight: 500; }
.pk-card .pk-go { color: #b9c2bf; font-size: 16px; line-height: 1; }
/* 新品申请 / 审核弹窗里的紧凑表单（.np-form 输入框只有 27px 高）：
   卡片同步压成单行，去掉图标和编码行，高度与同排输入框一致 */
.np-form .pk-card { min-height: 0; height: 27px; padding: 0 8px; gap: 6px; margin: 0; }
.np-form .pk-card .pk-i { display: none; }
.np-form .pk-card .pk-s { display: none; }
.np-form .pk-card .pk-t { font-size: 13px; line-height: 1; }
.np-form .pk-card .pk-go { font-size: 14px; }

/* ③ 底部抽屉（搜索 + 双列网格，点选即回填） */
.pks { position: fixed; inset: 0; z-index: 92; }
.pks-mask { position: absolute; inset: 0; background: rgba(17, 24, 22, .42); opacity: 0; transition: opacity .18s; }
.pks.on .pks-mask { opacity: 1; }
.pks-panel { position: absolute; left: 0; right: 0; bottom: 0; margin: 0 auto; max-width: 560px;
  background: var(--card); border-radius: 16px 16px 0 0; padding: 8px 14px calc(12px + env(safe-area-inset-bottom));
  display: flex; flex-direction: column; max-height: 76vh; transform: translateY(100%);
  transition: transform .22s cubic-bezier(.22, .61, .36, 1); box-shadow: 0 -8px 24px rgba(0, 0, 0, .12); }
.pks.on .pks-panel { transform: translateY(0); }
.pks-bar { width: 38px; height: 4px; border-radius: 2px; background: #dfe4e2; margin: 2px auto 8px; }
.pks-head { display: flex; align-items: center; gap: 8px; padding-bottom: 9px; }
.pks-head b { font-size: 15px; }
.pks-head em { font-style: normal; font-size: 11.5px; color: var(--text-2); }
.pks-x { margin-left: auto; width: 28px; height: 28px; border-radius: 8px; background: #f2f5f4;
  color: var(--text-2); display: flex; align-items: center; justify-content: center; font-size: 13px; }
.pks-search { display: flex; align-items: center; gap: 7px; background: #f4f7f6;
  border: 1px solid var(--line); border-radius: 999px; padding: 7px 12px; margin-bottom: 10px; }
.pks-search input { flex: 1; min-width: 0; border: 0; background: transparent; outline: none;
  font-size: 13.5px; font-family: inherit; }
.pks-clr { font-size: 11.5px; color: var(--text-2); }
.pks-list { display: grid; grid-template-columns: 1fr 1fr; gap: 8px; overflow-y: auto;
  -webkit-overflow-scrolling: touch; padding: 2px 0 4px; align-content: start; }
.pks-item { position: relative; display: flex; flex-direction: column; gap: 1px;
  padding: 9px 30px 9px 11px; background: #fff; border: 1px solid var(--line);
  border-radius: 10px; color: var(--text); -webkit-tap-highlight-color: transparent; }
.pks-item:active { border-color: var(--primary); background: var(--primary-light); }
.pks-item.on { border-color: var(--primary); background: var(--primary-light); }
.pks-nm { font-size: 13px; font-weight: 600; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.pks-no { font-size: 10.5px; color: var(--text-2); font-variant-numeric: tabular-nums; }
.pks-item.on .pks-nm { color: var(--primary-dark); }
.pks-ck { position: absolute; right: 9px; top: 50%; transform: translateY(-50%);
  font-size: 13px; color: var(--primary); font-style: normal; }
.pks-empty { grid-column: 1 / -1; text-align: center; color: var(--text-2); font-size: 13px; padding: 26px 0; }
@media (min-width: 640px) { .pks-list { grid-template-columns: repeat(3, 1fr); } }

/* 手机端筛选行：胶囊跟其它控件一样两两一排（与 .filter 输入框同高，上下边缘齐平） */
@media (max-width: 768px), (orientation: landscape) and (max-height: 520px) and (pointer: coarse) {
  .filter .pk-chip { flex: 1 1 40%; min-width: 0; justify-content: space-between; }
  .filter .pk-chip .pk-v { max-width: none; }
}

/* ================================================================
   v1.86 统一搜索胶囊：货商「补货下单」rpKw / 采购「开单」odKw 共用
   🔍 图标 + 输入 + 📷 扫码（手机才显示）+ 模糊/精准切换，收进一颗圆角胶囊；
   聚焦时整颗胶囊亮主色描边。尺寸对齐 .filter 控件（34px 高 / 10px 圆角）。
   注意用 .filter .kw-capsule 提特异性，压掉 .filter input[type=text] 的
   flex:1/min-width:140px/padding/边框（否则胶囊里会冒出双层边框）。
   ================================================================ */
.filter .kw-capsule { display: inline-flex; align-items: center; min-width: 0; width: 300px;
  height: 34px; box-sizing: border-box; padding: 0 4px 0 10px;
  background: #fff; border: 1px solid var(--line); border-radius: 10px;
  transition: border-color .15s, box-shadow .15s; }
.filter .kw-capsule:focus-within { border-color: var(--primary); box-shadow: 0 0 0 3px var(--primary-light); }
.kw-capsule .kw-ico { flex: 0 0 auto; font-style: normal; font-size: 13px; opacity: .45; margin-right: 5px; }
.filter .kw-capsule input[type=text] { flex: 1 1 auto; min-width: 0; width: auto; height: 100%;
  padding: 0 2px; border: none; outline: none; background: transparent;
  font-family: inherit; font-size: 13px; color: var(--text); }
.kw-capsule input[type=text]::placeholder { color: #a9b1ba; letter-spacing: -.2px; }
/* 📷 扫码：胶囊内改成无边的浅底小方钮，不再像外面那样带一圈边框 */
.filter .kw-capsule .scan-btn { width: 28px; height: 28px; flex: 0 0 28px; font-size: 15px;
  border: none; background: transparent; border-radius: 7px; }
.filter .kw-capsule .scan-btn:active { background: var(--primary-light); }
/* 模糊/精准切换作为胶囊右侧收尾段：小一号、去掉外框感 */
.filter .kw-capsule .adm-mode { height: 24px; min-width: 46px; margin-left: 2px;
  border-radius: 7px; font-size: 10.5px; }

/* ================================================================
   v1.89 采购员「商品编辑权限」勾选区（管理端 采购员管理 → 编辑）
   ----------------------------------------------------------------
   9 个字段级权限：名称 / 四档价 / 图片上传 / 图片删除 / 更多资料 / 开关项。
   用 auto-fill 网格，手机端自动降到两列；checkbox 显式 width:auto，
   否则会被通用 .field input{width:100%} 撑满整行。
   ================================================================ */
.perm-bar { display: flex; align-items: center; gap: 12px; margin: 2px 0 8px; font-size: 12.5px; color: var(--text-2); }
.perm-bar a.a-no { margin-left: auto; }
.perm-bar a.a-no + a.a-no { margin-left: 0; }
.perm-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(132px, 1fr)); gap: 6px; }
.perm-ck { display: flex; align-items: center; gap: 7px; padding: 7px 10px; font-size: 13px;
  color: var(--text); border: 1px solid var(--line); border-radius: 8px; cursor: pointer;
  background: #fff; user-select: none; -webkit-tap-highlight-color: transparent;
  transition: border-color .12s, background .12s; }
.perm-ck:hover { border-color: var(--primary); }
.perm-ck:has(input:checked) { border-color: var(--primary); background: var(--primary-light);
  color: var(--primary-dark); font-weight: 600; }
.perm-ck input[type=checkbox] { width: auto; flex: 0 0 auto; margin: 0; }

/* v1.97 购买模块：「未开通（可购买）」与「无权限」区分开 —— 不压那么灰，右上角显式标签，点击引导去购买 */
.menu-tile.off .tile-lock { position: absolute; top: 3px; right: 4px; font-size: 9.5px; line-height: 1.1;
  padding: 2px 4px; border-radius: 4px; background: #fdf3e6; color: #b96a10; font-weight: 700; }
.menu-tile.off:has(.tile-lock) { cursor: pointer; opacity: .8; background: #f7f8f9; border-style: solid; border-color: #e3d8c8; }
.menu-tile.off:has(.tile-lock)::after { content: none; }
.menu-tile.off:has(.tile-lock):hover { transform: translateY(-1px); box-shadow: 0 3px 10px rgba(185,106,16,.10); border-color: #e8c79a; }


/* v1.98 三层授权：权限弹窗里的灰锁 / 未分配标记 */
.perm-item.ent-lock { opacity: .6; background: #f7f8f9; border-radius: 6px; padding: 3px 6px; margin: 0 -6px; cursor: not-allowed; }
.perm-item.ent-need { background: #fdfaf3; border-radius: 6px; padding: 3px 6px; margin: 0 -6px; }
.ent-tag { font-size: 10px; line-height: 1.4; color: #b93a32; background: #fdeceb;
  padding: 1px 5px; border-radius: 4px; margin-left: 5px; white-space: nowrap; }
.ent-tag.warn { color: #b96a10; background: #fdf3e6; }
.ent-need { font-style: normal; font-size: 10px; color: #9aa4ae; margin-left: 4px; }

/* v1.105 卖场授权中心内置页：iframe 内嵌（继承登录态，不新开页面） */
.tn-frame { position: relative; background: #fff; border-radius: 12px; overflow: hidden;
  box-shadow: 0 1px 3px rgba(16,24,40,.06); height: calc(100vh - 208px); min-height: 460px; }
.tn-frame iframe { width: 100%; height: 100%; border: 0; display: block; background: #f4f6f8; }
@media (max-width: 960px) {
  .tn-frame { height: calc(100dvh - 236px); min-height: 420px; border-radius: 10px; }
}

/* ================= v1.109 采购/配送动态角标（菜单项/卡片/手机底栏通用） =================
   配色与 .np-badge 同一套；宿主不同定位不同：
   · #nav 菜单项 / .bottomnav 底栏：绝对定位右上（菜单项本就 relative）
   · .cat-card 冻结条/分类页卡片：绝对定位在箭头左侧 */
.dyn-badge { display: inline-block; min-width: 18px; height: 18px; line-height: 18px; padding: 0 5px;
  background: var(--red); color: #fff; font-style: normal;
  font-size: 11px; font-weight: 700; border-radius: 999px; text-align: center;
  box-shadow: 0 1px 4px rgba(217, 70, 62, .4); margin-left: auto; }
#nav a, .bottomnav a { position: relative; }
#nav a .dyn-badge, .bottomnav a .dyn-badge { position: absolute; right: 10px; top: 50%; transform: translateY(-50%); margin-left: 0; }
.bottomnav a .dyn-badge { top: 3px; right: 12%; transform: none; min-width: 15px; height: 15px; line-height: 15px; font-size: 10px; }
.cat-card { position: relative; }
.cat-card .dyn-badge { position: absolute; top: 6px; right: 8px; margin-left: 0; }

/* v1.111 配送总览：新订单（待审核）红点 + 提交时间列 */
.ord-dot { display: inline-block; width: 8px; height: 8px; border-radius: 50%; background: var(--red);
  margin-left: 6px; vertical-align: 2px; box-shadow: 0 0 0 3px rgba(217,70,62,.15); }
.da-stat .ord-dot { margin: 0 0 0 6px; }

/* ================= v1.113 删除数据：数据类型行 ================= */
.sd-row { display: flex; align-items: center; gap: 10px; padding: 10px 4px; border-bottom: 1px solid var(--line, #eef0f3); cursor: pointer; }
.sd-row:last-of-type { border-bottom: 0; }
.sd-row:hover { background: #fafbfc; }
.sd-row input[type="checkbox"] { width: 16px; height: 16px; flex: none; }
.sd-row .sd-n { font-weight: 700; font-size: 13.5px; white-space: nowrap; }
.sd-row .sd-d { flex: 1; font-size: 12.5px; color: var(--text-2); }
.sd-row .sd-c { font-weight: 700; font-size: 13px; min-width: 56px; text-align: right; font-variant-numeric: tabular-nums; }
.sd-row.sd-warn { background: #fffaf5; }
/* v1.115b 删除数据页：密码面板突出 + 密码状态小字 + 按钮配色 */
.sd-pwd-panel { border-left: 4px solid var(--red); background: #fffdf9; }
.sd-pwd-panel .field label { font-size: 13.5px; font-weight: 700; color: var(--text); }
.sd-opsec-tip { margin-left: 10px; font-size: 11.5px; font-weight: 400; }
.sd-opsec-tip .sd-on { color: var(--primary); font-weight: 700; }
.sd-opsec-tip .sd-off { color: var(--red); font-weight: 600; }
.sd-opsec-btn { display: inline-block; margin-top: 6px; font-size: 12px; color: var(--primary); font-weight: 600; cursor: pointer; }
.sd-opsec-btn:hover { text-decoration: underline; }
.btn-blue { background: #1677ff !important; color: #fff !important; }
.btn-blue:active, .btn-blue:hover { background: #0e5fd8 !important; }
@media (max-width: 700px) {
  .sd-row { flex-wrap: wrap; row-gap: 2px; }
  /* 手机上：标题与数量同一行（数量右对齐），说明文字整行放下面，避免数字单独掉到第三行 */
  .sd-row .sd-n { flex: 1 1 0; min-width: 0; white-space: normal; }
  .sd-row .sd-c { order: 2; margin-left: auto; min-width: 0; }
  .sd-row .sd-d { order: 3; flex-basis: 100%; padding-left: 26px; }
}
/* ================= v1.127 删除数据：可按供应商删除 ================= */
.sd-range { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; padding: 10px 14px; margin-bottom: 10px; }
.sd-range .sd-range-n { font-size: 13.5px; font-weight: 700; color: var(--text); }
.sd-rg { border: 1px solid var(--line, #e6e9ee); background: #fff; color: var(--text-2);
  border-radius: 999px; padding: 5px 14px; font-size: 12.5px; font-weight: 600; cursor: pointer; }
.sd-rg.on { background: var(--primary); border-color: var(--primary); color: #fff; }
/* 供应商查找面板：内部直接复用 .adm-search / .adm-sup-row / .pg-btn（与采购员管理、盘点新建同一套） */
.sd-sup-panel { border-left: 4px solid var(--primary); background: #fafcff; margin-bottom: 10px; }
.sd-row.sd-off { opacity: .45; cursor: not-allowed; }
.sd-row .sd-tag { font-size: 11px; font-weight: 700; color: #b26a00; background: #fff3e0;
  border-radius: 4px; padding: 1px 5px; margin-left: 4px; }
/* ================= v1.151 删除数据：永久保留（锁定行，无勾选框） ================= */
.sd-lock-head { margin-top: 12px; padding: 12px 4px 6px; border-top: 2px dashed var(--line, #e6e9ee);
  font-size: 13px; font-weight: 700; color: var(--text); display: flex; align-items: baseline; gap: 8px; flex-wrap: wrap; }
.sd-lock-head i { font-style: normal; font-size: 11.5px; font-weight: 400; color: var(--text-2); }
.sd-row.sd-lock { cursor: default; background: #f7f8fa; }
.sd-row.sd-lock:hover { background: #f7f8fa; }
.sd-row.sd-lock .sd-n { color: var(--text-2); font-weight: 600; }
.sd-row.sd-lock .sd-d { color: #98a3b3; }
.sd-row.sd-lock .sd-c { color: var(--text-2); }
.sd-row .sd-lk { width: 16px; flex: none; text-align: center; font-size: 12px; opacity: .7; }
.sd-row .sd-tag.lock { color: #5b6472; background: #e8ebf0; }
.sd-lock-note { padding: 8px 4px 2px; font-size: 11.5px; line-height: 1.6; color: #98a3b3; }
@media (max-width: 700px) {
  .sd-range { padding: 10px 4px; }
  .sd-sup-panel { padding: 10px 4px !important; }
}

/* ---------------- v1.123 运费统计报表（P1） ----------------
   #dvBody / #dlaBody 在 .dlv-fixed 里是 flex 列，报表自己滚，列表表格不参与 */
.ftr-scroll { flex: 1 1 0; min-height: 0; overflow: auto; -webkit-overflow-scrolling: touch; padding-bottom: 12px; }
.ftr-head { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; margin: 0 0 6px; }
/* v1.150 收紧凑：统计卡一行细条（替代五张大卡），待补那格可点回列表 */
.ftr-strip { display: inline-flex; gap: 6px; flex-wrap: wrap; align-items: center; min-width: 0; }
.ftr-st { display: inline-flex; align-items: baseline; border: 1px solid var(--line); background: var(--card);
  border-radius: 8px; padding: 3px 10px; font-size: 12px; color: var(--text-2); white-space: nowrap; }
.ftr-st b { font-size: 13.5px; color: var(--text); margin-left: 5px; }
.ftr-st i { font-style: normal; font-size: 11px; margin-left: 2px; }
.ftr-st.warn { border-color: var(--red); background: #fff5f5; color: var(--red); font-weight: 600; cursor: pointer; }
.ftr-st.warn b { color: var(--red); }
.ftr-head .sp { flex: 1 1 auto; }
.ftr-note { font-size: 12px; color: var(--text-2); line-height: 1.5; }
.ftr-seg { display: inline-flex; border: 1px solid var(--line); border-radius: 9px; overflow: hidden; background: var(--card); }
.ftr-seg button { border: 0; background: transparent; padding: 6px 12px; font-size: 12.5px; color: var(--text-2); cursor: pointer; }
.ftr-seg button + button { border-left: 1px solid var(--line); }
.ftr-seg button.on { background: var(--primary); color: #fff; font-weight: 600; }
.ftr-tbl { width: 100%; border-collapse: collapse; font-size: 12.5px; }
.ftr-tbl th { position: sticky; top: 0; z-index: 1; background: #f7f9fa; text-align: left; font-weight: 600;
  color: var(--text-2); padding: 8px 10px; border-bottom: 1px solid var(--line); white-space: nowrap; }
.ftr-tbl td { padding: 6px 10px; border-bottom: 1px solid var(--line); white-space: nowrap; }
.ftr-tbl td.num, .ftr-tbl th.num { text-align: right; }
.ftr-tbl tbody tr:hover td { background: #fbfcfd; }
.ftr-tbl tr.sum td { background: #f2f8f5; font-weight: 700; }
.ftr-tbl .bar { display: inline-block; height: 5px; border-radius: 3px; background: var(--primary);
  vertical-align: middle; margin-right: 6px; opacity: .5; min-width: 2px; }
.ftr-anoms { display: flex; gap: 8px; flex-wrap: wrap; margin: 8px 0 6px; }
.ftr-chip { border: 1px solid var(--line); background: var(--card); border-radius: 999px; padding: 5px 11px;
  font-size: 12.5px; color: var(--text-2); cursor: pointer; user-select: none; }
.ftr-chip.on { border-color: var(--primary); color: var(--primary-dark); background: var(--primary-light); font-weight: 600; }
.ftr-chip i { font-style: normal; font-weight: 700; color: var(--red); margin-left: 3px; }
.flt-btn.on { background: var(--primary-light); border-color: var(--primary); color: var(--primary-dark); font-weight: 600; }
@media (max-width: 768px) {
  /* 手机端维度表只留 名称/单数/运费合计/运费率，一屏看完不左右滑 */
  /* 固定列宽 + 名称列可换行，保证四列恰好铺满屏宽不溢出
     （全局 table 在手机端有 min-width:500px，四列报表不需要，必须压掉） */
  .ftr-dim { table-layout: fixed; width: 100%; min-width: 0; }
  .ftr-dim th:first-child, .ftr-dim td:first-child { white-space: normal; word-break: break-all; }
  .ftr-dim th:nth-child(4), .ftr-dim td:nth-child(4),
  .ftr-dim th:nth-child(5), .ftr-dim td:nth-child(5),
  .ftr-dim th:nth-child(7), .ftr-dim td:nth-child(7) { display: none; }
  .ftr-tbl th, .ftr-tbl td { padding: 7px 8px; font-size: 12px; }
  .ftr-note { font-size: 11px; }
  .ftr-anoms { gap: 6px; }
  .ftr-chip { padding: 4px 9px; font-size: 12px; }
  .ftr-st { padding: 3px 8px; font-size: 11.5px; }
  .ftr-st b { font-size: 12.5px; }
}

/* v1.150 运费报表态：筛选输入/下拉再收一档（v1.73c 已全局压过页头，这里只补输入框）；
   关掉报表即还原。ftr-on 同时作为报表态的 CSS 挂钩。 */
.content.ftr-on .filter input, .content.ftr-on .filter select { padding: 5px 8px; font-size: 12.5px; }

/* ================= v1.131 变更审批：批量审核条 ================= */
.ca-bulk { display: flex; align-items: center; gap: 10px; padding: 8px 12px; margin-bottom: 8px;
  background: var(--primary-light, #eef7f1); border: 1px solid var(--line, #e6e9ee); border-radius: 8px; }
.ca-bulk input[type="checkbox"] { width: 15px; height: 15px; }
@media (max-width: 700px) {
  .ca-bulk { flex-wrap: wrap; row-gap: 6px; }
  .ca-bulk .btn { flex: 1 1 auto; }
}

/* v1.157 卖场端未开通套餐：菜单照常出现，仅灰化提示 */
.nav a.off{opacity:.42}
.nav a.off:hover{opacity:.6}

/* v1.159 「未选服务」醒目横幅（全端统一样式：货商端纯写模块 + 卖场端套餐共用） */
.ent-banner{margin:2px 0 14px;background:linear-gradient(90deg,#ff8a00,#ff4d00);color:#fff;
  font-size:15.5px;font-weight:700;padding:13px 18px;border-radius:12px;cursor:pointer;
  letter-spacing:.5px;box-shadow:0 2px 10px rgba(255,77,0,.28);line-height:1.5}
.ent-banner:hover{filter:brightness(1.07)}
.ent-banner small{display:block;font-size:12px;font-weight:400;opacity:.95;margin-top:3px;line-height:1.6}

/* v1.161 账号管理：单位用户总预览（圆润胶囊，标题行右侧） */
.user-pill{display:inline-flex;align-items:center;gap:7px;padding:7px 16px;border-radius:999px;
  background:linear-gradient(135deg,#fff4f2,#ffe9ec);border:1.5px solid #ffd6d6;
  font-size:13px;font-weight:600;color:#8a5a5a;white-space:nowrap;
  box-shadow:0 2px 8px rgba(217,70,62,.08);line-height:1;cursor:default}
.user-pill .up-ico{font-size:15px;line-height:1}
.user-pill b{font-size:16px;font-weight:800;color:#d9463e;font-variant-numeric:tabular-nums;
  padding:0 1px;transform:translateY(-.5px)}
.user-pill .up-remain{color:#e07a1f}
.user-pill .up-sep{width:1px;height:13px;background:#f3c9c9;border-radius:1px}
.user-pill.low{background:linear-gradient(135deg,#fff1f0,#ffe0de);border-color:#f5b8b3}
.user-pill.low .up-remain,.user-pill.low b{color:#c0392b}

/* v1.163 统一「席位配额」胶囊：总 / 已用 / 剩余（采购员 S1·S2、钉钉群授权、供应商账号 B3 全用这一套）
   绿色=还有额度，橙红 low=已用完，灰色 na=厂商还没授权给本卖场 */
.quota-pill{display:inline-flex;align-items:center;gap:6px;padding:7px 15px;border-radius:999px;
  background:linear-gradient(135deg,#eef9f4,#e2f4ec);border:1.5px solid #c6e8d6;
  font-size:12.5px;font-weight:600;color:#1f6b4a;white-space:nowrap;line-height:1.35;
  box-shadow:0 2px 8px rgba(31,122,77,.08);cursor:default}
.quota-pill .qp-ico{font-size:14px;line-height:1}
.quota-pill b{font-size:14px;font-weight:800;font-variant-numeric:tabular-nums;padding:0 1px;color:#14664a}
.quota-pill .qp-sep{width:1px;height:13px;background:#cbe7d8;border-radius:1px;display:inline-block;margin:0 3px}
.quota-pill .qp-used{color:#b26a00}
.quota-pill .qp-left{color:#1a7f5a}
.quota-pill.low{background:linear-gradient(135deg,#fff4f2,#ffe9ec);border-color:#ffd6d6;color:#8a5a5a}
.quota-pill.low b,.quota-pill.low .qp-left{color:#c0392b}
.quota-pill.na{background:#f4f6f8;border-color:#e3e8ec;color:#8a939d;box-shadow:none}
.quota-pill.na b{color:#8a939d}
.quota-pill.open{background:linear-gradient(135deg,#f5f8fb,#eef3f9);border-color:#d8e3ee;color:#4a6b8a;box-shadow:none}
.quota-pill.open b{color:#2f5d86}
.qpill-row{display:inline-flex;align-items:center;gap:8px;flex-wrap:wrap;margin-right:6px}
@media (max-width:640px){
  .quota-pill{padding:6px 12px;font-size:11.5px}
  .quota-pill b{font-size:13px}
}

/* v1.161 钉钉群通知：盒头说明改为圆润徽章 */
.hd-pill{display:inline-flex;align-items:center;gap:5px;padding:5px 12px;border-radius:999px;
  background:linear-gradient(135deg,#eef6ff,#e3efff);border:1px solid #cfe3fb;
  font-size:12px;font-weight:600;color:#3a6ea5;white-space:nowrap;line-height:1.4}
.hd-pill:hover{filter:brightness(1.02)}

/* v1.161 采购员管理：厂商授权状态徽章（右上角圆润胶囊；绿=已授权，橙红=未授权限10条） */
.auth-pill{display:inline-flex;align-items:center;gap:7px;padding:7px 16px;border-radius:999px;
  background:linear-gradient(135deg,#eafaf1,#dcf5e8);border:1.5px solid #bfe8d2;
  font-size:12.5px;font-weight:600;color:#1f7a4d;white-space:nowrap;
  box-shadow:0 2px 8px rgba(31,122,77,.08);line-height:1.4;cursor:default;margin-right:6px}
.auth-pill.warm{background:linear-gradient(135deg,#fff4f2,#ffe9ec);border-color:#ffd6d6;
  color:#c0392b;box-shadow:0 2px 8px rgba(217,70,62,.10)}

/* v1.161 侧栏「系统设置」小节标题（平铺模式下的分组，圆润克制） */
.nav-sec{display:flex;align-items:center;gap:6px;margin:14px 4px 4px;padding:6px 8px;
  font-size:11.5px;font-weight:700;letter-spacing:.5px;color:#8b93a7;
  border-top:1px dashed rgba(0,0,0,.10);border-radius:8px}
.nav-sec i{font-style:normal;font-size:12px;opacity:.85}

/* v1.205 分类卡「未购买」灰卡：保留可见但不可点，与工作台 .menu-tile.off 同口径 */
.cat-card.off { cursor: not-allowed; background: #f4f6f8; border-color: #e2e6ea; }
.cat-card.off:hover { transform: none; box-shadow: none; border-color: #e2e6ea; }
.cat-card.off .cc-ico { filter: grayscale(1) contrast(.7); opacity: .3; }
.cat-card.off .cc-txt b { color: #a2a8b0; }
.cat-card.off .cc-txt i { color: #b3bac2; }
.cat-card .cc-lock { flex: 0 0 auto; font-size: 10px; font-weight: 600; color: #98a1ab; background: #e9edf1; border-radius: 8px; padding: 2px 7px; }

/* v1.207 库存预警 W8：货商自助「选服务」按钮（分类卡 / 冻结条 / 工作台磁贴）
   v1.207b：灰卡原本 cursor:not-allowed 会继承到「选服务」按钮上变成禁止光标；
   这里给按钮及「可自购」的卡片显式改成正常手型，其它未开通模块仍保持禁止光标。 */
.cc-buy { flex: 0 0 auto; margin-left: 2px; padding: 4px 9px; border-radius: 999px;
  background: var(--primary); color: #fff; font-size: 11px; font-weight: 700; white-space: nowrap; cursor: pointer; }
.cc-buy:hover { background: var(--primary-dark); }
.cat-bar .cat-card .cc-buy { font-size: 10px; padding: 3px 7px; }
.tile-buy { position: absolute; left: 50%; transform: translateX(-50%); bottom: 6px;
  padding: 3px 9px; border-radius: 999px; background: var(--primary); color: #fff;
  font-size: 10px; font-weight: 700; white-space: nowrap; z-index: 2; cursor: pointer; }
.menu-tile.off:has(.tile-buy) { padding-bottom: 26px; cursor: pointer; }
.cat-card.off:has(.cc-buy) { cursor: pointer; }
/* 冻结条窄卡：按钮改成绝对定位放卡片底部，不再挤占标题宽度（否则「库存预警推送」会被压成竖排）；
   有「选服务」时隐藏重复的「未开通」角标 */
.cat-bar .cat-card:has(.cc-buy) { position: relative; padding-bottom: 28px; }
.cat-bar .cat-card .cc-buy { position: absolute; left: 50%; transform: translateX(-50%);
  bottom: 6px; margin: 0; font-size: 10px; padding: 2px 9px; }
.cat-bar .cat-card:has(.cc-buy) .cc-lock { display: none; }
.cat-bar .cat-card:has(.cc-buy) .cc-txt b,
.cat-bar .cat-card:has(.cc-buy) .cc-txt i { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }

/* ===== v1.251 ③区费用ID明细表（新计费版·卖场端） ===== */
.fee-tbl { width: 100%; border-collapse: collapse; font-size: 12.5px; margin-top: 4px; }
.fee-tbl th { text-align: left; font-size: 11px; font-weight: 600; color: #8a939d;
  padding: 4px 8px; border-bottom: 1px solid #e3e7ec; white-space: nowrap; }
.fee-tbl td { padding: 5px 8px; border-bottom: 1px solid #f0f3f6; white-space: nowrap; }
.fee-tbl td.fno { font-family: Consolas, monospace; color: #47506b; }
/* v1.285 行号列：窄、灰、小，不占位置 */
.fee-tbl th.rn, .fee-tbl td.rn { width: 26px; min-width: 26px; text-align: center; padding-left: 2px; padding-right: 2px; }
.fee-tbl td.rn { color: #a6adb6; font-size: 10.5px; font-variant-numeric: tabular-nums; }
.fee-tbl td.num { font-variant-numeric: tabular-nums; }
.fee-tbl tr.fee-tr { cursor: pointer; }
.fee-tbl tr.fee-tr:hover td { background: #f6f9fc; }
.fee-tbl tr.fee-tr.on td { background: #eef6f0; }
.fee-bdg { display: inline-block; padding: 1px 9px; border-radius: 10px; font-size: 11px; font-weight: 600; white-space: nowrap; }
.fee-bdg.free { background: #e8f5ee; color: #1d7a4f; }
.fee-bdg.ok { background: #e8f0fb; color: #1d5fbf; }
.fee-bdg.pend { background: #fdf3e0; color: #b45309; }
.fee-bdg.expired { background: #fdeaea; color: #c0453a; }

/* ===== v1.260 功能编码徽章 + ③区明细筛选条（按功能 / 到期窗口筛，续费加量前先定位） ===== */
.fcode { display: inline-block; font-family: Consolas, "SF Mono", Menlo, monospace; font-size: 10.5px;
  font-weight: 700; letter-spacing: .5px; color: #3b4650; background: #eef2f5;
  border: 1px solid #dde3e9; border-radius: 5px; padding: 0 5px; margin-right: 5px; vertical-align: 1px; }
.fee-tbl td.fcode-td { white-space: nowrap; }
.fee-tbl td.fcode-td .nm { color: #47506b; }
.seat-q-fil { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; margin: 8px 0 2px; }
.seat-q-fil select { height: 30px; border: 1px solid #d8dee5; border-radius: 8px; padding: 0 8px;
  font-size: 12px; background: #fff; color: #3b4650; font-family: inherit; outline: none; cursor: pointer; }
.seat-q-fil select:focus { border-color: #17865a; }
.seat-q-fil .fhint { font-size: 11.5px; color: #8a939d; margin-left: auto; }

/* ============================================================
   v1.252 卖场端「更新供应链系统」悬浮按钮（用户 2026-11-07 拍板）
   以前只在「新品审核 / 账号管理 / 钉钉群 / 盘点 / 配送 / 采购员 / 变更审批」这些页的标题行里，
   翻到工作台、网址页等地方就没有了，要更新得先绕回有按钮的页面。
   现在改成固定悬浮：卖场端（超管 admin / 审核专员 reviewer）全站常驻右下角；
   登录页、货商端、购买服务页（独立页 buy.html / buyv2.html）都不出现。
   视觉与行为完全复用 .pg-refresh（主题色胶囊 + 点击确认 → 转圈 → 重载），只改定位与尺寸。 */
.fab-upd { position: fixed; right: 12px; top: calc(84px + env(safe-area-inset-top));
  z-index: 40; display: none; flex-direction: column; align-items: center; gap: 0;
  padding: 7px 13px 6px; font-size: 13px; line-height: 1.2; white-space: nowrap;
  /* v1.327 / D-141 再透一档（用户 11-09 实测：要能比较轻松看清背后的文字）：
     ① 底色 34% → 12% 绿；② 毛玻璃 8px → 1.5px（模糊才是「看得见但认不出」的元凶，
     几乎不糊才读得出字）；③ 白边/阴影同步减淡。文字本身仍不透明，靠加深的文字阴影保证可读。 */
  background: rgba(26, 127, 90, .12); border: 1px solid rgba(20, 105, 74, .32);
  border-radius: 12px;
  -webkit-backdrop-filter: blur(1.5px) saturate(1.02); backdrop-filter: blur(1.5px) saturate(1.02);
  box-shadow: 0 3px 10px rgba(12, 60, 42, .10);
  transition: background .18s ease, box-shadow .18s ease;
  /* v1.253 可拖拽：拖动时不许触发滚动/选中/长按菜单，鼠标给抓手光标 */
  touch-action: none; user-select: none; -webkit-user-select: none; -webkit-user-drag: none;
  cursor: grab; }
.fab-upd.show { display: inline-flex; }
.fab-upd .fab-row { display: inline-flex; align-items: center; gap: 5px;
  /* v1.327 底色透到 12% 后白字会融进浅色底：改品牌深绿 + 白色光晕，
     浅底上字清楚、深底上也被光晕托住；文字本身仍不透明，不靠整体 opacity */
  color: #0d6b4a; text-shadow: 0 0 3px rgba(255, 255, 255, .95), 0 1px 2px rgba(255, 255, 255, .90); }
/* 第二行小字：一眼知道这玩意儿能拖走 */
.fab-upd .fab-tip { margin-top: 2px; font-size: 10px; font-weight: 700; letter-spacing: .16em;
  color: #0d6b4a; text-shadow: 0 0 3px rgba(255, 255, 255, .95), 0 1px 2px rgba(255, 255, 255, .90); }
/* 悬停 / 拖动时底色变实（深绿），字必须换回白色才看得见 */
.fab-upd:hover .fab-row, .fab-upd:hover .fab-tip,
.fab-upd.dragging .fab-row, .fab-upd.dragging .fab-tip {
  color: #fff; text-shadow: 0 1px 2px rgba(0, 0, 0, .55), 0 0 6px rgba(0, 0, 0, .35); }
.fab-upd .pg-ico { font-size: 15px; line-height: 1; animation: none; }
/* 点击后 / 正在重载：照样要转（上面的 animation:none 会盖掉 .pg-refresh.busy，这里补回来） */
.fab-upd.busy .pg-ico,
body.pg-reloading .fab-upd .pg-ico { animation: pgSpin .8s linear infinite; }
/* 常驻按钮不再每 3 秒自转（一直在角落里晃太吵）：只在悬停 / 点击时转 */
.fab-upd:hover .pg-ico { transform: rotate(180deg); }
/* 悬停 / 拖动中：变实一点，绝不影响「我要操作它」时的清晰度 */
.fab-upd:hover, .fab-upd.dragging { background: rgba(22, 110, 78, .92);
  border-color: rgba(255, 255, 255, .70); box-shadow: 0 5px 18px rgba(26, 127, 90, .40); }
/* v1.253 拖动中：轻微放大 + 加重阴影，明确「正在被拿起来挪」，松手即落到新位置 */
.fab-upd.dragging { cursor: grabbing; transform: scale(1.04);
  box-shadow: 0 8px 22px rgba(26, 127, 90, .48); transition: none; }
/* 电脑端：顶栏在电脑端是隐藏的（内容区从最顶上开始），直接贴页面右上角 18px；
   手机端要让开 sticky 顶栏（.topbar + .topbar-info ≈ 79px），落在内容区右上角，
   不盖住「显示大小 / 横屏 / 退出」。拖动过则由 app.js 的内联 left/top 接管，与这里无关。 */
@media (min-width: 769px) {
  .fab-upd { right: 24px; top: 18px; }
}
/* 手机端紧凑版：字号/padding 收一档（宽约 124、高约 37），top 提到 78（贴登录信息条底边，
   那一行右侧本来就是空的），尽量少占页面右上角 */
@media (max-width: 768px) {
  .fab-upd { top: calc(78px + env(safe-area-inset-top)); right: 8px;
    padding: 5px 10px 4px; font-size: 12px; }
  .fab-upd .pg-ico { font-size: 13px; }
  .fab-upd .fab-tip { font-size: 9.5px; letter-spacing: .12em; margin-top: 1px; }
}
/* ============================================================
   v1.255 右上角整块留给这个悬浮按钮（用户 2026-11-07「右上角所有菜单留给它，仔细检查不要漏」）
   体检发现各页首行右端都有东西被压：🔔 去配钉钉群 / 待审核·待处理切换 / ＋新建盘点任务 /
   筛选 ▾ / 席位胶囊（S1·S2）/ 账号席位胶囊 / 钉钉授权胶囊…共 16 页无一幸免。
   做法：**所有页面首块（标题行 / 工具行 / 筛选行）右侧按按钮宽度让位**，右端控件自动左移，
   按钮独占右上角那块地方；下面 y 超过按钮的部分本来就不冲突，滚动时穿过属悬浮按钮常态。
   宽度取按钮实测宽(139) + 右边距 + 余量：手机 156px、电脑 168px。 */
body.has-fab .content > :first-child { padding-right: 172px; }
/* 手机：只给按钮本身那一条高度让位（紧凑版高 37 + 余量 ≈ 净让 34px），内容照常全宽铺开——
   不折行、不缩窄、不留大片空白；唯一代价是内容整体下移一条按钮的高度，一屏仍能看满 */
@media (max-width: 768px) {
  body.has-fab .content { padding-top: 54px; }
}

/* v1.252 我方云离线时的到期宽限态（顾客机仍可解绑/换绑，不耽误做生意） */
.fee-bdg.grace { background: #fdf3e0; color: #b45309; }
/* v1.324 / D-138 账号与席位明细：一眼分清这个账号有没有激活码 */
.bind-tag { display:inline-block; padding:1px 8px; border-radius:10px; font-size:11px; font-weight:600; white-space:nowrap; }
.bind-tag.on  { background:#e6f4ee; color:#137a4c; }
.bind-tag.off { background:#fdf1e3; color:#b45309; }
/* v1.325 / D-140：未绑定账号旁的「去绑定」快捷按钮（两处用户列表共用） */
.go-bind { display:inline-flex; align-items:center; margin:2px 0 0 6px; padding:2px 9px;
  font-size:11.5px; font-weight:600; line-height:1.6; white-space:nowrap; cursor:pointer;
  color:var(--primary-dark); background:#e6f4ee; border:1px solid var(--primary);
  border-radius:999px; transition:all .15s ease; }
.go-bind:hover { background:var(--primary); color:#fff; }
.go-bind:active { transform:scale(.95); }
.seat-bdg.grace { background: #fdf3e0; color: #b45309; }

/* ===== v1.267 账号管理④「账号与席位明细」：统一查询栏（一条查询同时过滤费用ID表 + 账号表） ===== */
.uaq-bar { display: flex; flex-direction: column; gap: 6px; background: #f6faf7;
  border: 1px solid var(--line); border-radius: 12px; padding: 10px 12px; margin: 0 0 10px; }
.uaq-row { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; }
.uaq-bar .uaq-kw { flex: 1 1 280px; min-width: 0; gap: 5px; }
.uaq-bar .uaq-kw input { padding: 7px 11px; font-size: 12.5px; border-radius: 8px; }
.uaq-bar .adm-mode { height: 32px; }
.uaq-sel { height: 32px; min-width: 118px; border: 1px solid var(--line); border-radius: 8px;
  background: #fff; padding: 0 8px; font-size: 12.5px; color: var(--text); outline: none; }
.uaq-sel:focus { border-color: var(--primary); }
.uaq-bar .adm-seg a { padding: 7px 12px; font-size: 12px; }
.uaq-cnt { font-size: 12px; color: #6b7480; padding-left: 2px; }
.uaq-cnt:empty { display: none; }
.ua-sub { display: flex; align-items: center; flex-wrap: wrap; gap: 4px; margin: 14px 0 8px;
  padding: 8px 12px; background: linear-gradient(90deg, #eef7f2, #f7faf8);
  border-left: 4px solid var(--primary); border-radius: 8px;
  font-size: 13px; font-weight: 700; color: var(--text); }
.ua-sub .hd-note { font-weight: 400; }
/* v1.267 账号列表状态列的快捷付费/续费/开通按钮（红色醒目，一眼能点） */
.adm-lnk.gofee { color: #c0453a; font-weight: 700; margin-left: 2px; }
.adm-lnk.gofee:hover { text-decoration: underline; }

/* v1.302 产品激活码页两个视图切换（本卖场采购端 / 供应商用户 B3）——撞色吸睛：
   本卖场=品牌绿实底、供应商用户=橙色实底；未选中各自淡底+彩边，一眼分清两边 */
.cod-tabs { display: flex; gap: 10px; margin: 0 0 10px; flex-wrap: wrap; }
.cod-tabs a { padding: 8px 18px; font-size: 13px; font-weight: 600; border: 1.5px solid transparent;
  border-radius: 999px; cursor: pointer; user-select: none; transition: .15s; }
/* v1.311 点击反馈：点下去有明确的按压感（缩放+压暗），松开回弹；
   配合 .on 实底高亮，用户一眼知道「点到了、而且点的是这个」 */
.cod-tabs a:active { transform: scale(.94); filter: brightness(.9); }
.cod-tabs a:focus-visible { outline: 2px solid var(--primary); outline-offset: 2px; }
/* v1.311 补 #codTabLedger 配色：v1.304 把第一个页签改成「激活码台账（全部产品）」，
   但样式只写了 #codTabShop（已废弃的名字），导致这个页签点起来毫无反馈 —— 补齐成
   品牌绿实底选中态，与橙色的「供应商账号绑定情况」形成撞色区分。 */
#codTabLedger { background: var(--primary-light); border-color: var(--primary); color: var(--primary); }
#codTabLedger:hover { background: var(--primary); color: #fff; }
#codTabLedger.on { background: var(--primary); color: #fff; box-shadow: 0 2px 10px rgba(26, 127, 90, .38); }
#codTabShop { background: var(--primary-light); border-color: var(--primary); color: var(--primary); }
#codTabShop:hover { background: var(--primary); color: #fff; }
#codTabShop.on { background: var(--primary); color: #fff; box-shadow: 0 2px 10px rgba(26, 127, 90, .38); }
#codTabSup { background: #fdf1e3; border-color: var(--orange); color: var(--orange); }
#codTabSup:hover { background: var(--orange); color: #fff; }
#codTabSup.on { background: var(--orange); border-color: var(--orange); color: #fff; box-shadow: 0 2px 10px rgba(232, 132, 44, .38); }
/* 未选中的页签也保持彩边淡底，点了以后立刻能看出差别 */
.cod-tabs a:not(.on) { opacity: .92; }
.cod-tabs a.on { font-weight: 700; letter-spacing: .2px; }
/* v1.332 / D-146 标题右侧的「产品激活码 / 产品购买记录」切换页签：紧凑、贴标题行
   v1.334 / D-148 撞色卡片化：未选中=白底灰边胶囊，选中=品牌绿渐变白字；按压缩放反馈 */
.cod-head-top .cod-viewtabs { margin: 0; gap: 8px; }
.cod-head-top .cod-viewtabs a {
  padding: 7px 18px; font-size: 13px; font-weight: 600; white-space: nowrap;
  background: #fff; border: 1.5px solid #dbe3e9; color: #5c6670; border-radius: 999px;
  box-shadow: 0 1px 3px rgba(0, 0, 0, .06); transition: .15s;
}
.cod-head-top .cod-viewtabs a:hover { border-color: var(--primary); color: var(--primary);
  background: #eef7f2; transform: translateY(-1px); box-shadow: 0 3px 8px rgba(26, 127, 90, .16); }
.cod-head-top .cod-viewtabs a:active { transform: scale(.93); filter: brightness(.92); }
.cod-head-top .cod-viewtabs a.on {
  background: linear-gradient(135deg, #1a7f5a, #116044); border-color: transparent; color: #fff;
  box-shadow: 0 3px 10px rgba(26, 127, 90, .32); font-weight: 700; letter-spacing: .2px;
}
/* v1.311 内容区淡入 + 轻微上移：切换页签时动作看得见 */
@keyframes codFadeIn { from { opacity: 0; transform: translateY(6px); } to { opacity: 1; transform: none; } }
.cod-fade { animation: codFadeIn .22s ease-out; }
@media (prefers-reduced-motion: reduce) { .cod-fade { animation: none; } }

/* ============ v1.312 激活码管理页：新手能自己走完 ============
   ① 引导卡：按当前状态告诉用户「下一步做什么」，别只丢一张表让人猜
   ② 统计卡：几个数一眼看清（总数 / 已绑 / 待绑 / 免费 / 缺账号）
   ③ 状态筛选：全部 / 待绑定 / 已绑定 / 免费 / 已到期，码一多也能快速定位
   ④ 未绑定行：状态文字 + 操作按钮并排，按钮一眼能找到 */
.cod-guide { margin: 0 0 10px; }
.cod-guide .cg-row {
  display: flex; align-items: center; gap: 10px; flex-wrap: wrap;
  background: linear-gradient(90deg, #eaf7f0, #f6fbf8);
  border: 1px solid #bfe3d0; border-left: 4px solid var(--primary);
  border-radius: 9px; padding: 11px 13px;
}
.cod-guide .cg-t { font-size: 13.5px; font-weight: 700; color: #12563c; white-space: nowrap; }
.cod-guide .cg-d { flex: 1 1 320px; font-size: 12.5px; color: #4a6159; line-height: 1.6; }
.cod-guide .cg-btn {
  flex: 0 0 auto; padding: 7px 14px; border-radius: 999px; font-size: 12.5px; font-weight: 600;
  background: var(--primary); color: #fff; cursor: pointer; border: 1px solid var(--primary);
  transition: .15s; text-decoration: none; white-space: nowrap;
}
.cod-guide .cg-btn:hover { filter: brightness(1.08); box-shadow: 0 2px 8px rgba(26, 127, 90, .3); }
.cod-guide .cg-btn:active { transform: scale(.96); }
.cod-guide .cg-btn.ghost { background: #fff; color: var(--primary); }
.cod-guide .cg-btn.ghost:hover { background: var(--primary); color: #fff; }

/* 统计卡 */
.cod-stats { display: flex; gap: 8px; flex-wrap: wrap; margin: 4px 0 4px; }
.cod-stats .cs {
  font-size: 12px; color: #5c6670; background: #f4f6f8; border: 1px solid #e2e7eb;
  border-radius: 999px; padding: 3px 11px; white-space: nowrap;
}
.cod-stats .cs b { font-size: 13px; color: #1f2328; margin: 0 2px; }
.cod-stats .cs.ok { background: #eaf7f0; border-color: #bfe3d0; color: #17694a; }
.cod-stats .cs.ok b { color: #17694a; }
.cod-stats .cs.warn { background: #fff6e8; border-color: #f3ddb6; color: #8a5316; }
.cod-stats .cs.warn b { color: #8a5316; }
.cod-stats .cs.free { background: #eef4ff; border-color: #d3e0f8; color: #334f80; }
.cod-stats .cs.free b { color: #334f80; }
.cod-stats .cs.pend { background: #fff6e8; border-color: #f3ddb6; color: #8a5316; }
.cod-stats .cs.pend b { color: #8a5316; }
.cod-stats .cs.exp { background: #fdeeec; border-color: #f6cfc9; color: #9c382f; }
.cod-stats .cs.exp b { color: #9c382f; }
.cod-stats .cs.bad { background: #fdeeec; border-color: #f6cfc9; color: #9c382f; font-weight: 600; }
.cod-stats .cs.bad b { color: #9c382f; }

/* v1.329 / D-143 统计区改版：最左「总览卡」+ 每个产品系列一张卡
   （总数 / 已绑定 / 可绑定 / 免费），横向排列、系列多可横向滑动 */
.cod-stats2 { display: flex; gap: 10px; overflow-x: auto; margin: 6px 0 4px; padding: 2px;
  scrollbar-width: thin; -webkit-overflow-scrolling: touch; }
.cod-stats2::-webkit-scrollbar { height: 6px; }
.cod-stats2::-webkit-scrollbar-thumb { background: #d3dbe2; border-radius: 3px; }
.cod-stats2 .cs2-total, .cod-stats2 .cs2-card {
  flex: 0 0 auto; min-width: 126px; border-radius: 12px; padding: 9px 13px 8px;
  background: #fff; border: 1px solid #e2e7eb; }
.cod-stats2 .cs2-total {
  background: linear-gradient(135deg, #1a7f5a, #116044); border-color: transparent; color: #fff;
  box-shadow: 0 4px 14px rgba(26, 127, 90, .30); min-width: 150px; }
.cod-stats2 .cs2-name { font-size: 12.5px; font-weight: 600; color: #6b7580;
  display: flex; align-items: center; gap: 6px; white-space: nowrap; }
.cod-stats2 .cs2-total .cs2-name { color: rgba(255, 255, 255, .92); }
.cod-stats2 .cs2-code { font-size: 11px; font-weight: 700; background: #eef4ff; color: #334f80;
  border-radius: 5px; padding: 1px 6px; line-height: 1.3; }
.cod-stats2 .cs2-total .cs2-code { background: rgba(255, 255, 255, .20); color: #fff; }
.cod-stats2 .cs2-num { font-size: 24px; font-weight: 800; line-height: 1.05; margin: 3px 0 5px;
  color: #1f2328; }
.cod-stats2 .cs2-total .cs2-num { color: #fff; }
.cod-stats2 .cs2-sub { display: flex; gap: 10px; flex-wrap: nowrap; font-size: 12.5px; }
.cod-stats2 .cs2-t { color: #7a838d; white-space: nowrap; }
.cod-stats2 .cs2-t::before { content: ''; display: inline-block; width: 7px; height: 7px;
  border-radius: 50%; background: #cbd3da; margin-right: 5px; vertical-align: 0; }
.cod-stats2 .cs2-t b { font-weight: 700; color: #1f2328; }
.cod-stats2 .cs2-t.b::before { background: #17865a; }
.cod-stats2 .cs2-t.a::before { background: #e8862c; }
.cod-stats2 .cs2-t.f::before { background: #4a6fd0; }
.cod-stats2 .cs2-t.n { color: #9aa3ac; }
.cod-stats2 .cs2-t.n::before { display: none; }
/* 总览卡深绿底：三个维度统一白色，圆点用半透明白 */
.cod-stats2 .cs2-total .cs2-t { color: rgba(255, 255, 255, .88); }
.cod-stats2 .cs2-total .cs2-t b { color: #fff; }
.cod-stats2 .cs2-total .cs2-t::before { background: rgba(255, 255, 255, .72); }
.cod-stats2 .cs2-alert { flex: 0 0 auto; align-self: center; padding: 6px 12px; border-radius: 8px;
  font-size: 12.5px; font-weight: 600; white-space: nowrap; }
.cod-stats2 .cs2-alert.exp { background: #fdeeec; border: 1px solid #f6cfc9; color: #9c382f; }
.cod-stats2 .cs2-alert.gray { background: #f4f6f8; border: 1px solid #e2e7eb; color: #6b7580; }

/* v1.331 / D-145 产品激活码页改左右两栏：左=激活码列表，右=产品购买记录报表 */
.cod-layout { display: flex; gap: 14px; align-items: flex-start; }
.cod-layout .cod-main { flex: 1 1 0; min-width: 0; }
.cod-layout .cod-side { flex: 0 0 380px; width: 380px; min-width: 0; }
@media (max-width: 1080px) {
  .cod-layout { flex-direction: column; }
  .cod-layout .cod-side { flex: 1 1 auto; width: 100%; }
}
/* 右栏购买记录报表 */
.buyrep { background: #fff; border: 1px solid var(--line); border-radius: 12px; padding: 12px 14px; }
.buyrep-head { display: flex; align-items: center; justify-content: space-between; margin-bottom: 10px; }
.br-title { font-size: 14px; font-weight: 700; color: var(--text); display: flex; align-items: center; gap: 8px; }
.br-note { font-size: 12px; font-weight: 600; color: #6b7580; background: #f4f6f8; border-radius: 999px; padding: 2px 9px; }
.br-refresh { cursor: pointer; font-size: 15px; color: #6b7580; padding: 2px 8px; border-radius: 6px; }
.br-refresh:hover { color: var(--primary); background: #eef7f2; }
.br-card { border: 1px solid #eef1f0; border-radius: 10px; padding: 10px 12px; margin-bottom: 10px; }
.br-card:last-child { margin-bottom: 0; }
.br-top { display: flex; align-items: center; justify-content: space-between; gap: 8px; }
.br-no { font-size: 12px; font-weight: 600; color: #4a5a52; word-break: break-all; }
.br-st { font-size: 11px; font-weight: 600; padding: 1px 8px; border-radius: 999px; white-space: nowrap; flex-shrink: 0; }
.br-st.ok { background: #e6f4ee; color: #137a4c; }
.br-st.pend { background: #fff6e8; color: #8a5316; }
.br-st.bad { background: #fdeeec; color: #9c382f; }
.br-meta { font-size: 11px; color: #9aa3ac; margin: 3px 0 8px; }
.br-items { display: flex; flex-direction: column; gap: 4px; }
.br-item { display: flex; align-items: center; gap: 8px; font-size: 12px; }
.br-code { font-size: 10.5px; font-weight: 700; background: #eef4ff; color: #334f80; border-radius: 5px; padding: 1px 6px; flex-shrink: 0; }
.br-name { flex: 1; min-width: 0; color: #3a4a42; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.br-qty { color: #6b7580; white-space: nowrap; }
.br-qty i { font-style: normal; font-size: 10.5px; color: #9aa3ac; }
.br-price { width: 72px; text-align: right; color: #6b7580; }
.br-amt { width: 82px; text-align: right; font-weight: 600; color: #1f2328; }
.br-foot { display: flex; align-items: center; justify-content: space-between; margin-top: 8px; padding-top: 8px; border-top: 1px dashed #eef1f0; font-size: 12px; color: #6b7580; }
.br-foot b { font-size: 14px; color: var(--primary); }
.br-by { font-size: 11px; color: #9aa3ac; }

/* v1.339 / D-153 购买记录报表：查询栏 + 汇总条 + 明细表 */
.br-filter { display: flex; gap: 8px; flex-wrap: wrap; align-items: center; margin: 0 0 10px;
  padding: 10px 12px; background: #f8fafb; border: 1px solid #eef1f0; border-radius: 10px; }
.br-fld { display: inline-flex; align-items: center; gap: 5px; font-size: 12px; color: #6b7580; white-space: nowrap; }
.br-fld select { height: 34px; padding: 0 8px; font-size: 12.5px; min-width: 190px; max-width: 240px;
  border: 1px solid #dbe3e9; border-radius: 7px; background: #fff; color: #1f2328; outline: none; }
.br-fld select:focus { border-color: var(--primary); }
/* v1.347 / D-162：日期区间统一用平台标准件 .dp-range（手打 + 📅 点选），不再用原生 type=date */
.br-filter .dp-range { flex: 0 1 320px; min-width: 250px; }
.br-filter .dp-wrap .dp-text { padding: 7px 9px; font-size: 12.5px; }
.br-filter .dp-btn { padding: 0 8px; font-size: 14px; }
@media (max-width: 640px) {
  .br-filter .dp-range { flex: 1 1 100%; min-width: 0; }
  .br-filter .br-fld select { max-width: 100%; }
}
.br-sum { display: flex; gap: 10px; flex-wrap: wrap; margin: 0 0 10px; }
.br-sum .bs { font-size: 12.5px; color: #5c6670; background: #f4f6f8; border: 1px solid #e2e7eb;
  border-radius: 999px; padding: 5px 13px; white-space: nowrap; }
.br-sum .bs b { font-size: 13.5px; color: #1a7f5a; margin: 0 3px; }
.br-tbl { width: 100%; border-collapse: collapse; font-size: 12.5px; }
.br-tbl th { background: #f2f6f4; color: #6b7580; font-weight: 600; font-size: 12px; text-align: left;
  padding: 8px 10px; border-bottom: 1px solid var(--line); white-space: nowrap; }
.br-tbl td { padding: 8px 10px; border-bottom: 1px solid #eef1f0; vertical-align: top; }
.br-tbl tr:last-child td { border-bottom: none; }
.br-tbl .br-no { font-size: 11px; color: #6b7580; word-break: break-all; }
.br-pname { color: #3a4a42; }
.br-num { text-align: right; white-space: nowrap; font-variant-numeric: tabular-nums; }
/* v1.350 / D-167 授权起止日期列：等宽不换行，主机故障后照表补发授权时便于逐行核对 */
.br-tbl .br-date { white-space: nowrap; color: #42544a; font-size: 12px; font-variant-numeric: tabular-nums; }
.br-tbl .br-amt { text-align: right; white-space: nowrap; }
.br-tbl .br-amt b { color: var(--primary); font-size: 13.5px; }
.br-st-mini { display: block; font-size: 10.5px; font-weight: 600; margin-top: 3px; text-align: right; }
.br-st-mini.ok { color: #137a4c; }
.br-st-mini.pend { color: #8a5316; }
.br-st-mini.bad { color: #9c382f; }
.br-y { font-style: normal; font-size: 10.5px; color: #9aa3ac; margin-left: 2px; }

/* 状态筛选条 */
.cod-filter { display: flex; gap: 7px; flex-wrap: wrap; margin: 2px 0 8px; }
.cod-filter .cf {
  font-size: 12.5px; font-weight: 600; padding: 5px 14px; border-radius: 999px; cursor: pointer;
  background: #f4f6f8; border: 1px solid #e2e7eb; color: #5c6670; transition: .15s; user-select: none;
}
.cod-filter .cf:hover { border-color: var(--primary); color: var(--primary); }
.cod-filter .cf:active { transform: scale(.95); }
.cod-filter .cf.on { background: var(--primary); border-color: var(--primary); color: #fff; box-shadow: 0 2px 8px rgba(26, 127, 90, .28); }

/* 未绑定标记 */
.cod-nobind { color: #b45309; font-weight: 600; }

/* v1.335 绑定弹窗：账号列表改成表格，整行可点选 */
#codPickList tbody tr.codpick-row { cursor: pointer; }
#codPickList tbody tr.codpick-row:hover td { background: var(--primary-light); }
#codPickList tbody tr.codpick-row td { white-space: nowrap; }

/* v1.336 绑定弹窗：查询栏靠左收窄 + 右侧每页条数；列表分页条 */
.codpick-bar { display: flex; align-items: center; justify-content: space-between; gap: 12px; flex-wrap: wrap; margin: 10px 0 6px; }
.codpick-bar .codpick-search { flex: 0 1 auto; min-width: 0; }
.codpick-bar .codpick-search input { flex: 0 1 auto; width: 230px; }
.codpick-size { display: inline-flex; align-items: center; gap: 6px; font-size: 12.5px; color: var(--text-2); white-space: nowrap; }
.codpick-size input { width: 54px; text-align: center; padding: 6px 8px; border: 1px solid var(--line); border-radius: 8px; font-size: 12.5px; }
.codpick-size input:focus { border-color: var(--primary); outline: none; }
.codpick-pager { display: flex; align-items: center; justify-content: space-between; gap: 10px; padding: 8px 2px 0; font-size: 12.5px; color: var(--text-2); }
.codpick-pager .codpick-pgbtn { display: inline-flex; gap: 8px; }
.codpick-pager button { height: 26px; padding: 0 12px; border: 1px solid var(--line); border-radius: 999px; background: #fff; cursor: pointer; font-size: 12px; color: var(--text); }
.codpick-pager button:hover:not(:disabled) { border-color: var(--primary); color: var(--primary); }
.codpick-pager button:active:not(:disabled) { transform: scale(.94); }
.codpick-pager button:disabled { opacity: .45; cursor: not-allowed; }
@media (max-width: 640px) { .codpick-bar .codpick-search input { width: 100%; flex: 1 1 auto; } .codpick-bar .codpick-search { flex: 1 1 100%; } }
@media (max-width: 640px) { .cod-tabs a { flex: 1 1 auto; text-align: center; padding: 9px 10px; font-size: 12.5px; } }

/* v1.313 单页管理：顶部购买入口 / 产品分组 / 行内一组操作 */
.cod-top { display: flex; align-items: center; justify-content: space-between; gap: 14px; flex-wrap: wrap;
  background: #f0faf5; border: 1px solid #cfe9dc; border-radius: 10px; padding: 12px 16px; margin: 0 0 12px; }
.cod-top-t { font-size: 12.5px; color: #3a5b4c; line-height: 1.6; }
.cod-mhead { display: flex; align-items: center; justify-content: space-between; gap: 10px; flex-wrap: wrap; }
.cod-empty { background: #fafbfc; border: 1px dashed #d7dee4; border-radius: 8px; padding: 14px 16px;
  font-size: 12.5px; color: #6b7580; margin-bottom: 12px; }
.cod-empty .ac-dim { margin-left: 10px; }
.cod-ops { display: flex; gap: 5px; flex-wrap: wrap; justify-content: flex-end; align-items: center; }
.cod-op { display: inline-block; padding: 4px 10px; border-radius: 6px; font-size: 12px; line-height: 1.6;
  cursor: pointer; border: 1px solid #d7dee4; background: #fff; color: #40506a; white-space: nowrap; transition: .15s; }
.cod-op:hover { border-color: var(--primary); color: var(--primary); }
.cod-op:active { transform: scale(.95); }
.cod-op.main { background: var(--primary); border-color: var(--primary); color: #fff; font-weight: 600; }
.cod-op.main:hover { background: #126c4c; color: #fff; }
.cod-op.warn { background: #fff6e8; border-color: #f0d3a0; color: #8a5316; font-weight: 600; }
.cod-op.gray { color: #8a939d; }
/* v1.315 灰显不可点的操作（免费永久席的续期/加量：本来就不需要） */
.cod-op.dis { opacity: .5; cursor: not-allowed; background: #f6f7f8; }
.cod-op.dis:hover { border-color: #d7dee4; color: #8a939d; }
.cod-unassigned { color: #8a6d1f; font-weight: 600; }
.cod-unassigned small { display: block; font-weight: 400; font-size: 11px; color: #9aa3ac; margin-top: 2px; }
@media (max-width: 640px) {
  .cod-top { padding: 10px 12px; }
  .cod-ops { justify-content: flex-start; }
  .cod-op { padding: 5px 9px; }
}

/* v1.316 产品激活码页：顶部砍掉冗长说明，只留一行标题 + 购买按钮；
   并把「标题 + 查询栏 + 统计 + 筛选」整块冻结，滚激活码表时筛选条件始终在眼前。
   v1.318 修冻结：电脑端没有顶栏（顶栏在窄屏才显示，电脑是左侧栏），吸附位必须 top:0，
   否则头部被 sticky 硬顶到距顶 46px、上面空一大截还漏内容；手机端才吸在绿色顶栏下面。 */
.cod-head { position: sticky; top: 0; z-index: 12; background: var(--bg);
  margin: -22px -22px 10px; padding: 14px 22px 10px;
  border-bottom: 1px solid var(--line);
  box-shadow: 0 4px 12px rgba(0, 0, 0, .06); }
.cod-head-top { display: flex; align-items: center; justify-content: flex-start; gap: 16px;
  flex-wrap: wrap; margin-bottom: 8px; }
.cod-head-top .page-title { margin-bottom: 0; }
.cod-head .uaq-bar { margin: 0; }
@media (max-width: 768px) {
  .cod-head { top: var(--toph, 46px); margin: -14px -14px 10px; padding: 12px 14px 8px; }
  /* 手机有「更新供应链系统」悬浮按钮时，内容区顶部让出 54px，这里抵消掉，顶栏下不留白 */
  body.has-fab .cod-head { margin-top: -54px; }
}
body.ui-s .cod-head { margin: -10px -10px 8px; padding: 10px 10px 6px; }
body.ui-xs .cod-head { margin: -8px -8px 6px; padding: 8px 8px 6px; }
@media (orientation: landscape) and (max-height: 520px) and (pointer: coarse) {
  .cod-head { margin: -8px -12px 8px; padding: 8px 12px 4px; }
}

/* v1.319 激活码列表分页条：共 N 条 + 每页 10/50/100/200 + 上一页/下一页 */
.cod-pager { display: flex; align-items: center; justify-content: flex-end; gap: 12px;
  flex-wrap: wrap; margin: 10px 0 2px; padding-top: 10px; border-top: 1px solid var(--line);
  font-size: 12.5px; color: var(--text-2); }
.cod-pager .cp-total { color: var(--text-2); }
.cod-pager .cp-size { display: inline-flex; align-items: center; gap: 5px; }
.cod-pager .cp-size select { height: 28px; border: 1px solid var(--line); border-radius: 6px;
  background: #fff; padding: 0 6px; font-size: 12.5px; color: var(--text); outline: none; }
.cod-pager .cp-size select:focus { border-color: var(--primary); }
.cod-pager .cp-nav { display: inline-flex; align-items: center; gap: 8px; }
.cod-pager .cp-btn { height: 28px; padding: 0 12px; border: 1px solid var(--line); border-radius: 999px;
  background: #fff; color: var(--text); font-size: 12.5px; cursor: pointer; transition: .12s; }
.cod-pager .cp-btn:hover:not(:disabled) { border-color: var(--primary); color: var(--primary); }
.cod-pager .cp-btn:active:not(:disabled) { transform: scale(.94); }
.cod-pager .cp-btn:disabled { opacity: .45; cursor: not-allowed; }
.cod-pager .cp-info { font-weight: 600; color: var(--text); min-width: 64px; text-align: center; }
@media (max-width: 640px) { .cod-pager { justify-content: space-between; } }
/* v1.320 分页条挪到顶部查询栏右侧空位：去掉底部分隔线/外边距，紧凑内联 */
.cod-pager-slot { margin-left: 4px; }
.cod-pager-slot .cod-pager { margin: 0; padding: 0; border-top: none; gap: 8px; }
/* v1.320 电脑端：悬浮按钮只占标题行右侧（购买按钮让位），查询栏恢复全宽，
   这样分页条能排在查询按钮右侧同一行，而不是被挤到下一行 */
@media (min-width: 769px) {
  body.has-fab .content > .cod-head { padding-right: 22px; }
  body.has-fab .content > .cod-head .cod-head-top { padding-right: 172px; }
}

/* v1.341 物流公司「其他物流」手输：下拉右侧输入框，选中「其他物流」才出现 */
.co-row { display: flex; gap: 8px; align-items: center; }
.co-row select { flex: 0 0 auto; width: 150px; }
.co-row .co-other { flex: 1 1 auto; width: auto; min-width: 0; }
@media (max-width: 560px) {
  .co-row { flex-wrap: wrap; }
  .co-row select { width: 100%; flex: 1 1 100%; }
  .co-row .co-other { width: 100%; flex: 1 1 100%; }
}