/* ============================================================
   base.css —— 盛庆和一体化管理平台 业务页面共享样式（4-10 P2-1 提取）
   2026-08-26 建立：8 个业务页（account/baseData/contract/exposure/
   fix/logistics/risk/finance）公共组件样式超集。
   页面特有样式（tabs 变体 / kpi 布局 / 状态标签 / drawer / 图表等）
   保留在各页面内联 <style>，不在此文件。
   修改品牌色/组件样式：改本文件即可全站生效。
   ============================================================ */
:root{
  --brand:#0F6E56; --brand-d:#0B5544; --text:#1a2233; --sub:#5b6472;
  --line:#e3e6eb; --bg:#f5f6f8; --ok:#0F6E56; --warn:#854F0B;
  --danger:#B3261E; --blue:#1D5FA8; --purple:#6B4FA0; --teal:#0E7C86;
}
*{margin:0;padding:0;box-sizing:border-box;}
body{background:var(--bg);font-family:"Microsoft YaHei","PingFang SC",sans-serif;color:var(--text);min-height:100vh;font-size:14px;}

/* ---------- 顶栏 ---------- */
.top{background:#fff;border-bottom:1px solid var(--line);padding:12px 24px;display:flex;align-items:center;justify-content:space-between;position:sticky;top:0;z-index:10;}
.brand{display:flex;align-items:center;gap:10px;font-weight:600;font-size:15px;}
.badge{width:30px;height:30px;border-radius:8px;background:var(--brand);color:#fff;display:flex;align-items:center;justify-content:center;font-size:14px;}
.who{font-size:13px;color:var(--sub);display:flex;align-items:center;gap:12px;}
.who a{color:var(--brand);text-decoration:none;}
.wrap{max-width:1280px;margin:20px auto;padding:0 20px;}

/* ---------- 卡片 ---------- */
.card{background:#fff;border:1px solid var(--line);border-radius:12px;overflow:hidden;}
.hint{padding:8px 16px;font-size:12px;color:var(--sub);background:#FAFBFC;border-bottom:1px solid var(--line);}
.hint b{color:var(--text);}

/* ---------- 工具栏 ---------- */
.toolbar{display:flex;align-items:center;justify-content:space-between;gap:10px;padding:12px 16px;border-bottom:1px solid var(--line);flex-wrap:wrap;}
.toolbar .left{display:flex;gap:8px;align-items:center;flex-wrap:wrap;}
.toolbar h2{font-size:15px;}
.toolbar input[type=text]{border:1px solid var(--line);border-radius:6px;padding:7px 10px;font-size:13px;width:220px;outline:none;}
.toolbar input[type=text]:focus{border-color:var(--brand);}
.toolbar input[type=date]{border:1px solid var(--line);border-radius:6px;padding:6px 8px;font-size:12px;background:#fff;}
.toolbar select{border:1px solid var(--line);border-radius:6px;padding:7px 8px;font-size:13px;background:#fff;max-width:260px;}

/* ---------- 按钮 ---------- */
.btn{border:1px solid var(--line);background:#fff;border-radius:6px;padding:7px 14px;font-size:13px;cursor:pointer;color:var(--text);}
.btn:hover{border-color:var(--brand);color:var(--brand);}
.btn.pri,.btn.primary{background:var(--brand);border-color:var(--brand);color:#fff;}
.btn.pri:hover,.btn.primary:hover{background:var(--brand-d);}
.btn.sm{padding:4px 10px;font-size:12px;}
.btn.danger{color:var(--danger);border-color:#E5C0BE;}
.btn.danger:hover{background:#FBE9E7;border-color:var(--danger);}
.btn.warn{color:var(--warn);border-color:#E8D5B0;}
.btn.blue{color:var(--blue);border-color:#C5D7EA;}
.btn:disabled{opacity:.5;cursor:not-allowed;}
.ops{display:flex;gap:6px;flex-wrap:wrap;}

/* ---------- 表格 ---------- */
table{width:100%;border-collapse:collapse;}
th{background:#FAFBFC;font-size:12px;color:var(--sub);font-weight:500;text-align:left;padding:10px 12px;border-bottom:1px solid var(--line);white-space:nowrap;}
td{padding:9px 12px;border-bottom:1px solid #EFF1F4;font-size:13px;vertical-align:middle;}
tr:hover td{background:#F7FAF9;}
.num{text-align:right;font-variant-numeric:tabular-nums;}
.empty{padding:40px;text-align:center;color:var(--sub);font-size:13px;}
.loading{text-align:center;padding:36px;color:var(--sub);font-size:13px;}

/* ---------- 状态标签（基础） ---------- */
.st{display:inline-block;padding:2px 10px;border-radius:10px;font-size:12px;}
.tag{display:inline-block;padding:2px 8px;border-radius:6px;font-size:12px;}

/* ---------- 分页 ---------- */
.pager{display:flex;align-items:center;gap:10px;padding:10px 16px;font-size:12px;color:var(--sub);}
.pager button{border:1px solid var(--line);background:#fff;border-radius:5px;padding:4px 10px;cursor:pointer;font-size:12px;}
.pager button:disabled{opacity:.4;cursor:not-allowed;}

/* ---------- 弹窗 ---------- */
.mask{position:fixed;inset:0;background:rgba(15,23,42,.4);z-index:70;display:none;align-items:flex-start;justify-content:center;padding:48px 16px;overflow:auto;}
.mask.show{display:flex;}
.modal{background:#fff;border-radius:14px;width:100%;max-width:560px;box-shadow:0 12px 40px rgba(15,23,42,.18);}
.modal h3{font-size:16px;margin-bottom:16px;}
.mhead{padding:16px 20px;border-bottom:1px solid var(--line);display:flex;align-items:center;justify-content:space-between;}
.mhead h3{font-size:16px;margin-bottom:0;}
.mclose{cursor:pointer;font-size:20px;color:var(--sub);background:none;border:none;line-height:1;}
.mbody{padding:16px 20px;max-height:70vh;overflow:auto;}
.mfoot{padding:14px 20px;border-top:1px solid var(--line);display:flex;justify-content:flex-end;gap:10px;}
.frow{margin-bottom:12px;}
.frow label{display:block;font-size:12px;color:var(--sub);margin-bottom:5px;}
.frow label b{color:var(--danger);}
.frow input,.frow select{width:100%;border:1px solid var(--line);border-radius:7px;padding:8px 10px;font-size:13px;color:var(--text);outline:none;background:#fff;}
.frow input:focus,.frow select:focus{border-color:var(--brand);}
.frow .tip{font-size:11px;color:var(--sub);margin-top:4px;}
.fgrid{display:grid;grid-template-columns:1fr 1fr;gap:0 14px;}
.grid2{display:grid;grid-template-columns:1fr 1fr;gap:0 14px;}
.grid3{display:grid;grid-template-columns:1fr 1fr 1fr;gap:0 14px;}
.mbtns{display:flex;justify-content:flex-end;gap:10px;margin-top:18px;}

/* ---------- Toast ---------- */
.toast{position:fixed;top:18px;left:50%;transform:translateX(-50%);background:#1F2937;color:#fff;padding:9px 18px;border-radius:8px;font-size:13px;opacity:0;transition:opacity .25s;z-index:99;pointer-events:none;}
.toast.show{opacity:1;}
.toast.err{background:var(--danger);}

/* ---------- 其他 ---------- */
.check{width:15px;height:15px;accent-color:var(--brand);cursor:pointer;}
@media (max-width:900px){ .kpis{grid-template-columns:repeat(2,1fr);} .fgrid{grid-template-columns:1fr;} .grid2{grid-template-columns:1fr;} .grid3{grid-template-columns:1fr;} }