/* =================  聚合支付平台 前台/后台 通用样式  ================= */
/* 风格：商务蓝白，克制、无渐变发光、无 emoji                  */

:root{
  --blue:#1f6feb;
  --blue-dark:#1a5fd0;
  --blue-bg:#f5f8fd;
  --line:#e3e8f0;
  --text:#1f2633;
  --mute:#7c8798;
  --ok:#16a34a;
  --warn:#d97706;
  --err:#dc2626;
  --radius:6px;
}
*{box-sizing:border-box;margin:0;padding:0}
body{font-family:-apple-system,"Segoe UI","PingFang SC","Microsoft YaHei",sans-serif;background:var(--blue-bg);color:var(--text);font-size:14px;line-height:1.6}
a{color:var(--blue);text-decoration:none}
a:hover{text-decoration:underline}
table{border-collapse:collapse;width:100%}

/* ---------- 通用 ---------- */
.container{max-width:1100px;margin:0 auto;padding:0 16px}
.mute{color:var(--mute)}
.center{text-align:center}
.ui-btn{display:inline-block;padding:8px 18px;background:#fff;border:1px solid var(--line);border-radius:var(--radius);font-size:14px;color:#333;cursor:pointer;text-decoration:none}
.ui-btn:hover{text-decoration:none;border-color:var(--blue);color:var(--blue)}
.ui-btn.primary{background:var(--blue);border-color:var(--blue);color:#fff}
.ui-btn.primary:hover{background:var(--blue-dark);color:#fff}
.ui-btn.danger{background:var(--err);border-color:var(--err);color:#fff}
.ui-btn.sm{padding:4px 10px;font-size:13px}
.ui-field{margin-bottom:14px}
.ui-field label{display:block;margin-bottom:6px;color:#555;font-size:13px}
.ui-field input,.ui-field select,.ui-field textarea{width:100%;padding:8px 10px;border:1px solid var(--line);border-radius:var(--radius);background:#fff;font-size:14px}
.ui-field input:focus,.ui-field select:focus,.ui-field textarea:focus{outline:none;border-color:var(--blue)}
.ui-grid{display:grid;gap:16px}
.ui-grid.two{grid-template-columns:1fr 1fr}
.ui-grid.three{grid-template-columns:1fr 1fr 1fr}
.ui-row{margin-top:16px}
.ui-alert{padding:10px 14px;border-radius:var(--radius);margin-bottom:14px;font-size:13px}
.ui-alert.danger{background:#fdeeee;color:var(--err);border:1px solid #f5c2c2}
.ui-alert.ok{background:#f0fdf4;color:var(--ok);border:1px solid #b8e8c6}
.ui-badge{display:inline-block;padding:2px 8px;border-radius:3px;font-size:12px}
.ui-badge.ok{background:#e8f7ee;color:var(--ok)}
.ui-badge.warn{background:#fef3e2;color:var(--warn)}
.ui-badge.err{background:#fdeeee;color:var(--err)}
.ui-badge.mute{background:#eef1f6;color:var(--mute)}

/* ---------- 数据表 ---------- */
.tbl{background:#fff;border:1px solid var(--line);border-radius:var(--radius)}
.tbl th{background:#f2f5fa;color:#4a5568;font-weight:600;padding:10px 12px;border-bottom:1px solid var(--line);text-align:left;font-size:13px;white-space:nowrap}
.tbl td{padding:10px 12px;border-bottom:1px solid #f2f5fa;font-size:13px}
.tbl tr:last-child td{border-bottom:none}
.tbl tr:hover td{background:#fafcff}

/* ---------- 前台顶栏 ---------- */
.site-head{background:#fff;border-bottom:1px solid var(--line)}
.site-head .inner{max-width:1100px;margin:0 auto;padding:12px 16px;display:flex;align-items:center;gap:22px}
.site-head .logo{font-size:18px;font-weight:700;color:var(--blue-dark)}
.site-head .logo b{color:var(--blue)}
.site-head nav{margin-left:auto;display:flex;gap:4px;align-items:center}
.site-head nav a{color:#3b4453;padding:6px 12px;border-radius:var(--radius);font-size:14px}
.site-head nav a:hover{background:var(--blue-bg);color:var(--blue);text-decoration:none}
.site-head nav a.on{color:var(--blue);font-weight:600}
.foot{margin:40px 0 24px;text-align:center;color:var(--mute);font-size:12px}

/* ---------- 用户中心布局 ---------- */
.user-wrap{display:flex;gap:18px;align-items:flex-start;margin-top:20px}
.user-side{width:200px;flex:none;background:#fff;border:1px solid var(--line);border-radius:var(--radius);overflow:hidden}
.user-side .me{padding:18px 16px;border-bottom:1px solid var(--line)}
.user-side .me .av{width:46px;height:46px;border-radius:50%;background:var(--blue);color:#fff;display:flex;align-items:center;justify-content:center;font-size:18px;font-weight:600}
.user-side .me .nm{margin-top:8px;font-weight:600}
.user-side .me .gr{font-size:12px;color:var(--mute)}
.user-side .menu a{display:block;padding:10px 16px;color:#3b4453;font-size:13px;border-left:3px solid transparent}
.user-side .menu a:hover{background:var(--blue-bg);color:var(--blue);text-decoration:none}
.user-side .menu a.on{background:var(--blue-bg);color:var(--blue);border-left-color:var(--blue);font-weight:600}
.user-body{flex:1;min-width:0}
.card{background:#fff;border:1px solid var(--line);border-radius:var(--radius);padding:18px;margin-bottom:16px}
.card h3{font-size:15px;margin-bottom:14px;padding-bottom:10px;border-bottom:1px solid var(--line);color:var(--blue-dark)}
.card-title{font-size:15px;font-weight:600;margin-bottom:14px}
.stat-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:14px;margin-bottom:16px}
.stat-card{background:#fff;border:1px solid var(--line);border-radius:var(--radius);padding:14px 16px}
.stat-card .t{font-size:12px;color:var(--mute)}
.stat-card .n{font-size:20px;font-weight:700;margin-top:4px}
.stat-card .n.blue{color:var(--blue)}

/* ---------- 收银台 ---------- */
.cashier{display:grid;grid-template-columns:1fr 340px;gap:20px;align-items:start;margin-top:20px}
.order-panel{}
.order-amount{background:#f7fafd;border:1px solid var(--line);border-radius:var(--radius);padding:18px;text-align:center;margin-bottom:16px}
.order-amount .l{color:var(--mute);font-size:13px}
.order-amount .num{font-size:34px;font-weight:700;color:var(--blue-dark);margin-top:4px}
.pay-types{display:grid;grid-template-columns:repeat(3,1fr);gap:10px}
.pay-type{border:1px solid var(--line);border-radius:var(--radius);padding:12px;cursor:pointer;text-align:center;background:#fff}
.pay-type.on{border-color:var(--blue);box-shadow:0 0 0 1px var(--blue);background:#f4f8ff}
.pay-type .pt{font-weight:600;font-size:14px}
.pay-type .ps{font-size:12px;color:var(--mute);margin-top:2px}

/* ---------- 支付扫码 ---------- */
.scan-box{max-width:420px;margin:30px auto;background:#fff;border:1px solid var(--line);border-radius:8px;padding:24px;text-align:center}
.scan-box .qr{border:1px solid var(--line);display:inline-block;padding:10px;background:#fff;margin:14px 0}
.scan-box .status{font-size:15px;font-weight:600}
.scan-box .st-sub{color:var(--mute);font-size:13px;margin-top:4px}
.amount-big{font-size:28px;font-weight:700;color:var(--blue-dark)}

/* ---------- 安装向导 ---------- */
.install-page{background:#eef2f8;padding:40px 10px}
.install-box{max-width:560px;margin:0 auto;background:#fff;border:1px solid var(--line);border-radius:8px;padding:28px}
.install-box h1{font-size:20px;color:var(--blue-dark);margin-bottom:6px}
.install-box h2{font-size:15px;margin:6px 0 12px;color:#333}
.install-box h2.sep{margin-top:20px;border-top:1px solid var(--line);padding-top:16px}
.install-head{padding-bottom:16px;border-bottom:1px solid var(--line);margin-bottom:18px}
.install-success{text-align:center;padding:20px 0}
.ok-ico{width:52px;height:52px;border-radius:50%;background:var(--ok);color:#fff;font-size:26px;display:flex;align-items:center;justify-content:center;margin:0 auto 12px}
.env-list .env-row{display:flex;justify-content:space-between;padding:9px 4px;border-bottom:1px solid #f2f5fa;font-size:14px}
.install-foot{margin-top:22px;text-align:center;font-size:12px}

/* ---------- 后台布局 ---------- */
.admin-body{display:flex;min-height:calc(100vh - 58px)}
.admin-side{width:210px;background:#22303f;flex:none;padding-top:6px}
.admin-side a{display:block;padding:11px 20px;color:#bcc8d6;font-size:13px}
.admin-side a:hover{background:rgba(255,255,255,.06);color:#fff;text-decoration:none}
.admin-side a.on{background:var(--blue);color:#fff;font-weight:600}
.admin-main{flex:1;padding:20px 22px;min-width:0}
.admin-top{background:#fff;border-bottom:1px solid var(--line);padding:11px 20px;display:flex;align-items:center;gap:14px}
.admin-top .t{font-weight:600}
.admin-top .right{margin-left:auto;display:flex;align-items:center;gap:14px;font-size:13px}
.page-title{font-size:16px;font-weight:700;margin-bottom:16px}
.searchbar{display:flex;gap:10px;margin-bottom:16px;align-items:center}
.searchbar input,.searchbar select{padding:7px 10px;border:1px solid var(--line);border-radius:var(--radius);font-size:13px;background:#fff}
.searchbar .grow{flex:1}

.pager{display:flex;gap:8px;margin-top:16px;align-items:center}
.pager a,.pager span{display:inline-block;padding:5px 11px;border:1px solid var(--line);border-radius:var(--radius);background:#fff;font-size:13px}
.pager a:hover{border-color:var(--blue);color:var(--blue);text-decoration:none}
.split-title{margin:20px 0 12px;font-size:14px;color:#333;font-weight:600;border-left:3px solid var(--blue);padding-left:10px}