/* ===== 美店云 · 多主题皮肤系统 =====
 * 通过 body[data-theme] 覆盖 base.css 的 :root 变量 + 关键硬编码渐变色。
 * 皮肤列表（仅保留 2 套）：classic 玫瑰红（base.css :root 默认） / ocean 静谧深海蓝
 * 优先级：本文件在所有样式之后加载，body[data-theme] 选择器比 :root 更具体 → 覆盖生效。
 */

/* ---------- 静谧深海蓝 ocean（沉稳科技） ---------- */
body[data-theme="ocean"] {
  --primary: #1d6ff2;
  --primary-dark: #0f4cba;
  --primary-light: #e8f0fe;
  --teal: #0d9488;
  --teal-light: #e9fbf8;
  --ink: #0f172a;
  --ink-2: #334155;
  --ink-3: #64748b;
  --line: #e2e8f0;
  --bg: #e3eaf5;
  --card: #ffffff;
  --shadow: 0 1px 3px rgba(15,40,90,.06), 0 6px 18px rgba(15,40,90,.06);
}
body[data-theme="ocean"] {
  background: #ffffff;
}
body[data-theme="ocean"] .sidebar {
  background: linear-gradient(180deg, #0b1f3a 0%, #0e2a4d 55%, #123a66 100%);
}
body[data-theme="ocean"] .auth-bg {
  background: linear-gradient(135deg, #0b1f3a 0%, #123a66 48%, #0f4c8a 100%);
}
body[data-theme="ocean"] .btn-primary {
  background: linear-gradient(135deg, #3b82f6, #0f4cba);
  color: #fff !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.35), inset 0 -2px 0 rgba(0,0,0,.16), 0 3px 12px rgba(29,111,242,.26);
}
body[data-theme="ocean"] .btn-primary:hover { box-shadow: inset 0 1px 0 rgba(255,255,255,.35), inset 0 -2px 0 rgba(0,0,0,.16), 0 6px 18px rgba(29,111,242,.38); }
body[data-theme="ocean"] .btn-ghost:hover { box-shadow: 0 3px 12px rgba(29,111,242,.12); }
body[data-theme="ocean"] .input:focus, body[data-theme="ocean"] .select:focus {
  box-shadow: 0 0 0 3px rgba(29,111,242,.12);
}
body[data-theme="ocean"] .nav a.active { box-shadow: 0 4px 16px rgba(29,111,242,.38); }
body[data-theme="ocean"] .t-revenue { background: linear-gradient(135deg, #3b82f6, #0e3a8a); }
body[data-theme="ocean"] .t-received { background: linear-gradient(135deg, #14b8a6, #0b6b62); }
body[data-theme="ocean"] .mcard-mini.normal, body[data-theme="ocean"] .mcard-lg.normal { background: linear-gradient(135deg, #64748b, #3b4c63); }
body[data-theme="ocean"] .mcard-mini.silver, body[data-theme="ocean"] .mcard-lg.silver { background: linear-gradient(135deg, #a9b6c8, #64748b); }
body[data-theme="ocean"] .mcard-mini.gold, body[data-theme="ocean"] .mcard-lg.gold { background: linear-gradient(135deg, #e8a020, #a05e0a); }
body[data-theme="ocean"] .mcard-mini.dia, body[data-theme="ocean"] .mcard-lg.dia { background: linear-gradient(135deg, #38bdf8, #0369a1); }
body[data-theme="ocean"] .modal-close { box-shadow: 0 2px 10px rgba(29,111,242,.35); }
body[data-theme="ocean"] .btn-teal,
body[data-theme="ocean"] .btn-red.btn-primary,
body[data-theme="ocean"] .btn-red.btn-teal { color: #fff !important; }
body[data-theme="ocean"] .lv-chip.active { box-shadow: 0 3px 12px rgba(29,111,242,.30); }

/* ---------- 玫瑰红 classic（base.css 默认，这里只补充两处强化） ---------- */
body[data-theme="classic"] .t-revenue { background: linear-gradient(135deg, #D6006E, #8A0047); }
body[data-theme="classic"] .t-received { background: linear-gradient(135deg, #0d9488, #115e59); }
/* v258 导航页选中项恢复玫瑰红（其余选中态如底部导航仍用主色深灰绿，保持不变） */
body[data-theme="classic"] .nav a.active, body:not([data-theme]) .nav a.active {
  background: #D6006E;
}

/* ---------- 皮肤切换选择器（系统设置页） ---------- */
.skin-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(112px, 1fr)); gap: 8px; margin-top: 6px; }
.skin-card {
  border: 2px solid var(--line); border-radius: 12px; overflow: hidden; cursor: pointer;
  background: var(--card); transition: all .18s; text-align: center; padding: 0;
}
.skin-card:hover { transform: translateY(-2px); box-shadow: 0 6px 16px rgba(15,23,42,.10); }
.skin-card.active { border-color: var(--primary); box-shadow: 0 0 0 2px var(--primary-light); }
.skin-card .swatch { height: 30px; display: flex; }
.skin-card .swatch i { flex: 1; display: block; }
.skin-card .meta { padding: 6px 8px 7px; }
.skin-card .meta b { font-size: 12.5px; display: block; line-height: 1.3; }
.skin-card .meta span { font-size: 10.5px; color: var(--ink-3); display: block; margin-top: 2px; line-height: 1.4; }

/* 系统设置右下角「退出登录」（浮在页面右下偏上，避开浏览器底边与底部区域） */
.settings-logout {
  position: fixed; right: 22px; bottom: 78px; z-index: 40;
  padding: 10px 22px; border: 1px solid var(--line); border-radius: 12px;
  background: var(--card); color: #D6006E; font-size: 14px; font-weight: 600;
  cursor: pointer; box-shadow: 0 6px 20px rgba(15,23,42,.12); transition: all .16s;
}
.settings-logout:hover { background: #fef2f2; border-color: #fecaca; transform: translateY(-1px); }

/* 窄屏（手机）时同步上移，避免被底部手势条压住 */
@media (max-width: 640px) {
  .settings-logout { right: 14px; bottom: 92px; }
}

/* ===== 全局配色统一（v239）：主色按首页「今日数据」深灰绿 + 香槟金，标题前金色竖条 ===== */
:root {
  --primary: #1d4433;
  --primary-dark: #10291c;
  --primary-light: #e9f4ec;
}
.page-title::before {
  background: linear-gradient(180deg, #e9c880, #8a6a1a);
  box-shadow: 0 0 6px rgba(212,161,55,.45);
}
/* 副标/卡片标题前加区分竖条（仿首页「门店管理」前的金色图标） */
.card-title { position: relative; padding-left: 12px; }
.card-title::before {
  content: ''; position: absolute; left: 0; top: 50%; transform: translateY(-50%);
  width: 4px; height: 15px; border-radius: 3px;
  background: linear-gradient(180deg, #e9c880, #8a6a1a);
}
.btn-primary { background: linear-gradient(135deg, #e9c880, #c99a2e); color: #3d2f14; }