/* ============================================================
   桥程-16 审批流 P1 增强样式 approval-p1.css
   依据：《用友久其内控审批逻辑借鉴与桥云方案 v1.0》P1 #5–#9
   依赖：approval.css（令牌/卡片/表格/弹窗）与 approval-p0.css（分级/状态）
   新增 P1 专属：额度台账、单据算额、标准维护、级数配置、业务状态、收付款计划、消息中心。
   ============================================================ */

/* ===== 1. 通用数字/只读 ===== */
.amt-readonly{background:var(--blue-soft)!important;color:var(--navy);font-weight:700;font-variant-numeric:tabular-nums;cursor:not-allowed;}
.amt-lg{font-size:22px;color:var(--navy);font-weight:700;font-variant-numeric:tabular-nums;}
.sub-bar{display:flex;flex-wrap:wrap;gap:12px;margin:10px 0 4px;font-size:12.5px;color:var(--muted);}
.sub-bar b{color:var(--navy);font-variant-numeric:tabular-nums;}

/* ===== 2. 额度台账 ===== */
.qstat{display:flex;flex-wrap:wrap;gap:10px;margin-bottom:14px;}
.qstat .qs{flex:1;min-width:130px;background:var(--panel);border:1px solid var(--line);border-radius:12px;
  padding:10px 14px;box-shadow:var(--carved-sm);}
.qstat .qs span{display:block;font-size:11.5px;color:var(--muted);}
.qstat .qs b{font-size:20px;color:var(--navy);font-variant-numeric:tabular-nums;}
.qstat .qs b.green{color:var(--green);}
.qstat .qs b.orange{color:#B4560B;}
.qstat .qs b.red{color:var(--red);}
.bar-avail{height:8px;border-radius:4px;background:var(--line);overflow:hidden;margin-top:8px;}
.bar-avail i{display:block;height:100%;background:var(--green);border-radius:4px;}
.quota-ok{color:var(--green);}
.quota-warn{color:#B4560B;}
.quota-over{color:var(--red);font-weight:700;}

/* ===== 3. 单据算额明细 ===== */
.calc-lines{background:var(--blue-soft);border-radius:10px;padding:10px 14px;margin:8px 0;font-size:12.5px;line-height:2;}
.calc-lines .cl{display:flex;justify-content:space-between;gap:10px;border-bottom:1px dashed #C6D4E8;}
.calc-lines .cl:last-child{border-bottom:none;}
.calc-lines .cl b{color:var(--navy);}
.over-box{background:#FBE3E6;border:1px solid var(--red);border-left:4px solid var(--red);border-radius:10px;
  padding:10px 14px;margin:8px 0;font-size:13px;color:#8C1D1D;line-height:1.8;}
.over-box.ok{background:var(--green-soft);border-color:var(--green);border-left-color:var(--green);color:#0F5E33;}

/* ===== 4. 标准维护 ===== */
.demo-flag{display:inline-block;font-size:11px;padding:1px 7px;border-radius:8px;background:var(--amber-soft);color:var(--amber);margin-left:6px;}
.std-unit{font-size:11px;color:var(--muted);}

/* ===== 5. 级数配置 ===== */
.step-opts{display:flex;flex-wrap:wrap;gap:6px;margin-top:4px;}
.step-opts .so{padding:5px 12px;border-radius:14px;border:1px solid var(--line);background:var(--panel);
  color:var(--muted);font-size:12.5px;cursor:pointer;transition:all .18s;}
.step-opts .so:hover{border-color:var(--navy-2);color:var(--navy);}
.step-opts .so.on{background:var(--navy);border-color:var(--navy);color:#fff;font-weight:600;}
.cfg-node{border:1px solid var(--line);border-radius:12px;padding:12px 14px;margin-bottom:10px;background:var(--panel);}
.cfg-node .cn-t{display:flex;align-items:center;gap:10px;font-weight:600;color:var(--navy);font-size:14px;}
.cfg-node .cn-role{font-size:11.5px;color:var(--muted);font-weight:400;}
.step-preview{font-size:12px;color:var(--muted);margin-top:6px;line-height:1.8;}
.step-preview b{color:var(--navy);}
.cfg-legend{font-size:12px;color:var(--muted);line-height:1.9;background:var(--amber-soft);border-radius:10px;
  padding:10px 14px;margin:8px 0 14px;}

/* ===== 6. 业务状态机 ===== */
.bizbar{display:flex;flex-wrap:wrap;align-items:center;gap:10px;}
.bizbtn{border:1px solid var(--navy-2);background:var(--panel);color:var(--navy);padding:6px 14px;border-radius:6px;
  cursor:pointer;font-size:13px;font-family:var(--sans);transition:all .15s;}
.bizbtn:hover{background:var(--navy);color:#fff;}
.bizbtn.warn{border-color:var(--amber);color:var(--amber);}
.bizbtn.danger{border-color:var(--red);color:var(--red);}
.bizbtn.danger:hover{background:var(--red);color:#fff;}

/* ===== 7. 收付款计划 ===== */
.plan-sum{display:flex;flex-wrap:wrap;gap:18px;margin:6px 0 12px;font-size:12.5px;color:var(--muted);}
.plan-sum b{color:var(--navy);font-variant-numeric:tabular-nums;font-size:15px;}
.money-in{color:var(--green);}
.money-out{color:var(--red);}
.plan-state{font-size:11px;padding:1px 8px;border-radius:8px;background:var(--grey-soft);color:var(--muted);}
.plan-state.done{background:var(--green-soft);color:var(--green);}
.plan-state.late{background:#FBE3E6;color:var(--red);}
.plan-state.today{background:var(--amber-soft);color:var(--amber);}

/* ===== 8. 消息中心 ===== */
.bell{position:relative;background:none;border:none;font-size:18px;cursor:pointer;padding:2px 4px;line-height:1;}
.bell .n{position:absolute;top:-4px;right:-6px;min-width:16px;height:16px;border-radius:8px;background:var(--red);
  color:#fff;font-size:10px;line-height:16px;text-align:center;padding:0 4px;font-weight:700;display:none;}
.bell .n.show{display:block;}
.nt-item{display:flex;gap:12px;padding:12px 4px;border-bottom:1px dashed var(--line);align-items:flex-start;}
.nt-item.unread{background:var(--blue-soft);border-radius:10px;padding:12px 12px;}
.nt-item .nt-dot{flex-shrink:0;width:8px;height:8px;border-radius:50%;margin-top:7px;background:#B7C3D4;}
.nt-item.unread .nt-dot{background:var(--red);}
.nt-item .nt-c{flex:1;min-width:0;}
.nt-item .nt-t{font-size:13.5px;color:var(--navy);line-height:1.6;}
.nt-item .nt-meta{font-size:11.5px;color:var(--muted);margin-top:3px;}
.nt-type{display:inline-block;font-size:11px;padding:0 7px;border-radius:7px;background:var(--grey-soft);color:var(--muted);margin-right:6px;vertical-align:1px;}
.nt-type.todo{background:var(--amber-soft);color:var(--amber);}
.nt-type.done{background:var(--green-soft);color:var(--green);}
.nt-type.reject{background:#FBE3E6;color:var(--red);}
.nt-type.warn{background:var(--amber-soft);color:var(--amber);}

@media(max-width:860px){
  .qstat .qs{min-width:calc(50% - 10px);}
  .amt-lg{font-size:18px;}
}