/* ============================================================
   admin.css —— 运营后台布局
   ------------------------------------------------------------
   和客户端同一套 token（base.css），但密度更高：
   客户端是给客户慢慢看的，后台是给自己人一屏扫完的。
   字号 13px 基准、行高 1.5、表格行高 34px。
   刻意做得「没那么好看」—— 后台好看不是优点，一眼看出哪一单要黄了才是。
   ============================================================ */

:root{ --fs:13px; --ah-nav:224px; --ah-top:52px; }

html,body{height:100%}
body{overflow:hidden;background:var(--bg)}

/* ---------------- 顶栏 ---------------- */
.ah-top{
  height:var(--ah-top);flex:none;background:#fff;border-bottom:1px solid var(--line);
  display:flex;align-items:center;padding:0 18px;gap:14px;position:relative;z-index:30;
}
.ah-top .brand{display:flex;align-items:center;gap:8px;font-weight:700;font-size:14px;letter-spacing:-.2px}
.ah-top .brand i{width:19px;height:19px;border-radius:5px;background:var(--t1);display:block;position:relative}
.ah-top .brand i::after{content:'';position:absolute;inset:5px;border:1.6px solid #fff;border-radius:2px}
.ah-top .brand em{
  font-style:normal;font-size:10px;font-weight:600;letter-spacing:.06em;color:var(--t3);
  padding:2px 6px;border-radius:4px;background:var(--line2);margin-left:2px;
}
.ah-top .crumb{font-size:12px;color:var(--t3);display:flex;align-items:center;gap:7px}
.ah-top .crumb b{color:var(--t1);font-weight:600}
.ah-top .sp{flex:1}
.ah-top .q{
  display:flex;align-items:center;gap:6px;height:30px;padding:0 10px;border:1px solid var(--line);
  border-radius:7px;background:var(--bg);color:var(--t3);font-size:12px;min-width:210px;
}
.ah-top .q kbd{
  margin-left:auto;font-family:inherit;font-size:10px;padding:1px 5px;border-radius:4px;
  background:#fff;border:1px solid var(--line);color:var(--t3);
}
.ah-top .who{display:flex;align-items:center;gap:8px;padding-left:14px;border-left:1px solid var(--line)}
.ah-top .who .av{
  width:27px;height:27px;border-radius:50%;background:var(--t1);color:#fff;
  display:flex;align-items:center;justify-content:center;font-size:12px;font-weight:600;
}
.ah-top .who .nm{font-size:12px;line-height:1.25}
.ah-top .who .nm b{display:block;font-weight:600}
.ah-top .who .nm span{color:var(--t3);font-size:10.5px}

/* ---------------- 骨架 ---------------- */
.ah-wrap{display:grid;grid-template-columns:var(--ah-nav) minmax(0,1fr);height:calc(100vh - var(--ah-top))}

.ah-nav{
  background:#fff;border-right:1px solid var(--line);overflow-y:auto;
  padding:12px 0 30px;display:flex;flex-direction:column;gap:2px;
}
.ah-nav .grp{
  padding:14px 16px 6px;font-size:10px;color:var(--t3);letter-spacing:.09em;font-weight:600;
}
.ah-nav .grp:first-child{padding-top:2px}
.ah-nav a{
  display:flex;align-items:center;gap:9px;padding:7px 16px;font-size:12.5px;color:var(--t2);
  cursor:pointer;position:relative;text-decoration:none;border-radius:0;
}
.ah-nav a:hover{background:#FAFBFC;color:var(--t1)}
.ah-nav a.on{background:var(--blue-l);color:var(--blue);font-weight:600}
.ah-nav a.on::before{content:'';position:absolute;left:0;top:0;bottom:0;width:2.5px;background:var(--blue)}
.ah-nav a .ic{
  width:16px;text-align:center;flex:none;font-size:11px;color:var(--t3);
  font-variant-numeric:tabular-nums;
}
.ah-nav a.on .ic{color:var(--blue)}
.ah-nav a .n{
  margin-left:auto;font-size:10.5px;font-weight:600;padding:0 5px;border-radius:9px;
  background:var(--dan);color:#fff;min-width:16px;text-align:center;line-height:16px;
}
.ah-nav a .n.w{background:var(--warn)}
.ah-nav a .n.g{background:var(--line2);color:var(--t3)}
.ah-nav .foot{
  margin-top:auto;padding:12px 14px 0;border-top:1px solid var(--line2);
  font-size:10.5px;color:var(--t3);line-height:1.65;
}
.ah-nav .foot a{display:flex;width:fit-content;padding:3px 8px;border:1px solid var(--line);border-radius:5px;
  font-size:10px;color:var(--t2);margin-top:6px;gap:4px;background:#fff}
.ah-nav .foot a:hover{border-color:var(--blue);color:var(--blue);background:var(--blue-l)}

.ah-main{overflow-y:auto;padding:22px 26px 80px;min-height:0}
.ah-mx{max-width:1180px;margin:0 auto}

/* ---------------- 页头 ---------------- */
.ah-hd{display:flex;align-items:flex-start;gap:14px;margin-bottom:16px}
.ah-hd h1{font-size:18px;font-weight:700;letter-spacing:-.3px;line-height:1.3}
.ah-hd .sub{font-size:11.5px;color:var(--t3);margin-top:3px;line-height:1.6}
.ah-hd .sp{flex:1}
.ah-hd .acts{display:flex;gap:7px;flex:none;padding-top:2px}

/* ---------------- 按钮 ---------------- */
.bt{
  display:inline-flex;align-items:center;gap:5px;height:29px;padding:0 11px;border-radius:6px;
  border:1px solid var(--line);background:#fff;font-size:12px;color:var(--t2);cursor:pointer;
  white-space:nowrap;transition:.12s;
}
.bt:hover{border-color:#C9CDD4;color:var(--t1)}
.bt.pri{background:var(--blue);border-color:var(--blue);color:#fff;font-weight:500}
.bt.pri:hover{background:var(--blue-d);border-color:var(--blue-d);color:#fff}
.bt.dan{background:var(--dan);border-color:var(--dan);color:#fff}
.bt.dan:hover{background:#B42318;color:#fff}
.bt.sm{height:25px;padding:0 9px;font-size:11.5px}
.bt.ghost{border-color:transparent;background:transparent}
.bt.ghost:hover{background:var(--line2)}
.bt:disabled,.bt[aria-disabled="true"]{
  opacity:.45;cursor:not-allowed;pointer-events:none;
}
/* 「通过」这个动作在 N 类上不存在 —— 不是置灰，是整颗按钮不渲染。
   这里留一个类只为对比演示：静态图上能看出「有按钮但点不动」和
   「根本没有按钮」的区别。 */
.bt.gone{display:none}

/* ---------------- KPI ---------------- */
.kpis{display:grid;grid-template-columns:repeat(auto-fit,minmax(148px,1fr));gap:10px;margin-bottom:16px}
.kpi{
  background:#fff;border:1px solid var(--line);border-radius:9px;padding:12px 14px;position:relative;
}
.kpi .k{font-size:11px;color:var(--t3);letter-spacing:.02em;display:flex;align-items:center;gap:4px}
.kpi .v{font-size:23px;font-weight:700;letter-spacing:-.6px;line-height:1.35;font-variant-numeric:tabular-nums}
.kpi .v small{font-size:12px;font-weight:500;color:var(--t3);letter-spacing:0;margin-left:2px}
.kpi .d{font-size:10.5px;color:var(--t3);line-height:1.5;margin-top:2px}
.kpi.hot{border-color:#F5C2BE;background:linear-gradient(180deg,#FFF8F7,#fff)}
.kpi.hot .v{color:var(--dan)}
.kpi.warm .v{color:var(--warn)}
.kpi.ok .v{color:var(--ok)}

/* ---------------- 卡片 ---------------- */
.bx{background:#fff;border:1px solid var(--line);border-radius:9px;margin-bottom:14px;overflow:hidden}
.bx>h3{
  display:flex;align-items:center;gap:8px;padding:11px 14px;border-bottom:1px solid var(--line2);
  font-size:12.5px;font-weight:600;
}
.bx>h3 .sp{flex:1}
.bx>h3 .hint{font-size:10.5px;color:var(--t3);font-weight:400}
.bx>h3 .cnt{font-size:10.5px;font-weight:600;padding:1px 6px;border-radius:9px;background:var(--line2);color:var(--t2)}
.bx .bd{padding:13px 14px}
.bx .bd.tight{padding:0}
.bx .ft{padding:9px 14px;border-top:1px solid var(--line2);background:#FCFCFD;font-size:11px;color:var(--t3);line-height:1.65}

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

/* ---------------- 表格 ---------------- */
.tb{width:100%;border-collapse:collapse;font-size:12px}
.tb th{
  text-align:left;font-weight:500;color:var(--t3);font-size:10.5px;letter-spacing:.03em;
  padding:7px 12px;border-bottom:1px solid var(--line);background:#FCFCFD;white-space:nowrap;
}
.tb td{padding:8px 12px;border-bottom:1px solid var(--line2);vertical-align:middle;line-height:1.5}
.tb tr:last-child td{border-bottom:0}
.tb tbody tr:hover{background:#FAFBFC}
.tb td.r,.tb th.r{text-align:right}
.tb td.c,.tb th.c{text-align:center}
.tb .nm{font-weight:600;color:var(--t1)}
.tb .sm{font-size:10.5px;color:var(--t3)}
.tb .num{font-variant-numeric:tabular-nums;font-weight:600}
.tb .mono{font-size:10.5px;color:var(--t2)}
.tb tr.click{cursor:pointer}
.tb tr.hl{background:var(--blue-l)}
.tb tr.hl:hover{background:var(--blue-l)}
.tb tr.dn{background:#FFF7F6}
.tb tr.dn:hover{background:#FFF7F6}

/* ---------------- 状态点 ---------------- */
.dot{display:inline-flex;align-items:center;gap:5px;font-size:11.5px;white-space:nowrap}
.dot::before{content:'';width:6px;height:6px;border-radius:50%;background:var(--t3);flex:none}
.dot.ok::before{background:var(--ok)}
.dot.blue::before{background:var(--blue)}
.dot.warn::before{background:var(--warn)}
.dot.dan::before{background:var(--dan)}
.dot.gray::before{background:var(--t3)}
.dot.pulse::before{box-shadow:0 0 0 3px var(--dan-l)}

/* ---------------- 待办行 ---------------- */
.tdl{display:flex;gap:11px;padding:11px 14px;border-bottom:1px solid var(--line2);cursor:pointer}
.tdl:last-child{border-bottom:0}
.tdl:hover{background:#FAFBFC}
.tdl .lv{
  flex:none;width:3px;border-radius:2px;background:var(--line);margin:2px 0;
}
.tdl .lv.high{background:var(--dan)}
.tdl .lv.mid{background:var(--warn)}
.tdl .lv.low{background:var(--line)}
.tdl .mn{flex:1;min-width:0}
.tdl .t{font-size:12.5px;font-weight:600;line-height:1.45;display:flex;align-items:center;gap:7px}
.tdl .t .no{font-weight:400;font-size:10.5px;color:var(--t3)}
.tdl .w{font-size:11.5px;color:var(--t2);line-height:1.6;margin-top:3px}
.tdl .c{
  font-size:11px;color:var(--dan);line-height:1.6;margin-top:5px;padding:5px 8px;
  background:#FFF7F6;border-radius:5px;border-left:2px solid #F5C2BE;
}
.tdl .c::before{content:'不处理：';font-weight:600}
.tdl .rt{flex:none;display:flex;flex-direction:column;align-items:flex-end;gap:6px;padding-top:1px}
.tdl .rt .own{font-size:10.5px;color:var(--t3)}
.tdl.done{opacity:.45}
.tdl.done .t{text-decoration:line-through}

/* ---------------- 事实审核行 ---------------- */
.rv{border-bottom:1px solid var(--line2);padding:12px 14px}
.rv:last-child{border-bottom:0}
.rv:hover{background:#FCFCFD}
.rv .h{display:flex;align-items:flex-start;gap:8px}
.rv .h .txt{flex:1;font-size:12.5px;line-height:1.55;font-weight:500}
.rv .h .txt em{font-style:normal;background:#FFF8E6;padding:0 2px;border-radius:2px}
.rv .m{display:flex;align-items:center;gap:8px;flex-wrap:wrap;margin-top:6px;font-size:11px;color:var(--t3)}
.rv .why{
  font-size:11.5px;color:var(--t2);line-height:1.65;margin-top:8px;padding:8px 10px;
  background:var(--bg);border-radius:6px;
}
.rv .why b{display:block;color:var(--t1);font-weight:600;margin-bottom:2px}
.rv .ops{display:flex;gap:6px;margin-top:9px;align-items:center}
.rv .ops .sp{flex:1}
.rv.back{background:#FAFAFB}
.rv.passed{background:#F6FFF9}

/* ---------------- 提示条 ---------------- */
.bnr{
  display:flex;gap:9px;padding:10px 12px;border-radius:8px;font-size:11.5px;line-height:1.65;
  background:var(--bg);border:1px solid var(--line);color:var(--t2);margin-bottom:14px;
}
.bnr .ic{flex:none;font-weight:700;font-size:12px;color:var(--t3)}
.bnr b{color:var(--t1)}
.bnr.dan{background:#FFF7F6;border-color:#F5C2BE;color:#8A1C13}
.bnr.dan .ic{color:var(--dan)}
.bnr.warn{background:#FFFBF0;border-color:#FAE2B8;color:#7A4B00}
.bnr.warn .ic{color:var(--warn)}
.bnr.ok{background:#F5FFF9;border-color:#BFE9CE;color:#08431F}
.bnr.ok .ic{color:var(--ok)}
.bnr.blue{background:var(--blue-l);border-color:#CBDCFF;color:#0B2C7A}
.bnr.blue .ic{color:var(--blue)}

/* ---------------- 进度 / 条形 ---------------- */
.bar{height:4px;border-radius:3px;background:var(--line2);overflow:hidden;flex:1;min-width:40px}
.bar i{display:block;height:100%;background:var(--blue);border-radius:3px}
.bar i.ok{background:var(--ok)}
.bar i.warn{background:var(--warn)}
.bar i.dan{background:var(--dan)}
.barline{display:flex;align-items:center;gap:8px;font-size:11px;color:var(--t3);font-variant-numeric:tabular-nums}
.barline b{color:var(--t1);font-weight:600;flex:none}

/* ---------------- 键值 ---------------- */
.kvs{display:grid;gap:1px;background:var(--line2);border-radius:7px;overflow:hidden}
.kvs .r{display:flex;justify-content:space-between;gap:12px;padding:7px 11px;background:#fff;font-size:12px}
.kvs .r span{color:var(--t3);flex:none}
.kvs .r b{font-weight:600;text-align:right;font-variant-numeric:tabular-nums}
.kvs .r.hl{background:var(--blue-l)}
.kvs .r.hl b{color:var(--blue)}
.kvs .r.or{background:var(--orange-l)}
.kvs .r.or b{color:var(--orange)}
.kvs .r.dn{background:#FFF7F6}
.kvs .r.dn b{color:var(--dan)}

/* ---------------- 抽屉 ---------------- */
.dw{
  position:fixed;top:var(--ah-top);right:0;bottom:0;width:520px;max-width:92vw;background:#fff;
  border-left:1px solid var(--line);box-shadow:-12px 0 32px rgba(17,24,39,.09);
  z-index:60;display:flex;flex-direction:column;transform:translateX(102%);transition:transform .22s ease;
}
.dw.on{transform:none}
.dw .hh{display:flex;align-items:flex-start;gap:10px;padding:14px 16px;border-bottom:1px solid var(--line)}
.dw .hh h2{font-size:14px;font-weight:700;line-height:1.4}
.dw .hh .sub{font-size:11px;color:var(--t3);margin-top:2px}
.dw .hh .sp{flex:1}
.dw .bb{flex:1;overflow-y:auto;padding:14px 16px 30px}
.dw .mask{position:fixed;inset:0;background:rgba(17,24,39,.18);z-index:55}

/* ---------------- toast ---------------- */
.ts{
  position:fixed;left:50%;bottom:26px;transform:translate(-50%,14px);z-index:90;
  background:#111827;color:#fff;font-size:12px;padding:9px 14px;border-radius:7px;
  opacity:0;pointer-events:none;transition:.2s;max-width:78vw;line-height:1.6;
  box-shadow:0 8px 24px rgba(0,0,0,.18);
}
.ts.on{opacity:1;transform:translate(-50%,0)}
.ts b{color:#fff}
.ts .why{display:block;color:rgba(255,255,255,.62);font-size:11px;margin-top:2px}

/* ---------------- 拖拽（报价页） ---------------- */
.zone{
  border:1px dashed var(--line);border-radius:8px;padding:10px;min-height:72px;background:#FCFCFD;
  transition:.15s;
}
.zone.over{border-color:var(--blue);background:var(--blue-l)}
.zone.no{border-color:var(--dan);background:#FFF7F6}
.zone .zh{font-size:10.5px;color:var(--t3);letter-spacing:.04em;font-weight:600;margin-bottom:7px;
  display:flex;align-items:center;gap:6px}
.zone .zh .tag{margin-left:auto}
.drag{cursor:grab}
.drag:active{cursor:grabbing}
.shake{animation:shk .32s}
@keyframes shk{
  0%,100%{transform:translateX(0)}
  22%{transform:translateX(-4px)}
  55%{transform:translateX(4px)}
  78%{transform:translateX(-2px)}
}

/* ---------------- 细枝末节 ---------------- */
.hr{height:1px;background:var(--line2);margin:12px 0}
.sect{font-size:10.5px;color:var(--t3);letter-spacing:.06em;font-weight:600;margin:14px 0 7px}
.sect:first-child{margin-top:0}
.flexrow{display:flex;align-items:center;gap:8px}
.fl{display:flex;align-items:center;gap:6px;font-size:11.5px;color:var(--t2)}
.tiny{font-size:10.5px;color:var(--t3);line-height:1.6}
.chip{
  display:inline-flex;align-items:center;gap:4px;padding:1px 7px;border-radius:5px;
  background:var(--line2);color:var(--t2);font-size:10.5px;white-space:nowrap;
}
.chip.blue{background:var(--blue-l);color:var(--blue)}
.chip.ok{background:var(--ok-l);color:var(--ok)}
.chip.warn{background:var(--warn-l);color:var(--warn)}
.chip.dan{background:var(--dan-l);color:var(--dan)}
.chip.t1{background:#111827;color:#fff}
.link{color:var(--blue);cursor:pointer;text-decoration:none}
.link:hover{text-decoration:underline}
.ellipsis{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}

/* 三步时间线（链接检测） */
.tl{display:flex;align-items:center;gap:4px}
.tl i{width:15px;height:15px;border-radius:50%;display:flex;align-items:center;justify-content:center;
  font-size:9px;font-style:normal;font-weight:700;background:var(--line2);color:var(--t3)}
.tl i.y{background:var(--ok-l);color:var(--ok)}
.tl i.n{background:var(--dan-l);color:var(--dan)}
.tl i.w{background:var(--warn-l);color:var(--warn)}

/* ================= 多角色：权限矩阵与角色徽章 ================= */
.pm{table-layout:fixed}
.pm th:first-child,.pm td:first-child{width:150px}
.pm td.c{padding:6px 4px}
.pm .pm-no{color:#C9CDD4;font-size:12px}
.pm tbody tr:hover{background:var(--blue-l)}

/* 顶栏角色切换：演示用，真实按账号登录 */
.roleSw{
  display:flex;align-items:center;gap:6px;padding:3px 8px 3px 10px;border-radius:7px;
  border:1px solid var(--line);background:#fff;cursor:pointer;font-size:11.5px;color:var(--t2);
  transition:.15s;position:relative;
}
.roleSw:hover{border-color:var(--blue);color:var(--blue)}
.roleSw .kk{font-size:10px;color:var(--t3)}
.roleSw b{color:var(--t1);font-weight:600}
.rolePop{
  position:absolute;top:calc(100% + 8px);right:0;width:330px;background:#fff;
  border:1px solid var(--line);border-radius:10px;box-shadow:0 12px 32px rgba(17,24,39,.14);
  padding:8px;z-index:60;display:none;
}
.rolePop.on{display:block}
.rolePop .grp{padding:8px 8px 4px;font-size:10px;color:var(--t3);letter-spacing:.06em;font-weight:600}
.rolePop a{
  display:flex;align-items:center;gap:8px;padding:7px 9px;border-radius:6px;
  cursor:pointer;font-size:11.5px;color:var(--t1);text-decoration:none;
}
.rolePop a:hover{background:var(--bg)}
.rolePop a.on{background:var(--blue-l);color:var(--blue);font-weight:600}
.rolePop a .av{width:22px;height:22px;border-radius:6px;background:var(--line2);color:var(--t2);
  display:flex;align-items:center;justify-content:center;font-size:10.5px;font-weight:600;flex:none}
.rolePop a.on .av{background:var(--blue);color:#fff}
.rolePop a .k{margin-left:auto;font-size:10px;color:var(--t3);font-weight:400}

/* 顶栏数据态切换：纯演示件，正式环境删除。
   比角色切换更淡 —— 演示控件不该占产品的位置，看的人不该先注意到它。 */
.datSw{
  display:flex;align-items:center;gap:5px;padding:3px 8px;border-radius:6px;
  border:1px dashed var(--line);background:transparent;cursor:pointer;
  font-size:10.5px;color:var(--t4);transition:.15s;
}
.datSw:hover{border-color:#C9CDD4;color:var(--t2)}
.datSw b{font-weight:600;color:var(--t3)}
.datSw.d-empty b{color:var(--t1)}
.datSw.d-load b{color:var(--blue)}
.datSw.d-err b{color:var(--dan)}
.datSw.d-deny b{color:var(--warn)}

/* 伙伴侧：数据边界横幅 */
.bnd{border:1px solid var(--line);border-radius:9px;background:#fff;padding:11px 14px;
  display:flex;gap:10px;align-items:flex-start;margin-bottom:12px}
.bnd .lk{flex:none;font-size:15px;color:var(--t3);line-height:1.3}
.bnd .tx{font-size:11.5px;color:var(--t2);line-height:1.75}
.bnd .tx b{color:var(--t1)}

/* 报价页「两笔相加」这一行：不是漏填，是明确不设这个数。
   用删除线视觉（划线 + 否定词）比写「仅供参考」硬 ——
   「仅供参考」四个字在报价单上没有效力，反而暗示「可以这么算」。 */
.kvs .r.noSum{background:var(--dan-l)}
.kvs .r.noSum span{color:#8F2018}
.kvs .r.noSum b{color:var(--dan);font-weight:600;text-decoration:none;letter-spacing:.02em}