/* ================= 鲜活鱼类进销存系统 ================= */
* { box-sizing: border-box; margin: 0; padding: 0; }
:root {
  --primary: #0e7490;
  --primary-dark: #0c637b;
  --primary-light: #e0f2f7;
  --bg: #f1f5f9;
  --card: #ffffff;
  --text: #1e293b;
  --text-sub: #64748b;
  --border: #e2e8f0;
  --success: #16a34a;
  --success-bg: #f0fdf4;
  --warn: #d97706;
  --warn-bg: #fffbeb;
  --danger: #dc2626;
  --danger-bg: #fef2f2;
  --info: #2563eb;
  --radius: 12px;
  --shadow: 0 1px 3px rgba(15, 23, 42, .08), 0 4px 14px rgba(15, 23, 42, .05);
}
html, body { height: 100%; }
body {
  font-family: -apple-system, "PingFang SC", "Microsoft YaHei", "Segoe UI", sans-serif;
  background: var(--bg); color: var(--text); font-size: 14px; line-height: 1.6;
}
.hidden { display: none !important; }

/* ---------------- 登录页 ---------------- */
.login-wrap {
  min-height: 100vh; display: flex; align-items: center; justify-content: center;
  background: linear-gradient(135deg, #0f2e35 0%, #0e7490 100%); padding: 16px;
}
.login-card {
  background: #fff; border-radius: 18px; padding: 40px 36px; width: 380px; max-width: 100%;
  box-shadow: 0 18px 50px rgba(0,0,0,.25); text-align: center;
}
.login-logo { font-size: 46px; }
.login-card h1 { font-size: 20px; margin: 8px 0 4px; }
.login-sub { color: var(--text-sub); font-size: 13px; margin-bottom: 24px; }
.login-card .field { text-align: left; margin-bottom: 14px; }
.login-card label { display: block; font-size: 13px; color: var(--text-sub); margin-bottom: 4px; }
.login-card input {
  width: 100%; padding: 10px 12px; border: 1px solid var(--border); border-radius: 8px; font-size: 15px;
}
.login-card input:focus { outline: 2px solid var(--primary-light); border-color: var(--primary); }
.login-msg { color: var(--danger); font-size: 13px; min-height: 20px; margin-bottom: 6px; }
.login-hint { margin-top: 18px; font-size: 12px; color: var(--text-sub); }

/* ---------------- 布局 ---------------- */
/* 大图自适应：避免移动端撑破布局产生横向滚动 */
img { max-width: 100%; height: auto; }
.app { display: flex; min-height: 100vh; }
.sidebar {
  width: 210px; flex-shrink: 0; background: linear-gradient(180deg, #0f2e35, #0b3f47);
  color: #e2e8f0; display: flex; flex-direction: column; padding: 18px 12px;
  position: sticky; top: 0; height: 100vh; overflow-y: auto;
}
.brand { font-size: 17px; font-weight: 700; padding: 4px 10px 14px; letter-spacing: 1px; }
.user-chip {
  background: rgba(255,255,255,.08); border-radius: 10px; padding: 8px 10px;
  display: flex; align-items: center; justify-content: space-between; margin-bottom: 14px; font-size: 14px;
}
.role-badge {
  font-size: 11px; background: #0e7490; color: #fff; border-radius: 20px; padding: 1px 8px;
}
#side-nav { flex: 1; display: flex; flex-direction: column; gap: 2px; }
.nav-item {
  display: flex; align-items: center; gap: 10px; padding: 9px 12px; border-radius: 8px;
  color: #cbd5e1; cursor: pointer; font-size: 14px; border: none; background: none; text-align: left; width: 100%;
}
.nav-item:hover { background: rgba(255,255,255,.08); color: #fff; }
.nav-item.active { background: var(--primary); color: #fff; font-weight: 600; }
#logout-btn { margin-top: 12px; color: #94a3b8; }
#logout-btn:hover { color: #fff; background: rgba(220,38,38,.35); }

/* ---------------- 二级分类导航（一级业务域 + 二级功能） ---------------- */
.nav-group { margin-bottom: 3px; }
.nav-group-hd {
  display: flex; align-items: center; gap: 8px; width: 100%; border: none; background: none;
  color: #94a3b8; cursor: pointer; padding: 8px 10px; border-radius: 8px; font-size: 13px; text-align: left;
}
.nav-group-hd:hover { background: rgba(255,255,255,.06); color: #e2e8f0; }
.nav-gi { font-size: 14px; }
.nav-gl { flex: 1; font-weight: 600; }
.nav-gn { font-size: 11px; background: rgba(255,255,255,.12); border-radius: 10px; padding: 0 6px; }
.nav-gc { font-size: 10px; opacity: .85; }
.nav-group.open .nav-group-hd { color: #e2e8f0; }
.nav-sub {
  display: none; flex-direction: column; gap: 2px;
  padding: 2px 0 4px 10px; margin: 0 0 0 14px; border-left: 1px solid rgba(255,255,255,.14);
}
.nav-group.open .nav-sub { display: flex; }
.nav-item { font-size: 13.5px; padding: 7px 10px; }
.nav-empty { color: #94a3b8; font-size: 12.5px; padding: 10px; }
.nav-tip {
  margin: 10px 4px 0; padding: 8px 10px; border-radius: 8px; font-size: 11.5px; line-height: 1.65;
  color: #a5b4c8; background: rgba(255,255,255,.06);
}
.nav-tip b { color: #e2e8f0; }

/* ---------------- 手机端顶条（收起蓝色导航用，桌面侧栏不显示） ---------------- */
.mnav-btn {
  display: none; align-items: center; gap: 7px; margin-left: auto; cursor: pointer;
  padding: 7px 13px; border-radius: 20px; border: 1px solid rgba(255,255,255,.16);
  background: rgba(255,255,255,.10); color: #eaf2f7; font-size: 12.5px; font-weight: 600;
  font-family: inherit; white-space: nowrap; transition: background .18s, transform .12s;
}
.mnav-btn:hover { background: rgba(255,255,255,.16); }
.mnav-btn:active { transform: scale(.96); }
.mnav-btn .mnav-cur { max-width: 150px; overflow: hidden; text-overflow: ellipsis; }
.mnav-btn .mnav-ico { font-size: 14px; opacity: .9; }
/* 抽屉与遮罩：只在窄屏启用（脚本把导航整块搬进抽屉） */
.mnav-panel, .mnav-mask { display: none; }

/* ---------------- 销售排行榜占比条 ---------------- */
.rank-bar {
  display: inline-block; width: 118px; height: 8px; border-radius: 6px;
  background: var(--border); overflow: hidden; vertical-align: middle;
}
.rank-bar i { display: block; height: 100%; background: linear-gradient(90deg, var(--primary), var(--primary-dark)); }
.rank-pct { font-size: 12px; color: var(--text-sub); margin-left: 6px; }

/* ---------------- 审核中心：日期快捷选择 ---------------- */
.ac-quick {
  display: flex; align-items: center; gap: 8px; flex-wrap: wrap;
  margin: 6px 0 10px; padding: 8px 10px;
  border: 1px dashed var(--border); border-radius: 8px; background: #f8fafc;
}
.ac-quick-t { font-size: 12.5px; color: var(--text-sub); font-weight: 600; }
.ac-quick input[type="date"] { width: 152px; }
.ac-quick .pill { padding: 3px 10px; font-size: 12.5px; }
.ac-quick-now { margin-left: auto; font-size: 12px; color: var(--text-sub); }

/* ---------------- 品项库存就地提示（选品类不再弹窗） ---------------- */
.stock-inline {
  margin: 2px 0 8px; font-size: 12.5px; color: var(--success); line-height: 1.5;
}
.stock-inline.empty { color: var(--text-sub); }

/* ---------------- 知识网关联条 ---------------- */
.relbar {
  display: flex; align-items: center; gap: 8px; flex-wrap: wrap;
  padding: 8px 22px; background: var(--bg); border-bottom: 1px solid var(--border); font-size: 12.5px;
}
.rel-t { color: var(--text-sub); }
.rel-chip {
  border: 1px solid var(--border); background: var(--card); color: var(--text);
  border-radius: 20px; padding: 3px 10px; font-size: 12.5px; cursor: pointer;
}
.rel-chip:hover { border-color: var(--primary); color: var(--primary); }
/* 相关功能按二级分类排序时的分类名（跨分类才显示） */
.rel-cat {
  font-size: 11.5px; color: var(--text-sub); padding: 2px 6px; border-radius: 4px;
  background: var(--bg); border: 1px dashed var(--border); white-space: nowrap;
}
.rel-cur {
  cursor: default; font-weight: 600;
  background: var(--primary-light); border-color: var(--primary-light); color: var(--primary-dark);
}
.rel-cur:hover { border-color: var(--primary-light); color: var(--primary-dark); }

.main { flex: 1; min-width: 0; display: flex; flex-direction: column; }
.topbar {
  background: var(--card); border-bottom: 1px solid var(--border);
  padding: 14px 22px; display: flex; align-items: center; justify-content: space-between;
  position: sticky; top: 0; z-index: 10;
}
.topbar h2 { font-size: 18px; }
/* 原为 max-width:1200px —— 1920 屏下侧栏占 210px，内容区还剩 1710px，却被这道上限
   砍掉 500 多像素，右侧留出一大片空白；订单列表（17 列）被迫在 1116px 里横向滚动，
   看不到「审核 / 状态 / 操作」。去掉上限，让内容区吃满可用宽度，表格一屏平铺。 */
#view { padding: 20px 22px 40px; width: 100%; }

/* ---------------- 通用组件 ---------------- */
.card { background: var(--card); border-radius: var(--radius); box-shadow: var(--shadow); padding: 18px 20px; margin-bottom: 16px; }
.card h3 { font-size: 15px; margin-bottom: 12px; display: flex; align-items: center; gap: 8px; }
.card h3 .sub { font-size: 12px; color: var(--text-sub); font-weight: 400; }

.btn {
  border: none; border-radius: 8px; padding: 8px 16px; font-size: 14px; cursor: pointer;
  background: var(--primary); color: #fff; transition: background .15s; font-family: inherit;
}
.btn:hover { background: var(--primary-dark); }
.btn:disabled { opacity: .5; cursor: not-allowed; }
.btn-block { width: 100%; }
.btn-sm { padding: 4px 10px; font-size: 13px; border-radius: 6px; }
.btn-ghost { background: transparent; border: 1px solid var(--border); color: var(--text-sub); }
.btn-ghost:hover { background: var(--bg); color: var(--text); }
.btn-danger { background: var(--danger); }
.btn-danger:hover { background: #b91c1c; }
.btn-success { background: var(--success); }
.btn-success:hover { background: #15803d; }
.btn-warn { background: var(--warn); }

.field { margin-bottom: 12px; }
label { display: block; font-size: 13px; color: var(--text-sub); margin-bottom: 4px; }
input, select, textarea {
  width: 100%; padding: 8px 10px; border: 1px solid var(--border); border-radius: 8px;
  font-size: 14px; font-family: inherit; background: #fff; color: var(--text);
}
input:focus, select:focus, textarea:focus { outline: 2px solid var(--primary-light); border-color: var(--primary); }
input.warn-pending { border-color: var(--warn); background: var(--warn-bg); }

.grid { display: grid; gap: 12px; }
.grid-2 { grid-template-columns: repeat(2, 1fr); }
.grid-3 { grid-template-columns: repeat(3, 1fr); }
.grid-4 { grid-template-columns: repeat(4, 1fr); }
.form-row { display: flex; gap: 12px; flex-wrap: wrap; }
.form-row .field { flex: 1; min-width: 140px; }
.form-row .field.fx { flex: 0 0 auto; }

/* 高级查询筛选条（柠檬云风格：一行装日内多条件 + 右侧操作） */
.adv-bar {
  display: flex; gap: 10px; flex-wrap: wrap; align-items: flex-end;
  background: var(--bg); border: 1px solid var(--border); border-radius: 10px;
  padding: 12px 14px; margin-bottom: 14px;
}
.adv-bar .field { margin-bottom: 0; min-width: 130px; }
.adv-bar .field.wide { min-width: 190px; }
.adv-bar .spacer { flex: 1; }
.adv-actions { display: flex; gap: 8px; align-items: flex-end; }

/* 多选下拉（店名勾选框：一次勾选多家门店合并汇总对账） */
.ms-field { position: relative; }
.ms-box { position: relative; }
.ms-btn {
  width: 100%; padding: 8px 10px; border: 1px solid var(--border); border-radius: 8px;
  background: #fff; color: var(--text); font-size: 14px; font-family: inherit;
  text-align: left; cursor: pointer; display: flex; align-items: center; justify-content: space-between;
}
.ms-btn::after { content: '\25BE'; color: var(--text-sub); font-size: 12px; margin-left: 6px; }
.ms-btn.on { border-color: var(--primary); color: var(--primary-dark); background: var(--primary-light); font-weight: 600; }
.ms-panel {
  position: absolute; z-index: 150; top: calc(100% + 4px); left: 0; width: 260px; min-width: 220px;
  background: var(--card); border: 1px solid var(--border); border-radius: 10px;
  box-shadow: 0 8px 24px rgba(15, 23, 42, .12); padding: 10px;
}
.ms-search-wrap { margin-bottom: 8px; }
.ms-search { padding: 6px 8px; font-size: 13px; }
.ms-act { display: flex; align-items: center; justify-content: space-between; margin-bottom: 6px; font-size: 12.5px; }
.ms-act .ms-all { display: flex; align-items: center; gap: 6px; margin: 0; cursor: pointer; color: var(--primary-dark); }
.ms-act .ms-all input { width: auto; margin: 0; }
.ms-link { color: var(--text-sub); cursor: pointer; text-decoration: underline; }
.ms-link:hover { color: var(--primary); }
.ms-list {
  max-height: 240px; overflow-y: auto; padding: 6px 0;
  border-top: 1px solid var(--border); border-bottom: 1px solid var(--border);
}
.ms-item { display: flex; align-items: center; gap: 8px; padding: 5px 8px; margin: 0; cursor: pointer; font-size: 13.5px; border-radius: 6px; }
.ms-item:hover { background: var(--bg); }
.ms-item input { width: auto; margin: 0; }
.ms-empty { padding: 10px; text-align: center; color: var(--text-sub); font-size: 13px; }
.ms-foot { display: flex; align-items: center; justify-content: space-between; margin-top: 8px; }
.ms-count { font-size: 12px; color: var(--text-sub); }
/* 版本号：让用户一眼确认自己打开的是不是最新构建（避免旧站/缓存造成"改了没生效"） */
.login-ver { margin-top: 14px; text-align: center; font-size: 12px; color: var(--text-sub); }
.side-ver { font-size: 11px; color: var(--text-sub); padding: 2px 0 10px; letter-spacing: .3px; }

.ms-tip {
  margin: 8px 0 0; padding: 6px 10px; font-size: 12.5px; color: var(--primary-dark);
  background: var(--primary-light); border: 1px dashed var(--primary); border-radius: 8px;
}
.filter-bar .ms-field { flex: 1; min-width: 240px; }
@media (max-width: 640px) {
  .ms-panel { width: 100%; min-width: 0; }
}

table.tbl { width: 100%; border-collapse: collapse; font-size: 13.5px; }
.tbl th {
  text-align: left; padding: 8px 10px; color: var(--text-sub); font-weight: 600;
  border-bottom: 2px solid var(--border); white-space: nowrap;
}
.tbl td { padding: 8px 10px; border-bottom: 1px solid var(--border); vertical-align: middle; }
.tbl tr:hover td { background: #f8fafc; }
.tbl-wrap { overflow-x: auto; }
.tbl-inp { width: 100%; min-width: 110px; padding: 4px 6px; border: 1px solid var(--border); border-radius: 6px; font-size: 12.5px; background: #fff; color: var(--text); }
.tbl-inp:focus { outline: none; border-color: var(--primary); box-shadow: 0 0 0 2px var(--primary-light); }
/* 订单号：双击打开本张销售订单明细 */
td.ord-no { cursor: pointer; color: var(--primary); font-weight: 600; }
td.ord-no:hover { text-decoration: underline; }
/* 汇总行（合计/小计，贴在表尾，不被 hover 高亮覆盖） */
.tbl tr.sum-row td {
  background: var(--primary-light); font-weight: 700; color: var(--text);
  border-top: 2px solid var(--primary); border-bottom: none;
}
.tbl tr.sum-row:hover td { background: var(--primary-light); }
.tbl tr.sub-row td { background: #f8fafc; font-weight: 600; }

.badge { display: inline-block; padding: 1px 9px; border-radius: 20px; font-size: 12px; white-space: nowrap; }
.badge-green { background: var(--success-bg); color: var(--success); }
.badge-red { background: var(--danger-bg); color: var(--danger); }
.badge-orange { background: var(--warn-bg); color: var(--warn); }
.badge-blue { background: #eff6ff; color: var(--info); }
.badge-cyan { background: #ecfeff; color: #0e7490; border: 1px solid #a5f3fc; }
.badge-gray { background: #f1f5f9; color: var(--text-sub); }

.stat-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(150px, 1fr)); gap: 14px; margin-bottom: 16px; }
.stat {
  background: var(--card); border-radius: var(--radius); box-shadow: var(--shadow);
  padding: 16px 18px;
}
.stat .k { font-size: 13px; color: var(--text-sub); }
.stat .v { font-size: 24px; font-weight: 700; margin-top: 2px; }
.stat .v small { font-size: 13px; font-weight: 400; color: var(--text-sub); }
.stat.warn .v { color: var(--warn); }
.stat.danger .v { color: var(--danger); }

/* OCR 收货单 */
.upload-area {
  border: 2px dashed var(--border); border-radius: var(--radius); padding: 34px 20px;
  text-align: center; color: var(--text-sub); cursor: pointer; background: #fafcfd;
  transition: border-color .15s;
}
.upload-area:hover, .upload-area.drag { border-color: var(--primary); background: var(--primary-light); }
.upload-area .big { font-size: 34px; }
.sheet-card { border: 1px solid var(--border); border-radius: var(--radius); padding: 14px 16px; margin-bottom: 16px; background: #fff; }
.sheet-head { display: flex; gap: 14px; align-items: flex-start; flex-wrap: wrap; }
.sheet-thumb { width: 110px; height: 82px; object-fit: cover; border-radius: 8px; border: 1px solid var(--border); }
.sheet-meta { flex: 1; min-width: 260px; display: grid; grid-template-columns: repeat(auto-fit, minmax(150px, 1fr)); gap: 10px; }
.sheet-status { min-width: 130px; text-align: right; }
.pending-tag { color: var(--warn); font-weight: 600; font-size: 12px; }

/* 司机端 */
.task-card { display: flex; flex-wrap: wrap; gap: 12px; align-items: center; }
.task-info { flex: 1; min-width: 220px; }
.task-info .customer { font-size: 16px; font-weight: 700; }
.task-info .meta { color: var(--text-sub); font-size: 13px; margin-top: 2px; }
.cmd-box { display: flex; gap: 10px; }
.cmd-box input { flex: 1; }

/* 提示与弹窗 */
#toast-wrap { position: fixed; top: 18px; right: 18px; z-index: 300; display: flex; flex-direction: column; gap: 10px; }
.toast {
  background: #1e293b; color: #fff; border-radius: 10px; padding: 11px 18px; font-size: 14px;
  box-shadow: var(--shadow); max-width: 360px; animation: slideIn .25s ease;
}
.toast.success { background: var(--success); }
.toast.error { background: var(--danger); }
.toast.warn { background: var(--warn); }
@keyframes slideIn { from { transform: translateX(40px); opacity: 0; } to { transform: none; opacity: 1; } }

.modal-mask {
  position: fixed; inset: 0; background: rgba(15,23,42,.45); z-index: 200;
  display: flex; align-items: center; justify-content: center; padding: 16px;
}
.modal {
  background: #fff; border-radius: 14px; padding: 24px; width: 440px; max-width: 100%;
  max-height: 86vh; overflow-y: auto; box-shadow: 0 20px 60px rgba(0,0,0,.3);
}
.modal h3 { margin-bottom: 14px; font-size: 16px; }
.modal .modal-btns { display: flex; gap: 10px; justify-content: flex-end; margin-top: 18px; }
.modal p.desc { color: var(--text-sub); font-size: 13.5px; margin-bottom: 12px; }

.loading { text-align: center; color: var(--text-sub); padding: 60px 0; font-size: 15px; }
.error-box { background: var(--danger-bg); color: var(--danger); border-radius: 10px; padding: 14px 18px; margin-bottom: 14px; }
.empty-tip { text-align: center; color: var(--text-sub); padding: 30px 0; }
.mt { margin-top: 14px; }
.mb { margin-bottom: 14px; }
.link-btn { background: none; border: none; color: var(--primary); cursor: pointer; font-size: 13px; padding: 2px 4px; }
.link-btn:hover { text-decoration: underline; }

/* 预警 */
.alert-item { display: flex; gap: 10px; align-items: flex-start; padding: 10px 4px; border-bottom: 1px solid var(--border); }
.alert-item:last-child { border-bottom: none; }
.alert-item .content { flex: 1; font-size: 13.5px; }
.alert-item .time { color: var(--text-sub); font-size: 12px; white-space: nowrap; }
.alert-dot { width: 8px; height: 8px; border-radius: 50%; margin-top: 8px; flex-shrink: 0; }
.alert-dot.warn { background: var(--warn); }
.alert-dot.danger { background: var(--danger); }
.alert-dot.info { background: var(--info); }

/* ============ 增量 C：智能看板 KPI + 一线分级弹窗 ============ */
/* KPI 卡片区 */
.kpi-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(150px, 1fr)); gap: 10px; }
.kpi { border: 1px solid var(--border); border-radius: 10px; padding: 10px 12px; background: var(--bg); }
.kpi .kpi-k { font-size: 12px; color: var(--text-sub); }
.kpi .kpi-v { font-size: 20px; font-weight: 700; margin: 3px 0; }
.kpi .kpi-v small { font-size: 12px; font-weight: 400; color: var(--text-sub); }
.kpi .kpi-s { font-size: 11.5px; color: var(--text-sub); }
.kpi-danger-tip {
  margin-top: 10px; padding: 8px 12px; border-radius: 8px; font-size: 13px;
  background: var(--danger-bg); color: var(--danger); border: 1px solid var(--danger);
}
/* warn 级顶部横幅（非阻塞、可关） */
.tier-banner {
  display: flex; align-items: center; gap: 10px; padding: 9px 14px;
  background: var(--warn-bg); color: #9a6b00; border-bottom: 1px solid var(--warn);
  font-size: 13px; z-index: 40; position: relative;
}
.tier-banner .tb-icon { font-size: 16px; flex-shrink: 0; }
.tier-banner .tb-body { flex: 1; line-height: 1.5; }
.tier-banner .tb-more { color: var(--text-sub); }
.tier-banner .tb-go {
  border: 1px solid var(--warn); background: #fff; color: #9a6b00;
  border-radius: 6px; padding: 3px 10px; font-size: 12.5px; cursor: pointer; flex-shrink: 0;
}
.tier-banner .tb-go:hover { background: #fff7e6; }
.tier-banner .tb-x {
  border: none; background: transparent; color: #9a6b00; font-size: 18px;
  line-height: 1; cursor: pointer; padding: 0 4px; flex-shrink: 0;
}
/* danger 级强制弹窗 */
.tier-critical-modal { max-width: 460px; }
.tier-critical-modal h3 { color: var(--danger); margin-bottom: 10px; }
.tc-list { max-height: 320px; overflow: auto; margin-bottom: 12px; }
.tc-item { display: flex; gap: 8px; align-items: flex-start; padding: 8px 2px; border-bottom: 1px solid var(--border); }
.tc-item:last-child { border-bottom: none; }
.tc-item .content { flex: 1; font-size: 13.5px; }
.tc-item .time { color: var(--text-sub); font-size: 11.5px; margin-top: 2px; }
/* 侧栏预警角标 */
.side-alert-badge {
  display: flex; align-items: center; gap: 5px; margin: 4px 12px 6px;
  padding: 5px 10px; border-radius: 8px; background: var(--warn-bg); color: #9a6b00; font-size: 12.5px;
}
.side-alert-badge .sab-num { font-weight: 700; }

/* ============ 增量 D-1：审计监督页 ============ */
/* 顶部分级计数卡左侧色条复用 .kpi，此处仅补充「异常明细」表的等级徽标间距与行高亮 */
.gov-lv-danger { background: rgba(220, 38, 38, .05); }
.gov-lv-warn { background: rgba(245, 158, 11, .05); }

/* ============ 增量 D-2：关键节点指引 ============ */
/* 节点内联提示条（info 级）：贴在操作区旁，不打扰、可关闭 */
.guide-inline {
  display: flex; gap: 8px; align-items: flex-start;
  padding: 9px 12px; margin-bottom: 12px; border-radius: 8px;
  background: #eef4ff; border-left: 3px solid var(--info, #2563eb);
  font-size: 13px; line-height: 1.55;
}
.guide-inline[data-lv="warn"] { background: var(--warn-bg, #fffbeb); border-left-color: var(--warn, #d97706); }
.guide-inline[data-lv="danger"] { background: var(--danger-bg, #fef2f2); border-left-color: var(--danger, #dc2626); }
.guide-inline .gi-icon { flex: 0 0 auto; font-size: 15px; line-height: 1.4; }
.guide-inline .gi-body { flex: 1; }
.guide-inline .gi-line + .gi-line { margin-top: 3px; }
.guide-inline .gi-x {
  flex: 0 0 auto; border: none; background: transparent; cursor: pointer;
  font-size: 16px; color: var(--text-sub); line-height: 1; padding: 0 2px;
}
/* 看板「关键节点指引」卡 */
.guide-card .guide-row {
  display: flex; gap: 10px; align-items: flex-start;
  padding: 10px 12px; border-radius: 8px; margin-bottom: 8px;
  background: var(--bg, #f1f5f9); border-left: 3px solid var(--border);
}
.guide-card .guide-row:last-child { margin-bottom: 0; }
.guide-card .guide-lv-warn { border-left-color: var(--warn, #d97706); background: var(--warn-bg, #fffbeb); }
.guide-card .guide-lv-danger { border-left-color: var(--danger, #dc2626); background: var(--danger-bg, #fef2f2); }
.guide-card .guide-lv-info { border-left-color: var(--info, #2563eb); background: #eef4ff; }
.guide-card .gr-icon { flex: 0 0 auto; font-size: 16px; line-height: 1.4; }
.guide-card .gr-body { flex: 1; }
.guide-card .gr-title { font-weight: 600; margin-bottom: 2px; }
.guide-card .gr-line { font-size: 12.5px; color: var(--text-sub); line-height: 1.55; }
.guide-card .gr-go { flex: 0 0 auto; align-self: center; white-space: nowrap; }
/* 节点弹窗（danger 级复用 tier-critical 样式，仅补间距） */
.guide-modal .tc-item .content { line-height: 1.55; }

/* ============ 增量 D-3：暂养池负荷动态 ============ */
.pool-load-card .pool-bar {
  display: inline-block; vertical-align: middle; width: 96px; height: 8px;
  background: var(--border); border-radius: 5px; overflow: hidden; margin-right: 6px;
}
.pool-load-card .pool-bar i { display: block; height: 100%; border-radius: 5px; background: var(--success); }
.pool-load-card .pool-bar-ok i { background: var(--success); }
.pool-load-card .pool-bar-warn i { background: var(--warn); }
.pool-load-card .pool-bar-danger i { background: var(--danger); }
.pool-load-card .pool-rate { font-size: 12px; color: var(--text-sub); vertical-align: middle; }
.pool-load-card .pool-row-danger { background: rgba(220, 38, 38, .05); }
.pool-load-card .pool-row-warn { background: rgba(217, 119, 6, .05); }

/* 响应式 */
@media (max-width: 860px) {
  .app { flex-direction: column; }
  /* 手机端：导航栏移到页面顶部并吸顶（横向滚动），内容区在下方滚动 */
  .app-body { flex-direction: column; }
  .sidebar {
    width: 100%; height: auto; flex-direction: row; align-items: center; gap: 6px;
    padding: 8px 10px; flex-wrap: wrap;
    position: sticky; top: 0; z-index: 60; box-shadow: 0 2px 8px rgba(15, 23, 42, .18);
    max-height: 46vh; overflow-y: auto;
  }
  .brand {
    padding: 0; font-size: 13px; flex: 1 1 auto; min-width: 0;
    overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
  }
  .user-chip { display: none; }
  /* 手机端：蓝色导航做成两行横向胶囊 —— 上行分类、下行该分类的功能，各滚各的，内容区尽量占满屏 */
  .sidebar {
    max-height: none; padding: 8px 10px 7px; gap: 6px;
    background: linear-gradient(180deg, #0f2e35, #0b3f47);
    box-shadow: 0 4px 14px rgba(15, 23, 42, .22); border-bottom: 1px solid rgba(255,255,255,.08);
  }
  /* 上行：分类胶囊（横向滑动，滚动条隐藏） */
  #side-nav {
    flex-direction: row; flex-wrap: nowrap; overflow-x: auto; width: 100%; order: 3;
    gap: 6px; padding: 2px 0; scrollbar-width: none; -webkit-overflow-scrolling: touch;
  }
  #side-nav::-webkit-scrollbar, .side-nav-sub::-webkit-scrollbar { display: none; }
  .nav-group { flex: 0 0 auto; display: flex; align-items: center; margin-bottom: 0; }
  .nav-group-hd {
    width: auto; padding: 7px 12px; border-radius: 20px; white-space: nowrap; gap: 6px;
    background: rgba(255,255,255,.09); color: #dbe6ef; font-size: 12.5px; font-weight: 600;
    border: 1px solid rgba(255,255,255,.10); transition: background .18s, color .18s, transform .12s;
  }
  .nav-group-hd:active { transform: scale(.96); }
  .nav-group.m-open .nav-group-hd {
    background: linear-gradient(135deg, var(--primary), var(--primary-dark)); color: #fff;
    border-color: transparent; box-shadow: 0 2px 8px rgba(14,116,144,.35);
  }
  .nav-gc { display: none; }
  .nav-gn { font-size: 10.5px; background: rgba(255,255,255,.18); border-radius: 10px; padding: 0 5px; }
  .nav-group.m-open .nav-gn { background: rgba(255,255,255,.30); }
  /* 下行：当前分类下的功能胶囊（整行由脚本搬到 .side-nav-sub，两行互不挤压） */
  #side-nav .nav-group .nav-sub { display: none; }
  .side-nav-sub {
    order: 4; width: 100%; display: flex; overflow-x: auto; gap: 6px; padding: 3px 0 1px;
    scrollbar-width: none; -webkit-overflow-scrolling: touch;
  }
  .side-nav-sub.hidden { display: none; }
  .side-nav-sub .nav-sub {
    display: flex; flex-direction: row; flex-wrap: nowrap; gap: 6px;
    padding: 0; margin: 0; border-left: none;
  }
  .nav-item {
    width: auto; white-space: nowrap; padding: 6px 12px; border-radius: 18px; gap: 6px; font-size: 12.5px;
    background: rgba(255,255,255,.07); color: #dbe6ef; border: 1px solid rgba(255,255,255,.08);
  }
  .nav-item.active {
    background: linear-gradient(135deg, var(--primary), var(--primary-dark)); color: #fff;
    border-color: transparent; box-shadow: 0 2px 8px rgba(14,116,144,.30);
  }
  .nav-tip { display: none; }
  .port-switch { margin: 0; padding: 6px 8px; }
  .port-switch-title { display: none; }
  .port-switch-btns button { padding: 4px 6px; font-size: 12px; }
  .relbar { padding: 8px 12px; }
  #logout-btn { margin-top: 0; margin-left: auto; padding: 4px 12px; border-radius: 16px; font-size: 12px; }
  /* 顶条：蓝色导航只剩一行（品牌 + 「☰ 当前功能」），看单据 / 报表几乎不占屏 */
  #mnav-btn { display: inline-flex; order: 1; flex: 0 0 auto; }
  /* 抽屉：分类行 / 功能行 / 端口切换 / 退出都搬到浮层里，浮在内容上方，不把内容挤下去 */
  .mnav-mask {
    display: none; position: fixed; left: 0; right: 0; top: 0; bottom: 0;
    background: rgba(15, 23, 42, .45); z-index: 55;
  }
  .mnav-mask:not(.hidden) { display: block; }
  .mnav-panel {
    display: none; position: absolute; left: 0; right: 0; top: 100%;
    padding: 9px 10px 11px; z-index: 60;
    background: linear-gradient(180deg, #0f2e35, #0b3f47);
    box-shadow: 0 12px 26px rgba(15, 23, 42, .32);
    border-bottom: 1px solid rgba(255,255,255,.08);
    max-height: 68vh; overflow-y: auto; -webkit-overflow-scrolling: touch;
  }
  .sidebar.nav-open .mnav-panel { display: flex; flex-direction: column; }
  /* 侧栏本身不裁剪、不换行：保证永远只有一行高，抽屉才能溢出到内容区上方 */
  .sidebar { overflow: visible; flex-wrap: nowrap; }
  /* 抽屉里的元素重排：分类 → 功能 → 端口切换 → 退出，各自占满一行 */
  .mnav-panel #side-nav { order: 1; }
  .mnav-panel #side-nav-sub { order: 2; }
  .mnav-panel .port-switch { order: 3; margin: 8px 0 0; }
  .mnav-panel #logout-btn { order: 4; margin-left: 0; width: 100%; justify-content: center; }
  .mnav-panel .port-switch:not(.hidden) { display: block; }
  .mnav-panel #side-nav-sub:not(.hidden) { display: flex; }
  .mnav-panel #logout-btn { display: inline-flex; }
  #view { padding: 14px 12px 40px; }
  .grid-2, .grid-3, .grid-4 { grid-template-columns: 1fr; }
  .sheet-status { text-align: left; }
  /* 只有导航栏吸顶，页面标题栏跟随滚动，避免两层 sticky 互相遮挡 */
  .topbar { position: static; }
  .main { min-width: 0; overflow-x: hidden; }
  .stat-grid { grid-template-columns: repeat(2, 1fr); }
}

/* ============ 登录端口选择 ============ */
.port-tabs { display: flex; gap: 8px; margin-bottom: 18px; }
.port-tab {
  flex: 1; padding: 9px 4px; border: 1px solid var(--border); border-radius: 8px;
  background: #fff; cursor: pointer; font-size: 13px; color: var(--text-sub); font-family: inherit;
  transition: all .15s;
}
.port-tab:hover { border-color: var(--primary); }
.port-tab.active { border-color: var(--primary); background: var(--primary-light); color: var(--primary); font-weight: 600; }

/* ============ 侧边栏端口视角切换（仅老板） ============ */
.port-switch { margin: 10px 12px 0; padding: 10px; background: var(--bg); border-radius: 10px; }
.port-switch-title { font-size: 11.5px; color: var(--text-sub); margin-bottom: 7px; }
.port-switch-btns { display: grid; grid-template-columns: 1fr 1fr 1fr; gap: 6px; }
.port-switch-btns button {
  padding: 6px 2px; font-size: 12px; border: 1px solid var(--border); background: #fff;
  border-radius: 7px; cursor: pointer; color: var(--text-sub); font-family: inherit; transition: all .15s;
}
.port-switch-btns button:hover { border-color: var(--primary); color: var(--primary); }
.port-switch-btns button.active { background: var(--primary); color: #fff; border-color: var(--primary); font-weight: 600; }

/* ============ 账目明细看板 ============ */
.pill-tabs { display: flex; gap: 8px; margin-bottom: 16px; flex-wrap: wrap; }
.pill-tabs .pill {
  padding: 7px 20px; border-radius: 999px; border: 1px solid var(--border); background: #fff;
  cursor: pointer; font-size: 13.5px; color: var(--text-sub); font-family: inherit; transition: all .15s;
}
.pill-tabs .pill:hover { border-color: var(--primary); color: var(--primary); }
.pill-tabs .pill.active { background: var(--primary); color: #fff; border-color: var(--primary); font-weight: 600; }
.chart-legend { display: flex; gap: 18px; font-size: 12.5px; color: var(--text-sub); margin: 4px 2px 8px; align-items: center; }
.legend-dot { display: inline-block; width: 10px; height: 10px; border-radius: 3px; margin-right: 5px; vertical-align: -1px; }
.chart-scroll { overflow-x: auto; }
.chart-scroll svg { display: block; }

/* ============ 导航高亮（账目看板醒目标识） ============ */
.nav-item .nav-label { flex: 1; }
.nav-item.hot {
  background: linear-gradient(90deg, #7c2d12, #b45309);
  color: #fff; font-weight: 700; box-shadow: 0 0 0 1px rgba(249, 115, 22, .6);
}
.nav-item.hot:hover { background: linear-gradient(90deg, #9a3412, #c2410c); color: #fff; }
.nav-item.hot.active { background: var(--primary); color: #fff; }
.tag-hot {
  font-style: normal; font-size: 10px; background: #f97316; color: #fff;
  border-radius: 999px; padding: 1px 7px; flex-shrink: 0; letter-spacing: 1px;
}

/* ============ 进销存速览卡片 ============ */
.psi-card .psi-quick { display: grid; grid-template-columns: repeat(auto-fit, minmax(150px, 1fr)); gap: 12px; }
.psi-quick .q { background: var(--bg); border-radius: 10px; padding: 10px 14px; }
.psi-quick .k { font-size: 12px; color: var(--text-sub); }
.psi-quick .v { font-size: 20px; font-weight: 700; color: var(--text); }
.psi-quick .v small { font-size: 12px; font-weight: 400; color: var(--text-sub); }

/* ============ 布局调整：支持顶部导航（司机端） ============ */
.app { flex-direction: column; }
.app-body { flex: 1; display: flex; min-width: 0; }

/* ---------------- 司机端顶部导航栏 ---------------- */
.topnav {
  display: flex; align-items: center; justify-content: space-between;
  height: 54px; padding: 0 22px; flex-shrink: 0;
  background: #fff; border-bottom: 1px solid var(--border); box-shadow: var(--shadow);
}
.topnav-brand { font-size: 17px; font-weight: 700; color: var(--text); letter-spacing: 1px; }
.topnav-right { display: flex; align-items: center; gap: 12px; font-size: 13.5px; color: var(--text-sub); }
.topnav .role-badge { background: #165DFF; }
.topnav .btn-ghost { color: var(--text-sub); border-color: var(--border); }

/* ---------------- 司机端整体主题（深蓝 #165DFF） ---------------- */
.app.driver-mode { --primary: #165DFF; --primary-dark: #0E42D2; --primary-light: #E8F0FF; }
.app.driver-mode .sidebar { background: linear-gradient(180deg, #10233F, #0A1B33); }
.app.driver-mode .role-badge { background: #165DFF; }
.app.driver-mode .brand, .app.driver-mode .user-chip, .app.driver-mode #logout-btn { display: none; }
.app.driver-mode .nav-item.active { background: #165DFF; }
.app.driver-mode .port-switch-btns button.active { background: #165DFF; border-color: #165DFF; }

/* ---------------- 表格斑马纹 ---------------- */
.tbl-zebra tbody tr:nth-child(even) { background: #f8fafc; }
.tbl-zebra tbody tr:hover { background: #eef4ff; }

/* ---------------- 司机端列表辅助样式 ---------------- */
.filter-bar { display: flex; gap: 14px; flex-wrap: wrap; align-items: flex-end; margin-bottom: 14px; }
.filter-bar .field { margin-bottom: 0; }
.filter-bar .fk { flex: 1; min-width: 180px; }
.filter-bar .fb { flex-shrink: 0; }
.op-bar { display: flex; gap: 10px; margin-bottom: 14px; flex-wrap: wrap; }
.hint-text { font-size: 13px; color: var(--text-sub, #6b7785); align-self: center; opacity: .92; }

/* ---------------- 批量审核（勾选 + 一键审核 / 驳回 / 反审核） ---------------- */
.ba-bar { display: flex; align-items: center; gap: 10px; flex-wrap: wrap; margin: 10px 0; padding: 8px 10px; background: #f8fafc; border: 1px dashed #cbd5e1; border-radius: 8px; }
.ba-bar .ba-tip { font-size: 12.5px; color: var(--text-sub, #6b7785); }
.ba-bar .ba-tip b { color: var(--danger, #dc2626); }
.ba-cell { width: 38px; text-align: center; }
.ba-cell input[type=checkbox] { width: 15px; height: 15px; cursor: pointer; }
/* 司机端「已送达」置灰按钮：防止重复点击重复出库 */
.link-btn.link-btn-done { color: var(--text-sub, #94a3b8); opacity: .65; cursor: not-allowed; text-decoration: none; }
.link-btn.link-btn-done:hover { color: var(--text-sub, #94a3b8); }
/* 收货入库单：录单区与台账区同页合并 */
.si-ledger { margin-top: 18px; border-top: 2px dashed #e2e8f0; padding-top: 14px; }
.dstat-grid { margin-bottom: 14px; }
.td-addr { max-width: 200px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.td-ops { white-space: nowrap; }
.pager { display: flex; align-items: center; justify-content: space-between; margin-top: 12px; flex-wrap: wrap; gap: 8px; }
.pager-info { font-size: 12.5px; color: var(--text-sub); }
.pager-btns { display: flex; gap: 8px; }

/* ---------------- 单据审核状态 ---------------- */
.badge-audited { background: var(--success-bg); color: var(--success); }
.badge-waitaudit { background: var(--warn-bg); color: var(--warn); }
.badge-rejected { background: var(--danger-bg); color: var(--danger); }
.flow-tip { font-size: 12px; color: var(--text-sub); margin-left: 6px; }
.row-locked td { background: #fbfdff; }
.mini-note { font-size: 11.5px; color: var(--text-sub); display: block; margin-top: 2px; }

/* ---------------- 平板适配（不再覆盖手机的 860px 断点） ---------------- */
@media (min-width: 861px) and (max-width: 900px) {
  .topnav { padding: 0 14px; }
  .sidebar { width: 170px; }
  .filter-bar .fk { min-width: 140px; }
}

/* ============ 收货单上传：按钮行 + 图片暂存区（勾选标记） ============ */
.upload-btn-row { display: flex; gap: 10px; flex-wrap: wrap; }

.stage-grid {
  display: grid; grid-template-columns: repeat(auto-fill, minmax(150px, 1fr));
  gap: 12px; margin-bottom: 12px;
}
.stage-item {
  position: relative; border: 2px solid var(--border); border-radius: 10px;
  overflow: hidden; cursor: pointer; background: #fff; transition: all .15s;
}
.stage-item img { display: block; width: 100%; height: 110px; object-fit: cover; }
.stage-item.checked { border-color: var(--primary); box-shadow: 0 0 0 2px rgba(22,93,255,.18); }
.stage-item:not(.checked) img { filter: grayscale(.7); opacity: .6; }
.stage-check {
  position: absolute; top: 6px; right: 6px; width: 22px; height: 22px;
  border-radius: 6px; display: flex; align-items: center; justify-content: center;
  font-size: 14px; color: #fff; background: rgba(0,0,0,.28); border: 1.5px solid rgba(255,255,255,.85);
}
.stage-item.checked .stage-check { background: var(--primary); border-color: var(--primary); }
.stage-name {
  display: block; font-size: 11.5px; color: var(--text-sub); padding: 5px 7px;
  white-space: nowrap; overflow: hidden; text-overflow: ellipsis; background: var(--bg);
}
/* 暂存图片预处理工具条（增量 E：倾斜校正 + 增强） */
.stage-prep { display: flex; gap: 4px; padding: 5px 6px; background: var(--bg); flex-wrap: wrap; }
.btn-xs {
  flex: 1 1 auto; min-width: 0; padding: 4px 2px; font-size: 11px; line-height: 1.2;
  border: 1px solid var(--border); border-radius: 6px; background: #fff; color: var(--text-sub);
  cursor: pointer; white-space: nowrap;
}
.btn-xs:hover { border-color: var(--primary); color: var(--primary); }
.btn-xs.on { background: var(--primary); border-color: var(--primary); color: #fff; }

/* ============ 档案下拉选择（供应商/品类/规格/斤两） ============ */
.sel-wrap { display: flex; gap: 6px; align-items: center; }
.sel-wrap > select { flex: 1; min-width: 0; }
.sel-wrap > input.sel-custom { flex: 1; min-width: 110px; }
table .sel-wrap > select { min-width: 112px; }
table td .sel-wrap { min-width: 120px; }
.warn-select-in { border-color: var(--warn); background: var(--warn-bg); }
.warn-tip { display: block; font-size: 11.5px; color: var(--warn); margin-top: 3px; }

/* 单价/金额为 0 的统一标红提醒（未定价 / 赠送，不产生收入与应收） */
.price-zero { color: var(--danger) !important; font-weight: 700; }
.price-zero-inp { border-color: var(--danger) !important; background: var(--warn-bg) !important; }
.price-zero-tag { display: inline-block; font-size: 11px; line-height: 1.4; font-weight: 600; color: #fff; background: var(--danger); border-radius: 4px; padding: 0 5px; margin-left: 3px; vertical-align: middle; }

/* ============ 新增：账目看板 / AI 助手 / 二维码 ============ */
/* 账目看板卡片（按财务属性归类，可点击查明细） */
.fin-grid { display:grid; grid-template-columns:repeat(auto-fill,minmax(190px,1fr)); gap:10px; margin-top:10px; }
.fin-card { border:1px solid var(--border,#e2e8f0); border-radius:10px; padding:12px 14px; cursor:pointer; transition:box-shadow .15s, transform .15s; background:#fff; }
.fin-card:hover { box-shadow:0 4px 14px rgba(15,23,42,.10); transform:translateY(-2px); }
.fin-attr { display:inline-block; font-size:11px; padding:1px 8px; border-radius:999px; background:#eef2ff; color:#4338ca; margin-bottom:6px; }
.fin-name { font-size:13px; color:var(--text-sub,#64748b); }
.fin-val { font-size:20px; font-weight:700; margin:4px 0 2px; }
.fin-val.c-red { color:#dc2626; } .fin-val.c-green { color:#16a34a; } .fin-val.c-blue { color:#2563eb; }
.fin-note { font-size:11.5px; color:var(--text-sub,#64748b); }
.fin-more { font-size:11px; color:#94a3b8; margin-top:6px; }
.c-red { color:#dc2626; } .c-green { color:#16a34a; } .c-blue { color:#2563eb; }

/* AI 机器人助手 */
.ai-fab { position:fixed; right:22px; bottom:26px; z-index:1200; border:none; border-radius:999px; padding:12px 18px;
  background:linear-gradient(135deg,#4f46e5,#7c3aed); color:#fff; font-size:15px; font-weight:600; cursor:pointer;
  box-shadow:0 6px 20px rgba(79,70,229,.35); display:flex; align-items:center; gap:6px; }
.ai-fab:hover { filter:brightness(1.08); }
.ai-fab-txt { font-size:13.5px; }
.ai-panel { position:fixed; right:22px; bottom:86px; z-index:1200; width:400px; max-width:calc(100vw - 32px); height:520px; max-height:calc(100vh - 120px);
  background:#fff; border:1px solid #e2e8f0; border-radius:14px; box-shadow:0 12px 40px rgba(15,23,42,.18);
  display:flex; flex-direction:column; overflow:hidden; }
.ai-panel.hidden { display:none; }
.ai-head { display:flex; align-items:center; gap:8px; padding:12px 14px; background:linear-gradient(135deg,#4f46e5,#7c3aed); color:#fff; font-weight:600; font-size:14px; }
.ai-head span[style] { font-weight:400; flex:1; }
.ai-close { background:rgba(255,255,255,.2); border:none; color:#fff; border-radius:8px; width:26px; height:26px; cursor:pointer; }
.ai-body { flex:1; overflow-y:auto; padding:12px; background:#f8fafc; display:flex; flex-direction:column; gap:10px; }
.ai-msg { max-width:88%; padding:9px 12px; border-radius:12px; font-size:13.5px; line-height:1.65; word-break:break-word; }
.ai-msg.ai { background:#fff; border:1px solid #e2e8f0; align-self:flex-start; border-top-left-radius:4px; }
.ai-msg.user { background:#4f46e5; color:#fff; align-self:flex-end; border-top-right-radius:4px; }
.ai-msg .tbl { font-size:12px; } .ai-msg .tbl-wrap { margin-top:8px; max-height:200px; overflow:auto; }
.ai-msg.ai-loading { color:#64748b; font-style:italic; }
/* AI 智能导航按钮（既能答题，也能一键进界面） */
.ai-nav { display:flex; flex-wrap:wrap; gap:6px; margin-top:6px; }
.ai-nav-btn {
  border:1px solid var(--primary); background:var(--primary-light); color:var(--primary-dark);
  border-radius:18px; padding:4px 10px; font-size:12.5px; cursor:pointer;
}
.ai-nav-btn:hover { background:var(--primary); color:#fff; }
.ai-nav-t { margin-top:8px; font-size:11.5px; color:var(--text-sub); }
.ai-input-row { display:flex; gap:8px; padding:10px; border-top:1px solid #e2e8f0; background:#fff; }
.ai-input-row input { flex:1; border:1px solid #e2e8f0; border-radius:8px; padding:8px 10px; font-size:13.5px; }

/* 登录页 / 设置页 二维码 */
.login-qr { display:flex; gap:14px; justify-content:center; margin-top:12px; flex-wrap:wrap; }
.login-qr.hidden { display:none; }
.qr-item { text-align:center; background:#fff; border:1px solid #e2e8f0; border-radius:10px; padding:10px 12px; min-width:150px; }
.qr-item img { width:140px; height:140px; display:block; margin:0 auto 6px; background:#f1f5f9; border-radius:6px; }
.qr-name { font-size:13px; font-weight:600; }
.qr-url { display:block; font-size:10px; color:#94a3b8; word-break:break-all; margin:4px 0; }
.qr-row { display:flex; gap:14px; flex-wrap:wrap; }

/* 选品弹窗：库存与规格选择 */
.ssm-stock{margin:6px 0 10px;padding:10px 12px;background:var(--bg-soft,#f6f8fb);border:1px solid var(--border,#e6eaf0);border-radius:10px;font-size:13px;line-height:1.7}
.ssm-spec-title{font-size:13px;color:var(--text-sub,#6b7785);margin:4px 0 8px}
.ssm-specs{display:flex;flex-wrap:wrap;gap:8px;margin:2px 0 6px}
.ssm-chip{display:inline-block;margin:3px 6px 3px 0;padding:2px 8px;border-radius:20px;background:#eaf3ff;color:#2b6cb0;font-size:12px}
.ssm-custom{display:flex;gap:8px;margin:8px 0 4px}
.ssm-input{flex:1;padding:8px 10px;border:1px solid var(--border,#e6eaf0);border-radius:8px;font-size:13px}

/* 多品种大单：品名明细行（2 级：订单头 + 逐行品种） */
.dp-items-head{margin:14px 0 8px;font-size:13px;color:var(--text-sub,#6b7785);}
.dp-items-head b{color:var(--text,#1f2933);font-size:14px;}
.dp-item{border:1px dashed var(--border,#e6eaf0);border-radius:10px;padding:14px 12px 10px;margin-bottom:10px;background:var(--bg-soft,#f9fbfd);display:flex;gap:12px;flex-wrap:wrap;align-items:flex-start;position:relative}
.dp-item-idx{position:absolute;top:-9px;left:10px;background:var(--card,#fff);color:var(--info,#2b6cb0);font-size:12px;font-weight:700;padding:0 6px;border-radius:8px}
.dp-item .field{flex:1;min-width:140px;margin-bottom:0}
.dp-item-stock{width:100%;font-size:12.5px;margin-top:2px;padding:5px 8px;border-radius:7px;background:#f1f5f9;color:var(--text-sub,#6b7785)}
.dp-item-stock.ok{color:#1a7f37;background:#eafaf0}
.dp-item-stock.warn{color:#b42318;background:#fdecea}

/* 司机端：配送品种明细行（de-item，与进销存管理端 dp-item 同款） */
.de-item{border:1px dashed var(--border,#e6eaf0);border-radius:10px;padding:14px 12px 10px;margin-bottom:10px;background:var(--bg-soft,#f9fbfd);display:flex;gap:12px;flex-wrap:wrap;align-items:flex-start;position:relative}
.de-item-idx{position:absolute;top:-9px;left:10px;background:var(--card,#fff);color:var(--info,#2b6cb0);font-size:12px;font-weight:700;padding:0 6px;border-radius:8px}
.de-item .field{flex:1;min-width:140px;margin-bottom:0}

/* 司机端：配送大单卡片（2 级：单头 + 各品种明细表） */
.grp-card{border:1px solid var(--border,#e6eaf0);border-radius:12px;margin-bottom:14px;background:var(--card,#fff);overflow:hidden;box-shadow:0 1px 3px rgba(15,23,42,.04)}
.grp-head{padding:12px 14px;border-bottom:1px solid var(--border,#eef1f5);background:linear-gradient(0deg,#f8fafc,#fff)}
.grp-title{font-size:14px}
.grp-title b{color:var(--primary,#2b6cb0);font-family:var(--mono,monospace);font-size:13px}
.grp-driver{color:var(--info,#2b6cb0);font-weight:600}
.grp-meta{font-size:12.5px;color:var(--text-sub,#6b7785);margin-top:3px}
.grp-ops{margin-top:8px;display:flex;gap:8px;flex-wrap:wrap}
.grp-card .tbl-wrap{margin:0;border-radius:0;border:none}
.grp-card table.tbl{margin:0}
.grp-detail-head{font-size:13px;color:var(--text,#1f2933);padding:10px 12px;background:var(--bg-soft,#f8fafc);border-radius:8px;margin-bottom:8px}
.grp-sub{display:inline-block;margin-left:6px;padding:1px 8px;border-radius:8px;background:#eef5ff;color:var(--info,#2b6cb0);font-size:12px;font-weight:600}
.grp-meta b{color:var(--text,#1f2933)}
.grp-amt{margin-left:2px}
.grp-done-tip{font-size:12.5px;color:var(--text-sub,#6b7785);background:var(--bg-soft,#f8fafc);border:1px solid var(--border,#eef1f5);border-radius:8px;padding:8px 10px;margin-bottom:8px}
.modal-lg{max-width:860px;width:92%}
.gd-input{width:100%;min-width:80px;padding:6px 8px;border:1px solid var(--border,#e2e8f0);border-radius:7px;font-size:13px;box-sizing:border-box}
/* 销售订单 Tab 外壳（合并「订单处理」与「销售单台账」） */
.orders-tabs{display:flex;gap:6px;margin:0 0 12px;flex-wrap:wrap}
.orders-tab{font-size:13.5px;padding:7px 16px;border:1px solid var(--border,#e2e8f0);background:var(--card,#fff);color:var(--text,#1f2a37);border-radius:9px;cursor:pointer;transition:.15s}
.orders-tab:hover{border-color:var(--primary,#2f6fed);color:var(--primary,#2f6fed)}
.orders-tab.active{background:var(--primary,#2f6fed);border-color:var(--primary,#2f6fed);color:#fff;font-weight:600}

/* 司机端权限查看（老板端只读） */
.perm-group{border:1px solid var(--border,#eef1f5);border-radius:12px;padding:12px 14px;margin-bottom:12px;background:var(--bg-soft,#f9fbfd)}
.perm-group-hd{font-size:14px;font-weight:700;color:var(--text,#1f2a37);margin-bottom:10px;display:flex;align-items:center;gap:8px}
.perm-g-ico{font-size:16px}
.perm-list{display:flex;flex-direction:column;gap:8px}
.perm-item{display:flex;gap:10px;align-items:flex-start;background:var(--card,#fff);border:1px solid var(--border,#eef1f5);border-radius:10px;padding:9px 12px}
.perm-ico{font-size:18px;line-height:1.3;flex:0 0 auto}
.perm-body{flex:1;min-width:0}
.perm-body b{font-size:13.5px;color:var(--text,#1f2a37)}
.perm-desc{font-size:12.5px;color:var(--text-sub,#6b7785);margin-top:2px;line-height:1.5}


/* ============ 司机视角预览（老板实地查看司机端权限） ============ */
.perm-cta{display:flex;gap:12px;align-items:flex-end;flex-wrap:wrap;background:var(--card,#fff);border:1px solid var(--border,#eef1f5);border-left:3px solid var(--primary,#2f6fed);border-radius:10px;padding:12px 14px;margin:10px 0 14px}
.perm-cta .field{margin:0;min-width:220px}
.drive-view-tip{margin:10px 0 0;padding:9px 12px;background:rgba(47,111,253,.07);border:1px solid rgba(47,111,253,.25);border-radius:8px;font-size:12.5px;color:var(--text,#1f2a37);line-height:1.6}
.drive-view-tip b{color:var(--primary,#2f6fed)}
.drive-view-bar{margin-top:12px;padding:10px;border-radius:10px;background:linear-gradient(135deg,rgba(47,111,253,.10),rgba(47,111,253,.04));border:1px solid rgba(47,111,253,.30);display:flex;flex-direction:column;gap:8px}
.dvb-title{font-size:12.5px;font-weight:700;color:var(--primary,#2f6fed);letter-spacing:.2px}
.dvb-sel{width:100%;padding:7px 9px;border:1px solid var(--border,#eef1f5);border-radius:8px;background:var(--card,#fff);color:var(--text,#1f2a37);font-size:12.5px}
.dvb-exit{align-self:stretch}
@media (max-width:860px){.perm-cta{flex-direction:column;align-items:stretch}.perm-cta .field{min-width:0}}

/* ============ 刷新不跳动：兜底 ============
   渲染函数普遍以 box.innerHTML='<div class="loading">加载中…</div>' 开头，
   内容瞬间清空会造成页面高度骤变 → 浏览器把滚动条拉回顶部 → 视觉上"屏幕跳一下"。
   JS 侧已用 min-height 钉住 + renderKeepScroll 完整还原滚动位置；
   这里再关闭过渡动画与滚动行为动画，双保险确保刷新过程绝对平滑。 */
.loading{transition:none!important}
#view{overflow-anchor:none}
html{scroll-behavior:auto!important}

/* ============ 品名首拼+全拼智能录入（增量 A：纯交互层） ============ */
.py-combo{position:relative;display:inline-block;min-width:160px;vertical-align:middle}
.py-combo .py-native{display:none!important}
.py-input{width:100%;padding:7px 9px;border:1px solid var(--border,#eef1f5);border-radius:8px;background:var(--card,#fff);color:var(--text,#1f2a37);font-size:13px;box-sizing:border-box}
.py-input:focus{outline:none;border-color:var(--primary,#2f6fed);box-shadow:0 0 0 2px rgba(47,111,253,.15)}
.py-pop{position:absolute;z-index:50;left:0;right:0;top:calc(100% + 2px);max-height:240px;overflow:auto;background:var(--card,#fff);border:1px solid var(--border,#eef1f5);border-radius:8px;box-shadow:0 8px 24px rgba(20,30,50,.16);padding:4px}
.py-pop.hidden{display:none}
.py-opt{padding:7px 10px;border-radius:6px;font-size:13px;cursor:pointer;color:var(--text,#1f2a37);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.py-opt:hover{background:rgba(47,111,253,.10)}
.py-opt.py-cur{background:rgba(47,111,253,.16);color:var(--primary,#2f6fed);font-weight:600}
.py-opt.py-add{color:#0a8f4f;border:1px dashed rgba(10,143,79,.4);margin-top:2px}
.py-opt.py-empty{padding:8px 10px;color:#9aa4b2;font-size:12.5px;cursor:default}
.py-pop .py-opt.py-empty:hover{background:transparent}

/* ============ 增量 D-5~D-10：暂养池一体化治理（抽样/转池/动态重量/一批多池/质量索赔/一池一批） ============ */
/* 治理列：混池/损耗/抽样提示紧凑排版 */
.pool-load-card td .badge{margin-left:2px}
.pool-load-card td .btn-xs{margin:0 2px 0 0}
.pool-gov-hint{font-size:11px;line-height:1.5}
.pool-gov-hint .gov-lv-warn{color:var(--warn,#d97706)}
.pool-gov-hint .sub{color:#9aa4b2}
/* 质量索赔状态徽标配色补充 */
.badge-blue{background:rgba(37,99,235,.12);color:#2563eb;border:1px solid rgba(37,99,235,.25)}
/* 索赔卡片表格在窄屏可横向滚动 */
#view .tbl-wrap{overflow-x:auto}

/* ==================== 销售订单列表：紧凑平铺（一屏看全，免横向滑动） ====================
   背景：销售订单列表共 17 列。原样式下表格自然宽度约 1793px（1440 宽下溢出 469px），
   必须左右拖动才能看到「审核 / 状态 / 操作」，右侧还容易留出空白。
   这里仅对 .od-list 作用域做收窄（不影响其它报表）：
     · 字号 13.5px → 12.5px、单元格内边距 8/10px → 5/5px；
     · .tbl-inp 松开全局 min-width:110px（改由各输入框自身的 inline 宽度决定）；
     · 操作列允许换行，不再被 white-space:nowrap 撑到 240px。
   收窄后表格自然宽度落回容器内，再由 table{width:100%} 把余量平铺到各列 —— 右端不留空白。 */
.od-list table.tbl { font-size: 12.5px; }
.od-list table.tbl th,
.od-list table.tbl td { padding: 5px 5px; }
.od-list table.tbl .tbl-inp { min-width: 0; padding: 3px 5px; font-size: 12.5px; }
.od-list table.tbl th { white-space: nowrap; }
.od-list table.tbl td.ba-cell,
.od-list table.tbl th.ba-cell { width: 30px; padding-left: 3px; padding-right: 3px; }
.od-list table.tbl td.ord-no { white-space: nowrap; }
.od-list table.tbl td.td-ops { white-space: normal; }
.od-list table.tbl td.td-ops > .btn { margin: 1px 0; }
.od-list table.tbl td .badge { white-space: nowrap; }
/* 关键列设下限，避免表格被压到「店名竖排一行一个字」「审核/驳回上下堆叠」 */
.od-list table.tbl th:nth-child(4), .od-list table.tbl td:nth-child(4) { min-width: 84px; }   /* 店名 */
.od-list table.tbl th:nth-child(5), .od-list table.tbl td:nth-child(5) { min-width: 92px; }   /* 品种/规格 */
.od-list table.tbl th:nth-child(13), .od-list table.tbl td:nth-child(13) { min-width: 88px; } /* 出库批次 */
.od-list table.tbl th:nth-child(14), .od-list table.tbl td:nth-child(14) { min-width: 66px; } /* 审核 */
.od-list table.tbl th:last-child, .od-list table.tbl td.td-ops { min-width: 112px; }          /* 操作 */
/* 订单号列：多品种标记另起一行，使该列最小宽度回到「订单号本身」的宽度 */
.od-list table.tbl td.ord-no .od-multi-tag { display: block; color: var(--text-sub); font-size: 11.5px; font-weight: 400; }

/* ===== 门店报单监测（未报单 / 报单减少 / 月度波浪线） ===== */
.monitor-card .monitor-grid { display:grid; grid-template-columns:1fr 1fr; gap:14px; margin:10px 0 4px; }
.monitor-col .mc-title { font-weight:600; margin-bottom:6px; color:var(--text); }
.tag-red { display:inline-block; margin:2px 4px 2px 0; padding:2px 8px; border-radius:10px; font-size:12.5px; background:#fdecec; color:#c0392b; border:1px solid #f5c2c2; }
.ok-tip { color:#2e9e5b; font-size:13px; }
.dec-row { font-size:13px; margin:4px 0; color:#b9770e; }
.wave-wrap { margin-top:12px; border-top:1px dashed #e6eaf0; padding-top:10px; }
.wave-head { display:flex; align-items:center; gap:10px; margin-bottom:8px; flex-wrap:wrap; }
.wave-head select { padding:5px 8px; border:1px solid #d6dde6; border-radius:7px; }
.wave-sum { color:var(--text-sub); font-size:13px; }
.wave-trends { margin-top:8px; display:flex; flex-wrap:wrap; gap:6px; }
.store-trend { display:inline-block; padding:2px 8px; background:#f3f6fa; border:1px solid #e0e7ef; border-radius:10px; font-size:12.5px; }
#waveChart svg { max-width:100%; }
/* 门店报单监测 - 多店对比波浪线 */
.wave-wrap { margin-top:8px; }
.wave-head { display:flex; align-items:center; gap:10px; flex-wrap:wrap; margin-bottom:6px; }
.wave-head select { font-size:13px; padding:3px 8px; border:1px solid #d8dde4; border-radius:6px; background:#fff; }
.wave-hint { font-size:12px; color:#98a0ab; }
.wave-chart-box { position:relative; }
.wave-svg { display:block; width:100%; }
.wave-tip { position:absolute; display:none; pointer-events:none; background:rgba(28,36,48,.94); color:#fff; font-size:12px; line-height:1.5; padding:7px 9px; border-radius:7px; box-shadow:0 4px 14px rgba(0,0,0,.18); z-index:20; max-width:210px; }
.wave-tip .wt-head { font-weight:600; margin-bottom:3px; border-bottom:1px solid rgba(255,255,255,.18); padding-bottom:3px; }
.wave-tip .wt-row { white-space:nowrap; }
.wave-tip .dot { display:inline-block; width:8px; height:8px; border-radius:50%; margin-right:5px; vertical-align:middle; }
.wave-legend { display:flex; flex-wrap:wrap; gap:6px; margin-top:8px; }
.wl-chip { display:inline-flex; align-items:center; gap:5px; font-size:12px; padding:3px 8px; border:1px solid #e3e8ee; border-radius:14px; background:#fff; cursor:pointer; user-select:none; }
.wl-chip i { width:10px; height:10px; border-radius:50%; background:var(--c,#2f7be4); }
.wl-chip small { color:#98a0ab; }
.wl-chip.off { opacity:.4; text-decoration:line-through; }
.wave-range-info { font-size:12px; color:#3a4655; font-weight:600; margin-left:6px; white-space:nowrap; }
/* 日曲线自选日期区间 */
.wave-head select#waveGran { width:auto; flex:0 0 auto; min-width:78px; }
.wave-dates { display:inline-flex; align-items:center; gap:4px; flex:0 0 auto; }
.wave-dates .wd-sep { color:#98a0ab; font-size:12px; }
.wave-date { width:auto; flex:0 0 auto; min-width:132px; font-size:12px; padding:3px 6px; border:1px solid #d8dde4; border-radius:6px; background:#fff; color:#3a4655; height:27px; }
.wave-date:focus { outline:none; border-color:#2f7be4; box-shadow:0 0 0 2px rgba(47,123,228,.12); }
@media (max-width: 640px) {
  .wave-dates { gap:2px; }
  .wave-date { font-size:11px; padding:2px 4px; height:26px; min-width:120px; }
}
.wave-overview { margin-top:6px; padding:4px 0 2px; cursor:pointer; user-select:none; -webkit-user-select:none; touch-action:none; }
.wave-ov-svg { width:100%; display:block; }
.wave-ov-svg .wave-ov-win { cursor:grab; }
.wave-ov-svg .wave-ov-win:active { cursor:grabbing; }
/* 报单端建议报单量面板 + 载入上次 */
.sugg-box { background:#f7fbff; border:1px solid #cfe3fb; margin:10px 0; padding:10px 12px; }
.sugg-title { font-weight:600; margin-bottom:4px; }
.sugg-line { font-size:13px; color:var(--text); }
.sugg-foot { margin-top:8px; display:flex; align-items:center; gap:12px; }
.sugg-gap { font-size:13px; }

/* 报货端：条数必填校验高亮 */
input.input-err { border-color:#e23b3b !important; background:#fff3f3 !important; box-shadow:0 0 0 2px rgba(226,59,59,.15); }
.col-tail .tail::placeholder { color:#c0392b; }

/* 月底盘存 */
.mc-toolbar { align-items:end; }
.mc-toolbar .field { min-width:170px; }
.mc-toolbar .mc-next { max-width:210px; }
.mc-toolbar .mc-actions { display:flex; gap:8px; flex:1; justify-content:flex-end; }
.mc-note,.mc-saved { margin:8px 0 0; font-size:12.5px; line-height:1.7; color:var(--text-sub); }
.mc-saved { color:var(--success); }
.mc-formula { font-size:13px; line-height:1.8; color:var(--text-sub); }
.mc-formula p { margin:4px 0; }
.mc-real { width:96px; text-align:right; }
.mc-stats .stat .v.c-red,.mc-stats .stat .v.c-green { font-weight:700; }

/* 手机端：预警弹窗、预警横幅与 AI 机器人共用桌面数据，窄屏下单独适配呈现。 */
@media (max-width:640px) {
  .modal-mask { padding:10px; align-items:center; }
  .modal { width:100%; max-height:90vh; max-height:90dvh; padding:18px 16px; border-radius:12px; }
  .modal .modal-btns { flex-wrap:wrap; gap:8px; }
  .modal .modal-btns .btn { flex:1; min-width:110px; }
  .tier-critical-modal { max-width:100%; }
  .tc-list { max-height:52vh; max-height:52dvh; }
  .tc-item .content { font-size:14px; line-height:1.55; }
  .tier-banner { align-items:flex-start; flex-wrap:wrap; padding:9px 10px; gap:7px; }
  .tier-banner .tb-body { min-width:calc(100% - 54px); font-size:12.5px; }
  .tier-banner .tb-go { margin-left:23px; }
  .ai-fab { right:14px; bottom:14px; padding:12px 15px; z-index:1200; }
  .ai-panel { left:8px; right:8px; bottom:76px; width:auto; max-width:none; height:68vh; height:68dvh; max-height:calc(100vh - 94px); max-height:calc(100dvh - 94px); border-radius:14px; }
  .ai-head { padding:11px 12px; }
  .ai-head span[style] { display:none; }
  .ai-close { margin-left:auto; width:32px; height:32px; }
  .ai-body { padding:10px; }
  .ai-msg { max-width:94%; font-size:14px; }
  .ai-input-row { padding:9px; }
  .ai-input-row input { min-width:0; font-size:16px; }
  .ai-input-row .btn { flex-shrink:0; }
  .mc-toolbar .field,.mc-toolbar .mc-next { min-width:0; max-width:none; width:100%; }
  .mc-toolbar .mc-actions { justify-content:flex-start; flex-wrap:wrap; }
  .mc-real { width:84px; font-size:16px; }
}
