/* ============================================================
   Neutral Glass Design System — 聚合支付平台
   低饱和 / 中性 / 克制的高级液态玻璃（macOS/iOS 原生质感）
   覆盖 Bootstrap 3 类名 + 自定义组件，全站统一
   ============================================================ */

/* ---------- 全局设计变量（中性，暗/亮两套） ---------- */
:root {
  /* 圆角：统一 10-18px，不大小乱跳 */
  --radius-sm: 10px;
  --radius-md: 14px;
  --radius-lg: 18px;
  /* 阴影：柔和，无发光无霓虹 */
  --shadow-1: 0 1px 2px rgba(20,22,26,.06), 0 8px 24px rgba(20,22,26,.08);
  --shadow-2: 0 2px 4px rgba(20,22,26,.08), 0 14px 36px rgba(20,22,26,.14);
  /* 动效：只保留 淡入/上浮/微下沉/微光 */
  --ease: cubic-bezier(.4,0,.2,1);
  --dur: .22s;
  /* 字体：系统字体栈，三级统一字号/字重/行高 */
  --font-body: -apple-system, BlinkMacSystemFont, "Segoe UI", "PingFang SC", "Microsoft YaHei", sans-serif;
  --font-size-title: 16px;
  --font-size-body: 14px;
  --font-size-aux: 12px;
  --font-weight-title: 600;
  --font-weight-body: 400;
  --line-height: 1.6;
}

:root[data-theme="dark"] {
  /* 背景：中性冷灰，无花哨渐变 */
  --bg-base: #131518;
  --bg-gradient: linear-gradient(165deg, #1a1d21 0%, #15171a 55%, #101215 100%);
  /* 玻璃层：半透明白，不带颜色 */
  --glass-bg: rgba(255,255,255,.055);
  --glass-bg-strong: rgba(255,255,255,.09);
  --glass-bg-hover: rgba(255,255,255,.13);
  --glass-border: rgba(255,255,255,.12);
  --glass-border-strong: rgba(255,255,255,.20);
  --glass-shadow: var(--shadow-1);
  --glass-shadow-hover: var(--shadow-2);
  /* 文字：中性灰三级，对比度达标 */
  --text-primary: #e7e9ec;
  --text-secondary: #aab0b8;
  --text-muted: #7a818b;
  /* 主色：单一低饱和冷灰蓝 */
  --accent: #9aa8b8;
  --accent-soft: rgba(154,168,184,.16);
  --accent-soft-strong: rgba(154,168,184,.24);
  --on-accent: #14161a;
  --accent2: var(--accent);
  --accent-gradient: none;
  --accent-glow: none;
  /* 状态色：低饱和，不荧光 */
  --success: #6aa18b;
  --success-soft: rgba(106,161,139,.14);
  --danger: #c46f6f;
  --danger-soft: rgba(196,111,111,.14);
  --warning: #b99144;
  --warning-soft: rgba(185,145,68,.13);
  --info: #7290a8;
  --info-soft: rgba(114,144,168,.14);
  /* 表单 / 表格 / 导航 */
  --input-bg: rgba(255,255,255,.05);
  --input-border: rgba(255,255,255,.14);
  --table-stripe: rgba(255,255,255,.025);
  --table-hover: rgba(255,255,255,.05);
  --code-bg: rgba(0,0,0,.35);
  --navbar-bg: rgba(20,22,26,.72);
  --sidebar-bg: rgba(255,255,255,.03);
}

:root[data-theme="light"] {
  --bg-base: #eceef1;
  --bg-gradient: linear-gradient(165deg, #f2f3f5 0%, #eceef1 55%, #e5e8eb 100%);
  --glass-bg: rgba(255,255,255,.6);
  --glass-bg-strong: rgba(255,255,255,.78);
  --glass-bg-hover: rgba(255,255,255,.92);
  --glass-border: rgba(255,255,255,.92);
  --glass-border-strong: rgba(255,255,255,1);
  --glass-shadow: 0 1px 2px rgba(23,26,31,.05), 0 8px 24px rgba(23,26,31,.10);
  --glass-shadow-hover: 0 2px 4px rgba(23,26,31,.07), 0 14px 36px rgba(23,26,31,.15);
  --text-primary: #23272b;
  --text-secondary: #565c64;
  --text-muted: #858b93;
  --accent: #55677c;
  --accent-soft: rgba(85,103,124,.13);
  --accent-soft-strong: rgba(85,103,124,.20);
  --on-accent: #ffffff;
  --accent2: var(--accent);
  --accent-gradient: none;
  --accent-glow: none;
  --success: #3f7d66;
  --success-soft: rgba(63,125,102,.12);
  --danger: #a8554f;
  --danger-soft: rgba(168,85,79,.12);
  --warning: #96691f;
  --warning-soft: rgba(150,105,31,.12);
  --info: #47627a;
  --info-soft: rgba(71,98,122,.12);
  --input-bg: rgba(255,255,255,.7);
  --input-border: rgba(23,26,31,.14);
  --table-stripe: rgba(23,26,31,.03);
  --table-hover: rgba(23,26,31,.06);
  --code-bg: rgba(0,0,0,.05);
  --navbar-bg: rgba(255,255,255,.62);
  --sidebar-bg: rgba(255,255,255,.5);
}

/* ---------- Reset & Base ---------- */
* { box-sizing: border-box; }
html, body { margin: 0; padding: 0; min-height: 100vh; }
body {
  font-family: var(--font-body);
  background: var(--bg-gradient) fixed;
  background-attachment: fixed;
  color: var(--text-primary);
  font-size: var(--font-size-body);
  line-height: var(--line-height);
  -webkit-font-smoothing: antialiased;
  transition: color var(--dur) var(--ease);
}
a { color: var(--accent); text-decoration: none; transition: all var(--dur) var(--ease); }
a:hover { color: var(--accent2); text-decoration: none; }

.text-muted, .help-block { color: var(--text-muted) !important; }
.text-primary { color: var(--accent) !important; }
.text-success { color: var(--success) !important; }
.text-danger { color: var(--danger) !important; }
.text-warning { color: var(--warning) !important; }
.text-info { color: var(--info) !important; }

code, pre {
  font-family: "Consolas", "Monaco", monospace;
  background: var(--code-bg);
  color: var(--text-primary);
  border-radius: 8px;
}
pre { padding: 14px; border: 1px solid var(--glass-border); }
pre code { background: transparent; padding: 0; }

/* ---------- 动效（克制：仅淡入/上浮/微下沉/微光） ---------- */
@keyframes fadeInUp { from { opacity: 0; transform: translateY(14px); } to { opacity: 1; transform: translateY(0); } }
@keyframes fadeIn { from { opacity: 0; } to { opacity: 1; } }
@keyframes shimmer { 0% { background-position: -200% 0; } 100% { background-position: 200% 0; } }
@keyframes modalIn { from { transform: scale(.97); opacity: 0; } to { transform: scale(1); opacity: 1; } }

body > .container, body > .container-fluid, .main { animation: fadeInUp .4s var(--ease); }

/* ---------- Glass Card (.panel) ---------- */
.panel {
  background: var(--glass-bg);
  backdrop-filter: blur(20px);
  -webkit-backdrop-filter: blur(20px);
  border: 1px solid var(--glass-border);
  border-radius: var(--radius-lg);
  box-shadow: var(--glass-shadow);
  margin-bottom: 20px;
  overflow: hidden;
  transition: all var(--dur) var(--ease);
}
.panel:hover { box-shadow: var(--glass-shadow-hover); border-color: var(--glass-border-strong); }
.panel > .panel-heading {
  background: var(--glass-bg-strong) !important;
  color: var(--text-primary) !important;
  border-bottom: 1px solid var(--glass-border);
  border-radius: calc(var(--radius-lg) - 1px) calc(var(--radius-lg) - 1px) 0 0 !important;
  padding: 14px 18px;
  font-size: var(--font-size-title);
  font-weight: var(--font-weight-title);
}
.panel > .panel-heading b, .panel > .panel-heading i { color: var(--text-primary); }
.panel > .panel-body { padding: 18px; }
.panel > .panel-footer {
  background: transparent;
  border-top: 1px solid var(--glass-border);
  color: var(--text-secondary);
  padding: 12px 18px;
}
.panel-info > .panel-heading { background: var(--info-soft) !important; color: var(--info) !important; }
.panel-success > .panel-heading { background: var(--success-soft) !important; color: var(--success) !important; }
.panel-danger > .panel-heading { background: var(--danger-soft) !important; color: var(--danger) !important; }
.panel-warning > .panel-heading { background: var(--warning-soft) !important; color: var(--warning) !important; }

/* ---------- 按钮（统一一套：玻璃底+半透明边+统一圆角/高度/字号） ----------
   主/次/危险 仅靠 透明度 + 边框 + 文字 区分，不靠花哨颜色填充 */
.btn {
  border-radius: var(--radius-md);
  height: 40px;
  padding: 0 18px;
  font-size: var(--font-size-body);
  font-weight: 500;
  border: 1px solid var(--glass-border);
  background: var(--glass-bg);
  backdrop-filter: blur(12px);
  -webkit-backdrop-filter: blur(12px);
  color: var(--text-primary);
  box-shadow: var(--glass-shadow);
  cursor: pointer;
  outline: none !important;
  /* 统一 flex 对齐：图标 + 文字垂直居中、间距统一，避免错位/大小不一 */
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 6px;
  white-space: nowrap;
  vertical-align: middle;
  transition: all var(--dur) var(--ease);
}
.btn:hover, .btn:focus {
  background: var(--glass-bg-hover);
  border-color: var(--glass-border-strong);
  color: var(--text-primary);
  transform: translateY(-1px);
  box-shadow: var(--glass-shadow-hover);
  outline: none !important;
}
.btn:active { transform: translateY(0) scale(.98); }
.btn[disabled], .btn.disabled { opacity: .5; pointer-events: none; }

/* 主按钮：玻璃底 + 主色边 + 主色文字（略强调） */
.btn-primary, .btn-primary:hover, .btn-primary:focus {
  background: var(--accent-soft);
  border-color: rgba(154,168,184,.35);
  color: var(--accent);
}
:root[data-theme="light"] .btn-primary, :root[data-theme="light"] .btn-primary:hover { border-color: rgba(85,103,124,.35); }
.btn-primary:hover { background: var(--accent-soft-strong); }

/* 成功：低饱和绿文字+淡绿底，不荧光 */
.btn-success, .btn-success:hover, .btn-success:focus { background: var(--success-soft); border-color: rgba(106,161,139,.35); color: var(--success); }
:root[data-theme="light"] .btn-success { border-color: rgba(63,125,102,.35); }

/* 危险：低饱和红文字+淡红底 */
.btn-danger, .btn-danger:hover, .btn-danger:focus { background: var(--danger-soft); border-color: rgba(196,111,111,.35); color: var(--danger); }
:root[data-theme="light"] .btn-danger { border-color: rgba(168,85,79,.35); }

/* 警告 */
.btn-warning, .btn-warning:hover, .btn-warning:focus { background: var(--warning-soft); border-color: rgba(185,145,68,.35); color: var(--warning); }
:root[data-theme="light"] .btn-warning { border-color: rgba(150,105,31,.35); }

/* 信息 */
.btn-info, .btn-info:hover, .btn-info:focus { background: var(--info-soft); border-color: rgba(114,144,168,.35); color: var(--info); }
:root[data-theme="light"] .btn-info { border-color: rgba(71,98,122,.35); }

/* 默认/次按钮 */
.btn-default, .btn-default:hover { background: var(--glass-bg); border-color: var(--glass-border); color: var(--text-primary); }
.btn-default:hover { background: var(--glass-bg-hover); border-color: var(--glass-border-strong); }

/* 尺寸：统一比例，圆角随尺寸微调但不乱 */
.btn-sm { height: 32px; padding: 0 12px; font-size: var(--font-size-aux); border-radius: var(--radius-sm); }
.btn-xs { height: 26px; padding: 0 10px; font-size: var(--font-size-aux); border-radius: 8px; }
.btn-lg { height: 48px; padding: 0 26px; font-size: var(--font-size-title); }
.btn-block { width: 100%; border-radius: var(--radius-md); }

/* ---------- 表单 / 输入 ---------- */
.form-control {
  background: var(--input-bg);
  backdrop-filter: blur(10px);
  -webkit-backdrop-filter: blur(10px);
  border: 1px solid var(--input-border);
  border-radius: var(--radius-md);
  color: var(--text-primary);
  padding: 8px 14px;
  height: auto;
  min-height: 40px;
  box-shadow: none !important;
  transition: all var(--dur) var(--ease);
}
.form-control:focus {
  border-color: var(--accent);
  background: var(--glass-bg-strong);
  box-shadow: 0 0 0 3px var(--accent-soft) !important;
  outline: none;
}
.form-control::placeholder { color: var(--text-muted); }
select.form-control option { background: #1a1d21; color: #e7e9ec; }
:root[data-theme="light"] select.form-control option { background: #fff; color: #23272b; }
.form-group label { color: var(--text-secondary); font-weight: 500; }
.input-group-addon {
  background: var(--glass-bg-strong);
  border: 1px solid var(--input-border);
  border-radius: var(--radius-md) 0 0 var(--radius-md);
  color: var(--text-secondary);
}
.input-group .form-control { border-radius: 0 var(--radius-md) var(--radius-md) 0; }
.input-group .input-group-btn .btn { border-radius: 0 var(--radius-md) var(--radius-md) 0; }
.input-group .input-group-btn + .form-control,
.input-group .form-control:not(:first-child) { border-radius: 0 var(--radius-md) var(--radius-md) 0; }
.input-group .form-control:first-child { border-radius: var(--radius-md) 0 0 var(--radius-md); }
.input-group .input-group-addon + .form-control { border-radius: 0 var(--radius-md) var(--radius-md) 0; }
.form-inline .form-group { margin-right: 10px; margin-bottom: 10px; }
.form-inline .form-control { margin-bottom: 0; }
textarea.form-control { resize: vertical; }
input[type="checkbox"], input[type="radio"] { accent-color: var(--accent); }

/* ---------- 表格 ---------- */
.table { color: var(--text-primary); margin-bottom: 0; }
.table > thead > tr > th {
  background: var(--glass-bg-strong);
  color: var(--text-primary);
  border-bottom: 1px solid var(--glass-border);
  border-top: none;
  font-weight: var(--font-weight-title);
  padding: 12px 14px;
  white-space: nowrap;
}
.table > tbody > tr > td { border-top: 1px solid var(--glass-border); padding: 11px 14px; vertical-align: middle; color: var(--text-primary); }
.table > tbody > tr:nth-child(odd) { background: var(--table-stripe); }
.table > tbody > tr:hover { background: var(--table-hover); }
.table-bordered { border: 1px solid var(--glass-border); border-radius: 0; }
.table-bordered > thead > tr > th, .table-bordered > tbody > tr > th,
.table-bordered > thead > tr > td, .table-bordered > tbody > tr > td { border: 1px solid var(--glass-border); }
.table-responsive { border-radius: var(--radius-md); }

/* ---------- 标签 / 徽章（低饱和，不荧光） ---------- */
.label {
  border-radius: 8px;
  font-weight: 500;
  padding: 3px 10px;
  font-size: var(--font-size-aux);
  background: var(--glass-bg-strong);
  color: var(--text-secondary);
}
.label-success { background: var(--success-soft); color: var(--success); }
.label-danger { background: var(--danger-soft); color: var(--danger); }
.label-warning { background: var(--warning-soft); color: var(--warning); }
.label-info { background: var(--info-soft); color: var(--info); }
.label-default { background: var(--glass-bg-strong); color: var(--text-secondary); }
.label-primary { background: var(--accent-soft); color: var(--accent); border: 1px solid rgba(154,168,184,.35); }
:root[data-theme="light"] .label-primary { border-color: rgba(85,103,124,.35); }
.badge { background: var(--glass-bg-strong); border: 1px solid var(--glass-border); color: var(--text-secondary); border-radius: 10px; padding: 3px 10px; }

/* ---------- 提示 ---------- */
.alert {
  border-radius: var(--radius-md);
  border: 1px solid var(--glass-border);
  background: var(--glass-bg);
  backdrop-filter: blur(10px);
  -webkit-backdrop-filter: blur(10px);
  color: var(--text-primary);
  padding: 12px 16px;
  margin-bottom: 16px;
}
.alert-success { background: var(--success-soft); border-color: rgba(106,161,139,.3); color: var(--success); }
:root[data-theme="light"] .alert-success { border-color: rgba(63,125,102,.3); }
.alert-danger, .alert-error { background: var(--danger-soft); border-color: rgba(196,111,111,.3); color: var(--danger); }
:root[data-theme="light"] .alert-danger, :root[data-theme="light"] .alert-error { border-color: rgba(168,85,79,.3); }
.alert-warning { background: var(--warning-soft); border-color: rgba(185,145,68,.3); color: var(--warning); }
:root[data-theme="light"] .alert-warning { border-color: rgba(150,105,31,.3); }
.alert-info { background: var(--info-soft); border-color: rgba(114,144,168,.3); color: var(--info); }
:root[data-theme="light"] .alert-info { border-color: rgba(71,98,122,.3); }

/* ---------- 导航栏 ---------- */
.navbar-pay, .navbar {
  background: var(--navbar-bg) !important;
  backdrop-filter: blur(20px);
  -webkit-backdrop-filter: blur(20px);
  border: none !important;
  border-bottom: 1px solid var(--glass-border) !important;
  border-radius: 0 !important;
  box-shadow: var(--glass-shadow) !important;
  margin-bottom: 0;
  min-height: 56px;
}
.navbar-pay .navbar-brand, .navbar .navbar-brand { color: var(--text-primary) !important; font-weight: var(--font-weight-title); font-size: 17px; line-height: 24px; padding: 15px 15px; }
.navbar-pay .navbar-brand i, .navbar .navbar-brand i { color: var(--text-primary); }
.navbar-pay .navbar-nav > li > a, .navbar .navbar-nav > li > a { color: var(--text-secondary) !important; transition: color var(--dur); }
.navbar-pay .navbar-nav > li > a:hover, .navbar .navbar-nav > li > a:hover { color: var(--text-primary) !important; background: var(--glass-bg) !important; }
.navbar-pay .user-menu { color: var(--text-secondary) !important; }
.navbar-toggle { border: none !important; }
.navbar-toggle .icon-bar { background: var(--text-primary) !important; }
.dropdown-menu {
  background: var(--glass-bg-strong);
  backdrop-filter: blur(20px);
  -webkit-backdrop-filter: blur(20px);
  border: 1px solid var(--glass-border);
  border-radius: var(--radius-md);
  box-shadow: var(--glass-shadow);
  padding: 8px 0;
}
.dropdown-menu > li > a { color: var(--text-primary); padding: 8px 18px; transition: all var(--dur); }
.dropdown-menu > li > a:hover, .dropdown-menu > li > a:focus { background: var(--glass-bg-hover); color: var(--text-primary); }
.dropdown-menu .divider { background: var(--glass-border); }
.caret { border-top-color: var(--text-secondary) !important; }

/* ---------- 侧栏（商户） ---------- */
.sidebar-nav {
  background: var(--glass-bg);
  backdrop-filter: blur(20px);
  -webkit-backdrop-filter: blur(20px);
  border: 1px solid var(--glass-border);
  border-radius: var(--radius-lg);
  padding: 10px;
  box-shadow: var(--glass-shadow);
  margin-bottom: 16px;
}
.sidebar-nav .list-group { background: transparent; border-radius: var(--radius-md); overflow: hidden; }
.sidebar-nav .list-group-item { background: transparent; border: none; border-left: 3px solid transparent; border-radius: var(--radius-sm); color: var(--text-secondary); padding: 10px 14px; margin-bottom: 2px; transition: all var(--dur); }
.sidebar-nav .list-group-item:hover { background: var(--glass-bg-hover); color: var(--text-primary); }
.sidebar-nav .list-group-item.active { background: var(--accent-soft); border-left-color: var(--accent); color: var(--accent); box-shadow: none; }
.sidebar-nav .list-group-item.active i { color: var(--accent); }
.sidebar-nav .list-group-item i { width: 22px; text-align: center; margin-right: 6px; color: var(--text-muted); }

/* ---------- 管理员顶栏 ---------- */
.topbar {
  background: var(--navbar-bg) !important;
  backdrop-filter: blur(20px);
  -webkit-backdrop-filter: blur(20px);
  border-bottom: 1px solid var(--glass-border);
  color: var(--text-primary) !important;
  padding: 0 20px;
  line-height: 52px;
  height: 52px;
  box-shadow: var(--glass-shadow);
  position: sticky;
  top: 0;
  z-index: 1000;
}
.topbar .brand { font-weight: var(--font-weight-title); font-size: 17px; color: var(--text-primary); }
.topbar .brand i { color: var(--text-primary); }
.topbar .right { float: right; }
.topbar a { color: var(--text-secondary) !important; transition: color var(--dur); }
.topbar a:hover { color: var(--text-primary) !important; }

/* ---------- 管理员侧栏 ---------- */
.sidebar {
  background: var(--sidebar-bg) !important;
  backdrop-filter: blur(20px);
  -webkit-backdrop-filter: blur(20px);
  border-right: 1px solid var(--glass-border);
  min-height: calc(100vh - 52px);
  padding: 10px 0 !important;
}
.sidebar .group-title { font-size: 11px; color: var(--text-muted); padding: 14px 20px 6px; text-transform: uppercase; letter-spacing: 1px; }
.sidebar .list-group-item { background: transparent; border: none; border-left: 3px solid transparent; border-radius: 0 var(--radius-sm) var(--radius-sm) 0; color: var(--text-secondary); padding: 10px 20px; margin: 2px 10px 2px 0; transition: all var(--dur); }
.sidebar .list-group-item:hover { background: var(--glass-bg-hover); color: var(--text-primary); }
.sidebar .list-group-item.active { background: var(--accent-soft); border-left-color: var(--accent); color: var(--accent); box-shadow: none; }
.sidebar .list-group-item.active i { color: var(--accent); }
.sidebar .list-group-item i { width: 20px; text-align: center; margin-right: 5px; color: var(--text-muted); }

.main { padding: 20px; }

/* ---------- 余额卡（中性玻璃，无渐变无发光） ---------- */
.balance-card {
  background: var(--glass-bg-strong) !important;
  backdrop-filter: blur(22px);
  -webkit-backdrop-filter: blur(22px);
  border: 1px solid var(--glass-border-strong);
  border-radius: var(--radius-lg);
  color: var(--text-primary) !important;
  padding: 24px;
  box-shadow: var(--glass-shadow);
  margin-bottom: 16px;
  transition: all var(--dur);
}
.balance-card:hover { transform: translateY(-2px); box-shadow: var(--glass-shadow-hover); }
.balance-card .label { color: var(--text-secondary) !important; font-size: 13px; }
.balance-card .num { font-size: 32px; font-weight: var(--font-weight-title); color: var(--text-primary); margin-top: 4px; }
.balance-card .btn { background: var(--glass-bg); border: 1px solid var(--glass-border); color: var(--text-primary); }
.balance-card .btn:hover { background: var(--glass-bg-hover); color: var(--text-primary); }
.balance-meta { color: var(--text-secondary) !important; font-size: 13px; margin-top: 10px; }
.balance-actions { display: flex; gap: 10px; margin-top: 18px; }
.balance-actions .btn {
  flex: 1;
  height: 40px;
  font-size: 14px;
  border-radius: var(--radius-md);
  padding: 0 8px;
}
.balance-actions .btn i { font-size: 15px; }

/* 快捷金额 / 并排操作按钮：flex 等分，统一高度比例 */
.amount-actions { display: flex; gap: 8px; flex-wrap: wrap; }
.amount-actions .btn {
  flex: 1 1 auto;
  height: 40px;
  min-width: 60px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  font-size: 14px;
  border-radius: var(--radius-md);
  padding: 0 10px;
}
.amount-actions .btn-sm { height: 40px; }
@media (max-width: 420px) {
  .amount-actions .btn { min-width: 46px; padding: 0 6px; font-size: 13px; }
}

/* ---------- 统计卡（文字居中：两列卡片各自居中，消除中间大空隙/偏移） ---------- */
.stat-card {
  background: var(--glass-bg) !important;
  backdrop-filter: blur(20px);
  -webkit-backdrop-filter: blur(20px);
  border: 1px solid var(--glass-border);
  border-radius: var(--radius-lg);
  padding: 16px 12px;
  box-shadow: var(--glass-shadow);
  margin-bottom: 16px;
  text-align: center;
  transition: all var(--dur) var(--ease);
}
.stat-card:hover { transform: translateY(-2px); box-shadow: var(--glass-shadow-hover); border-color: var(--glass-border-strong); }
.stat-card .label { font-size: 13px; color: var(--text-secondary); display: block; }
.stat-card .value { font-size: 24px; font-weight: var(--font-weight-title); color: var(--text-primary); margin-top: 6px; }
.stat-card .text-muted { font-size: var(--font-size-aux); margin-top: 4px; display: block; }

/* ---------- 页脚 ---------- */
.footer { color: var(--text-muted); text-align: center; padding: 24px 0; font-size: var(--font-size-aux); }

/* ---------- 分页 ---------- */
.pagination { margin: 0; display: flex; justify-content: center; gap: 4px; }
.pagination > li > a, .pagination > li > span { background: var(--glass-bg); border: 1px solid var(--glass-border); color: var(--text-primary); border-radius: var(--radius-sm); padding: 6px 14px; transition: all var(--dur); }
.pagination > li > a:hover { background: var(--glass-bg-hover); border-color: var(--accent); color: var(--accent); }
.pagination > li.active > a, .pagination > li.active > span { background: var(--accent-soft) !important; border-color: var(--accent) !important; color: var(--accent) !important; }
.pagination > li:first-child > a, .pagination > li:first-child > span { border-radius: var(--radius-sm) 0 0 var(--radius-sm); }
.pagination > li:last-child > a, .pagination > li:last-child > span { border-radius: 0 var(--radius-sm) var(--radius-sm) 0; }

/* ---------- Tabs ---------- */
.nav-tabs { border-bottom: 1px solid var(--glass-border); }
.nav-tabs > li > a { color: var(--text-secondary); border: none; border-radius: var(--radius-sm) var(--radius-sm) 0 0; transition: all var(--dur); }
.nav-tabs > li > a:hover { background: var(--glass-bg); border-color: transparent; color: var(--text-primary); }
.nav-tabs > li.active > a, .nav-tabs > li.active > a:hover, .nav-tabs > li.active > a:focus { color: var(--accent); background: var(--glass-bg-strong); border: none; border-bottom: 2px solid var(--accent); border-radius: var(--radius-sm) var(--radius-sm) 0 0; }
.nav-pills > li > a { color: var(--text-secondary); border-radius: var(--radius-sm); }
.nav-pills > li.active > a, .nav-pills > li.active > a:hover { background: var(--accent-soft); border-radius: var(--radius-sm); color: var(--accent); }

/* ---------- 弹窗 ---------- */
.modal-content {
  background: var(--glass-bg-strong);
  backdrop-filter: blur(24px);
  -webkit-backdrop-filter: blur(24px);
  border: 1px solid var(--glass-border-strong);
  border-radius: var(--radius-lg);
  box-shadow: var(--glass-shadow-hover);
  color: var(--text-primary);
  animation: modalIn var(--dur) var(--ease);
}
.modal-header { border-bottom: 1px solid var(--glass-border); }
.modal-header .close { color: var(--text-secondary); opacity: .7; text-shadow: none; }
.modal-header .close:hover { color: var(--text-primary); opacity: 1; }
.modal-title { color: var(--text-primary); }
.modal-body { color: var(--text-primary); }
.modal-footer { border-top: 1px solid var(--glass-border); }
.modal-backdrop.in { opacity: .32; }

/* ---------- 登录 / 认证页 ---------- */
.login-wrap, .reg-wrap, .wrap, .login {
  background: var(--glass-bg-strong) !important;
  backdrop-filter: blur(24px);
  -webkit-backdrop-filter: blur(24px);
  border: 1px solid var(--glass-border-strong);
  border-radius: var(--radius-lg) !important;
  box-shadow: var(--glass-shadow-hover) !important;
  overflow: hidden;
  animation: fadeInUp .5s var(--ease);
}
.login-head, .reg-head, .head {
  background: var(--glass-bg-strong) !important;
  color: var(--text-primary);
  text-align: center;
  padding: 28px 20px;
  border-bottom: 1px solid var(--glass-border);
}
.login-head .logo, .reg-head .logo, .head .logo { font-size: 26px; font-weight: var(--font-weight-title); color: var(--text-primary); }
.login-head .logo i, .reg-head .logo i, .head .logo i { color: var(--accent); }
.login-head .sub { color: var(--text-secondary); font-size: 13px; margin-top: 6px; }
.login-body, .reg-body, .body { padding: 28px 30px 24px; }
.btn-pay {
  background: var(--accent-soft) !important;
  border: 1px solid rgba(154,168,184,.38) !important;
  color: var(--accent) !important;
  height: 46px;
  font-size: var(--font-size-title);
  font-weight: 600;
  border-radius: var(--radius-md) !important;
  backdrop-filter: blur(14px);
  -webkit-backdrop-filter: blur(14px);
  box-shadow: var(--glass-shadow);
  transition: all var(--dur) var(--ease);
}
:root[data-theme="light"] .btn-pay { border-color: rgba(85,103,124,.38); }
.btn-pay:hover { transform: translateY(-1px); background: var(--accent-soft-strong) !important; color: var(--accent) !important; box-shadow: var(--glass-shadow-hover); }
.footer-links a { color: var(--text-secondary) !important; }

/* ---------- 收银台 ---------- */
.cashier {
  background: var(--glass-bg-strong) !important;
  backdrop-filter: blur(24px);
  -webkit-backdrop-filter: blur(24px);
  border: 1px solid var(--glass-border-strong);
  border-radius: var(--radius-lg) !important;
  box-shadow: var(--glass-shadow-hover) !important;
  overflow: hidden;
  animation: fadeInUp .5s var(--ease);
}
.cashier-head {
  background: var(--glass-bg-strong) !important;
  color: var(--text-primary);
  text-align: center;
  padding: 28px;
  border-bottom: 1px solid var(--glass-border);
}
.cashier-head .amt { font-size: 36px; font-weight: var(--font-weight-title); color: var(--text-primary); }
.cashier-head .sub { color: var(--text-secondary); font-size: 13px; margin-top: 6px; }
.cashier-body { padding: 22px 26px; }
.pay-item { display: flex; align-items: center; padding: 14px 16px; border: 1px solid var(--glass-border); border-radius: var(--radius-md); margin-bottom: 12px; cursor: pointer; transition: all var(--dur); background: var(--glass-bg); }
.pay-item:hover { border-color: var(--glass-border-strong); transform: translateY(-1px); background: var(--glass-bg-hover); }
.pay-item.selected { border-color: var(--accent); background: var(--accent-soft); }
.pay-item .icon { font-size: 24px; margin-right: 12px; width: 36px; text-align: center; color: var(--text-secondary); }
.pay-item .label { flex: 1; font-size: 15px; color: var(--text-primary); }
.pay-item .check { color: var(--accent); font-size: 18px; }
.timer { color: var(--danger); font-weight: 700; }
.status-paid { text-align: center; padding: 30px; }
.status-paid .big { font-size: 26px; color: var(--success); font-weight: 700; }

/* ---------- 主题切换按钮（去旋转炫技，仅微动效） ---------- */
.theme-toggle {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 38px;
  height: 38px;
  border-radius: var(--radius-sm);
  background: var(--glass-bg);
  border: 1px solid var(--glass-border);
  color: var(--text-primary);
  cursor: pointer;
  transition: all var(--dur);
  margin-left: 8px;
  font-size: 16px;
}
.theme-toggle:hover { background: var(--glass-bg-hover); transform: translateY(-1px); }

/* ---------- Toast ---------- */
.glass-toast-wrap { position: fixed; top: 20px; right: 20px; z-index: 99999; display: flex; flex-direction: column; gap: 10px; max-width: 360px; }
.glass-toast {
  background: var(--glass-bg-strong);
  backdrop-filter: blur(20px);
  -webkit-backdrop-filter: blur(20px);
  border: 1px solid var(--glass-border-strong);
  border-radius: var(--radius-md);
  padding: 14px 18px;
  box-shadow: var(--glass-shadow);
  color: var(--text-primary);
  display: flex;
  align-items: center;
  gap: 10px;
  animation: fadeInUp var(--dur) var(--ease);
  font-size: var(--font-size-body);
}
.glass-toast.success { border-left: 4px solid var(--success); color: var(--success); }
.glass-toast.error { border-left: 4px solid var(--danger); color: var(--danger); }
.glass-toast.warning { border-left: 4px solid var(--warning); color: var(--warning); }
.glass-toast.info { border-left: 4px solid var(--info); color: var(--info); }
.glass-toast.leaving { opacity: 0; transform: translateY(-10px); transition: all var(--dur); }

/* ---------- 自定义弹窗 ---------- */
.glass-modal-overlay { position: fixed; inset: 0; background: rgba(0,0,0,.4); backdrop-filter: blur(4px); z-index: 99998; display: flex; align-items: center; justify-content: center; opacity: 0; animation: fadeIn .2s forwards; }
.glass-modal {
  background: var(--glass-bg-strong);
  backdrop-filter: blur(24px);
  -webkit-backdrop-filter: blur(24px);
  border: 1px solid var(--glass-border-strong);
  border-radius: var(--radius-lg);
  box-shadow: var(--glass-shadow-hover);
  padding: 28px;
  max-width: 420px;
  width: 90%;
  color: var(--text-primary);
  animation: modalIn var(--dur) var(--ease);
}
.glass-modal .glass-modal-title { font-size: var(--font-size-title); font-weight: var(--font-weight-title); margin-bottom: 12px; }
.glass-modal .glass-modal-body { margin-bottom: 20px; color: var(--text-secondary); line-height: var(--line-height); }
.glass-modal .glass-modal-actions { display: flex; gap: 10px; justify-content: flex-end; }

/* ---------- 页头 / Well ---------- */
.page-header { border-bottom: 1px solid var(--glass-border); margin: 20px 0; padding-bottom: 10px; }
.page-header h1, .page-header h2, .page-header h3 { color: var(--text-primary); font-weight: var(--font-weight-title); }
.well { background: var(--glass-bg); border: 1px solid var(--glass-border); border-radius: var(--radius-md); box-shadow: none; color: var(--text-primary); }

/* ---------- 响应式 ---------- */
@media (max-width: 768px) {
  body { font-size: 13px; }
  .container, .container-fluid { padding-left: 12px; padding-right: 12px; }
  .main { padding: 12px; }
  .stat-card { padding: 14px; }
  .stat-card .value { font-size: 20px; }
  .balance-card { padding: 18px; }
  .balance-card .num { font-size: 26px; }
  .sidebar { min-height: auto; border-right: none; border-bottom: 1px solid var(--glass-border); }
  .cashier { margin: 10px; }
  .login-wrap, .reg-wrap, .wrap, .login { margin: 20px 10px; }
  .table { white-space: nowrap; }
  .table-responsive { overflow-x: auto; }
  .form-inline .form-group { display: block; margin-right: 0; }
  .form-inline .form-control { width: 100%; margin-bottom: 8px; }
  .topbar { padding: 0 12px; }
}

/* ---------- 不支持 backdrop-filter 时的降级（纯色半透明） ---------- */
@supports not (backdrop-filter: blur(20px)) {
  body { background: #15171a fixed; }
  :root[data-theme="light"] body { background: #eceef1 fixed; }
  .panel, .sidebar-nav, .stat-card, .navbar-pay, .navbar, .topbar, .sidebar,
  .login-wrap, .reg-wrap, .wrap, .login, .cashier, .modal-content, .dropdown-menu,
  .alert, .form-control, .btn, .glass-toast, .glass-modal {
    background: rgba(21,23,26,.94) !important;
  }
  :root[data-theme="light"] .panel, :root[data-theme="light"] .sidebar-nav,
  :root[data-theme="light"] .stat-card, :root[data-theme="light"] .navbar-pay,
  :root[data-theme="light"] .navbar, :root[data-theme="light"] .topbar,
  :root[data-theme="light"] .sidebar, :root[data-theme="light"] .login-wrap,
  :root[data-theme="light"] .reg-wrap, :root[data-theme="light"] .wrap,
  :root[data-theme="light"] .login, :root[data-theme="light"] .cashier,
  :root[data-theme="light"] .modal-content, :root[data-theme="light"] .dropdown-menu,
  :root[data-theme="light"] .alert, :root[data-theme="light"] .form-control,
  :root[data-theme="light"] .btn, :root[data-theme="light"] .glass-toast,
  :root[data-theme="light"] .glass-modal { background: rgba(255,255,255,.95) !important; }
}

/* ---------- 右上角抽屉菜单（中性玻璃） ---------- */
.drawer-toggle {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 40px;
  height: 40px;
  margin: 8px 4px 0 0;
  border: 1px solid var(--glass-border);
  border-radius: var(--radius-md);
  background: var(--glass-bg);
  color: var(--text-primary);
  font-size: 18px;
  cursor: pointer;
  float: right;
  transition: all var(--dur) var(--ease);
}
.drawer-toggle:hover { background: var(--glass-bg-hover); border-color: var(--glass-border-strong); }
.nav-drawer-overlay { position: fixed; inset: 0; background: rgba(0,0,0,.35); backdrop-filter: blur(3px); -webkit-backdrop-filter: blur(3px); z-index: 998; opacity: 0; visibility: hidden; transition: opacity var(--dur) ease, visibility var(--dur); }
.nav-drawer-overlay.show { opacity: 1; visibility: visible; }
.nav-drawer {
  position: fixed;
  top: 0; left: 0; bottom: 0;
  width: 84%;
  max-width: 340px;
  display: flex;
  flex-direction: column;
  background: rgba(255,255,255,.10);
  backdrop-filter: blur(26px);
  -webkit-backdrop-filter: blur(26px);
  border-right: 1px solid var(--glass-border-strong);
  box-shadow: var(--glass-shadow-hover);
  z-index: 999;
  transform: translateX(-105%);
  transition: transform .34s var(--ease);
}
.nav-drawer.open { transform: translateX(0); }
.drawer-head { padding: 20px 20px 16px; border-bottom: 1px solid var(--glass-border); position: relative; }
.drawer-brand { font-size: 18px; font-weight: var(--font-weight-title); color: var(--text-primary); }
.drawer-sub { margin-top: 6px; font-size: 13px; color: var(--text-secondary); }
.drawer-close { position: absolute; top: 16px; right: 14px; width: 32px; height: 32px; border-radius: var(--radius-sm); background: var(--glass-bg); border: 1px solid var(--glass-border); color: var(--text-secondary); font-size: 14px; cursor: pointer; transition: all var(--dur); }
.drawer-close:hover { color: var(--text-primary); background: var(--glass-bg-hover); }
.drawer-body { flex: 1; overflow-y: auto; padding: 8px 0; }
.drawer-group-title { font-size: 11px; color: var(--text-muted); padding: 16px 22px 6px; letter-spacing: 1px; text-transform: uppercase; }
.drawer-item { display: flex; align-items: center; padding: 12px 22px; margin: 1px 10px; border-radius: var(--radius-md); color: var(--text-secondary); border-left: 3px solid transparent; transition: all var(--dur); font-size: 15px; }
.drawer-item i { width: 22px; text-align: center; margin-right: 10px; color: var(--text-muted); font-size: 15px; }
.drawer-item:hover { background: var(--glass-bg-hover); color: var(--text-primary); }
.drawer-item.active { background: var(--accent-soft); color: var(--accent); border-left-color: var(--accent); }
.drawer-item.active i { color: var(--accent); }
.drawer-foot { padding: 10px; border-top: 1px solid var(--glass-border); }
.drawer-foot .drawer-item { color: var(--danger); }
.drawer-foot .drawer-item:hover { background: var(--danger-soft); }

/* ---------- 移动端：隐藏平铺侧栏，功能走抽屉 ---------- */
@media (max-width: 768px) {
  .sidebar-nav { display: none; }
  .navbar-nav.navbar-right { display: none; }
}