/* ==========================================================
   工作台外壳样式（截图风格窄侧边栏）
   —— 基础组件（卡片/表格/按钮/弹窗）仍由 _theme.css 提供
   ========================================================== */
:root{
  --wb-sidebar:#ffffff;
  --wb-bg:#f5f5f7;
  --wb-text:#1f2937;
  --wb-muted:#6b7280;
  --wb-line:#e5e7eb;
  --wb-green:#16a34a;
  --wb-green-bg:#e6f7ed;
}
*{ margin:0; padding:0; box-sizing:border-box; }
html,body{ height:100%; }
body{ font-family:-apple-system,BlinkMacSystemFont,"PingFang SC","Microsoft YaHei",sans-serif;
  background:var(--wb-bg); color:var(--wb-text); -webkit-font-smoothing:antialiased; }
.hidden{ display:none !important; }

/* ---------- 登录（Apple 浅色风：苹果灰底 + 磨砂卡片 + 系统蓝点缀） ---------- */
.wb-login{ min-height:100vh; display:flex; align-items:center; justify-content:center;
  background:
    radial-gradient(1100px 620px at 18% -12%, #e9eefb 0%, rgba(233,238,251,0) 62%),
    radial-gradient(900px 520px at 100% 0%, #eef1f6 0%, rgba(238,241,246,0) 58%),
    linear-gradient(180deg, #fbfcfd 0%, #f2f3f7 100%); }
.wb-login-box{ background:rgba(255,255,255,.82);
  backdrop-filter:blur(24px) saturate(180%); -webkit-backdrop-filter:blur(24px) saturate(180%);
  border:1px solid rgba(255,255,255,.75); border-radius:20px; padding:40px; width:360px;
  box-shadow:0 1px 2px rgba(16,24,40,.04), 0 12px 32px -8px rgba(16,24,40,.10),
             0 32px 64px -24px rgba(16,24,40,.14); }
.wb-brand{ display:flex; align-items:center; justify-content:center; gap:10px; margin-bottom:26px; }
.wb-brand img{ width:38px; height:38px; border-radius:9px; background:#fff; padding:2px;
  box-shadow:0 1px 3px rgba(16,24,40,.06); }
.wb-brand h1{ font-size:20px; font-weight:600; letter-spacing:.4px; color:#1d1d1f; }
.wb-login-box input{ width:100%; height:46px; border:1px solid rgba(0,0,0,.08); border-radius:12px;
  padding:0 14px; margin-bottom:14px; font-size:14px; outline:none; color:#1d1d1f;
  background:rgba(255,255,255,.9);
  transition:border-color .18s ease, box-shadow .18s ease, background .18s ease; }
.wb-login-box input::placeholder{ color:#a1a1a6; }
.wb-login-box input:focus{ border-color:#0071e3; background:#fff;
  box-shadow:0 0 0 3px rgba(0,113,227,.14); }
.wb-login-btn{ width:100%; height:46px; background:#0071e3; color:#fff;
  border:none; border-radius:12px; font-size:15px; font-weight:600; cursor:pointer; letter-spacing:3px;
  box-shadow:0 4px 14px -2px rgba(0,113,227,.35);
  transition:background .18s ease, box-shadow .18s ease, transform .18s cubic-bezier(.34,1.56,.64,1); }
.wb-login-btn:hover{ background:#0077ed; box-shadow:0 8px 20px -4px rgba(0,113,227,.42);
  transform:translateY(-1px); }
.wb-login-btn:active{ background:#006edb; transform:translateY(0);
  box-shadow:0 2px 8px -2px rgba(0,113,227,.35); }
.wb-login-box .err{ color:#d93025; font-size:13px; margin-bottom:12px; text-align:center; }

/* ---------- 布局 ---------- */
.wb-layout{ display:flex; height:100vh; overflow:hidden; }
.wb-sidebar{ width:92px; background:var(--wb-sidebar); border-right:1px solid var(--wb-line);
  flex-shrink:0; display:flex; flex-direction:column; align-items:center;
  padding:18px 8px 12px; gap:14px; overflow-y:auto; }
.wb-avatar{ width:46px; height:46px; border-radius:50%; overflow:hidden; background:#fff;
  flex-shrink:0; box-shadow:0 2px 8px rgba(0,0,0,.06); }
.wb-avatar img{ width:100%; height:100%; object-fit:contain; }
.wb-nav{ display:flex; flex-direction:column; gap:4px; width:100%; }
.wb-bottom{ margin-top:auto; width:100%; border-top:1px solid #f3f4f6; padding-top:8px;
  display:flex; flex-direction:column; gap:4px; }
.wb-navitem{ display:flex; flex-direction:column; align-items:center; justify-content:center; gap:4px;
  padding:10px 2px; border-radius:14px; cursor:pointer; color:var(--wb-muted); font-size:12px;
  font-weight:500; border:none; background:transparent; transition:.18s; font-family:inherit; }
.wb-navitem:hover{ background:#f3f4f6; color:var(--wb-text); }
.wb-navitem.active{ background:var(--wb-green-bg); color:var(--wb-green); }
.wb-navitem svg{ width:22px; height:22px; }
.wb-navitem span{ white-space:nowrap; }

.wb-main{ flex:1; min-width:0; display:flex; flex-direction:column; }
.wb-topbar{ height:60px; background:#fff; border-bottom:1px solid var(--wb-line); flex-shrink:0;
  display:flex; align-items:center; justify-content:space-between; padding:0 24px; gap:16px; }
.wb-topbar h2{ font-size:17px; font-weight:700; white-space:nowrap; }
.wb-topbar-right{ display:flex; align-items:center; gap:12px; font-size:13px; color:var(--wb-muted); }
.wb-user{ font-weight:600; color:var(--wb-text); }
.wb-lang{ height:30px; border:1px solid var(--wb-line); border-radius:8px; padding:0 6px;
  font-size:12px; background:#fff; color:var(--wb-text); outline:none; }
.wb-ghost{ height:30px; padding:0 12px; border:1px solid var(--wb-line); border-radius:8px;
  background:#fff; color:var(--wb-text); font-size:12px; cursor:pointer; transition:.18s; }
.wb-ghost:hover{ background:#f3f4f6; }
.wb-content{ flex:1; overflow:auto; padding:22px 24px 40px; }

/* ---------- 修正 _theme.css 与外壳的冲突 ----------
   _theme.css 的表头 sticky(top:73px) 和 .card 上边距
   是为旧版 index.html 的置顶大标题预留的，这里改为内容区内聚 */
.wb-content thead th{ position:static; }
.wb-content .card{ margin:0 0 16px; }
.wb-content .stat-grid{ margin:0 0 16px; }
.wb-content .subtabs{ margin:0 0 16px; }
.wb-content .toolbar{ margin:0 0 16px; }
.wb-content .tab-panel > h2{ display:none; }

/* ---------- 帮助页 ---------- */
.wb-help{ max-width:760px; line-height:1.9; }
.wb-help h3{ font-size:16px; margin-bottom:10px; }
.wb-help p{ font-size:14px; color:#374151; margin-bottom:6px; }

/* ---------- 首页常用功能（可自定义） ---------- */
.wb-shortcuts{ padding:18px 20px; }
.wb-sc-head{ display:flex; align-items:center; justify-content:space-between; margin-bottom:14px; }
.wb-sc-head h3{ font-size:15px; font-weight:700; }
.wb-sc-edit{ height:30px; padding:0 12px; border:1px solid var(--wb-line); border-radius:8px;
  background:#fff; font-size:12px; cursor:pointer; color:var(--wb-text); transition:.18s; }
.wb-sc-edit:hover{ background:#f3f4f6; border-color:#d1d5db; }
.wb-sc-grid{ display:grid; grid-template-columns:repeat(auto-fill,minmax(124px,1fr)); gap:12px; }
.wb-sc-item{ display:flex; flex-direction:column; align-items:center; justify-content:center; gap:8px;
  padding:16px 8px; border:1px solid var(--wb-line); border-radius:14px; background:#fff;
  cursor:pointer; transition:.18s; color:var(--wb-text); font-size:13px; font-weight:500; text-align:center; }
.wb-sc-item:hover{ border-color:var(--wb-green); color:var(--wb-green); background:var(--wb-green-bg);
  transform:translateY(-2px); box-shadow:0 8px 18px -10px rgba(22,163,74,.55); }
.wb-sc-item svg{ width:24px; height:24px; }
.wb-sc-item small{ display:block; font-size:11px; color:var(--wb-muted); font-weight:400; margin-top:2px; }
.wb-sc-empty{ padding:26px; text-align:center; color:var(--wb-muted); font-size:13px; }

/* 自定义弹窗 */
.wb-sc-tip{ font-size:12px; color:var(--wb-muted); margin-bottom:10px; line-height:1.6; }
.wb-sc-list{ max-height:38vh; overflow:auto; margin-bottom:6px; }
.wb-sc-row{ display:flex; align-items:center; gap:10px; padding:7px 10px; border-radius:10px; }
.wb-sc-row:hover{ background:#f7f8fa; }
.wb-sc-row input[type=checkbox]{ width:16px; height:16px; cursor:pointer; }
.wb-sc-row .nm{ flex:1; font-size:13px; }
.wb-sc-row .cat{ font-size:12px; color:var(--wb-muted); }
.wb-sc-order{ display:flex; gap:4px; }
.wb-sc-order button{ width:24px; height:24px; border:1px solid var(--wb-line); border-radius:6px;
  background:#fff; cursor:pointer; font-size:12px; line-height:1; color:var(--wb-text); }
.wb-sc-order button:hover{ background:#f3f4f6; }

/* ---------- 全站列表自动分页 ---------- */
.wb-pager{ display:flex; align-items:center; gap:6px; flex-wrap:wrap; margin-top:14px;
  font-size:13px; color:var(--wb-muted); }
.wb-pager button{ min-width:30px; height:30px; padding:0 9px; border:1px solid var(--wb-line);
  border-radius:8px; background:#fff; color:var(--wb-text); font-size:12px; cursor:pointer;
  transition:.15s; font-family:inherit; }
.wb-pager button:hover:not([disabled]):not(.cur){ background:#f3f4f6; border-color:#d1d5db; }
.wb-pager button.cur{ background:var(--wb-green); border-color:var(--wb-green); color:#fff; font-weight:600; }
.wb-pager button[disabled]{ opacity:.4; cursor:not-allowed; }
.wb-pager .wb-pager-info{ margin-right:4px; }
