:root {
  --bg: #f7f5f2;
  --card-bg: #ffffff;
  --text: #2b2b28;
  --muted: #8a857c;
  --border: #e6e2da;
  --primary: #4a5a45;
  --primary-text: #ffffff;
  --danger: #b3402f;
  --danger-bg: #fbeae6;
  --warning: #b8792b;
  --warning-bg: #fbf1e2;
  --ok-bg: #eef1ea;
}

* { box-sizing: border-box; }

body {
  margin: 0;
  font-family: -apple-system, BlinkMacSystemFont, "Helvetica Neue", Arial, "PingFang SC", "Microsoft YaHei", sans-serif;
  background: var(--bg);
  color: var(--text);
}

.container {
  max-width: 640px;
  margin: 0 auto;
  padding: 16px;
}
.container.has-nav { padding-bottom: 88px; }

.topbar {
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 12px 16px;
  background: var(--card-bg);
  border-bottom: 1px solid var(--border);
  position: sticky;
  top: 0;
  z-index: 10;
}
.topbar-title { font-weight: 600; }
.topbar-right { display: flex; align-items: center; gap: 12px; }
.logout-form { display: flex; align-items: center; gap: 8px; }
.staff-name { color: var(--muted); font-size: 14px; }
.lang-switch { display: flex; gap: 4px; }
.lang-switch a {
  font-size: 12px;
  font-weight: 600;
  color: var(--muted);
  text-decoration: none;
  padding: 3px 7px;
  border-radius: 6px;
}
.lang-switch a.lang-active { background: var(--ok-bg); color: var(--primary); }

.card {
  background: var(--card-bg);
  border: 1px solid var(--border);
  border-radius: 14px;
  padding: 20px;
  margin-bottom: 16px;
}
.center-card { margin-top: 15vh; }

h1 { font-size: 20px; margin: 0 0 12px; }
h2 { font-size: 16px; }
.section-title { margin: 20px 4px 8px; font-size: 15px; }
.danger-text { color: var(--danger); }
.warning-text { color: var(--warning); }

.muted { color: var(--muted); font-size: 13px; }
.error { color: var(--danger); font-size: 14px; }

form label {
  display: block;
  font-size: 13px;
  color: var(--muted);
  margin-bottom: 12px;
}
form input[type="text"],
form input[type="password"],
form input[type="number"],
form input[type="date"],
form select {
  display: block;
  width: 100%;
  margin-top: 4px;
  padding: 12px;
  font-size: 16px;
  border: 1px solid var(--border);
  border-radius: 10px;
  background: #fff;
  color: var(--text);
}

.btn-primary, .btn-secondary, .btn-scan {
  border: none;
  border-radius: 10px;
  padding: 13px 18px;
  font-size: 16px;
  cursor: pointer;
  width: 100%;
}
.btn-primary { background: var(--primary); color: var(--primary-text); }
.btn-secondary { background: var(--ok-bg); color: var(--text); }
.btn-scan { background: var(--ok-bg); color: var(--text); width: auto; white-space: nowrap; }
.btn-link { background: none; border: none; color: var(--primary); font-size: 14px; padding: 6px 0; cursor: pointer; text-decoration: underline; }

.picker-row { display: flex; gap: 8px; align-items: stretch; }
.picker-row input { flex: 1; }
.picker-results { margin-top: 4px; }
.picker-item { padding: 10px; border: 1px solid var(--border); border-radius: 8px; margin-bottom: 4px; cursor: pointer; background: #fff; }
.picker-item:hover { background: var(--ok-bg); }
.picker-empty { color: var(--muted); font-size: 13px; padding: 6px; }
.picker-selected { background: var(--ok-bg); padding: 10px 12px; border-radius: 8px; margin: 8px 0; font-size: 14px; }

.inline-form { display: flex; flex-wrap: wrap; gap: 8px; margin: 12px 0; }
.inline-form input, .inline-form select { flex: 1; min-width: 100px; padding: 10px; border: 1px solid var(--border); border-radius: 8px; }
.inline-form button { flex: none; }

.summary-row { display: flex; gap: 12px; margin-bottom: 16px; }
.summary-tile { flex: 1; border-radius: 14px; padding: 18px; text-align: center; }
.tile-danger { background: var(--danger-bg); color: var(--danger); }
.tile-warning { background: var(--warning-bg); color: var(--warning); }
.tile-num { font-size: 32px; font-weight: 700; }
.tile-label { font-size: 13px; margin-top: 4px; }

.empty-state { text-align: center; color: var(--muted); padding: 32px 16px; }

.batch-row {
  display: flex;
  align-items: center;
  gap: 10px;
  background: var(--card-bg);
  border: 1px solid var(--border);
  border-left: 5px solid var(--border);
  border-radius: 10px;
  padding: 12px 14px;
  margin-bottom: 8px;
}
.batch-row.status-expired { border-left-color: var(--danger); background: var(--danger-bg); }
.batch-row.status-warning { border-left-color: var(--warning); background: var(--warning-bg); }
.batch-main { flex: 1; }
.batch-name { font-weight: 600; }
.batch-meta { font-size: 13px; color: var(--muted); margin-top: 2px; }
.batch-qty { font-weight: 600; white-space: nowrap; }
.batch-actions { display: flex; flex-direction: column; align-items: flex-end; gap: 2px; }

.filter-form { display: flex; gap: 8px; margin-bottom: 14px; flex-wrap: wrap; }
.filter-form input { flex: 2; min-width: 140px; padding: 10px; border: 1px solid var(--border); border-radius: 8px; }
.filter-form select { flex: 1; padding: 10px; border: 1px solid var(--border); border-radius: 8px; }

.data-table { width: 100%; border-collapse: collapse; margin-top: 8px; }
.data-table th, .data-table td { text-align: left; padding: 8px; border-bottom: 1px solid var(--border); font-size: 14px; }

.preview-box { margin-top: 14px; padding: 12px; background: var(--ok-bg); border-radius: 10px; }
.preview-item { font-size: 14px; padding: 4px 0; }
.manual-row { margin: 8px 0; }
.manual-row input { width: 100px; margin-top: 4px; }
.warn-badge { display: block; color: var(--warning); font-size: 12px; margin-top: 2px; }

.confirm-list { margin: 10px 0; }
.confirm-item { display: flex; justify-content: space-between; align-items: center; gap: 10px; padding: 10px 12px; border: 1px solid var(--border); border-radius: 10px; margin-bottom: 8px; background: #fff; }
.confirm-item.confirm-done { border-color: var(--primary); background: var(--ok-bg); }
.confirm-item-info { font-size: 14px; }
.confirm-item-status { font-size: 13px; color: var(--muted); white-space: nowrap; }
.confirm-item.confirm-done .confirm-item-status { color: var(--primary); font-weight: 600; }
.btn-primary:disabled { opacity: 0.45; cursor: not-allowed; }

.msg { font-size: 14px; min-height: 20px; margin: 8px 0; }
.msg-ok { color: var(--primary); }
.msg-error { color: var(--danger); }

.bottom-nav {
  position: fixed;
  bottom: 0;
  left: 0;
  right: 0;
  display: flex;
  background: var(--card-bg);
  border-top: 1px solid var(--border);
  padding: 8px 4px calc(8px + env(safe-area-inset-bottom));
  z-index: 10;
}
.bottom-nav a {
  flex: 1;
  text-align: center;
  text-decoration: none;
  color: var(--text);
  font-size: 12px;
  padding: 6px 2px;
}

.scan-overlay {
  position: fixed;
  inset: 0;
  background: rgba(0,0,0,0.8);
  display: flex;
  align-items: center;
  justify-content: center;
  z-index: 100;
}
.scan-box {
  background: #fff;
  border-radius: 14px;
  padding: 16px;
  width: 90%;
  max-width: 400px;
}
#scan-reader { width: 100%; margin-bottom: 12px; }

@media (prefers-color-scheme: dark) {
  :root {
    --bg: #1c1b19;
    --card-bg: #26241f;
    --text: #ece8e0;
    --muted: #9a958a;
    --border: #3a372f;
    --ok-bg: #302e28;
    --danger-bg: #3a2420;
    --warning-bg: #3a2f1c;
  }
  .picker-item { background: var(--card-bg); }
  .scan-box { background: var(--card-bg); }
}

/* ---------- 退货 / 取消单 ---------- */
.returns-money { display:grid; grid-template-columns:repeat(auto-fit,minmax(150px,1fr)); gap:8px; margin:12px 0; }
.rm-card { border:1px solid #e2e5e8; border-left:3px solid #888; border-radius:4px; padding:9px 11px; background:#fff; }
.rm-claim { border-left-color:#9a6a12 } .rm-wait { border-left-color:#15605a }
.rm-sold { border-left-color:#2a6349 } .rm-cn { border-left-color:#ae3a34 }
.rm-l { display:block; font-size:11px; letter-spacing:.06em; color:#6b7680; text-transform:uppercase }
.rm-v { display:block; font-size:19px; font-weight:600 }
.rm-s { display:block; font-size:11.5px; color:#6b7680 }

.returns-tiles { display:grid; grid-template-columns:repeat(auto-fit,minmax(170px,1fr)); gap:8px; margin:12px 0; }
.rt-tile { display:block; text-decoration:none; color:inherit; background:#fff; border:1px solid #e2e5e8;
  border-left:3px solid #888; border-radius:4px; padding:10px 12px; }
.rt-tile.on { background:#f2f7f6; border-color:#15605a }
.rt-bad { border-left-color:#ae3a34 } .rt-ours { border-left-color:#9a6a12 }
.rt-ok { border-left-color:#2a6349 } .rt-unknown { border-left-color:#5b6670 }
.rt-l { display:block; font-size:12px; font-weight:600; letter-spacing:.05em; text-transform:uppercase }
.rt-n { display:block; font-size:22px; font-weight:600 }
.rt-a { font-size:11.5px; color:#6b7680; font-weight:400 }
.rt-h { display:block; font-size:11.5px; color:#6b7680; margin-top:4px; line-height:1.35 }
.rt-p { display:block; height:3px; background:#e2e5e8; border-radius:2px; margin:6px 0 3px; overflow:hidden }
.rt-p i { display:block; height:100%; background:#15605a }

/* 一列退货单。原本写 4 栏但实际有 5 块内容（天数/品项/原因/操作/金额），
   第 5 块被挤出格线 → 桌面版文字重叠（2026-09-09 修）。
   改成两段式：上排是资讯（一眼扫），下排是操作（要点的东西），操作区不再被压在窄栏里。 */
.ret-row { display:grid; gap:6px 12px;
  grid-template-columns:52px minmax(0,1.6fr) minmax(0,1.1fr) 104px;
  grid-template-areas:
    "age main reason amt"
    "act act  act    act";
  border:1px solid #e2e5e8; border-left:3px solid #888; border-radius:4px;
  padding:11px 13px; margin-bottom:7px; background:#fff; }
.ret-row > * { min-width:0; }               /* 不加这行长字串会把栏位撑爆 */
.ret-age { grid-area:age } .ret-main { grid-area:main }
.ret-reason { grid-area:reason } .ret-amt { grid-area:amt }
.ret-act { grid-area:act; border-top:1px solid #eef1f3; padding-top:8px; margin-top:2px;
  display:grid; grid-template-columns:repeat(auto-fit,minmax(210px,1fr)); gap:6px 16px; align-items:start }
.ret-reason, .ret-main p, .ret-flag { overflow-wrap:anywhere }
.ret-bad { border-left-color:#ae3a34 } .ret-ours { border-left-color:#9a6a12 }
.ret-ok { border-left-color:#2a6349 } .ret-unknown { border-left-color:#5b6670 }
.ret-age { text-align:right } .ret-age b { display:block; font-size:19px } .ret-age span { font-size:10.5px; color:#6b7680 }
.ret-prod { margin:0 0 2px; font-weight:500; line-height:1.35 }
.ret-meta { margin:0 0 3px; font-size:11.5px; color:#6b7680 }
.ret-trk { font-family:ui-monospace,Menlo,monospace }
.ret-reason { margin:4px 0 0; font-size:13px; line-height:1.4 }
.ret-tag { font-size:10.5px; font-weight:600; text-transform:uppercase; letter-spacing:.05em;
  background:#eef1f3; border-radius:2px; padding:1px 5px; margin-right:6px }
.ret-flag { margin:4px 0 0; font-size:11.5px; color:#9a6a12; line-height:1.35 }
.ret-stage { font-size:10px; letter-spacing:.1em; text-transform:uppercase; color:#6b7680; margin:5px 0 3px }
.ret-btns { display:flex; gap:4px }
.ret-b { flex:1; font-size:11.5px; font-weight:600; padding:5px 3px; border:1px solid #d8dde1;
  border-radius:3px; background:#fff; color:#6b7680; cursor:pointer }
.ret-b[aria-pressed="true"] { background:#15605a; border-color:#15605a; color:#fff }
.ret-b:disabled { opacity:.5 }
.ret-in { width:100%; font-size:12px; padding:4px 7px; margin-top:4px; border:1px solid #d8dde1; border-radius:3px }
.ret-sig { margin:4px 0 0; font-size:10.5px; color:#6b7680 }
.ret-sig a { margin-left:6px }
.ret-verdict { display:block; margin-top:5px; font-size:11.5px; font-weight:600; padding:3px 7px; border-radius:3px;
  background:#eef1f3; color:#5b6670 }
.v-claim,.v-wait { background:#fcf3e2; color:#9a6a12 } .v-cn { background:#fbedec; color:#ae3a34 }
.v-sold { background:#e8f2ec; color:#2a6349 }
.ret-amt { text-align:right } .ret-amt b { display:block; font-size:15px } .ret-amt span { font-size:10.5px; color:#6b7680 }
@media (max-width:820px){ .ret-row { grid-template-columns:44px 1fr } .ret-act,.ret-amt { grid-column:2/-1 } .ret-amt { text-align:left } }
.ret-lab { display:block; font-size:10.5px; color:#6b7680; margin-top:4px }
.ret-lab .ret-in { margin-top:2px }
.ret-live { position:fixed; left:50%; transform:translateX(-50%); bottom:66px; z-index:50;
  background:#15605a; color:#fff; padding:9px 14px; border-radius:20px; font-size:13px;
  box-shadow:0 3px 12px rgba(0,0,0,.25); display:flex; gap:10px; align-items:center }
.ret-live button { background:#fff; color:#15605a; border:0; border-radius:14px; padding:4px 12px;
  font-size:12.5px; font-weight:600; cursor:pointer }
.ret-links { display:flex; flex-wrap:wrap; gap:5px; margin-top:6px; align-items:center }
.ret-links a, .ret-copy { font-size:11px; padding:3px 8px; border:1px solid #d8dde1; border-radius:12px;
  background:#fff; color:#15605a; text-decoration:none; cursor:pointer; white-space:nowrap }
.ret-links a:hover, .ret-copy:hover { border-color:#15605a; background:#f2f7f6 }
.ret-copy { font-family:inherit }
.ret-inv { margin:3px 0 0; font-size:11.5px; color:#15605a; font-family:ui-monospace,Menlo,monospace }
.ret-dead { display:inline-block; margin-left:6px; font-family:var(--sans,inherit); color:#ae3a34; font-weight:600 }
.ret-pending { color:#9a6a12; font-weight:600 }

/* 缅甸文要用支援 Myanmar 字体的字型堆叠，不然手机上会变方框 */
:lang(my), [lang="my"], html[lang="my"] body {
  font-family:"Noto Sans Myanmar","Myanmar Text","Padauk","Myanmar Sangam MN",
    -apple-system,BlinkMacSystemFont,sans-serif;
  line-height:1.85;   /* 缅甸文叠字多，行高要比中文大 */
}


/* 操作区改成横向分栏之后的收尾（2026-09-09） */
.ret-act .ret-stage:first-child { margin-top:0 }
.ret-act .ret-btns { flex-wrap:wrap }
.ret-act .ret-b { min-width:60px }
.ret-verdict { grid-column:1/-1 }           /* 结论横跨整列，最显眼 */
.ret-links { grid-column:1/-1 }
.ret-sig, .ret-flag { grid-column:1/-1 }
@media (max-width:820px){
  .ret-row { grid-template-columns:44px 1fr;
    grid-template-areas:"age main" "age reason" "amt amt" "act act" }
  .ret-amt { text-align:left }
}

/* 商品缩图（2026-09-09）：仓库对货用看的比读 SKU 快，
   对看不懂中文品名的员工尤其有用。图挂掉就自动隐藏，不会留破图。 */
.ret-item { display:flex; gap:9px; align-items:flex-start; margin-bottom:7px }
.ret-item:last-child { margin-bottom:0 }
.ret-thumb { width:46px; height:46px; flex:none; object-fit:cover;
  border:1px solid #e2e5e8; border-radius:4px; background:#f6f7f8 }
.ret-thumb-none { display:flex; align-items:center; justify-content:center;
  color:#b6bec4; font-size:13px }
.ret-item .ret-prod, .ret-item .ret-meta { margin:0 }
.ret-item .ret-prod { line-height:1.3 }
.ret-packer .ret-in { border-color:#d6a44b }   /* 包货员那格标出来，一眼看到要填 */

/* 包货上下班（2026-09-09）：一天点一次，不影响 PayRecon 那边照旧扫 */
.pk-bar { display:flex; gap:14px; align-items:center; justify-content:space-between; flex-wrap:wrap;
  background:#fff; border:1px solid #e2e5e8; border-left:3px solid #15605a; border-radius:4px;
  padding:11px 14px; margin:12px 0 }
.pk-k { font-size:12px; letter-spacing:.06em; text-transform:uppercase; color:#6b7680; margin-right:6px }
.pk-none { color:#9a6a12; font-weight:600 }
.pk-hint { margin:4px 0 0; font-size:12px; color:#6b7680 }
.pk-act { flex:none }
.ret-auto { margin:4px 0 0; font-size:12px; color:#2a6349 }

/* ---------- 包货台（给仓库共用 iPad 用，按钮要大）---------- */
.pk-count { display:flex; gap:10px; margin:10px 0 14px }
.pk-c { font-size:14px; padding:7px 14px; border-radius:20px; border:1px solid #e2e5e8; background:#fff }
.pk-c b { font-size:19px }
.pk-c-todo { border-left:3px solid #9a6a12 }
.pk-c-doing { border-left:3px solid #2a6349 }
.pk-setup { background:#fcf3e2; border-left:3px solid #9a6a12; padding:11px 14px; border-radius:4px }

.pk-row { display:grid; grid-template-columns:minmax(0,1fr) 260px; gap:14px;
  border:1px solid #e2e5e8; border-radius:5px; padding:13px 15px; margin-bottom:9px; background:#fff }
.pk-row.taken { background:#f4f9f6; border-color:#c6e0d2 }
.pk-ord { margin:0 0 8px; font-weight:600; font-family:ui-monospace,Menlo,monospace; font-size:14px }
.pk-shop { font-family:inherit; font-weight:400; color:#6b7680; margin-left:8px; font-size:13px }
.pk-amt { float:right; color:#15605a }
.pk-item { display:flex; gap:10px; align-items:flex-start; margin-bottom:8px }
.pk-item:last-child { margin-bottom:0 }
.pk-thumb { width:56px; height:56px; flex:none; object-fit:cover; border:1px solid #e2e5e8;
  border-radius:4px; background:#f6f7f8 }
.pk-thumb-none { display:flex; align-items:center; justify-content:center; color:#b6bec4 }
.pk-name { margin:0; font-size:14px; line-height:1.35 }
.pk-sku { margin:2px 0 0; font-size:12.5px; color:#6b7680; font-family:ui-monospace,Menlo,monospace }
.pk-sku b { color:#14181d; font-size:14px }

.pk-ask { margin:0 0 7px; font-size:12.5px; color:#6b7680 }
.pk-names { display:flex; flex-wrap:wrap; gap:7px }
/* 手指点的，按钮要够大 —— iPad 上戴手套也点得到 */
.pk-btn { min-width:76px; min-height:46px; font-size:16px; font-weight:600;
  border:1px solid #15605a; background:#fff; color:#15605a; border-radius:6px; cursor:pointer }
.pk-btn:active { background:#15605a; color:#fff }
.pk-btn:disabled { opacity:.5 }
.pk-taken { font-size:15px; color:#2a6349; line-height:1.4 }
.pk-taken b { font-size:19px }
.pk-taken span { font-size:12px; color:#6b7680 }
.pk-undo { margin-top:8px; font-size:12.5px; padding:5px 11px; border:1px solid #d8dde1;
  background:#fff; color:#6b7680; border-radius:4px; cursor:pointer }
@media (max-width:760px){ .pk-row { grid-template-columns:1fr } }
.pk-chip { display:inline-flex; align-items:center; gap:6px; background:#eef1f3; border-radius:16px;
  padding:6px 8px 6px 14px; font-size:14px; margin:0 6px 6px 0 }
.pk-chip button { border:0; background:#d8dde1; color:#5c666f; width:22px; height:22px;
  border-radius:50%; cursor:pointer; font-size:14px; line-height:1 }

/* 扫单区（包货台上方）*/
.pk-scan { display:grid; grid-template-columns:minmax(0,1fr) minmax(0,1fr); gap:16px;
  background:#fff; border:1px solid #e2e5e8; border-left:3px solid #15605a;
  border-radius:5px; padding:14px 16px; margin:12px 0 }
.pk-me .pk-k { display:block; font-size:12.5px; color:#6b7680; margin-bottom:7px }
.pk-me-btn.on { background:#15605a; color:#fff; border-color:#15605a }
.pk-scanbox label { display:block; font-size:12.5px; color:#6b7680; margin-bottom:7px }
#pkScan { width:100%; font-size:18px; padding:11px 13px; border:2px solid #15605a; border-radius:6px;
  font-family:ui-monospace,Menlo,monospace }
#pkScan:disabled { border-color:#d8dde1; background:#f6f7f8 }
.pk-hint2 { margin:6px 0 0; font-size:12px; color:#6b7680; line-height:1.4 }
.pk-result { border-radius:6px; padding:14px 16px; margin-bottom:12px }
.pk-result.good { background:#e8f2ec; border:1px solid #a9cfbc }
.pk-result.bad { background:#fbedec; border:1px solid #e3b3af }
.pk-r-t { font-size:22px; font-weight:700 }
.pk-result.good .pk-r-t { color:#2a6349 }
.pk-result.bad .pk-r-t { color:#ae3a34 }
.pk-r-d { margin-top:5px; font-size:14px; line-height:1.5 }
.pk-r-w { margin-top:6px; color:#9a6a12; font-weight:600 }
@media (max-width:760px){ .pk-scan { grid-template-columns:1fr } }

/* ---------- 包货核对（手机上用，字和按钮都要大）---------- */
.pc-wrap { max-width:640px }
.pc-back { display:inline-block; margin-bottom:8px; font-size:14px }
.pc-h { font-family:ui-monospace,Menlo,monospace; font-size:20px; margin:4px 0 2px }
.pc-scan { margin:14px 0 }
.pc-scan label { display:block; font-size:13px; color:#6b7680; margin-bottom:6px }
#pcScan { width:100%; font-size:18px; padding:12px 14px; border:2px solid #15605a;
  border-radius:6px; font-family:ui-monospace,Menlo,monospace }
#pcCam { width:100%; margin-top:8px; font-size:17px; padding:14px }

.pc-result { border-radius:8px; padding:16px 18px; margin:12px 0 }
.pc-result.good { background:#e8f2ec; border:2px solid #2a6349 }
.pc-result.bad  { background:#fbedec; border:2px solid #ae3a34 }
.pc-result.warn { background:#fcf3e2; border:2px solid #9a6a12 }
.pc-r-t { font-size:24px; font-weight:700; line-height:1.25 }
.pc-result.good .pc-r-t { color:#2a6349 }
.pc-result.bad .pc-r-t { color:#ae3a34 }
.pc-result.warn .pc-r-t { color:#9a6a12 }
.pc-r-d { margin-top:7px; font-size:15px; line-height:1.5 }
.pc-batches { margin-top:9px; background:#fff; border:1px solid #dfe3e7; border-radius:7px; padding:9px 11px }
.pc-batch-head { font-weight:700; margin-bottom:5px }
.pc-batch-head.warn { color:#9a6a12 }
.pc-batch-row { font-size:14px; padding:3px 0; border-top:1px dashed #eceef0 }
.pc-batch-row:first-of-type { border-top:0 }
.pc-batches .mono { font-family:ui-monospace,Menlo,monospace }

.pc-item { display:grid; grid-template-columns:60px minmax(0,1fr) auto; gap:12px; align-items:center;
  border:1px solid #e2e5e8; border-radius:6px; padding:11px 13px; margin-bottom:8px; background:#fff }
.pc-item.ok { background:#f2f9f5; border-color:#a9cfbc }
.pc-thumb { width:60px; height:60px; object-fit:cover; border:1px solid #e2e5e8; border-radius:4px; background:#f6f7f8 }
.pc-thumb-none { display:flex; align-items:center; justify-content:center; color:#b6bec4 }
.pc-name { margin:0; font-size:15px; line-height:1.35 }
.pc-sku { margin:3px 0 0; font-size:12.5px; color:#6b7680; font-family:ui-monospace,Menlo,monospace }
.pc-nobar { background:#fcf3e2; color:#9a6a12; border-radius:3px; padding:1px 6px; margin-left:6px;
  font-family:inherit; font-size:11.5px }
.pc-qty { text-align:right }
.pc-n { font-size:15px; color:#6b7680; white-space:nowrap }
.pc-n b { font-size:24px; color:#14181d }
.pc-item.ok .pc-n b { color:#2a6349 }
.pc-manual { display:flex; gap:5px; margin-top:6px }
.pc-manual button { min-height:40px; min-width:52px; font-size:15px; border:1px solid #d8dde1;
  background:#fff; border-radius:5px; cursor:pointer }
.pc-plus { font-weight:600; color:#15605a; border-color:#15605a !important }

.pc-foot { position:sticky; bottom:56px; background:#fff; border:1px solid #e2e5e8;
  border-radius:8px; padding:14px 16px; margin-top:14px; box-shadow:0 -2px 12px rgba(0,0,0,.06) }
.pc-foot.good { background:#e8f2ec; border-color:#2a6349 }
.pc-foot p { margin:0 0 10px; font-size:15px; font-weight:600 }
.pc-foot button { width:100%; font-size:17px; padding:14px; margin-bottom:7px }
.pc-fin { color:#2a6349 }
.pk-go { display:block; text-align:center; margin-top:8px; text-decoration:none }
/* 没选名字时的提示（比灰掉输入框好懂） */
.pk-needme { margin:6px 0 0; font-size:14px; font-weight:600; color:#9a6a12 }
.pk-names.need .pk-btn { animation:pkPulse 1.1s ease-in-out infinite }
@keyframes pkPulse { 0%,100%{ box-shadow:0 0 0 0 rgba(154,106,18,.5) } 50%{ box-shadow:0 0 0 6px rgba(154,106,18,0) } }
@media (prefers-reduced-motion:reduce){ .pk-names.need .pk-btn { animation:none; border-color:#9a6a12 } }

/* 手机版筛选栏：不要把下拉挤成一排看不出是什麽的小方块（2026-09-09 用户截图回报） */
@media (max-width:640px){
  .filter-form { display:grid; grid-template-columns:1fr 1fr; gap:8px }
  .filter-form input[type="text"],
  .filter-form input[type="search"] { grid-column:1/-1 }
  .filter-form select { width:100%; min-height:44px; font-size:15px;
    background-image:none; padding:8px 10px }
  .filter-form button, .filter-form .btn-secondary { min-height:44px; font-size:15px }
}

/* ===== 手机版包货台（2026-09-09：用户说是用手机不是 iPad）=====
   手机直的宽度大概 390px，原本按 iPad 两栏排的会挤成一团。
   改成上下排：资讯在上、名字按钮在下排满整行，单手就能点。 */
@media (max-width:640px){
  .pk-row { grid-template-columns:1fr; gap:10px; padding:12px }
  .pk-who { border-top:1px solid #eef1f3; padding-top:10px }
  .pk-names { display:grid; grid-template-columns:repeat(auto-fit,minmax(96px,1fr)); gap:8px }
  .pk-btn { width:100%; min-height:52px; font-size:17px }     /* 手指点得到 */
  .pk-ord { font-size:13px }
  .pk-amt { float:none; display:block; margin-top:2px }
  .pk-thumb { width:48px; height:48px }
  .pk-name { font-size:13.5px }

  .pk-scan { grid-template-columns:1fr; gap:12px; padding:12px }
  .pk-me-btn { min-height:52px }
  #pkScan { font-size:17px; padding:13px }
  .pk-count { flex-wrap:wrap }
  .pk-c { flex:1 1 45%; text-align:center }

  /* 核对页：手机上一行一样货，图小一点、数字大一点 */
  .pc-item { grid-template-columns:52px 1fr auto; gap:9px; padding:10px }
  .pc-thumb { width:52px; height:52px }
  .pc-name { font-size:14px }
  .pc-n b { font-size:26px }
  .pc-r-t { font-size:21px }
  .pc-manual button { min-height:44px; min-width:48px }
  /* 结果框固定在最上面，扫的时候视线不用移开 */
  .pc-result { position:sticky; top:0; z-index:20 }
  .pc-foot { bottom:60px }
}

/* ---------- 调货：选批次 ---------- */
.tf-batchbox { margin: 14px 0; padding: 12px; background: #f7f5f2; border-radius: 10px; }
.tf-bk { margin: 0 0 8px; font-weight: 600; }
.tf-batches { display: flex; flex-direction: column; gap: 6px; }
.tf-b { display: grid; grid-template-columns: 1fr auto auto; gap: 10px; align-items: center;
  padding: 12px; border: 2px solid #ddd8d0; border-radius: 8px; background: #fff;
  font-size: 15px; text-align: left; cursor: pointer; }
.tf-b.on { border-color: #4a5a45; background: #eef2ec; }
.tf-b-no { font-family: ui-monospace, monospace; }
.tf-b-exp { font-weight: 700; }
.tf-b-qty { color: #8a857c; }
.tf-b-tag { grid-column: 1 / -1; font-size: 12px; color: #4a5a45; }
.tf-warn { margin: 10px 0 0; padding: 10px; background: #fff4e0; border-radius: 8px;
  color: #8a5a00; font-size: 14px; }

/* ---------- 分装登记 ---------- */
.rp-form fieldset { border: 1px solid #e4e0d8; border-radius: 10px; padding: 14px; margin: 0 0 14px; }
.rp-form legend { padding: 0 6px; font-weight: 600; color: #4a5a45; }
.rp-key input { border: 2px solid #4a5a45; }
.rp-warn { display: block; margin-top: 6px; font-size: 13px; color: #8a5a00; }
.rp-next { color: #8a857c; }
.rp-next b, .rp-ok b { font-family: ui-monospace, monospace; }
.rp-ok { padding: 12px; background: #eef2ec; border-radius: 8px; }
.rp-ok a { margin-left: 10px; }

/* 包货台扫单：手机没有扫描枪，输入框旁边直接放相机键 */
.pk-scanrow { display: flex; gap: 8px; align-items: stretch; }
.pk-scanrow input { flex: 1; min-width: 0; }
.pk-scanrow button { flex: none; white-space: nowrap; }

/* ---------- 退货：还要提的索赔 form（一种一格，混在一起就会看漏） ---------- */
.ret-claims { margin: 16px 0; }
.ret-claims-h { margin: 0 0 8px; font-weight: 600; }
.ret-claims-row { display: grid; grid-template-columns: repeat(auto-fit, minmax(150px, 1fr)); gap: 10px; }
.rc-card { display: flex; flex-direction: column; gap: 2px; padding: 12px;
  border-radius: 10px; border: 2px solid transparent; text-decoration: none; color: inherit; }
.rc-card.on { border-color: #4a5a45; }
.rc-l { font-size: 13px; font-weight: 600; }
.rc-n { font-size: 26px; font-weight: 700; line-height: 1.1; font-variant-numeric: tabular-nums; }
.rc-a { font-size: 13px; opacity: .75; font-variant-numeric: tabular-nums; }
.rc-h { font-size: 11px; opacity: .65; margin-top: 4px; }
.rc-damage  { background: #fdecec; color: #8a1c1c; }
.rc-lost    { background: #f3ecfd; color: #4a1c8a; }
.rc-postage { background: #fff4e0; color: #8a5a00; }
.rc-freight { background: #e8f0fb; color: #1c4a8a; }
.ret-ck { margin: 4px 0 0; font-size: 13px; font-weight: 600; }
.ret-ck-damage  { color: #8a1c1c; }
.ret-ck-lost    { color: #4a1c8a; }
.ret-ck-postage { color: #8a5a00; }
.ret-ck-freight { color: #1c4a8a; }
.rt-mind   { background: #fff4e0; }
.rt-failed { background: #e8f0fb; }
.rt-cancel { background: #f2f1ee; }

/* ---------- 退货：勾一批一起提索赔 ---------- */
.ret-pick { display: flex; align-items: flex-start; padding-top: 4px; }
.ret-pick input { width: 22px; height: 22px; }
.ret-pick-off { width: 22px; }
/* ⚠️ display:flex 会盖掉浏览器给 [hidden] 的 display:none —— 少了下面这行，
   底部那条和弹窗会**永远显示**（就算一张都没勾）。2026-09-09 用户手机上撞到过。 */
.ret-bulk[hidden], .ret-sheet[hidden] { display: none !important; }

.ret-bulk { position: fixed; left: 0; right: 0; bottom: 0; z-index: 40;
  display: flex; flex-wrap: wrap; gap: 8px; align-items: center; justify-content: space-between;
  padding: 10px 14px; background: #2f3a2c; color: #fff;
  box-shadow: 0 -4px 16px rgba(0,0,0,.18); }
.rb-info { font-size: 15px; }
.rb-info b { font-size: 20px; font-variant-numeric: tabular-nums; }
.rb-shops { opacity: .8; font-size: 13px; }
.rb-shops.warn { opacity: 1; color: #ffcf7a; }
.rb-btns { display: flex; flex-wrap: wrap; gap: 6px; }
.rb-btns button { padding: 8px 12px; font-size: 14px; white-space: nowrap; }
.rb-btns .btn-link { color: #cfd8cb; background: none; border: none; }
/* 手机上按钮本来一颗一行、整条吃掉半个萤幕 —— 改成两颗一行 */
@media (max-width: 560px) {
  .ret-bulk { padding: 8px 10px; gap: 6px; }
  .rb-info { width: 100%; font-size: 14px; }
  .rb-info b { font-size: 17px; }
  .rb-btns { width: 100%; display: grid; grid-template-columns: 1fr 1fr; gap: 6px; }
  .rb-btns .btn-link { grid-column: 1 / -1; padding: 4px; }
}
.ret-sheet { position: fixed; inset: 0; z-index: 50; background: rgba(0,0,0,.45);
  display: flex; align-items: center; justify-content: center; padding: 16px; }
.rs-box { background: #fff; border-radius: 12px; padding: 20px; max-width: 760px; width: 100%;
  max-height: 88vh; overflow-y: auto; position: relative; }
@media (max-width: 560px) {
  .ret-sheet { padding: 0; align-items: stretch; }
  .rs-box { max-height: 100vh; border-radius: 0; padding: 16px; }
}
.rs-x { position: absolute; top: 10px; right: 14px; border: none; background: none;
  font-size: 26px; line-height: 1; cursor: pointer; }
.rs-warn { padding: 10px; background: #fff4e0; border-radius: 8px; color: #8a5a00; font-size: 14px; }
.rs-g { margin: 16px 0; }
.rs-gh { margin: 0 0 6px; }
.rs-t { width: 100%; font-family: ui-monospace, monospace; font-size: 12px;
  border: 1px solid #ddd8d0; border-radius: 8px; padding: 10px; }
.rc-shipq { background: #f2f1ee; color: #5a5348; }
.ret-shipq { color: #5a5348; }
.rc-sub { font-size: 10px; opacity: .7; font-weight: 400; }
.rc-sub2 { font-size: 11px; opacity: .55; }
.rc-feeq { background: #f2f1ee; color: #5a5348; }
.ret-feeq { color: #5a5348; }
.ret-ship { margin: 4px 0 0; font-size: 13px; }
.ret-ship-yes { color: #8a5a00; font-weight: 600; }
.ret-ship-no { color: #5a7a55; }
.ret-ship-unknown { color: #5a5348; }
.ret-ev { display: block; font-size: 11px; opacity: .7; font-variant-numeric: tabular-nums; }
.ret-claimamt { color: #8a1c1c; }

/* ---------- 交寄证明 ---------- */
.do-start label { display: block; margin: 10px 0; }
.do-next { color: #8a857c; }
.do-next b { font-family: ui-monospace, monospace; }
.do-h { display: flex; align-items: center; gap: 10px; flex-wrap: wrap; }
.do-sealed { font-size: 13px; color: #4a5a45; background: #eef2ec; padding: 4px 10px; border-radius: 6px; }
.do-open td { background: #fffbe8; }
.do-nophoto { color: #b45309; }
.do-count { margin: 14px 0 8px; font-size: 15px; }
.do-big { font-size: 32px; font-weight: 700; font-variant-numeric: tabular-nums; }
.do-warn { color: #8a5a00; font-size: 12px; }
.do-unmatched td { background: #fff4e0; }
.do-rm { border: none; background: #fdecec; color: #8a1c1c; border-radius: 6px;
  width: 30px; height: 30px; font-size: 14px; cursor: pointer; }
.do-photos { margin: 18px 0; }
.do-thumbs { display: flex; gap: 10px; flex-wrap: wrap; margin: 8px 0; }
.do-thumbs a { display: flex; flex-direction: column; align-items: center; gap: 2px;
  text-decoration: none; color: #8a857c; font-size: 11px; }
.do-thumbs img { width: 92px; height: 92px; object-fit: cover; border-radius: 8px;
  border: 1px solid #ddd8d0; }
.do-addphoto { display: inline-block; cursor: pointer; }
.do-foot { margin-top: 16px; padding-top: 14px; border-top: 1px solid #eee; }
.do-sealed-note { color: #4a5a45; }
.ret-dop { margin: 4px 0 0; font-size: 13px; color: #1c4a8a; }
.pc-batch { margin: 2px 0 0; font-size: 13px; color: #4a5a45; font-weight: 600; }
.pc-batch-warn { color: #8a5a00; font-weight: 600; }

/* ---------- 批次效期报告 ---------- */
.rpt-head { display: flex; justify-content: space-between; align-items: flex-start; gap: 12px; flex-wrap: wrap; }
.rpt-actions { display: flex; gap: 8px; }
.rpt-sum { display: grid; grid-template-columns: repeat(auto-fit, minmax(150px, 1fr)); gap: 10px; margin: 16px 0; }
.rs-card { display: flex; flex-direction: column; padding: 12px 14px; border-radius: 10px;
  text-decoration: none; color: inherit; border: 2px solid transparent; }
.rs-card.on { border-color: #4a5a45; }
.rs-card b { font-size: 26px; font-variant-numeric: tabular-nums; line-height: 1.1; }
.rs-card span { font-size: 12px; opacity: .7; }
.rs-bad { background: #fdecec; color: #8a1c1c; }
.rs-warn { background: #fff4e0; color: #8a5a00; }
.rs-soft { background: #f2f1ee; color: #5a5348; }
.rpt-table th { white-space: nowrap; }
.rpt-expired td { background: #fdecec; }
.rpt-warn td { background: #fff4e0; }
@media print {
  nav, .filter-form, .rpt-actions, footer, .lang-switch { display: none !important; }
  .card { border: none; box-shadow: none; }
  body { background: #fff; }
}
.trc-head { display: grid; grid-template-columns: repeat(auto-fit, minmax(110px, 1fr)); gap: 10px;
  background: #f7f5f2; border-radius: 10px; padding: 12px 14px; margin: 14px 0; font-size: 14px; }
.callout-mini { padding: 10px 12px; background: #fff4e0; color: #8a5a00; border-radius: 8px; font-size: 14px; }
.ret-recon { margin: 10px 0; padding: 10px 14px; background: #eef2ec; border-radius: 10px; font-size: 14px; }
.ret-recon-ok { color: #2f5a2b; }
.ret-recon-bad { color: #8a5a00; }

/* ---------- Grab 门市单 ---------- */
.gb-row { border: 1px solid #e4e0d8; border-radius: 12px; padding: 12px 16px; margin: 10px 0; }
.gb-row.keyed { opacity: .72; }
.gb-head { display: flex; gap: 12px; align-items: baseline; flex-wrap: wrap; }
.gb-id { font-size: 17px; }
.gb-amt { margin-left: auto; font-variant-numeric: tabular-nums; }
.gb-st { font-size: 12px; padding: 2px 10px; border-radius: 999px; background: #f2f1ee; color: #5a5348; }
.gb-st-completed { background: #eef2ec; color: #2f5a2b; }
.gb-st-cancelled { background: #fdecec; color: #8a1c1c; }
.gb-items { width: 100%; margin: 8px 0 6px; font-size: 14px; border-collapse: collapse; }
.gb-items td { padding: 4px 8px; border-top: 1px solid #f0ede8; }
.gb-foot { display: flex; gap: 10px; align-items: center; justify-content: space-between; flex-wrap: wrap; }
.gb-keyed { color: #2f5a2b; font-size: 14px; }
.gb-un { display: flex; align-items: center; gap: 6px; font-size: 14px; }
.brand-h { font-size: 34px; letter-spacing: -0.5px; margin: 0; }
.brand-tag { color: #8a857c; letter-spacing: 1.5px; font-size: 13px; text-transform: uppercase; margin: 2px 0 18px; }
.gb-tools { display: flex; gap: 8px; margin: 10px 0; flex-wrap: wrap; }
.gb-pick input { width: 20px; height: 20px; }

/* Grab 批量列：固定在搜索框和清单之间，不浮动 */
.gb-bulkbar { display: flex; align-items: center; gap: 14px; flex-wrap: wrap;
  padding: 10px 14px; margin: 10px 0 4px; border-radius: 10px;
  background: #f2f1ee; border: 1px solid #e4e0d8; }
.gb-bulkbar.on { background: #eef2ec; border-color: #4a5a45; }
.gb-selall { display: flex; align-items: center; gap: 7px; font-size: 14px; cursor: pointer; }
.gb-selall input { width: 20px; height: 20px; }
.gb-count { font-size: 14px; color: #8a857c; }
.gb-count b { font-size: 18px; color: #2b2a26; font-variant-numeric: tabular-nums; }
.gb-bulkbtns { display: flex; gap: 8px; margin-left: auto; flex-wrap: wrap; }
.gb-bulkbtns button { padding: 8px 14px; font-size: 14px; }
.gb-bulkbtns button:disabled { opacity: .4; }
@media (max-width: 560px) {
  .gb-bulkbtns { margin-left: 0; width: 100%; }
  .gb-bulkbtns button { flex: 1; }
}
.gb-csv { font-size: 12px; opacity: .6; align-self: center; }

/* Grab 筛选列 */
.gb-filter { display: flex; flex-wrap: wrap; gap: 10px 14px; align-items: flex-end;
  padding: 12px 14px; background: #f7f5f2; border-radius: 10px; margin: 12px 0; }
.gb-filter label { display: flex; flex-direction: column; gap: 4px; font-size: 12.5px; color: #8a857c; }
.gb-filter input[type="date"], .gb-filter input[type="text"] {
  padding: 7px 10px; border: 1px solid #ddd8d0; border-radius: 7px; font-size: 14px; }
.gb-filter .gb-fq { flex: 1; min-width: 180px; }
.gb-filter .gb-fq input { width: 100%; }
.gb-filter .gb-un { flex-direction: row; align-items: center; gap: 7px; font-size: 14px; color: inherit; }
.gb-fbtn { display: flex; gap: 8px; align-items: center; }
@media (max-width: 560px) {
  .gb-filter label { flex: 1 1 46%; }
  .gb-filter .gb-fq, .gb-filter .gb-un, .gb-fbtn { flex: 1 1 100%; }
}

/* ==================== Dashboard ==================== */
.dash { padding-bottom: 20px; }
.dash-hi h1 { font-size: 26px; margin: 4px 0 2px; letter-spacing: -0.4px; }
.dash-hi p { color: var(--muted, #8a857c); margin: 0 0 18px; font-size: 14px; }

.dash-cards { display: grid; grid-template-columns: repeat(auto-fill, minmax(168px, 1fr)); gap: 12px; }
.dc { position: relative; display: flex; flex-direction: column; gap: 1px;
  padding: 15px 16px 16px; border-radius: 14px; text-decoration: none; color: inherit;
  border: 1px solid #e4e0d8; background: #fff; transition: transform .08s; }
.dc:active { transform: scale(.985); }
.dc-ico { font-size: 20px; line-height: 1; }
.dc-name { font-size: 13px; font-weight: 600; opacity: .75; margin-top: 6px; }
.dc-n { font-size: 34px; font-weight: 700; line-height: 1.05; font-variant-numeric: tabular-nums; }
.dc-unit { font-size: 12px; opacity: .7; margin-top: -2px; }
.dc-sub { font-size: 11.5px; opacity: .6; margin-top: 6px; }
.dc-extra { font-size: 11.5px; margin-top: 6px; padding: 3px 8px; border-radius: 999px;
  background: rgba(0,0,0,.06); align-self: flex-start; }
.dc-bad  { background: #fdecec; border-color: #f0c9c9; color: #8a1c1c; }
.dc-warn { background: #fff4e0; border-color: #ecd6ab; color: #8a5a00; }
.dc-go   { background: #eef2ec; border-color: #cfdcc9; color: #2f5a2b; }
.dc-ok   { opacity: .62; }
.dc-ok .dc-n { font-size: 26px; }

.dash-setup { margin: 16px 0; padding: 16px 18px; border-radius: 12px;
  background: #eef2ec; border: 1px solid #cfdcc9; }
.dash-setup b { display: block; margin-bottom: 4px; }
.dash-setup p { margin: 0 0 12px; font-size: 14px; opacity: .85; }

.dash-block { margin: 22px 0; }
.dash-block h2 { font-size: 16px; margin: 0 0 8px; }
.dash-row { display: grid; grid-template-columns: 1fr auto auto; gap: 12px; align-items: center;
  padding: 9px 12px; border-radius: 9px; text-decoration: none; color: inherit;
  font-size: 14px; margin-bottom: 5px; }
.dash-row.is-bad  { background: #fdecec; }
.dash-row.is-warn { background: #fff4e0; }

.dash-feeds { display: flex; flex-wrap: wrap; gap: 8px 14px; align-items: center;
  margin-top: 24px; padding-top: 14px; border-top: 1px solid #eee; font-size: 12.5px; }
.df-title { opacity: .55; }
.df { opacity: .7; }
.df b { font-variant-numeric: tabular-nums; }
.df-bad { color: #8a5a00; opacity: 1; font-weight: 600; }
@media (max-width: 560px) {
  .dash-cards { grid-template-columns: 1fr 1fr; gap: 10px; }
  .dc { padding: 13px 13px 14px; }
  .dc-n { font-size: 29px; }
}

/* ==================== 左侧栏（照 PayRecon 那样一排整齐） ==================== */
.layout { display: flex; align-items: flex-start; }
.side {
  width: 196px; flex: none; position: sticky; top: 0; height: 100vh;
  overflow-y: auto; background: #2f3a2c; color: #e9ece7;
  padding: 14px 0 24px; box-sizing: border-box;
}
.side-brand { display: flex; align-items: center; gap: 9px; padding: 10px 16px 18px; }
/* logo 是 O+T 交织（中间藏猫狗），缩太小会看不出是什麽 —— 给它够大 + 混色去掉深蓝底 */
.sb-mark { width: 38px; height: 38px; flex: none; border-radius: 9px;
  mix-blend-mode: screen; filter: brightness(1.12); }
.sb-name { font-size: 20px; font-weight: 700; letter-spacing: -0.3px; color: #fff; opacity: .95; }
.sb-logo { font-size: 19px; font-weight: 800; letter-spacing: -0.5px; color: #fff; }
.sb-mark { width: 28px; height: 28px; border-radius: 8px; display: block; }
.sb-name { font-size: 15px; opacity: .65; }
.side-grp {
  font-size: 10.5px; letter-spacing: 1.2px; text-transform: uppercase;
  opacity: .45; padding: 16px 18px 6px;
}
.side-a {
  display: flex; align-items: center; gap: 10px; padding: 9px 18px;
  color: #d6dcd3; text-decoration: none; font-size: 14.5px;
  border-left: 3px solid transparent;
}
.side-a:hover { background: rgba(255,255,255,.06); color: #fff; }
.side-a.on { background: rgba(255,255,255,.12); color: #fff; border-left-color: #a9c49e; font-weight: 600; }
.sa-ico { width: 20px; text-align: center; font-size: 15px; }
.container.has-side { flex: 1; min-width: 0; padding-bottom: 40px; }
.container.has-side.has-nav { padding-bottom: 40px; }
.nav-burger { display: none; background: none; border: none; font-size: 22px; cursor: pointer;
  padding: 0 10px 0 0; color: inherit; }
.side-scrim { display: none; }

@media (max-width: 860px) {
  .side {
    position: fixed; left: 0; top: 0; z-index: 60; transform: translateX(-100%);
    transition: transform .2s; box-shadow: 2px 0 18px rgba(0,0,0,.25);
  }
  .side.open { transform: translateX(0); }
  .nav-burger { display: inline-block; }
  .side-scrim.on { display: block; position: fixed; inset: 0; z-index: 55; background: rgba(0,0,0,.35); }
  .container.has-side { width: 100%; }
}
@media (prefers-color-scheme: dark) {
  .side { background: #22261f; }
}

.bottom-nav { display: none !important; }

/* ==================== 拿货核对页（重做版面） ==================== */
.pick-scan { margin: 14px 0 18px; }
.ps-hint { font-size: 14px; color: #8a857c; margin: 0 0 10px; }
.ps-cam { display: block; width: 100%; padding: 18px; border: none; border-radius: 14px;
  background: #4a5a45; color: #fff; font-size: 18px; font-weight: 600; cursor: pointer; }
.ps-cam:active { transform: scale(.99); }
.ps-gun { margin-top: 10px; }
.ps-gun summary { font-size: 13px; color: #8a857c; cursor: pointer; padding: 4px 0; }
.ps-gun input { width: 100%; margin-top: 6px; padding: 10px 12px;
  border: 1px solid #ddd8d0; border-radius: 8px; font-size: 15px; }

.pick-item { border: 1px solid #e4e0d8; border-radius: 12px; padding: 14px 16px; margin-bottom: 10px;
  background: #fff; }
.pick-item.ok { background: #eef2ec; border-color: #a9c49e; }
.pi-top { margin-bottom: 12px; }
.pi-name { font-size: 16px; font-weight: 600; margin: 0 0 4px; line-height: 1.35; }
.pi-sku { font-size: 13px; color: #8a857c; margin: 0; font-family: ui-monospace, monospace; }
.pi-sku .pc-nobar { font-family: inherit; background: #fff4e0; color: #8a5a00;
  padding: 2px 8px; border-radius: 999px; margin-left: 6px; font-size: 12px; }
.pi-bot { display: flex; align-items: center; justify-content: space-between; gap: 12px; flex-wrap: wrap; }
.pi-n { font-size: 15px; color: #8a857c; }
.pi-n b { font-size: 26px; color: #2b2a26; font-variant-numeric: tabular-nums; }
.pick-item.ok .pi-n b { color: #2f5a2b; }
.pi-btns { display: flex; gap: 8px; }
.pi-btns button { padding: 11px 18px; border-radius: 9px; border: 1px solid #ddd8d0;
  background: #fff; font-size: 15px; cursor: pointer; }
.pi-btns .pc-plus { background: #4a5a45; color: #fff; border-color: #4a5a45; font-weight: 600; }
.pi-btns .pc-minus { width: 48px; }

/* 深色模式：整套页面的底色和字色要成对定义，不然字会糊掉 */
@media (prefers-color-scheme: dark) {
  body { background: #1d1c1a; color: #e8e5df; }
  .card, .pick-item, .gb-row, .dc { background: #262522; border-color: #3a3833; color: #e8e5df; }
  .pi-name, .pi-n b, .dc-n { color: #e8e5df; }
  .pi-sku, .ps-hint, .muted, .pi-n, .ps-gun summary { color: #9a958a; }
  .pick-item.ok { background: #2e332c; border-color: #4a5a45; }
  .pick-item.ok .pi-n b { color: #a9c49e; }
  .pi-btns button { background: #32302b; border-color: #3a3833; color: #e8e5df; }
  .pi-btns .pc-plus, .ps-cam { background: #4a5a45; color: #fff; }
  .ps-gun input, .gb-filter input { background: #32302b; border-color: #3a3833; color: #e8e5df; }
  .gb-filter, .gb-bulkbar, .trc-head { background: #262522; border-color: #3a3833; }
  .topbar { background: #22211e; border-color: #3a3833; }
  table, th, td { color: #e8e5df; }
  th { background: #2e332c; }
  td { border-color: #3a3833; }
}

/* 拿货页收尾修正 */
.pc-back { display: inline-block; margin-bottom: 8px; font-size: 14px;
  color: #4a5a45; text-decoration: none; }
.pc-back:hover { text-decoration: underline; }
.pick-item .pi-bot { margin-top: 12px; }
.pc-foot { margin-top: 16px; padding: 14px 16px; border-radius: 12px;
  background: #f7f5f2; border: 1px solid #e4e0d8; }
.pc-foot p { margin: 0 0 10px; font-size: 14px; }
.pc-foot.good { background: #eef2ec; border-color: #a9c49e; }
.pc-foot button { width: 100%; padding: 15px; font-size: 17px; border-radius: 11px; }
@media (prefers-color-scheme: dark) {
  .pc-back { color: #a9c49e; }
  .pc-foot { background: #262522; border-color: #3a3833; }
  .pc-foot.good { background: #2e332c; border-color: #4a5a45; }
  .pc-foot p { color: #9a958a; }
  .pc-result.good { background: #2e332c; color: #cfe0c8; }
  .pc-result.bad { background: #3a2222; color: #f0b8b8; }
  .side-scrim.on { background: rgba(0,0,0,.6); }
  a { color: #a9c49e; }
}

/* ==================== 员工页：一人一块，自己勾权限 ==================== */
.stf { border: 1px solid #e4e0d8; border-radius: 12px; padding: 14px 16px; margin-bottom: 12px; background: #fff; }
.stf.is-admin { border-color: #a9c49e; background: #f6f9f5; }
.stf-top { display: flex; align-items: center; gap: 10px; flex-wrap: wrap; margin-bottom: 10px; }
.stf-name { font-size: 17px; font-weight: 600; padding: 7px 10px; border: 1px solid #ddd8d0;
  border-radius: 8px; max-width: 200px; }
.stf-badge { font-size: 12px; padding: 3px 10px; border-radius: 999px; background: #eef2ec; color: #2f5a2b; }
.stf-loc { font-size: 13px; }
.stf-adm { display: flex; align-items: center; gap: 8px; font-size: 14px; margin: 8px 0 10px; }
.stf-adm input { width: 18px; height: 18px; }
.stf-caps { display: flex; flex-wrap: wrap; gap: 6px 14px; align-items: center;
  padding: 10px 12px; background: #f7f5f2; border-radius: 9px; margin-bottom: 10px; }
.stf-capsT { font-size: 12px; color: #8a857c; width: 100%; }
.stf-cap { display: inline-flex; align-items: center; gap: 5px; font-size: 13.5px; }
.stf-cap input { width: 16px; height: 16px; }
.stf-bot { display: flex; gap: 8px; align-items: center; flex-wrap: wrap; }
.stf-del { color: #8a1c1c; margin-left: auto; }
.stf-add { border: 1px dashed #ddd8d0; border-radius: 12px; padding: 14px 16px; }
.stf-addrow { display: flex; gap: 8px; flex-wrap: wrap; margin-bottom: 10px; }
.stf-addrow input, .stf-addrow select { padding: 8px 10px; border: 1px solid #ddd8d0; border-radius: 8px; }
@media (prefers-color-scheme: dark) {
  .stf, .stf-add { background: #262522; border-color: #3a3833; }
  .stf.is-admin { background: #2a2e27; border-color: #4a5a45; }
  .stf-caps { background: #32302b; }
  .stf-name, .stf-addrow input, .stf-addrow select, .stf-bot input {
    background: #32302b; border-color: #3a3833; color: #e8e5df; }
}

/* Dashboard 顶栏：正规後台那种资讯列，不是打招呼 */
.dash-hd { display: flex; align-items: flex-start; justify-content: space-between;
  gap: 16px; flex-wrap: wrap; padding-bottom: 14px; margin-bottom: 18px;
  border-bottom: 1px solid #e4e0d8; }
.dash-hd h1 { font-size: 22px; margin: 0; letter-spacing: -0.3px; }
.dash-co { margin: 3px 0 0; font-size: 12.5px; letter-spacing: 1px;
  text-transform: uppercase; color: #8a857c; }
.dash-meta { text-align: right; font-size: 12.5px; color: #8a857c; line-height: 1.7; }
.dm-date { display: block; font-variant-numeric: tabular-nums; color: #2b2a26; font-weight: 600; font-size: 14px; }
.dm-sync { display: block; }
@media (prefers-color-scheme: dark) {
  .dash-hd { border-color: #3a3833; }
  .dm-date { color: #e8e5df; }
}
@media (max-width: 560px) {
  .dash-meta { text-align: left; }
}

/* 扫描：结果盖在相机上 + 提示音回馈 */
.scan-toast { position: absolute; left: 12px; right: 12px; top: 12px; z-index: 5;
  padding: 14px 16px; border-radius: 12px; font-size: 15px; line-height: 1.45;
  box-shadow: 0 6px 24px rgba(0,0,0,.3); max-height: 58%; overflow-y: auto; }
.scan-toast.good { background: #e6f4ea; color: #14532d; border: 2px solid #34a853; }
.scan-toast.warn { background: #fff4e0; color: #7a4e00; border: 2px solid #e8a200; }
.scan-toast.bad  { background: #fdecec; color: #7a1414; border: 2px solid #d93025; }
.scan-toast .st-t { font-size: 17px; font-weight: 700; margin-bottom: 4px; }
.scan-toast .st-d { font-size: 14px; }
.scan-box { position: relative; }

/* 包货核对：数量讲清楚 + 打勾 */
.pc-cnt { font-size: 22px; font-weight: 700; font-variant-numeric: tabular-nums; }
.pc-more { font-size: 16px; font-weight: 700; color: #8a5a00; background: #fff4e0;
  padding: 6px 12px; border-radius: 8px; margin-top: 6px; display: inline-block; }
.pc-enough { font-size: 14px; color: #2f5a2b; margin-top: 4px; }
.pc-nobatch { font-size: 12px; opacity: .6; margin-top: 8px; }
.pc-missbox { margin-top: 10px; padding-top: 8px; border-top: 1px solid rgba(0,0,0,.12); font-size: 13.5px; }
.pc-missrow { padding: 2px 0; }
.pc-tick { display: inline-block; margin-left: 8px; width: 26px; height: 26px; line-height: 26px;
  text-align: center; border-radius: 50%; background: #34a853; color: #fff; font-weight: 700; }
.pc-item.just-ok { animation: okpulse .9s ease; }
@keyframes okpulse { 0% { box-shadow: 0 0 0 0 rgba(52,168,83,.55); } 100% { box-shadow: 0 0 0 16px rgba(52,168,83,0); } }

/* 查一下 */
.lk-manual { display: flex; gap: 8px; margin-top: 10px; }
.lk-manual input { flex: 1; padding: 11px 12px; border: 1px solid #ddd8d0; border-radius: 9px; font-size: 15px; }
.lk-card { border-radius: 12px; padding: 16px; margin-top: 14px; border: 2px solid; }
.lk-card.good { background: #f4f9f4; border-color: #a9c49e; }
.lk-card.bad { background: #fdecec; border-color: #f0c9c9; }
.lk-h { font-size: 18px; font-weight: 700; margin-bottom: 10px; }
.lk-row { display: flex; justify-content: space-between; gap: 14px; padding: 5px 0;
  border-bottom: 1px solid rgba(0,0,0,.06); font-size: 14.5px; }
.lk-row span { opacity: .7; }
.lk-warn { margin-top: 10px; padding: 8px 12px; background: #fff4e0; color: #8a5a00; border-radius: 8px; font-size: 14px; }
.lk-items { margin-top: 10px; font-size: 14px; opacity: .85; }
.lk-items div { padding: 3px 0; }
.saved-ok { padding: 10px 14px; background: #eef2ec; color: #2f5a2b; border-radius: 9px; }
@media (prefers-color-scheme: dark) {
  .lk-card.good { background: #22291f; border-color: #4a5a45; }
  .lk-card.bad { background: #2e2020; border-color: #6a3838; }
  .lk-manual input { background: #32302b; border-color: #3a3833; color: #e8e5df; }
  .saved-ok { background: #2a2e27; color: #a9c49e; }
}

/* ==================== 退货处理流程 ==================== */
.rcase { margin: 12px 0; padding: 12px 14px; border-radius: 11px;
  background: #f7f5f2; border: 1px solid #e4e0d8; }
.rc-pick { display: block; font-size: 13px; color: #8a857c; margin-bottom: 8px; }
.rc-pick select { display: block; width: 100%; max-width: 340px; margin-top: 4px;
  padding: 9px 11px; border: 1px solid #ddd8d0; border-radius: 8px; font-size: 15px; }
.rc-next { display: flex; align-items: center; gap: 10px; flex-wrap: wrap;
  padding: 10px 12px; border-radius: 9px; font-size: 14.5px; margin: 8px 0; }
.rc-nt { font-size: 12px; opacity: .65; }
.rc-hub  { background: #eef2f8; color: #1c4a8a; }
.rc-payrecon { background: #fff4e0; color: #8a5a00; }
.rc-keep, .rc-next.rc-keep { background: #f2f1ee; color: #5a5348; }
.rc-done, .rc-next.rc-done { background: #eef2ec; color: #2f5a2b; }
.rc-go { margin-left: auto; white-space: nowrap; }
.rc-dispute { display: flex; flex-wrap: wrap; gap: 8px 14px; align-items: flex-end;
  padding: 10px 0; border-top: 1px dashed #ddd8d0; }
.rc-form { font-size: 13.5px; align-self: center; }
.rc-pays { padding-top: 10px; border-top: 1px dashed #ddd8d0; }
.rc-pt { font-size: 12px; color: #8a857c; display: block; margin-bottom: 6px; }
.rc-pt b { font-size: 15px; color: #2f5a2b; margin-left: 6px; }
.rc-pay { display: flex; gap: 10px; align-items: center; font-size: 14px; padding: 3px 0; }
.rc-payrm { border: none; background: none; color: #8a1c1c; cursor: pointer; margin-left: auto; }
.rc-payadd { display: flex; gap: 6px; flex-wrap: wrap; margin-top: 6px; }
.rc-payadd input { padding: 7px 9px; border: 1px solid #ddd8d0; border-radius: 7px; font-size: 14px; }
.rc-payadd .rc-pa { width: 6.5em; }
.rc-payadd .rc-pn { flex: 1; min-width: 110px; }
@media (prefers-color-scheme: dark) {
  .rcase { background: #262522; border-color: #3a3833; }
  .rc-pick select, .rc-payadd input { background: #32302b; border-color: #3a3833; color: #e8e5df; }
  .rc-hub { background: #1f2a3a; color: #8ab0e0; }
  .rc-payrecon { background: #3a2f1a; color: #e0b56a; }
  .rc-dispute, .rc-pays { border-color: #3a3833; }
}

/* 退货：货一栏、钱一栏，并排 */
.rc-two { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; margin-top: 10px; }
.rc-lane { padding: 11px 13px; border-radius: 10px; background: #fff; border: 1px solid #e4e0d8; }
.rc-lt { display: block; font-size: 11.5px; letter-spacing: .5px; opacity: .6; margin-bottom: 3px; }
.rc-lb { display: block; font-size: 14.5px; line-height: 1.45; }
.rc-lact { display: flex; gap: 8px; margin-top: 9px; flex-wrap: wrap; }
.rc-lact a, .rc-lact button { padding: 8px 13px; font-size: 13.5px; }
.rc-s-todo, .rc-c-todo { background: #fff4e0; border-color: #ecd6ab; }
.rc-s-done, .rc-c-done { background: #eef2ec; border-color: #cfdcc9; }
.rc-s-wait, .rc-c-wait { background: #eef2f8; border-color: #ccd8e8; }
.rc-s-none, .rc-c-none { opacity: .55; }
.rc-s-unset { background: #f2f1ee; }
.rc-hint { display: block; font-size: 11.5px; opacity: .55; margin-top: 3px; }
@media (max-width: 720px) { .rc-two { grid-template-columns: 1fr; } }
@media (prefers-color-scheme: dark) {
  .rc-lane { background: #2a2926; border-color: #3a3833; }
  .rc-s-todo, .rc-c-todo { background: #3a2f1a; border-color: #5a4a25; }
  .rc-s-done, .rc-c-done { background: #2a2e27; border-color: #4a5a45; }
  .rc-s-wait, .rc-c-wait { background: #1f2a3a; border-color: #2e4058; }
}

/* 扫描视窗底下的工具列（放大／手电筒／取消）—— 2026-09-22 */
.scan-tools { display: flex; gap: 8px; }
.scan-tools .btn-secondary { flex: 0 0 auto; }
.scan-tools #scan-close { flex: 1 1 auto; }
.scan-tools #scan-torch.on { background: #ffd966; color: #000; }

/* 打包核对：「剩下 N 件一次记」（同货大量时省时间，2026-09-23） */
.pc-bulkwrap { margin-top: 8px; }
.pc-bulk { font-size: 15px; padding: 8px 12px; }

/* 打包核对：强制指定「拿的是哪一批」（2026-09-23 老板要留痕） */
.pc-pickstate { font-size: 12.5px; margin: 3px 0 0; }
.pc-pickstate.need { color: #b34700; font-weight: 700; }
.pc-pickstate.ok { color: #0a7d3f; }
.pc-pick { display: flex; align-items: center; justify-content: space-between; gap: 10px; width: 100%;
  margin-top: 6px; padding: 10px 12px; text-align: left; cursor: pointer;
  background: var(--card-bg, #fff); color: inherit; border: 2px solid #d0d5dd; border-radius: 8px; font-size: 14px; }
.pc-pick:hover, .pc-pick:focus-visible { border-color: #0a7d3f; }
.pc-pick[disabled] { opacity: .5; }
.pc-pb-r { flex: 0 0 auto; font-weight: 700; color: #0a7d3f; white-space: nowrap; }
.pc-oldest { color: #0a7d3f; font-weight: 700; white-space: nowrap; }
@media (prefers-color-scheme: dark) {
  .pc-pickstate.need { color: #ffab66; }
  .pc-pickstate.ok { color: #6cc79a; }
  .pc-pick { border-color: #3a372f; }
  .pc-pb-r, .pc-oldest { color: #6cc79a; }
}

/* 设定：批号规则三选一（2026-09-23） */
.bs-opt { display: flex; gap: 10px; align-items: flex-start; padding: 10px 12px; margin-bottom: 8px;
  border: 1px solid var(--border); border-radius: 8px; cursor: pointer; }
.bs-opt:has(input:checked) { border-color: #0a7d3f; background: var(--ok-bg, #f0f8f2); }
.bs-opt input { margin-top: 4px; }

/* 退货：货还没归位的追办卡（2026-09-23 老板选 C） */
.rc-card.rc-stocktodo { border-color: #b07d18; }
.rc-card.rc-stocktodo .rc-n { color: #8a5f10; }
.rc-card.rc-stocktodo2 { border-color: #8a5cb8; }
.rc-card.rc-stocktodo2 .rc-n { color: #6b429a; }
@media (prefers-color-scheme: dark) {
  .rc-card.rc-stocktodo .rc-n { color: #e0b45f; }
  .rc-card.rc-stocktodo2 .rc-n { color: #b98be0; }
}

/* 调货单导入（2026-09-23） */
.tfi-up { display: flex; flex-wrap: wrap; gap: 10px; align-items: flex-end; margin-bottom: 8px; }
.tfi-row { border: 1px solid var(--border); border-radius: 8px; padding: 10px 12px; margin-bottom: 8px; background: var(--card-bg); }
.tfi-main { display: flex; gap: 8px; align-items: baseline; flex-wrap: wrap; }
.tfi-sku { font-size: 12px; color: var(--muted); }
.tfi-qty { font-weight: 700; }
.tfi-doc { font-size: 12px; margin: 2px 0 6px; }
.tfi-ctl { display: flex; gap: 8px; align-items: center; flex-wrap: wrap; }
.tfi-nob { font-size: 13px; }