/* ============================================================
   ChaoShunPay — 整站统一层 v6 (theme-unify)
   最后加载：统一覆盖 app.css / enhancements.css / 各页面专属 css
   只统一「通用外观」(色/圆角/阴影/字距/聚焦)，不动布局骨架
   范围：整站通用组件。业务概览 / 站点健康 / 争议相关区块不在本层处理
   ============================================================ */

:root{
  --bg:#F7F9FC; --surface:#FFFFFF; --surface-2:#F6F8FB; --surface-3:#EFF3F8;
  --border:#E3E8F0; --border-strong:#C7D1DF;
  --ink:#0A1018; --ink-2:#17253B; --ink-3:#3E4F69; --ink-4:#5A6A85;
  --accent:#2456E6; --accent-strong:#1C45C4; --accent-soft:#EDF2FF;
  --green:#0E9F6E; --amber:#C7740A; --red:#D23B3B;
  --radius:18px; --radius-lg:24px; --radius-sm:12px; --radius-btn:12px;
  --shadow-sm:0 1px 2px rgba(12,20,36,.04);
  --shadow:0 2px 4px rgba(12,20,36,.03),0 18px 44px -22px rgba(12,20,36,.18);
  --shadow-pop:0 8px 24px -10px rgba(12,20,36,.18),0 28px 64px -28px rgba(12,20,36,.28);
  --mono:"SF Mono","JetBrains Mono","Cascadia Code",Consolas,ui-monospace,monospace;
  --ease:cubic-bezier(.4,0,.2,1);
}

/* ---------- 全局基础 ---------- */
body{ background:var(--bg); color:var(--ink); font-weight:450; -webkit-font-smoothing:antialiased; }
::selection{ background:rgba(36,86,230,.14); color:var(--ink); }
:focus-visible{ outline:2px solid var(--accent); outline-offset:2px; border-radius:6px; }
#app{ scrollbar-gutter:stable; }
*::-webkit-scrollbar{ width:10px; height:10px; }
*::-webkit-scrollbar-track{ background:transparent; }
*::-webkit-scrollbar-thumb{ background:#D6DEE9; border-radius:99px; border:3px solid transparent; background-clip:content-box; }
*::-webkit-scrollbar-thumb:hover{ background:#BCC8D8; }
.boot-state{ color:var(--ink-4); font-size:14px; }

/* ---------- 侧栏：分组分隔线（原 CSS 用白色半透明，在白侧栏上不可见） ---------- */
.sidebar nav .nav-section+.nav-section{ margin-top:6px; padding-top:6px; border-top:1px solid var(--border); }
.sidebar nav .nav-section-title{
  padding:2px 13px 4px; color:var(--ink-4); font-size:10px; font-weight:800;
  letter-spacing:.14em; text-transform:uppercase;
}

/* ---------- 顶栏 ---------- */
.topbar{ height:68px; padding:0 32px; background:rgba(255,255,255,.88); backdrop-filter:blur(8px); }
.top-actions .local-mode{
  background:var(--surface-2); border:1px solid var(--border); color:var(--ink-3);
  font-size:11.5px; font-weight:650; border-radius:999px; padding:7px 12px;
}
.top-actions .online,.top-actions .version{ font-size:12px; color:var(--ink-2); }
.top-actions .local-mode,.top-actions .online,.top-actions .version{ box-shadow:var(--shadow-sm); }

/* ---------- 内容区 + 标题 ---------- */
.content{ max-width:1400px; padding:34px 38px; }
.page-head{ margin-bottom:24px; gap:14px; }
.page-head h1{ font-size:29px; letter-spacing:-.02em; font-weight:700; }
.page-head p{ color:var(--ink-3); font-size:14.5px; line-height:1.6; }
.page-head a{ color:var(--accent-strong); font-weight:600; text-decoration:none; }
.content h2,.content h3{ letter-spacing:-.01em; }

/* ---------- 面板 / 卡片 ---------- */
.panel,.card,.detail-card,.action-card,.stat{
  border:1px solid var(--border); border-radius:var(--radius);
  box-shadow:var(--shadow-sm); background:var(--surface);
}
.panel{ margin-bottom:22px; }
.panel-head{
  padding:20px 24px; gap:14px; align-items:flex-start; justify-content:space-between;
  border-bottom:1px solid var(--border); background:var(--surface);
}
.panel-head h2{ font-size:16.5px; font-weight:700; color:var(--ink); margin:0; }
.panel-head p,.panel-head small,.panel-head .muted{ color:var(--ink-3); font-size:13px; line-height:1.6; margin:5px 0 0; }
.panel-body{ padding:22px 24px; }
.detail-card,.action-card{ border-radius:var(--radius-sm); padding:18px 20px; }
.detail-card h4,.action-card h4{ font-size:13.5px; font-weight:700; color:var(--ink); }
.detail-card dt,.detail-grid>div>span:first-child{ color:var(--ink-3); font-size:12.5px; font-weight:650; }
.detail-card dd,.detail-grid>div>strong:last-child{ color:var(--ink-2); font-size:13.5px; }
.danger-card{ border-color:#F2D4D4; background:#FEF7F7; }

/* ---------- 表格 ---------- */
.table-wrap{ border:1px solid var(--border); border-radius:var(--radius); overflow:auto; box-shadow:var(--shadow-sm); background:var(--surface); }
.table{ border-collapse:separate; border-spacing:0; }
.table thead th{
  position:sticky; top:0; z-index:1;
  background:var(--surface-2); color:var(--ink-3);
  font-size:11.5px; font-weight:700; letter-spacing:.06em; text-transform:uppercase;
  padding:14px 20px; border-bottom:1px solid var(--border); white-space:nowrap;
}
.table td{ padding:15px 20px; border-bottom:1px solid #EEF2F7; color:var(--ink-2); font-size:14px; line-height:1.6; }
.table tbody tr:last-child td{ border-bottom:0; }
.table tbody tr:hover td{ background:#F9FBFD; }
.table td>strong,.table td b{ color:var(--ink); font-weight:650; }
.table code{
  font-family:var(--mono); font-size:12px; background:var(--surface-2);
  border:1px solid #E0E6EF; color:#1B2A44; padding:3px 8px; border-radius:8px;
}
.table td .muted,.cell-subtext{ color:var(--ink-3); font-size:12.5px; line-height:1.5; }
input.url-field{
  width:100%; border:1px solid var(--border); background:var(--surface-2); color:var(--ink-2);
  border-radius:10px; padding:8px 11px; font:500 12.5px var(--mono);
}
input.url-field:focus{ border-color:var(--accent); box-shadow:0 0 0 3px rgba(36,86,230,.12); outline:0; }

/* ---------- 按钮 ---------- */
.btn{
  border:1px solid var(--border-strong); background:var(--surface); color:var(--ink-2);
  border-radius:var(--radius-btn); padding:10px 16px; min-height:40px;
  font:650 13.5px/1 -apple-system,BlinkMacSystemFont,"Segoe UI",system-ui,sans-serif;
  letter-spacing:.01em; transition:background .15s var(--ease),border-color .15s var(--ease),box-shadow .15s var(--ease),transform .12s var(--ease);
  text-decoration:none; white-space:nowrap;
}
.btn:hover{ background:var(--surface-2); border-color:#B9C4D4; color:var(--ink); }
.btn:active{ transform:translateY(1px); }
.btn.primary{ background:var(--accent); border-color:var(--accent); color:#fff; box-shadow:0 10px 22px -10px rgba(36,86,230,.6); }
.btn.primary:hover{ background:var(--accent-strong); border-color:var(--accent-strong); color:#fff; }
.btn.soft{ background:var(--accent-soft); border-color:transparent; color:var(--accent-strong); }
.btn.soft:hover{ background:#E1E9FF; border-color:transparent; color:var(--accent-strong); }
.btn.danger{ color:var(--red); border-color:#EFD0D0; background:#fff; }
.btn.danger:hover{ background:#FDF3F3; border-color:#E8BCBC; color:var(--red); }
.btn.ghost,.btn.link{ background:transparent; border-color:transparent; color:var(--ink-3); }
.btn.ghost:hover{ background:var(--surface-2); color:var(--ink); }
.btn.mini{ padding:5px 11px; min-height:28px; font-size:11.5px; border-radius:9px; }
.btn:disabled,.btn[disabled],button:disabled{ opacity:.5; cursor:not-allowed; box-shadow:none; transform:none; }
.btn img{ width:15px; height:15px; }

/* ---------- 表单 ---------- */
.field{ gap:8px; }
.field label,.filters label,.form-grid label{ font-size:13px; font-weight:700; color:var(--ink-2); letter-spacing:.01em; }
.field small{ font-size:12.5px; color:var(--ink-3); line-height:1.55; }
input[type="text"],input[type="password"],input[type="email"],input[type="number"],input[type="search"],
input[type="date"],input[type="datetime-local"],input[type="url"],input[type="tel"],input:not([type]),
select,textarea,.field input,.field select,.field textarea,.filters input,.filters select,
.configuration-select,select[multiple]{
  width:100%; border:1px solid var(--border-strong); border-radius:var(--radius-btn);
  padding:11px 13px; font:500 14px/1.5 -apple-system,BlinkMacSystemFont,"Segoe UI",system-ui,sans-serif;
  color:var(--ink); background:var(--surface); box-shadow:var(--shadow-sm);
  transition:border-color .15s var(--ease),box-shadow .15s var(--ease);
}
select:not([multiple]),.field select:not([multiple]),.filters select:not([multiple]),.configuration-select:not([multiple]){
  appearance:none; -webkit-appearance:none; padding-right:38px; min-height:42px;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Cpath d='M4 6l4 4 4-4' stroke='%2355657D' stroke-width='1.8' fill='none' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
  background-repeat:no-repeat; background-position:right 13px center; background-size:14px 14px; cursor:pointer; font-weight:600;
}
textarea{ min-height:96px; resize:vertical; line-height:1.65; }
input:focus,select:focus,textarea:focus,.field input:focus,.field select:focus,.field textarea:focus,
.filters input:focus,.filters select:focus{
  outline:0; border-color:var(--accent); box-shadow:0 0 0 3px rgba(36,86,230,.13);
}
input:disabled,select:disabled,textarea:disabled{ background:var(--surface-2); color:var(--ink-4); cursor:not-allowed; }
input[type="checkbox"],input[type="radio"]{ width:16px; height:16px; accent-color:var(--accent); box-shadow:none; }
::placeholder{ color:#94A2B8; }
.form-actions{ margin-top:20px; gap:10px; }
.inline-form{ display:inline-flex; gap:8px; }

/* ---------- 工具条 / 筛选 ---------- */
.toolbar,.refresh-controls,.ledger-search,.order-search,.site-product-filters,.account-overview-toolbar,
.detail-filters,.form-grid+.toolbar{ align-items:center; gap:12px; flex-wrap:wrap; }
.refresh-controls{ margin-bottom:16px; }
.filters{ gap:10px; align-items:flex-end; }
.filters label{ display:flex; flex-direction:column; gap:7px; }
/* 工具条内的输入控件保持内容宽度，避免被 width:100% 撑满换行 */
.filters input,.filters select,.filters .check-picker,.refresh-controls input,.refresh-controls select,
.pagination-size select,.ledger-search input,.ledger-search select,.order-search input,.order-search select,
.toolbar input,.toolbar select,.site-product-filters input,.site-product-filters select,.detail-filters input,.detail-filters select{
  width:auto; min-width:130px;
}
.pagination-size{ display:inline-flex; align-items:center; gap:6px; white-space:nowrap; }
.filter-tabs{ display:flex; flex-wrap:wrap; gap:8px; align-items:center; }
/* 筛选条按分组竖排：每组一行，标签固定宽度，chips 从左边界对齐 */
.filter-chips{ display:flex; flex-direction:column; align-items:stretch; gap:8px; }
.filter-chips > div{ display:flex; flex-wrap:wrap; gap:8px; align-items:center; }
.filter-chips b{ flex:0 0 80px; min-width:80px; margin:0; font-weight:650; }
.filter-chips a,.filter-chips span,.filter-tabs a,.filter-tabs>span{
  padding:8px 15px; border:1px solid var(--border); border-radius:999px;
  background:var(--surface); color:var(--ink-2); font-size:13px; font-weight:650;
  text-decoration:none; transition:all .15s var(--ease); box-shadow:var(--shadow-sm);
}
.filter-chips a:hover,.filter-tabs a:hover{ border-color:var(--border-strong); background:var(--surface-2); color:var(--ink); }
.filter-chips a.active,.filter-tabs a.active{ background:var(--accent); border-color:var(--accent); color:#fff; }
.search-form input[type="search"],.ledger-search input,.order-search input{ min-height:42px; }

/* ---------- 分页 ---------- */
.pagination{ padding:20px 0 0; gap:14px; align-items:center; flex-wrap:wrap; }
.pagination-summary{ color:var(--ink-3); font-size:12.5px; }
.pagination-pages{ gap:6px; }
.pagination-pages a,.pagination-pages span{
  min-width:38px; height:38px; padding:0 12px; border:1px solid var(--border);
  border-radius:10px; background:var(--surface); color:var(--ink-2);
  font-size:13px; font-weight:650; text-decoration:none; justify-content:center;
  transition:all .15s var(--ease);
}
.pagination-pages a:hover{ border-color:var(--accent); color:var(--accent-strong); background:var(--accent-soft); }
.pagination-pages a.active{ background:var(--accent); border-color:var(--accent); color:#fff; }
.pagination-size,.pagination-size select{ font-size:12.5px; color:var(--ink-3); }

/* ---------- 徽标 / 提示条 ---------- */
.badge{
  font-family:-apple-system,BlinkMacSystemFont,"Segoe UI",system-ui,sans-serif;
  font-size:11.5px; font-weight:650; padding:5px 11px; border-radius:999px;
  background:var(--surface-2); border:1px solid var(--border); color:var(--ink-2); gap:7px;
}
.badge::before{ width:7px; height:7px; background:#94A3B8; }
.notice{
  border-radius:var(--radius-sm); border-width:1px; padding:13px 16px;
  font-size:13.5px; line-height:1.6; box-shadow:var(--shadow-sm);
}
.notice.success{ background:#EAF7F1; border-color:#BFE6D5; color:#0B7A55; }
.notice.error{ background:#FDF1F1; border-color:#F2D4D4; color:#B42318; }
.notice.info{ background:var(--accent-soft); border-color:#D6E2FF; color:var(--accent-strong); }
.notice.warn,.notice.warning{ background:#FDF6EC; border-color:#F3E3C8; color:#96590A; }

/* ---------- 空状态 ---------- */
.empty{
  color:var(--ink-3); font-size:14px; line-height:1.7; gap:10px; padding:56px 20px;
  display:flex; flex-direction:column; align-items:center; justify-content:center; text-align:center;
}
.empty::before{
  content:""; width:44px; height:44px; border-radius:14px; opacity:.75;
  background:var(--surface-2) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='20' height='20' viewBox='0 0 24 24' fill='none' stroke='%235A6A85' stroke-width='1.7' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='12' cy='12' r='10'/%3E%3Cpath d='M8 12h8M12 8v8'/%3E%3C/svg%3E") center/20px no-repeat;
  border:1px solid var(--border);
}

/* ---------- 折叠块 ---------- */
details summary,.account-settings summary{
  cursor:pointer; font-weight:700; font-size:14.5px; color:var(--ink);
  padding:14px 18px; border-radius:var(--radius-sm); background:var(--surface-2);
  border:1px solid var(--border); list-style:none; transition:background .15s var(--ease);
}
details summary::-webkit-details-marker{ display:none; }
details summary:hover{ background:var(--surface-3); }
details[open]>summary{ border-bottom-left-radius:0; border-bottom-right-radius:0; border-bottom-color:transparent; }

/* ---------- 弹窗 ---------- */
.app-dialog{
  width:min(760px,94vw); max-height:88vh; border:0; border-radius:var(--radius-lg);
  padding:0; background:var(--surface); color:var(--ink);
  box-shadow:var(--shadow-pop); overflow:hidden;
  animation:dialog-in .18s var(--ease);
}
@keyframes dialog-in{ from{ transform:translateY(8px) scale(.985); opacity:0 } to{ transform:none; opacity:1 } }
.app-dialog::backdrop{ background:rgba(12,20,36,.42); backdrop-filter:blur(3px); }
.app-dialog>.panel{ margin:0; border:0; border-radius:0; box-shadow:none; display:flex; flex-direction:column; max-height:88vh; }
.app-dialog .panel-head{ padding:20px 26px; background:var(--surface); flex-shrink:0; }
.app-dialog .panel-head h2{ font-size:17px; }
.app-dialog .panel-body{ padding:22px 26px; max-height:calc(88vh - 150px); overflow:auto; }
.modal-close{
  width:34px; height:34px; border-radius:50%; background:var(--surface-2);
  border:1px solid var(--border); color:var(--ink-3); font-size:20px; line-height:1;
  display:grid; place-items:center; transition:all .15s var(--ease);
}
.modal-close:hover{ background:var(--surface-3); color:var(--ink); }
.modal-footer{
  display:flex; justify-content:flex-end; gap:10px; padding:16px 26px;
  border-top:1px solid var(--border); background:var(--surface-2);
}
.app-dialog .field input,.app-dialog .field select,.app-dialog .field textarea{ box-shadow:none; }
.confirmation-copy{ font-size:14.5px; line-height:1.7; color:var(--ink-2); }

/* ---------- Toast ---------- */
.app-toast{
  align-items:center; gap:12px; background:#fff; border:1px solid var(--border);
  box-shadow:var(--shadow-pop); padding:14px 18px; border-radius:var(--radius-sm);
  color:var(--ink-2); font-size:13.5px; font-weight:500;
  animation:toast-in .2s var(--ease);
}
.app-toast>span{ background:#E7F6F0; color:var(--green); }
.app-toast.error>span{ background:#FDECEC; color:var(--red); }

/* ---------- 通用小字：保证可读下限 ---------- */
.muted,.subtle,.cell-subtext,.driver-cell small,.hint-text{ font-size:12.5px; line-height:1.6; color:var(--ink-3); }
.demo-footnote,.local-footer{ font-size:12px; color:var(--ink-4); }
.chart-tooltip{ font-size:12px; color:var(--ink-3); }

/* ---------- 登录 / 付款页（独立页面） ---------- */
.checkout-card{ border-radius:var(--radius-lg); border:1px solid var(--border); box-shadow:var(--shadow-pop); }
.checkout-card h1{ letter-spacing:-.02em; }
.checkout-note,.login-security-note{ color:var(--ink-3); font-size:13px; line-height:1.6; }
.login-hint{ color:var(--ink-4); font-size:12.5px; }

@media (max-width:760px){
  .content{ padding:20px; }
  .panel-head{ padding:16px 18px; flex-direction:column; align-items:stretch; }
  .panel-body{ padding:18px; }
  .table td,.table th{ padding:13px 16px; }
  .modal-footer{ padding:14px 18px; }
}
@media (prefers-reduced-motion: reduce){
  *{ animation:none !important; transition:none !important; }
}

/* modal-footer fix 20261030: pin footer, let body scroll */
.app-dialog .modal-form{ display:flex; flex-direction:column; min-height:0; flex:1 1 auto; }
.app-dialog .panel-body{ flex:1 1 auto; min-height:0; max-height:none; overflow:auto; }
.app-dialog .modal-footer{ flex-shrink:0; }

/* ---------- modal-footer fix 20261030-modal-fix2 ---------- */
.commerce-wide-modal>.panel{ display:flex; flex-direction:column; max-height:calc(100vh - 24px); }
.commerce-wide-modal .modal-form{ display:flex; flex-direction:column; min-height:0; flex:1 1 auto; }
.commerce-wide-modal .modal-form>.panel-body{ flex:1 1 auto; min-height:0; }
.commerce-wide-modal .panel-head,.commerce-wide-modal .modal-footer{ flex-shrink:0; }
@media(max-width:760px){.commerce-wide-modal>.panel{max-height:calc(100vh - 12px)}}
