/* ============ 商耘进销存原型 · 设计规范（Arco Design 定制） ============ */
:root{
  --brand:#376AF6;
  --brand-hover:#224ACC;
  --brand-active:#1A3DA8;
  --side-a:#3D7BFE;
  --side-b:#5F9BFF;
  --bg:#F2F3F5;
  --panel:#FFFFFF;
  --text:#1D2129;
  --text-2:#4E5969;
  --text-3:#86909C;
  --border:#E5E6EB;
  --border-2:#F0F1F3;
  --th-bg:#F5F8FF;
  --radius:4px;
  --green:#00B42A;
  --green-bg:#E8FFEA;
  --red:#F53F3F;
  --red-bg:#FFECE8;
  --orange:#FF7D00;
  --orange-bg:#FFF3E8;
  --gray:#86909C;
  --gray-bg:#F2F3F5;
  --cyan:#14C9C9;
  --cyan-bg:#E8FFFB;
  --purple:#722ED1;
  --purple-bg:#F5E8FF;
  --shadow:0 4px 16px rgba(0,0,0,.08);
  --side-w:208px;
}
*{box-sizing:border-box;margin:0;padding:0}
html,body{height:100%}
body{
  font-family:-apple-system,BlinkMacSystemFont,"Segoe UI","PingFang SC","Hiragino Sans GB","Microsoft YaHei",sans-serif;
  background:var(--bg);color:var(--text);font-size:14px;line-height:1.6;
  -webkit-font-smoothing:antialiased;
}
button{font-family:inherit;cursor:pointer}
input,select,textarea{font-family:inherit;font-size:14px;color:var(--text)}

/* ---------- 下拉选择器统一规格（对齐商耘 Arco Select 实测 2026-09-17）----------
   高 32px / 描边 1px #D2DDF8 / 圆角 4px / 文字左内边距 12px
   箭头：自绘 12×12 线性 ⌄，色 #86909C，距右边框 12px（原生箭头尺寸/边距不可控，必须自绘） */
select{
  appearance:none;-webkit-appearance:none;-moz-appearance:none;
  background-image:url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 12 12' fill='none'%3E%3Cpath d='M2.6 4.4L6 7.8L9.4 4.4' stroke='%2386909C' stroke-width='1.2' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
  background-repeat:no-repeat;background-position:right 12px center;background-size:12px 12px;
  padding-right:28px;cursor:pointer;
}
select::-ms-expand{display:none}
select:disabled{background-color:#F7F8FA;color:var(--text-3);cursor:not-allowed}
a{color:var(--brand);text-decoration:none}

/* ---------- 滚动条：对齐商耘 Arco（2026-09-17 实测 · 有头模式 + 像素采样）----------
   商耘线上 CSS 原文（index-CyYS8EDn.css）：
     ::-webkit-scrollbar{width:6px;height:6px;background-color:transparent;border-radius:5px}
     ::-webkit-scrollbar-thumb:hover{background-color:rgb(var(--link-5));border-radius:5px}
     ::-webkit-scrollbar-track:hover{background-color:var(--color-bg-1);border-radius:5px}
   变量实测：--link-5 = 89,137,248(#5989F8) │ --color-neutral-4 = #C9CDD4 │ --primary-6 = #376AF6
   像素采样（有头模式截图）：侧边栏滑块 = #C9CDD4、宽约 6px；内容区滑块 = 同规格 6px。
   结论：全站滚动条宽 6px / 圆角 5px / 轨道透明 / 滑块 #C9CDD4 / hover·拖动 #5989F8。
   注意：不要用标准属性 scrollbar-width:thin —— Chrome 121+ 会以它为准而忽略 webkit 伪元素。 */
*::-webkit-scrollbar{width:6px;height:6px;background-color:transparent;border-radius:5px}
*::-webkit-scrollbar-track{background-color:transparent;border-radius:5px}
*::-webkit-scrollbar-thumb{background-color:#C9CDD4;border-radius:5px}
*::-webkit-scrollbar-thumb:hover,*::-webkit-scrollbar-thumb:active{background-color:#5989F8;border-radius:5px}
*::-webkit-scrollbar-corner{background-color:transparent}

/* ---------- 顶栏 ---------- */
.topbar{
  height:64px;background:#fff;border-bottom:1px solid var(--border);
  display:flex;align-items:center;padding:0 16px;position:sticky;top:0;z-index:30;
}
.topbar .logo{display:flex;align-items:center;gap:8px;font-weight:600;font-size:15px;color:var(--brand)}
.topbar .logo .mk{width:26px;height:26px;border-radius:6px;background:linear-gradient(135deg,var(--side-a),var(--side-b));
  display:flex;align-items:center;justify-content:center;color:#fff;font-weight:700}
.topbar .search{flex:1;max-width:360px;margin:0 24px;position:relative}
.topbar .search input{width:100%;height:32px;border:1px solid var(--border);border-radius:16px;
  padding:0 12px 0 32px;background:#F7F8FA;outline:none}
.topbar .search::before{content:"🔍";position:absolute;left:10px;top:50%;transform:translateY(-50%);font-size:13px;opacity:.55}
.topbar .spacer{flex:1}
.topbar .bell{margin-right:18px;font-size:16px;cursor:pointer;position:relative}
.topbar .bell .dot{position:absolute;top:-2px;right:-2px;width:7px;height:7px;border-radius:50%;background:var(--red)}
.topbar .who{display:flex;align-items:center;gap:8px}
.topbar .avatar{width:30px;height:30px;border-radius:50%;background:linear-gradient(135deg,var(--side-a),var(--side-b));
  color:#fff;display:flex;align-items:center;justify-content:center;font-size:12px;font-weight:600}
.topbar .who .nm{font-size:14px}
.topbar .who .rl{font-size:11px;color:var(--text-3)}

/* ---------- 布局 ---------- */
.layout{display:flex;min-height:calc(100vh - 64px)}
.sidebar{
  width:var(--side-w);flex:0 0 var(--side-w);background:linear-gradient(180deg,var(--side-a) 0%,var(--side-b) 100%);
  color:#fff;padding:10px 0;position:sticky;top:64px;height:calc(100vh - 64px);overflow:auto;
}
/* 侧边栏对齐商耘实测：顶部项目标题 18px/500 + 分隔线；行高 52px；
   分组标题 14px/400（图标20px+文字，缩进42px），子项无图标纯文字（缩进46px，仅多4px） */
.side-proj{font-size:18px;font-weight:500;color:#fff;padding:16px 14px 14px;
  border-bottom:1px solid rgba(255,255,255,.18);margin-bottom:6px}
.side-group>.sg-t{display:flex;align-items:center;gap:8px;padding:0 12px;height:52px;
  font-size:14px;font-weight:400;opacity:1;letter-spacing:normal;text-transform:none;cursor:pointer}
.side-group>.sg-t:hover{background:rgba(255,255,255,.08)}
.side-item{display:flex;align-items:center;gap:10px;padding:0 12px 0 46px;height:52px;cursor:pointer;
  font-size:14px;font-weight:400;position:relative;opacity:1;transition:background .15s}
.side-item .ic{display:none}
.side-item:hover{background:rgba(255,255,255,.12)}
.side-item.active{background:rgba(255,255,255,.2);font-weight:500;opacity:1}
/* 分组标题图标：商耘 18px 白色线性 */
.sg-t .ic{width:18px;height:18px;opacity:.95;display:inline-block}
.side-item .sg-arrow{margin-left:auto;transition:transform .15s;opacity:.7}
.side-group.collapsed .sg-arrow{transform:rotate(-90deg)}
.side-group.collapsed .side-item{display:none}

.main{flex:1;padding:18px 22px 40px;min-width:0;overflow:auto}
.page{display:none;animation:fade .2s ease}
.page.show{display:block}
@keyframes fade{from{opacity:0;transform:translateY(4px)}to{opacity:1;transform:none}}

/* ---------- 面包屑 / 页头 ---------- */
.crumb{font-size:12px;color:var(--text-3);margin-bottom:10px}
.crumb b{color:var(--text-2);font-weight:500}
.ph{display:flex;align-items:flex-start;justify-content:space-between;margin-bottom:14px}
.ph h2{font-size:20px;font-weight:600}
.ph .pd{color:var(--text-3);font-size:12px;margin-top:3px;max-width:680px}

/* ---------- 筛选条 ---------- */
.filterbar{background:var(--panel);border:1px solid var(--border);border-radius:6px;padding:14px 16px;
  display:flex;flex-wrap:wrap;gap:12px 18px;align-items:flex-end;margin-bottom:14px}
.fi{display:flex;flex-direction:column;gap:5px}
.fi label{font-size:12px;color:var(--text-3)}
.fi input{height:32px;border:1px solid #D2DDF8;border-radius:var(--radius);padding:0 12px;min-width:150px;outline:none;background:#fff}
.fi select{height:32px;border:1px solid #D2DDF8;border-radius:var(--radius);padding:0 28px 0 12px;min-width:150px;outline:none;background-color:#fff}
/* 注意：以上均用 background-color，不能用 background 简写——简写会重置自绘箭头的 background-image/position */
.fi input:focus,.fi select:focus{border-color:var(--brand)}
.fb-actions{display:flex;gap:8px;margin-left:auto;align-items:flex-end}

/* ---------- 工具栏 ---------- */
.toolbar{display:flex;gap:10px;align-items:center;margin-bottom:12px;flex-wrap:wrap}
.toolbar .spacer{flex:1}

/* ---------- 按钮 ---------- */
.btn{height:32px;padding:0 16px;border:1px solid #D2DDF8;background:#fff;border-radius:var(--radius);
  color:var(--text);font-size:14px;display:inline-flex;align-items:center;gap:5px;transition:all .15s}
.btn:hover{border-color:var(--brand);color:var(--brand)}
.btn.primary{background:var(--brand);border-color:var(--brand);color:#fff}
.btn.primary:hover{background:var(--brand-hover);border-color:var(--brand-hover);color:#fff}
.btn.ghost{background:transparent;border-color:transparent;color:var(--text-2)}
.btn.ghost:hover{background:#F2F3F5;color:var(--text)}
.btn.sm{height:28px;padding:0 12px;font-size:14px}
.btn.danger{color:var(--red);border-color:var(--red-bg)}
.btn.danger:hover{background:var(--red-bg);border-color:var(--red)}
.btn.link{padding:0 4px;height:auto;border:none;background:none;color:var(--brand)}
.btn.link:hover{text-decoration:underline;background:none}
.btn[disabled]{opacity:.45;cursor:not-allowed}

/* ---------- 表格 ---------- */
.tbl-wrap{background:#fff;border:1px solid var(--border);border-radius:6px;overflow:auto}
table.tbl{width:100%;border-collapse:collapse;font-size:14px}
/* 表头：高 48 / 底 #F5F8FF / 600 / 字号 14 / 内边距 13px 16px / 文字 #1D2129；分隔线 #E9F0FF（实测） */
.tbl thead th{background:var(--th-bg);color:var(--text);font-weight:600;text-align:left;font-size:14px;
  padding:0 16px;height:48px;white-space:nowrap;border-bottom:1px solid #E9F0FF;position:sticky;top:0;vertical-align:middle}
.tbl tbody td{padding:13px 16px;border-bottom:1px solid #E9F0FF;white-space:nowrap;color:var(--text);font-size:14px}
.tbl tbody tr:hover{background:#FAFBFF}
.tbl tbody td.num{text-align:right;font-variant-numeric:tabular-nums}
.tbl .row-actions{display:flex;gap:4px;flex-wrap:wrap}
.empty{padding:46px;text-align:center;color:var(--text-3)}

/* ---------- 标签 ---------- */
.tag{display:inline-block;padding:1px 8px;border-radius:var(--radius);font-size:12px;line-height:22px;white-space:nowrap}
.tag.g{background:var(--green-bg);color:var(--green)}
.tag.r{background:var(--red-bg);color:var(--red)}
.tag.o{background:var(--orange-bg);color:var(--orange)}
.tag.gy{background:var(--gray-bg);color:var(--gray)}
.tag.c{background:var(--cyan-bg);color:var(--cyan)}
.tag.p{background:var(--purple-bg);color:var(--purple)}
.tag.b{background:#E8F0FF;color:var(--brand)}

/* ---------- 进度条 ---------- */
.pbar{height:6px;border-radius:4px;background:var(--border-2);width:120px;overflow:hidden;display:inline-block;vertical-align:middle}
.pbar>i{display:block;height:100%;background:var(--brand);border-radius:4px}
.pbar small{margin-left:8px;color:var(--text-3);font-size:12px;vertical-align:middle}

/* ---------- 分页 ---------- */
/* 分页（2026-09-18 商耘实测 .w-table-pagination）：
   容器高 32px；「共 N 条」14px/#1D2129；页码块 32×32/圆角2/字号14；
   默认字色 #4E5969，选中 = 底 #E8F2FF + 字 #376AF6；上/下一页箭头 12px、禁用 #BDC0CA；
   每页条数下拉 86×32（显示「10条/页」）；前往输入框 48×32、描边 #D2DDF8、圆角 4 */
.pager{display:flex;align-items:center;justify-content:flex-end;gap:10px;padding:12px 4px;color:var(--text-3);font-size:14px}
/* 「共 N 条」＝分页栏内、紧邻页码左侧（商耘顺序：共 148 条 → 页码 → N条/页 → 前往） */
.pager .pg-total{color:#1D2129;font-size:14px;margin-right:8px}
.pager .pg{display:inline-flex;gap:4px}
.pager .pg b,.pager .pg span{min-width:32px;height:32px;border:none;border-radius:2px;
  display:inline-flex;align-items:center;justify-content:center;cursor:pointer;background:transparent;font-size:14px;color:#4E5969;font-weight:400}
.pager .pg b{background:#E8F2FF;color:var(--brand);font-weight:400}
.pager .pg span:hover{color:var(--brand)}
.pager .pg-ell{cursor:default;color:#4E5969}
.pager .pg-btn{font-size:12px;color:#4E5969;line-height:1}
.pager .pg-btn.dis,.pager .pg-btn:disabled{color:#BDC0CA;cursor:not-allowed}
.pager .pg-size select{height:32px;min-width:86px;border:1px solid #D2DDF8;border-radius:4px;background-color:#fff;
  padding:0 28px 0 12px;font-size:14px;color:#1D2129;outline:none;appearance:none;
  background-image:url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 12 12'%3E%3Cpath d='M2.5 4.5L6 8l3.5-3.5' fill='none' stroke='%2386909C' stroke-width='1.2' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
  background-repeat:no-repeat;background-position:right 12px center;cursor:pointer}
.pager .pg-jump{color:#1D2129;font-size:14px}
.pager .pg-inp{width:48px;height:32px;box-sizing:border-box;border:1px solid #D2DDF8;border-radius:4px;padding:0 6px;
  font-size:14px;color:#1D2129;outline:none;background-color:#fff;text-align:center;margin:0 2px}
.pager .pg-inp:focus{border-color:var(--brand)}
/* 重置（清空筛选）：对齐商耘＝筛选块右侧的删除图标按钮 28×28，紧跟最后一个筛选块（间距 8px）
 图标默认「次要文本灰 #4E5969」（与筛选块箭头同色系），hover 转主色 —— 不再用主色蓝 */
.btn-icon-reset{width:28px;height:28px;display:inline-flex;align-items:center;justify-content:center;
  padding:0;border:1px solid #D2DDF8;border-radius:4px;background-color:#fff;color:#4E5969;cursor:pointer;flex:0 0 auto}
.btn-icon-reset:hover{background-color:#F5F8FF;border-color:var(--brand);color:var(--brand)}
.btn-icon-reset svg{width:14px;height:14px;display:block}

/* ---------- 仪表盘 ---------- */
.cards{display:grid;grid-template-columns:repeat(4,1fr);gap:14px;margin-bottom:18px}
.card{background:#fff;border:1px solid var(--border);border-radius:8px;padding:16px 18px}
.card .k{font-size:12px;color:var(--text-3)}
.card .v{font-size:26px;font-weight:700;margin-top:6px;font-variant-numeric:tabular-nums}
.card .v small{font-size:13px;color:var(--text-3);font-weight:400}
.card .trend{font-size:12px;margin-top:4px}
.card .trend.up{color:var(--green)}
.card .trend.dn{color:var(--red)}
.grid2{display:grid;grid-template-columns:1.4fr 1fr;gap:14px}
.panel{background:#fff;border:1px solid var(--border);border-radius:8px;padding:16px}
.panel h3{font-size:14px;margin-bottom:12px;display:flex;align-items:center;justify-content:space-between}
.bars{display:flex;align-items:flex-end;gap:14px;height:180px;padding:10px 4px 0}
.bar-col{flex:1;display:flex;flex-direction:column;align-items:center;justify-content:flex-end;height:100%}
.bar-col .bar{width:60%;background:linear-gradient(180deg,var(--side-a),var(--side-b));border-radius:5px 5px 0 0;transition:height .4s}
.bar-col .lab{font-size:11px;color:var(--text-3);margin-top:6px}
.bar-col .val{font-size:12px;font-weight:600;margin-bottom:4px}
.legend{display:flex;gap:16px;font-size:12px;color:var(--text-3);margin-top:10px}
.legend i{display:inline-block;width:9px;height:9px;border-radius:2px;margin-right:5px;vertical-align:middle}
.recent li{list-style:none;display:flex;align-items:center;gap:10px;padding:9px 0;border-bottom:1px solid var(--border-2)}
.recent li:last-child{border:none}
.recent .dotc{width:8px;height:8px;border-radius:50%;flex:0 0 8px}
.recent .rt{font-size:12px;color:var(--text-3);margin-left:auto}

/* ---------- 弹窗 ---------- */
.mask{position:fixed;inset:0;background:rgba(29,33,41,.45);display:none;z-index:60;align-items:flex-start;justify-content:center}
.mask.show{display:flex}
.modal{background:#fff;border-radius:8px;width:560px;max-width:92vw;max-height:90vh;display:flex;flex-direction:column;
  margin-top:6vh;box-shadow:var(--shadow);animation:pop .18s ease}
.modal.lg{width:880px}
@keyframes pop{from{transform:translateY(-10px);opacity:.6}to{transform:none;opacity:1}}
/* 弹窗规格对齐商耘实测：头 48px/左右 24px/底边框 #E9F0FF；体 24px；脚 16px 24px，按钮右对齐 */
.modal-h{height:48px;padding:0 24px;font-size:16px;font-weight:500;border-bottom:1px solid #E9F0FF;
  display:flex;align-items:center;justify-content:space-between;flex:none}
.modal-h .x{font-size:20px;color:var(--text-3);cursor:pointer;line-height:1}
.modal-b{padding:24px;overflow:auto}
.modal-f{padding:16px 24px;border-top:1px solid var(--border);display:flex;justify-content:flex-end;gap:12px}
.modal-f .btn{padding:0 24px}
.frow{display:flex;flex-wrap:wrap;gap:14px;margin-bottom:14px}
.frow .f{flex:1;min-width:200px;display:flex;flex-direction:column;gap:5px}
.frow .f.full{flex-basis:100%}
.f label{font-size:14px;color:var(--text-2)}
.f label .req{color:var(--red);margin-left:2px}
.f input,.f select,.f textarea{height:32px;border:1px solid #D2DDF8;border-radius:var(--radius);padding:0 12px;outline:none;background-color:#fff}
.f select{padding:0 28px 0 12px;background-color:#fff}
/* 查看（只读）态：字段值渲染为纯文本，对齐商耘详情页 */
.ro-val{min-height:32px;line-height:32px;font-size:14px;color:var(--text-1);word-break:break-all}
/* 分区标题旁的只读来源说明（如「收付款信息（财务回写 · 只读）」） */
.ro-note{font-size:12px;font-weight:400;color:var(--text-3);margin-left:4px}
.f textarea{height:auto;padding:8px 12px;resize:vertical}
.f input:focus,.f select:focus,.f textarea:focus{border-color:var(--brand)}
.hint{font-size:12px;color:var(--text-3);margin-top:2px}
.sub-tbl{width:100%;border-collapse:collapse;font-size:14px;margin-bottom:10px}
.sub-tbl th{background:var(--th-bg);padding:7px 8px;text-align:left;font-weight:600;color:var(--text-2)}
.sub-tbl td{padding:5px 8px;border-bottom:1px solid var(--border-2)}
.sub-tbl input{width:100%;height:28px;border:1px solid var(--border);border-radius:3px;padding:0 6px}
.sub-total{text-align:right;padding:8px;font-size:14px}
.sub-total b{font-size:15px;color:var(--brand)}

/* ---------- 抽屉 ---------- */
.drawer-mask{position:fixed;inset:0;background:rgba(29,33,41,.4);display:none;z-index:60}
.drawer-mask.show{display:block}
.drawer{position:absolute;right:0;top:0;height:100%;width:520px;max-width:94vw;background:#fff;
  box-shadow:-4px 0 24px rgba(0,0,0,.12);display:flex;flex-direction:column;animation:slide .22s ease}
@keyframes slide{from{transform:translateX(40px);opacity:.5}to{transform:none}}
.drawer-h{padding:16px 20px;border-bottom:1px solid var(--border);font-size:15px;font-weight:600;
  display:flex;align-items:center;justify-content:space-between}
.drawer-h .x{font-size:20px;color:var(--text-3);cursor:pointer}
.drawer-b{padding:18px 20px;overflow:auto;flex:1}
.dl{display:grid;grid-template-columns:120px 1fr;gap:10px 14px;margin-bottom:14px}
.dl dt{color:var(--text-3);font-size:14px}
.dl dd{font-size:14px;color:var(--text)}
.dsec{font-size:14px;font-weight:600;margin:14px 0 8px;padding-left:8px;border-left:3px solid var(--brand)}
.drawer-f{padding:12px 20px;border-top:1px solid var(--border);display:flex;gap:10px;justify-content:flex-end}

/* ---------- Toast ---------- */
.toasts{position:fixed;top:64px;left:50%;transform:translateX(-50%);z-index:90;display:flex;flex-direction:column;gap:8px}
.toast{background:#fff;border:1px solid var(--border);border-radius:6px;padding:9px 16px;font-size:14px;
  box-shadow:var(--shadow);display:flex;align-items:center;gap:8px;animation:tin .2s ease}
.toast .ic{width:16px;height:16px;border-radius:50%;display:flex;align-items:center;justify-content:center;color:#fff;font-size:11px}
.toast.ok .ic{background:var(--green)} .toast.err .ic{background:var(--red)}
.toast.warn .ic{background:var(--orange)} .toast.info .ic{background:var(--brand)}
@keyframes tin{from{transform:translateY(-8px);opacity:0}to{transform:none;opacity:1}}

/* ---------- 回到顶部 ---------- */
.topbtn{position:fixed;right:22px;bottom:22px;width:40px;height:40px;border-radius:50%;background:var(--brand);
  color:#fff;display:none;align-items:center;justify-content:center;font-size:18px;box-shadow:var(--shadow);z-index:40;cursor:pointer}
.topbtn.show{display:flex}

/* ---------- 设置 ---------- */
.set-nav{display:flex;gap:10px;margin-bottom:16px;flex-wrap:wrap}
.set-nav .tab{padding:7px 14px;border:1px solid var(--border);border-radius:20px;font-size:14px;cursor:pointer;background:#fff}
.set-nav .tab.active{background:var(--brand);color:#fff;border-color:var(--brand)}
.set-panel{display:none}
.set-panel.show{display:block}
.kv{display:flex;justify-content:space-between;align-items:center;padding:13px 0;border-bottom:1px solid var(--border-2)}
.kv .kt{font-size:14px} .kv .kd{font-size:12px;color:var(--text-3);margin-top:2px}
.switch{width:40px;height:22px;border-radius:12px;background:var(--border);position:relative;cursor:pointer;transition:background .15s}
.switch.on{background:var(--brand)}
.switch i{position:absolute;top:2px;left:2px;width:18px;height:18px;border-radius:50%;background:#fff;transition:left .15s}
.switch.on i{left:20px}

.muted{color:var(--text-3)}
.right{text-align:right}
.center{text-align:center}
.mt8{margin-top:8px} .mt12{margin-top:12px} .mb12{margin-bottom:12px}
.row{display:flex;gap:10px;align-items:center}
.wrap{display:flex;flex-wrap:wrap;gap:8px}
.scope{display:inline-block;background:var(--gray-bg);color:var(--text-2);border-radius:4px;padding:1px 8px;font-size:12px;margin:2px 0}

/* ---------- 详情抽屉（通用） ---------- */
.detail-mask{position:fixed;inset:0;background:rgba(29,33,41,.4);display:none;z-index:60}
.detail-mask.show{display:block}
.detail{position:fixed;right:0;top:0;height:100%;width:520px;max-width:94vw;background:#fff;
  box-shadow:-4px 0 24px rgba(0,0,0,.12);display:none;flex-direction:column;z-index:61;animation:slide .22s ease}
.detail.show{display:flex}
.detail-h{padding:16px 20px;border-bottom:1px solid var(--border);font-size:15px;font-weight:600;
  display:flex;align-items:center;justify-content:space-between}
.detail-h .x{font-size:20px;color:var(--text-3);cursor:pointer;line-height:1}
.detail-b{padding:18px 20px;overflow:auto;flex:1}
.detail-f{padding:12px 20px;border-top:1px solid var(--border);display:flex;gap:10px;justify-content:flex-end}
.kv2{display:grid;grid-template-columns:118px 1fr;gap:11px 14px;margin:0}
.kv2 .kr{display:contents}
.kv2 dt{color:var(--text-3);font-size:14px}
.kv2 dd{font-size:14px;color:var(--text);margin:0}
.sub-t{font-size:14px;font-weight:600;margin:6px 0 8px;padding-left:8px;border-left:3px solid var(--brand)}
.tbl tbody tr.warn-row{background:#FFF1F0}
.tbl tbody tr.warn-row td:first-child{box-shadow:inset 3px 0 0 var(--red)}
.topbtn{display:flex}

/* ===== 独立表单页（对齐商耘骨架 C：可关闭页签 + 竖线分区 + 3列栅格 + 底部固定操作栏） ===== */
.form-tabs{display:flex;gap:6px;border-bottom:1px solid var(--border);margin-bottom:14px}
/* 可关闭页签：高 40px / 内边距 0 16px / 字号 12 / 圆角 6px 6px 0 0（商耘实测） */
.ftab{display:inline-flex;align-items:center;gap:8px;padding:0 16px;height:40px;font-size:12px;color:var(--text-2);background:#F7F8FA;border:1px solid var(--border);border-bottom:none;border-radius:6px 6px 0 0;cursor:pointer}
.ftab:hover{color:var(--brand)}
.ftab.cur{background:#fff;color:var(--brand);font-weight:600;position:relative;top:1px;cursor:default}
.ftab.cur:hover{color:var(--brand)}
.ftab .x{font-style:normal;font-size:15px;color:var(--text-3);cursor:pointer;line-height:1}
.ftab .x:hover{color:var(--red)}
.form-card{background:#fff;border:1px solid var(--border);border-radius:8px;padding:20px 24px 28px;margin-bottom:20px}
.fp-head{font-size:17px;font-weight:600;margin-bottom:16px}
.fgrid{display:grid;grid-template-columns:repeat(3,1fr);gap:14px 24px}
.fgrid .f{display:flex;flex-direction:column;gap:6px;min-width:0}
.fgrid .f label{font-size:14px;color:var(--text-2)}
.fgrid .f input,.fgrid .f select{width:100%;border:1px solid #D2DDF8}
.fgrid .f select{padding:0 28px 0 12px}
/* ---------- 可检索下拉（对齐商耘：不定量枚举/≥10项带检索框；2026-09-18 实测） ---------- */
.combo-wrap{position:relative;display:flex;align-items:center;gap:8px;width:100%}
.fgrid .f .f-with-add .combo-wrap{flex:1 1 auto;width:auto;min-width:0}
.combo{position:relative;width:100%;height:32px;box-sizing:border-box;border:1px solid #D2DDF8;border-radius:4px;background-color:#fff;padding:0 28px 0 12px;display:flex;align-items:center;cursor:pointer;font-size:14px;color:var(--text-1);outline:none;transition:border-color .15s}
.combo:hover,.combo:focus{border-color:var(--brand)}
.combo .combo-txt{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.combo .combo-txt.ph{color:var(--text-3)}
.combo .combo-ar{position:absolute;right:12px;top:50%;margin-top:-6px;width:12px;height:12px;background-image:url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 12 12'%3E%3Cpath d='M2.5 4.5L6 8l3.5-3.5' fill='none' stroke='%2386909C' stroke-width='1.2' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");background-repeat:no-repeat;background-position:center;pointer-events:none}
.combo.dis{background-color:#F7F8FA;color:var(--text-3);cursor:not-allowed}
.combo.dis .combo-txt{color:var(--text-3)}
.combo-pop{position:absolute;top:36px;left:0;min-width:100%;max-width:320px;z-index:3000;background-color:#fff;border:1px solid #E5E6EB;border-radius:4px;box-shadow:0 4px 10px rgba(0,0,0,.1);padding:4px 0}
.combo-search{display:block;width:calc(100% - 16px);margin:4px 8px;height:32px;box-sizing:border-box;border:1px solid #D2DDF8;border-radius:4px;padding:0 8px;font-size:14px;outline:none;background-color:#fff}
.combo-search:focus{border-color:var(--brand)}
.combo-search::placeholder{color:var(--text-3)}
.combo-opts{max-height:264px;overflow:auto}
.combo-opt{height:36px;line-height:36px;padding:0 12px;font-size:14px;color:var(--text-1);cursor:pointer;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.combo-opt:hover{background-color:#F2F3F5}
.combo-opt.cur{color:var(--brand);font-weight:500}
.combo-empty{padding:20px 0;text-align:center;color:var(--text-3);font-size:14px}
/* 筛选块弹层检索框（枚举≥10时） */
.chip-search-box{padding:4px 8px;border-bottom:1px solid #E9F0FF;margin-bottom:2px}
.chip-search-box input{width:100%;height:28px;box-sizing:border-box;border:1px solid #D2DDF8;border-radius:4px;padding:0 8px;font-size:14px;outline:none;background-color:#fff}
.chip-search-box input:focus{border-color:var(--brand)}
.chip-search-box input::placeholder{color:var(--text-3)}
/* 字段旁「＋新增类别 / ＋新增分类」按钮：小号虚线描边、主色字，对齐商耘物品信息分类字段的可新增按钮 */
.fgrid .f .f-with-add{display:flex;align-items:center;gap:8px}
.fgrid .f .f-with-add>select{flex:1 1 auto;width:auto;min-width:0}
.fgrid .f .f-with-add .btn-add-opt{height:32px;flex:0 0 auto;padding:0 12px;border:1px dashed #C9CDD4;background:#fff;color:var(--brand);border-radius:4px;font-size:14px;line-height:30px;cursor:pointer;white-space:nowrap;transition:all .15s}
.fgrid .f .f-with-add .btn-add-opt:hover{background:#F5F8FF;border-color:var(--brand)}
.modal-b .f input{width:100%;border:1px solid #D2DDF8;height:32px;border-radius:4px;padding:0 12px;outline:none;background-color:#fff}
.modal-b .f input:focus{border-color:var(--brand)}
.fgrid .f input:disabled,.fgrid .f select:disabled{background-color:#F7F8FA;color:var(--text-3);cursor:not-allowed}
#page-form{padding-bottom:48px} /* 给底部固定操作栏留出空间，避免遮挡最后的附件分区 */
#page-form .sub-t{font-size:14px;margin:20px 0 10px}
#page-form .tbl th{height:44px}
#page-form .tbl td{padding:6px 8px}
#page-form .tbl td input,#page-form .tbl td select{width:100%;height:32px;border:1px solid #D2DDF8;border-radius:4px;padding:0 12px;outline:none;background-color:#fff}
#page-form .tbl td select{padding:0 28px 0 12px;background-color:#fff}
#page-form .tbl td input:focus,#page-form .tbl td select:focus{border-color:var(--brand)}
#page-form .tbl td input:disabled,#page-form .tbl td select:disabled{background:#F7F8FA;color:var(--text-3)}
.fp-foot{position:fixed;left:var(--side-w);right:0;bottom:0;z-index:40;background:#fff;border-top:1px solid var(--border);box-shadow:0 -2px 8px rgba(29,33,41,.05)}
/* 表单页底部操作栏：按钮一律固定在**右下角**（用户 2026-09-18 明确）；左侧合计金额/提示靠左，
   无左侧内容时按钮不会被拉到左边 */
.fp-foot-in{display:flex;align-items:center;justify-content:flex-end;padding:11px 24px}
.fp-amt,.fp-tip{margin-right:auto}
.fp-amt{font-size:14px;color:var(--text-2)}.fp-amt b{color:var(--red);font-size:19px;margin-left:4px}
.fp-btns{display:flex;gap:10px}
.fp-tip{font-size:12px;color:var(--text-3)}
.topbtn{bottom:70px}

/* ---------- 可点击编号 / 编码（规则 23/25） ---------- */
.lnk{color:var(--brand);text-decoration:none;cursor:pointer}
.lnk:hover{text-decoration:underline}

/* ---------- 列表工具条（导出） ---------- */
.toolbar{display:flex;align-items:center;gap:10px;padding:0 0 10px}
.tb-cnt{font-size:14px;color:var(--text-3)}

/* ---------- 用途&费用设置 ---------- */
.f .purpose-box{display:flex;gap:14px;flex-wrap:wrap;margin-top:2px}
.f .pchk{display:inline-flex;align-items:center;gap:6px;font-size:14px;color:var(--text-1);font-weight:400;text-transform:none;letter-spacing:0;white-space:nowrap}
.f .pchk input[type=checkbox]{width:15px;height:15px;accent-color:var(--brand)}
.f .pfee{width:96px;height:32px;border:1px solid #D2DDF8;border-radius:4px;padding:0 8px;outline:none;font-size:14px}
.f .pfee:focus{border-color:var(--brand)}
.f .hint{font-size:12px;color:var(--text-3);margin-top:4px;line-height:1.5}

/* ---------- 备注附件（规则 26） ---------- */
/* 附件：独立分区展示在表单最后（需求文档规则），支持预览/下载 */
.att-sec{background:#fff;border:1px solid var(--border);border-radius:var(--radius);padding:12px 14px}
.att-drop{display:inline-flex;align-items:center;gap:6px;height:32px;padding:0 14px;border:1px dashed #C9D6F5;border-radius:var(--radius);color:var(--brand);font-size:14px;cursor:pointer;background:#F5F8FF}
.att-drop:hover{border-color:var(--brand);background:#EEF4FF}
.att-plus{font-size:14px;line-height:1}
.att-tip{font-size:12px;color:var(--text-3);margin-top:8px}
.att-list{margin-top:8px}
.att-item{display:flex;align-items:center;gap:8px;font-size:14px;color:var(--text-1);padding:6px 0;border-bottom:1px dashed #F0F2F5}
.att-item:last-child{border-bottom:0}
.att-ic{font-size:13px}
.att-name{flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.att-size{color:var(--text-3);font-size:12px}
.att-ops{display:flex;gap:10px;flex:none}
.att-op{color:var(--brand);font-size:12px;text-decoration:none;cursor:pointer}
.att-op:hover{text-decoration:underline}
.att-op.del{color:var(--text-3)}
.att-op.del:hover{color:var(--red)}
.att-empty{font-size:12px;color:var(--text-3);padding:6px 0}

/* ---------- 列表页对齐商耘：搜索行 + 字段名⌄ 灰底筛选块 ---------- */
.search-row{display:flex;align-items:center;gap:12px;margin-bottom:12px}
.search-box{position:relative;width:300px}
.search-box input{width:100%;height:32px;border:1px solid #D2DDF8;border-radius:4px;padding:0 12px 0 30px;background:#fff;outline:none;font-size:14px}
.search-box input:focus{border-color:var(--brand)}
.search-box .sic{position:absolute;left:9px;top:50%;width:13px;height:13px;transform:translateY(-50%);border:1.5px solid #A9AEB8;border-radius:50%;pointer-events:none}
.search-box .sic::after{content:"";position:absolute;left:10px;top:11px;width:6px;height:1.5px;background:#A9AEB8;transform:rotate(45deg)}
.chip-row{display:flex;flex-wrap:wrap;gap:8px;align-items:center;margin-bottom:14px}
/* 筛选块：高 28px / 内边距 0 8px / 底 #F2F3F5 / 圆角 4px / 字号 14 / 块间距 8px
   箭头：12×12 #595F68，距块右边 9px（商耘实测） */
.fchip{position:relative;display:inline-flex;align-items:center;gap:5px;height:28px;padding:0 8px;background:#F2F3F5;border-radius:4px;font-size:14px;color:var(--text);cursor:pointer;user-select:none;white-space:nowrap;transition:background .1s}
.fchip:hover{background:#E5E6EB}
.fchip.on{background:#E8F0FF;color:var(--brand)}
.fchip b{font-weight:500}
.fchip .ar{width:12px;height:12px;flex:none;font-size:0;color:transparent;background:url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 12 12' fill='none'%3E%3Cpath d='M2.6 4.4L6 7.8L9.4 4.4' stroke='%23595F68' stroke-width='1.2' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") center/12px 12px no-repeat}
.fchip.on .ar{background-image:url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 12 12' fill='none'%3E%3Cpath d='M2.6 4.4L6 7.8L9.4 4.4' stroke='%23376AF6' stroke-width='1.2' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E")}
/* 下拉面板：白底 / 圆角 4 / 边框 1px #E5E6EB / 阴影 0 4px 10px rgba(0,0,0,.1) / 上部留白 4px
   选项：高 36px / 内边距 0 12px / 字号 14 / hover 底 #F2F3F5 / 选中主色加粗 */
.chip-pop{position:absolute;top:32px;left:0;min-width:150px;background:#fff;border:1px solid #E5E6EB;border-radius:4px;box-shadow:0 4px 10px rgba(0,0,0,.1);padding:4px 0 0;z-index:70}
.chip-pop .opt{height:36px;line-height:36px;padding:0 12px;font-size:14px;color:var(--text);cursor:pointer;white-space:nowrap;transition:background .1s}
.chip-pop .opt:hover{background:#F2F3F5}
.chip-pop .opt.cur{color:var(--brand);font-weight:500}
.chip-pop .opt-in{display:flex;gap:6px;padding:6px 12px}
.chip-pop .opt-in input{width:200px;height:32px;border:1px solid #D2DDF8;border-radius:4px;padding:0 12px;outline:none;font-size:14px}
.chip-pop .opt-in input:focus{border-color:var(--brand)}
/* 日期范围筛选（需求文档：需求日期范围/交期范围/入库日期范围/调拨日期范围/盘点日期范围） */
.chip-pop .dr-in{display:flex;align-items:center;gap:6px;padding:6px 12px}
.chip-pop .dr-in input{width:140px;height:32px;box-sizing:border-box;border:1px solid #D2DDF8;border-radius:4px;padding:0 8px;outline:none;font-size:14px;background-color:#fff;color:var(--text)}
.chip-pop .dr-in input:focus{border-color:var(--brand)}
.chip-pop .dr-sep{color:var(--text-3);font-size:14px}
.chip-count{margin-left:auto;font-size:12px;color:var(--text-3)}

/* ---------- 选择物品弹窗（公共组件） ---------- */
.modal.wide{width:940px!important;max-width:94vw}
.pick-tabs{display:flex;gap:4px;border-bottom:1px solid var(--border);margin-bottom:12px}
.pk-tab{padding:7px 16px;font-size:14px;color:var(--text-2);cursor:pointer;border-bottom:2px solid transparent}
.pk-tab.cur{color:var(--brand);border-bottom-color:var(--brand);font-weight:600}
.pick-filter{display:flex;align-items:center;gap:8px;margin-bottom:10px}
/* 在库序列号弹窗的说明行（只读提示：物品/仓库/在库数量） */
.sn-meta{font-size:14px;color:#4E5969;margin-bottom:8px}
/* 盘点「导入实盘数量」弹窗 */
.imp-tip{font-size:14px;color:#4E5969;line-height:22px;margin-bottom:14px}
.imp-tip2{font-size:14px;color:#86909C;line-height:22px;margin-top:12px}
.imp-row{display:flex;align-items:center;gap:12px}
.imp-file{display:inline-flex;align-items:center;gap:8px;height:32px;padding:0 16px;border:1px solid #D2DDF8;border-radius:4px;background:#fff;color:#1D2129;font-size:14px;cursor:pointer}
.imp-file:hover{border-color:var(--brand);color:var(--brand)}
.imp-file input{display:none}
.pick-filter input{width:220px;height:32px;border:1px solid #D2DDF8;border-radius:4px;padding:0 10px;outline:none}
.pick-filter select{height:32px;border:1px solid #D2DDF8;border-radius:4px;padding:0 28px 0 12px;outline:none;background-color:#fff}
.pick-tip{font-size:12px;color:var(--text-3)}
.pick-filter .pick-sp{flex:1}
.pick-filter .btn{height:32px;white-space:nowrap}
.pick-page{width:100%}
.pick-page .pk-pgs{margin-left:auto;display:flex;gap:4px;align-items:center}
.pk-pg{min-width:28px;height:28px;padding:0 6px;border:1px solid var(--border);background-color:#fff;border-radius:4px;font-size:13px;color:var(--text-1);cursor:pointer}
.pk-pg:hover{border-color:var(--brand);color:var(--brand)}
.pk-pg.cur{background-color:var(--brand);border-color:var(--brand);color:#fff}
.pk-size{margin-left:12px;color:var(--text-3);font-size:12px}
.pk-new{display:grid;grid-template-columns:1fr 1fr;gap:18px 24px;padding:6px 2px 10px}
.pk-f{display:flex;flex-direction:column;gap:6px}
.pk-f>label{font-size:14px;color:var(--text-1)}
.pk-f>label i{color:#F53F3F;font-style:normal;margin-left:2px}
.pk-f input,.pk-f select{height:32px;border:1px solid #D2DDF8;border-radius:4px;padding:0 12px;outline:none;font-size:14px;background-color:#fff}
.pk-f input:focus,.pk-f select:focus{border-color:var(--brand)}
/* 原生下拉空态「请选择」置灰（对齐商耘；不能把 background 写成简写，否则会重置自绘箭头） */
.f select:has(option[value=""]:checked),.pick-filter select:has(option[value=""]:checked){color:var(--text-3)}
.tbl td input[type=checkbox],.tbl th input[type=checkbox]{width:15px;height:15px;accent-color:var(--brand);cursor:pointer;vertical-align:middle}
.tbl tbody tr.pk-dis{background-color:#FAFAFA}
.tbl tbody tr.pk-dis td{color:var(--text-3)}
.pick-page{display:flex;align-items:center;gap:6px;font-size:14px;color:var(--text-2);padding:8px 0}
.pick-sel{font-size:14px;color:var(--text-2);border-top:1px solid var(--border);padding-top:9px;margin-top:4px}
.pick-sel b{color:var(--brand);font-size:15px}
.pick-names{color:var(--text-3);margin-left:6px;font-size:12px}
.tbl tbody tr.pk-on{background:#F0F5FF}
.tbl tbody tr.pk-on td:first-child{box-shadow:inset 3px 0 0 var(--brand)}

/* 操作列：按钮文字不换行、完整显示 */
.tbl th:last-child,.tbl td:last-child{white-space:nowrap}

/* ---------- 库存流水明细页（库存明细 → 流水 抽屉「查看完整流水」）---------- */
/* 只读提示条：流水系统自动记录，不可改删 */
.rolock{margin:0 0 12px;padding:8px 12px;background:#F5F8FF;border:1px solid #E9F0FF;border-radius:4px;
  font-size:12px;color:#4E5969}
.rolock b{color:#1D2129}
/* 筛选行：日期范围 + 变动类型（32px 下拉，自绘箭头）+ 关联单据号 + 重置图标 */
.flt{display:flex;flex-wrap:wrap;align-items:center;gap:8px;margin-bottom:14px}
.flt-l{font-size:14px;color:#4E5969;white-space:nowrap}
.flt input,.flt select{height:32px;border:1px solid #D2DDF8;border-radius:4px;font-size:14px;color:#1D2129;
  background-color:#fff;outline:none;box-sizing:border-box}
.flt input{padding:0 12px}
.flt select{padding:0 28px 0 12px;min-width:120px}
.flt input:focus,.flt select:focus{border-color:var(--brand)}
.flt .flt-txt{width:200px}

/* ---------- 项目管理侧 · 项目详情页（《项目管理》对接需求 三、入口点说明）---------- */
.proj-head{display:flex;align-items:flex-start;justify-content:space-between;gap:16px;margin-bottom:12px}
.proj-head h2{display:flex;align-items:center;gap:8px;font-size:20px;font-weight:600}
.proj-head .pd{font-size:12px;color:var(--text-3);margin-top:4px}
/* 项目操作区：普通操作按钮 + 快捷入口（采购物品/领用物品/调拨物品/承租物品） */
.proj-acts{display:flex;flex-wrap:wrap;align-items:center;gap:8px;padding:12px;margin-bottom:14px;
  background:#fff;border:1px solid var(--border);border-radius:6px}
.proj-acts .qk-sep{width:1px;height:20px;background:var(--border);margin:0 4px}
/* 快捷入口自成一组：4 个按钮不拆行 */
.proj-acts .qk-grp{display:inline-flex;align-items:center;gap:8px}
.qk{display:inline-flex;align-items:center;gap:6px;height:32px;padding:0 12px;border-radius:var(--radius);
  border:1px solid var(--brand);background:#F5F8FF;color:var(--brand);font-size:14px;font-weight:500;
  transition:background .15s,border-color .15s}
.qk:hover{background:#E8F2FF}
.qk .qi{display:inline-flex;width:14px;height:14px}
.qk .qi svg{width:14px;height:14px}
.qk.dis{border-color:#D2DDF8;background:#F7F8FA;color:var(--text-3);font-weight:400}
.qk.dis:hover{background:#F2F3F5}
/* 项目详情页卡片：主页签 + 单据子页签 + 单据列表 */
.pcard{background:#fff;border:1px solid var(--border);border-radius:6px;padding-bottom:16px}
.ptabs{display:flex;gap:26px;padding:0 16px;border-bottom:1px solid var(--border);overflow-x:auto}
.ptab{height:48px;line-height:48px;font-size:14px;color:var(--text-2);white-space:nowrap;cursor:pointer;
  border-bottom:2px solid transparent;margin-bottom:-1px}
.ptab:hover{color:var(--brand)}
.ptab.cur{color:var(--brand);font-weight:600;border-bottom-color:var(--brand)}
.subtabs{display:flex;gap:22px;padding:0 16px;border-bottom:1px solid var(--border)}
.subtab{height:44px;line-height:44px;font-size:14px;color:var(--text-2);cursor:pointer;
  border-bottom:2px solid transparent;margin-bottom:-1px}
.subtab:hover{color:var(--brand)}
.subtab.cur{color:var(--brand);font-weight:600;border-bottom-color:var(--brand)}
.ptab-body{padding:14px 16px 0}
