/* 后台各角色的手机版（U-274，static/m/staff.js）：沿用经理 app 的外壳（m.css），这里只补各角色新用到的几样 */

/* 切换栏：两格、四格 */
.hseg.two, .hseg.n2 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.hseg.n3 { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.hseg.n4 { grid-template-columns: repeat(4, minmax(0, 1fr)); }
.hseg.n4 button { flex-direction: column; gap: 0; height: 52px; font-size: 13.5px; }
.hseg.n4 button b { font-size: 14px; line-height: 1.1; }
.hseg.n4 button b:empty { display: none; }

/* 今日：一句话说清今天的事 */
.s-hook { margin: 0 2px 12px; padding: 11px 14px; border-radius: 14px; background: var(--accent-soft); color: var(--ink-1); font-size: 14.5px; font-weight: 700; line-height: 1.5; text-wrap: pretty; }
.s-nums { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 8px; }
.s-nums .st { text-align: left; border: 1px solid transparent; min-height: 76px; -webkit-tap-highlight-color: transparent; }
.s-nums .st:active { background: rgba(48, 32, 20, .07); }
.s-nums .st.warn { border-color: rgba(154, 101, 18, .35); }
.s-nums .st.warn .v { color: var(--warn); }
.s-nums .st .v { font-size: 21px; }

/* 资金申请单：金额 */
.s-amt { font-family: var(--mono); font-variant-numeric: tabular-nums; font-size: 30px; font-weight: 800; letter-spacing: -.02em; line-height: 1.15; overflow-wrap: anywhere; }
.s-amt small { font-family: var(--sans); font-size: 14px; font-weight: 700; color: var(--ink-3); margin-left: 6px; letter-spacing: 0; }
.cs-kv .pkv b { flex: 1; text-align: left; min-width: 0; overflow-wrap: anywhere; }  /* 值一律从标签后面左对齐（10-26：原来右对齐，短的值靠左、长的换行靠右，一张卡里参差） */
.num { font-family: var(--mono); font-variant-numeric: tabular-nums; }

/* 照片条：点开在查看器里看 */
.ph-strip { display: flex; gap: 8px; overflow-x: auto; padding: 2px 2px 6px; scroll-snap-type: x mandatory; -webkit-overflow-scrolling: touch; }
.ph-strip a { flex: none; width: 92px; height: 92px; border-radius: 12px; overflow: hidden; border: 1px solid var(--line); background: var(--panel-2); scroll-snap-align: start; }
.ph-strip img { width: 100%; height: 100%; object-fit: cover; display: block; }

/* 底部弹层里的拍照 / 相册选择 */
.is-staff #sheet .lbl { margin: 14px 2px 8px; }
.sf-box { border: 1.5px dashed var(--line-2); border-radius: 15px; padding: 10px; background: var(--bg); }
.sf-btns { display: grid; grid-template-columns: 1fr 1fr; gap: 8px; }
.sf-btns .btn { height: 48px; font-size: 15.5px; }
.sf-btns .btn svg { width: 22px; height: 22px; }
.sf-list { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 10px; min-height: 22px; align-items: center; }
.sf-list > .meta { padding: 0 4px; }
.sf-th { position: relative; width: 72px; height: 72px; border-radius: 10px; overflow: hidden; border: 1px solid var(--line); background: var(--panel-2); }
.sf-th img { width: 100%; height: 100%; object-fit: cover; display: block; }
.sf-th.doc { width: auto; max-width: 100%; height: 44px; padding: 0 40px 0 12px; display: flex; align-items: center; font-size: 13px; font-weight: 700; color: var(--ink-2); overflow-wrap: anywhere; }
.sf-th button { position: absolute; top: 0; right: 0; width: 32px; height: 32px; display: grid; place-items: center; font-size: 20px; line-height: 1; color: #fffcf7; background: rgba(31, 23, 16, .6); border-radius: 0 0 0 10px; }

/* 勾选确认 */
.s-chk { display: flex; align-items: center; gap: 10px; min-height: 48px; margin-top: 10px; padding: 0 4px; font-size: 15px; font-weight: 700; color: var(--ink-1); }
.s-chk input { width: 22px; height: 22px; accent-color: var(--accent); flex: none; }
.s-chk[hidden] { display: none; }

/* 回单识别结果 */
.s-vr { margin-top: 10px; padding: 10px 12px; font-size: 14px; line-height: 1.6; display: grid; gap: 2px; }
.ok-x { color: var(--up); font-weight: 800; }

/* 重复凭据（服务器 409）：说明和哪条重复，选「取消上传 / 仍然上传」 */
.s-dup { position: fixed; inset: 0; z-index: 90; display: grid; place-items: center; padding: 16px; background: rgba(31, 23, 16, .45); }
.s-dup > div { width: min(420px, 100%); max-height: 80dvh; overflow: auto; background: var(--bg); border-radius: 20px; padding: 18px 16px calc(16px + env(safe-area-inset-bottom)); box-shadow: var(--shadow-lg); }
.s-dup h3 { font-size: 18px; font-weight: 800; margin-bottom: 8px; text-wrap: balance; }
.s-dup .dup-r { display: flex; justify-content: space-between; gap: 8px; padding: 8px 0; border-top: 1px solid var(--line); font-size: 14px; }

/* 看板 */
.s-board { padding: 14px 16px; }
.s-board + .s-board { margin-top: 10px; }
.s-board h4 { font-size: 15px; font-weight: 800; display: flex; align-items: baseline; gap: 6px; margin-bottom: 10px; }
.s-board h4 small { font-size: 12.5px; font-weight: 500; color: var(--ink-3); }
.s-tank { display: flex; align-items: center; gap: 14px; }
.s-tank .bar { position: relative; flex: none; width: 54px; height: 86px; border-radius: 12px; background: var(--panel-2); border: 1px solid var(--line-2); overflow: hidden; }
.s-tank .bar i { position: absolute; left: 0; right: 0; bottom: 0; background: #d18b3c; }
.s-tank .v { font-family: var(--mono); font-variant-numeric: tabular-nums; font-size: 26px; font-weight: 800; }
.s-tank .v small { font-family: var(--sans); font-size: 13px; color: var(--ink-3); margin-left: 3px; }
.s-bars { display: grid; grid-auto-flow: column; grid-auto-columns: minmax(0, 1fr); gap: 6px; align-items: end; height: 120px; }
.s-bars .b { display: flex; flex-direction: column; align-items: center; justify-content: flex-end; gap: 4px; height: 100%; min-width: 0; }
.s-bars .b i { display: block; width: 100%; max-width: 30px; border-radius: 6px 6px 3px 3px; background: var(--accent); min-height: 2px; }
.s-bars .b.fc i { background: var(--accent-soft); border: 1.5px dashed rgba(196, 89, 31, .55); }
.s-bars .b small { font-size: 11px; color: var(--ink-3); white-space: nowrap; }
.s-bars .b em { font-style: normal; font-family: var(--mono); font-variant-numeric: tabular-nums; font-size: 11.5px; font-weight: 700; color: var(--ink-2); white-space: nowrap; }
.s-top { display: grid; gap: 8px; }
.s-top .r { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 4px 10px; align-items: center; font-size: 14px; }
.s-top .r .nm { min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-weight: 700; }
.s-top .r .n { font-family: var(--mono); font-variant-numeric: tabular-nums; font-weight: 700; }
.s-top .r .ln { grid-column: 1 / -1; height: 6px; border-radius: 99px; background: var(--panel-2); overflow: hidden; }
.s-top .r .ln i { display: block; height: 100%; background: var(--teal); border-radius: 99px; }

/* 订单进度 */
.s-prog { height: 6px; border-radius: 99px; background: var(--panel-2); overflow: hidden; margin-top: 8px; }
.s-prog i { display: block; height: 100%; border-radius: 99px; background: var(--up); }

/* 列表里的复选（核对数据一键确认） */
.row.pick { cursor: pointer; }
.row.pick input { width: 22px; height: 22px; accent-color: var(--accent); flex: none; }
.row.pick.look { background: rgba(154, 101, 18, .06); }

/* 拍单菜单 */
.s-cap { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; }
.s-cap button { min-height: 96px; border-radius: 18px; background: var(--panel-2); border: 1px solid var(--line); display: flex; flex-direction: column; align-items: flex-start; justify-content: space-between; padding: 14px; text-align: left; }
.s-cap button:active { transform: scale(.97); background: var(--accent-soft); }
.s-cap button b { font-size: 16.5px; font-weight: 800; }
.s-cap button span { font-size: 12.5px; color: var(--ink-3); line-height: 1.4; }
.s-cap button svg { width: 26px; height: 26px; color: var(--accent); }

/* 我的：退出按钮那一行不要箭头 */
.is-staff #s-me .row { min-height: 60px; }

/* 核对表（粉单 AI 识别后逐项对照） */
.s-cmp { display: grid; gap: 0; }
.s-cmp .r { display: grid; grid-template-columns: 5.5em minmax(0, 1fr) minmax(0, 1fr); gap: 8px; align-items: center; padding: 9px 2px; border-top: 1px solid var(--line); font-size: 14px; }
.s-cmp .r:first-child { border-top: 0; }
.s-cmp .r.h { font-size: 12px; font-weight: 800; color: var(--ink-3); padding-top: 0; }
.s-cmp .r .k { font-weight: 700; color: var(--ink-2); }
.s-cmp .r .num { overflow-wrap: anywhere; }
.s-cmp .r.diff { background: rgba(154, 101, 18, .07); }
.s-cmp .r.diff .ai { color: var(--warn); font-weight: 800; }
.s-cmp .r.fill .ai { color: var(--up); font-weight: 800; }
.s-cmp label { display: flex; align-items: center; gap: 6px; min-height: 36px; }
.s-cmp label input { width: 20px; height: 20px; accent-color: var(--accent); }

/* 今日：一类待办先列 5 件，「其余 N 件」就地展开 */
.s-more { display: flex; align-items: center; justify-content: center; gap: 2px; width: 100%; min-height: 44px; margin-top: 6px; border-radius: 12px; font-size: 14px; font-weight: 800; color: var(--accent); }
.s-more svg { width: 16px; height: 16px; transform: rotate(90deg); }
.s-more:active { background: var(--accent-soft); }

/* 库存：某天展开的每一车 */
.s-dayx { background: var(--panel-2); border-top: 1px solid var(--line); padding: 6px 10px 10px; display: grid; grid-template-columns: minmax(0, 1fr); gap: 6px; }  /* minmax：长塔名不再把卡片撑出屏幕（10-26） */
.s-tk { min-width: 0; }
.s-tk { display: block; background: var(--bg); border: 1px solid var(--line); border-radius: 12px; padding: 9px 11px; color: inherit; text-decoration: none; }
.s-tk .h { display: flex; align-items: center; gap: 8px; font-size: 14.5px; }
.s-tk .h .nm { flex: 1; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-weight: 700; }
.s-tk .h b { flex: none; }
.s-tk .s { font-size: 12.5px; color: var(--ink-3); margin-top: 3px; line-height: 1.45; }
.s-tk.out { border-style: dashed; }
.s-bdq { margin-top: 12px; }  /* 库位详情的搜索框和结果（10-26） */
.s-bdn { margin: 12px 4px 8px; }
.s-find { display: grid; grid-template-columns: minmax(0, 1fr); gap: 8px; }
.row.open .go svg { transform: rotate(90deg); }
.row .go svg { transition: transform .2s var(--ease); }

/* 入库：按天切换 */
.tk-day { display: flex; align-items: center; gap: 8px; margin-top: 10px; }
.tk-day .field { flex: 1; height: 46px; }
.tk-day .mini { width: 44px; height: 44px; font-size: 20px; padding: 0; }

/* 底部有「＋」的角色：页面最后一行不被凸起的按钮挡住 */
.is-staff.r-finance .view { padding-bottom: calc(env(safe-area-inset-bottom) + var(--tabbar-h) + 64px); }

/* 行里的小按钮（催办、查看、录入、凭证）：点击区不小于 44px */
.is-staff .row .mini, .is-staff .pkv .mini, .is-staff .s-vr .mini { height: 44px; min-width: 44px; padding: 0 14px; display: inline-grid; place-items: center; }
.is-staff .mini:active { transform: scale(.96); background: var(--line); }

/* 29 号超标粮专库（U-280）：单独一行 / 一块 */
.s-sp { margin-top: 10px; padding: 9px 12px; border-radius: 12px; background: rgba(154, 101, 18, .08); border: 1px solid rgba(154, 101, 18, .25); font-size: 13.5px; line-height: 1.5; }
.s-sp small { display: block; color: var(--ink-3); font-size: 12px; }
.s-spc { padding: 10px 12px; margin-bottom: 8px; background: rgba(154, 101, 18, .06); border-color: rgba(154, 101, 18, .22); }
/* 观察员（U-302）只看库存质量：没有通知中心 */
.r-viewer .top-r .bell { display: none; }

/* 手机版库存：3D 透视仓库（10-22，U-302 用户：「手机版的库存质量页面，应该保留现在的 3d 透视仓库视图」），模块和电脑版同一个（admin/wh3d.js），标签样式照 admin.css 的手机尺寸 */
.s-wh3 { --corn-ink: #8f5e10; padding: 0; overflow: hidden; margin-bottom: 12px; }
.s-wh3-t { display: flex; align-items: center; justify-content: space-between; gap: 8px; padding: 10px 10px 6px; }
.s-whm { display: inline-flex; padding: 3px; gap: 2px; border-radius: 11px; background: var(--panel-2); border: 1px solid var(--line); }
.s-whm button { min-width: 52px; height: 38px; padding: 0 10px; border-radius: 8px; font-size: 14px; font-weight: 700; color: var(--ink-2); }
.s-whm button.on { background: var(--ink-1); color: var(--bg); }
.s-whr { height: 44px; padding: 0 14px; border-radius: 11px; border: 1px solid var(--line-2); background: var(--bg); font-size: 14px; font-weight: 700; color: var(--ink-2); }
.s-whr:active, .s-whm button:active { transform: scale(.96); }
.s-wh3 .wh-canvas { position: relative; height: 320px; touch-action: none; background: #fffdf9; }
.s-wh3 .wh-canvas canvas { display: block; }
.s-wh3 .wh-canvas > .empty { position: absolute; inset: 0; display: grid; place-items: center; padding: 20px; text-align: center; }
.s-wh3-f { padding: 8px 12px 10px; border-top: 1px solid var(--line); font-size: 12.5px; color: var(--ink-3); text-wrap: pretty; }
.s-wh3-f i { display: inline-block; width: 9px; height: 9px; border-radius: 2px; margin: 0 2px 0 6px; vertical-align: -1px; }
.s-wh3-f i.g { background: #2f7a55; } .s-wh3-f i.y { background: #c9a227; } .s-wh3-f i.o { background: #e07a1f; } .s-wh3-f i.r { background: #c0392b; }
.s-wh3 .wh-labels { position: absolute; inset: 0; pointer-events: none; overflow: hidden; }
.s-wh3 .wh-lb { position: absolute; left: 0; top: 0; pointer-events: none; display: grid; justify-items: center; min-width: 0; padding: 2px 6px 3px; border-radius: 7px; line-height: 1.2;
  background: rgba(255, 253, 249, .94); border: 1px solid var(--line-2); box-shadow: 0 8px 18px -12px rgba(60, 38, 20, .55); translate: -50% calc(-100% - 6px); font-size: 11px; color: var(--ink-3); white-space: nowrap; }
.s-wh3 .wh-lb::after { content: ""; position: absolute; left: 50%; bottom: -5px; width: 8px; height: 8px; margin-left: -4px; background: inherit; border: inherit; border-width: 0 1px 1px 0; rotate: 45deg; }
.s-wh3 .wh-lb.hov { border-color: var(--accent); }
.s-wh3 .wh-lb.hide { visibility: hidden; }
.s-wh3 .wh-lb.mini { display: flex; gap: 5px; align-items: baseline; height: auto; translate: -50% calc(-100% - 2px); }  /* m.css 的通用 .mini 按钮是 36px 高，别套到缩小的标签上 */
.s-wh3 .wh-lb.mini::after { display: none; }
.s-wh3 .wh-lb small, .s-wh3 .wh-lb.mini em, .s-wh3 .wh-lb.mini.mv span, .s-wh3 .wh-name.mini span { display: none; }
.s-wh3 .wh-lb.mini.mv em { display: inline; font-size: 11.5px; }
.s-wh3 .wh-lb.mini.micro span, .s-wh3 .wh-lb.mini.micro em { display: none; }
.s-wh3 .wh-name.mini { translate: -100% -50%; }
.s-wh3 .wh-name.below { translate: -50% 2px; }
.s-wh3 .wh-lb b { font-family: var(--mono); font-size: 12px; font-weight: 800; color: var(--ink-1); }
.s-wh3 .wh-lb span { font-family: var(--mono); font-size: 11.5px; font-weight: 800; color: var(--corn-ink); }
.s-wh3 .wh-lb em { font-style: normal; font-weight: 800; }
.s-wh3 .wh-lb.empty span { color: var(--ink-3); font-family: var(--sans); }
.s-wh3 .wh-lb.over span { color: var(--down); }
.s-wh3 .wh-lb.on { background: var(--ink-1); border-color: var(--ink-1); color: rgba(255, 250, 244, .75); }
.s-wh3 .wh-lb.on b, .s-wh3 .wh-lb.on span, .s-wh3 .wh-lb.on em { color: var(--on-accent); }
.s-wh3 .wh-name { display: flex; align-items: baseline; gap: 6px; padding: 0; background: none; border: 0; box-shadow: none; translate: -100% -50%; }
.s-wh3 .wh-name::after { display: none; }
.s-wh3 .wh-name b { font-family: var(--sans); font-size: 13px; color: var(--ink-1); text-shadow: 0 0 4px var(--bg), 0 0 4px var(--bg); }
.s-wh3 .wh-name span { font-size: 11.5px; color: var(--ink-3); text-shadow: 0 0 4px var(--bg); }

/* U-315 staff3.js：手机上生成合同、补齐合同（不再去电脑版） */
.field.s3-sel select { flex: 1; min-width: 0; border: 0; outline: 0; background: none; font: inherit; font-size: 17px; font-weight: 700; color: var(--ink-1); appearance: none; -webkit-appearance: none; }
.field.s3-sel select:disabled, .field input[readonly] { color: var(--ink-3); }
.fw.ed .field { border-color: var(--warn); }
.fw.ed .lbl { color: var(--warn); }
.s3-ck { display: flex; align-items: center; gap: 10px; margin: 16px 2px 0; font-weight: 800; font-size: 15px; color: var(--ink-1); }
.s3-ck input { width: 20px; height: 20px; accent-color: var(--accent); flex: none; }
.s3-note { margin: 8px 2px 0; }
.s3-lack { margin-top: 12px; padding: 14px 16px; }
.card.s-form { padding: 10px 14px 14px; }  /* 卡片里的表单（塔的基本信息、修改订单）：字和输入框不贴卡片边（10-26） */
.s3-lack .meta { margin-top: 4px; overflow-wrap: anywhere; }
.s3-lack .btn-row { margin-top: 10px; }
.s3-left { margin: 14px 2px 0; overflow-wrap: anywhere; }
.s3-src { margin: 4px 4px 0; font-size: 12px; overflow-wrap: anywhere; }
.s3-err:not(:empty) { margin-bottom: 8px; overflow-wrap: anywhere; }
/* U-315 staff2.js：手机上就地办——资质证件、按粉单新增、改运力、合同补齐 */
.field select { flex: 1; min-width: 0; border: 0; outline: 0; background: none; font: inherit; font-size: 17px; font-weight: 700; color: var(--ink-1); }
.field.ai-fill { background: var(--up-soft); border-color: rgba(47, 122, 85, .45); }
.pn-g { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 14px 10px; }  /* 两列表单（改车辆、粉单、绿单……）：上下两行留 14px（10-26 财务：「标题和输入框之间的间隙太小」） */
.pn-g .lbl { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.pn-f > .lbl, .is-staff #sheet .pn-f > .lbl { margin: 0 2px 8px; }  /* 格子里的标签：上面靠行间距，下面离输入框 8px */
.pn-g .field { height: 52px; padding: 0 12px; }
.pn-g .field input { font-size: 17px; }
.cap2-n { display: grid; grid-template-columns: 58px minmax(0, 1fr) 58px; gap: 10px; align-items: center; }
.cap2-n .btn { height: 58px; font-size: 24px; padding: 0; }
.cap2-n .field input { text-align: center; }
.ct-fix:not(:empty) { margin-top: 10px; }
.dz-acts { display: flex; gap: 6px; flex-shrink: 0; align-items: center; }
.h-sec .mini { margin-left: 8px; vertical-align: middle; }
#dc-ai .late, #dc-ai .meta { margin-top: 4px; overflow-wrap: anywhere; }
/* U-315 staff.js：体检打开的塔、订单就地改；不能改的格（俗称以经理为准等）灰字 */
.field input:disabled { color: var(--ink-3); -webkit-text-fill-color: var(--ink-3); }
/* U-317 / U-319 / U-320 staff2.js：不合格、绿单、粉单手工填、财务修改一车（字段两列、照片能看能换） */
.row.tk-gone, .cs-top.tk-gone { opacity: .55; }
.tk-green { color: var(--up); }
.pn-g .te-w { grid-column: 1 / -1; }
.te-phs { display: grid; gap: 8px; }
.te-ph { display: flex; align-items: center; gap: 8px; min-height: 52px; padding: 6px 12px; border: 1px solid var(--line); border-radius: 14px; background: var(--bg); }
.te-ph .main { flex: 1; min-width: 0; overflow-wrap: anywhere; }
.te-ph .mini { height: 40px; min-width: 64px; padding: 0 12px; flex: none; }
.te-err:not(:empty) { margin: 0 2px 10px; color: var(--down); font-weight: 700; overflow-wrap: anywhere; }
.td-acts { display: flex; flex-wrap: wrap; gap: 8px; }
.td-acts .btn { flex: 1 1 140px; }
.te-ph a.mini { display: inline-flex; align-items: center; justify-content: center; text-decoration: none; }
/* U-323 staff2.js：是不是重检，前几次没过的车里选一条（单选） */
.rc-list .rc-o { align-items: flex-start; gap: 10px; text-align: left; }
.rc-list .rc-o .rc-dot { flex: none; width: 18px; height: 18px; margin-top: 3px; border-radius: 50%; border: 2px solid var(--line-2); }
.rc-list .rc-o.on { box-shadow: inset 0 0 0 2px var(--accent); }
.rc-list .rc-o.on .rc-dot { border-color: var(--accent); background: var(--accent); box-shadow: inset 0 0 0 3px var(--bg); }
.rc-list .rc-o .s { overflow-wrap: anywhere; }
/* 资金申请单「审批依据」（U-324）：对不上、缺回单、缺发票的那一行标红 */
.s-basis .pkv.bad > span { color: var(--bad, #b3261e); font-weight: 700; }
.s-basis .pkv b { font-weight: 600; }

/* 资金申请单底部三个按钮时主按钮放宽、不折行（U-401 发签批链接） */
.btn-row .btn.wide { flex: 1.6; white-space: nowrap; }
.tag.wp { background: var(--teal); color: var(--bg); border-color: transparent; }  /* 过磅付（10-24）：深青色，和电脑版、签批页一致 */
.tk-rg { margin-top: 8px; }  /* 入库车辆：按天 / 过去 3 天 / 过去 7 天（10-26） */
.tk-rg button { height: 34px; font-size: 14px; }
