/* ── 前台 深蓝商务主题 ── */
:root {
  --primary:       #1a3a5c;
  --primary-mid:   #1e4d8c;
  --primary-light: #2563b0;
  --accent:        #0ea5e9;
  --bg:            #f0f4f8;
  --card-shadow:   0 2px 8px rgba(0,0,0,.08);
  --border:        #e2e8f0;
  --text:          #1e293b;
  --muted:         #64748b;
}

*, *::before, *::after { box-sizing: border-box; }
body { margin:0; background:var(--bg); font-size:14px; color:var(--text); font-family:-apple-system,BlinkMacSystemFont,'Segoe UI',Roboto,sans-serif; }
a { color:var(--primary-light); }

/* ── Navbar ── */
.navbar { background:linear-gradient(90deg,var(--primary),var(--primary-mid)) !important; box-shadow:0 2px 8px rgba(0,0,0,.2); }
.navbar-brand { font-weight:700; font-size:1.1rem; color:#fff !important; }
.navbar-nav .nav-link { color:rgba(255,255,255,.85) !important; }
.navbar-nav .nav-link:hover { color:#fff !important; }

/* ── Hero ── */
.hero-banner {
  background: linear-gradient(135deg, var(--primary) 0%, var(--primary-mid) 60%, var(--primary-light) 100%);
  padding: 56px 0;
}
.hero-banner h1 { font-weight:800; letter-spacing:-.01em; }
.hero-banner .text-white-75 { color:rgba(255,255,255,.8); }
.hero-banner .btn-light {
  color: var(--primary);
  font-weight: 700;
  border: none;
  box-shadow: 0 4px 12px rgba(0,0,0,.15);
}
.hero-banner .btn-outline-light { border-color:rgba(255,255,255,.6); color:#fff; font-weight:600; }
.hero-banner .btn-outline-light:hover { background:rgba(255,255,255,.12); }

/* ── 卡片 ── */
.card { border:none; border-radius:10px; box-shadow:var(--card-shadow); }
.card-header { background:#fff; border-bottom:1px solid var(--border); font-weight:600; border-radius:10px 10px 0 0 !important; }

/* ── 统计卡片 ── */
.stat-card { border-radius:12px; overflow:hidden; transition:transform .15s,box-shadow .15s; }
.stat-card:hover { transform:translateY(-3px); box-shadow:0 8px 24px rgba(0,0,0,.12); }
.stat-card .icon-box { width:56px; height:56px; border-radius:50%; display:flex; align-items:center; justify-content:center; font-size:1.4rem; }

/* ── 步骤 ── */
.step-bar { display:flex; align-items:center; padding:16px 0; margin-bottom:16px; }
.step-item { display:flex; align-items:center; gap:8px; font-size:13px; font-weight:600; color:var(--muted); }
.step-item.active { color:var(--primary-light); }
.step-item.done { color:#16a34a; }
.step-circle {
  width:32px; height:32px; border-radius:50%;
  display:flex; align-items:center; justify-content:center;
  font-weight:700; font-size:13px;
  border:2px solid currentColor;
}
.step-line { flex:1; height:2px; background:var(--border); margin:0 8px; }
.step-line.done { background:#16a34a; }

/* ── 表格 ── */
.table thead th { font-weight:600; font-size:13px; border-top:none; white-space:nowrap; color:var(--muted); background:#f8fafc; }
.table-hover tbody tr:hover { background:rgba(37,99,176,.04); }

/* ── 按钮 ── */
.btn-primary { background:var(--primary-light); border-color:var(--primary-light); }
.btn-primary:hover { background:var(--primary-mid); border-color:var(--primary-mid); }
.btn-outline-primary { color:var(--primary-light); border-color:var(--primary-light); }
.btn-outline-primary:hover { background:var(--primary-light); color:#fff; }
.btn-xs { padding:.15rem .5rem; font-size:.75rem; border-radius:.2rem; }

/* ── 媒体卡片 ── */
.media-card { transition:transform .15s,box-shadow .15s; cursor:pointer; }
.media-card:hover { transform:translateY(-2px); box-shadow:0 6px 20px rgba(0,0,0,.12); }
.media-name { font-size:13px; font-weight:600; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.price-tag { color:#dc2626; font-weight:700; font-size:1.05rem; }

/* ── 徽章 ── */
.badge-sm { font-size:10px; padding:2px 6px; }

/* ── 编辑器 ── */
.editor-wrap { border:1px solid var(--border); border-radius:6px; overflow:hidden; background:#fff; }
.editor-toolbar { background:#f8fafc; border-bottom:1px solid var(--border); padding:6px 10px; display:flex; flex-wrap:wrap; gap:4px; align-items:center; }
.editor-toolbar button,.editor-toolbar label.tb-btn { padding:3px 8px; font-size:12px; border:1px solid var(--border); border-radius:3px; background:#fff; cursor:pointer; color:#555; line-height:1.5; display:inline-flex; align-items:center; }
.editor-toolbar button:hover,.editor-toolbar label.tb-btn:hover { background:#e8f4ff; color:var(--primary-light); }

/* ── 表单 ── */
.form-control:focus { border-color:var(--primary-light); box-shadow:0 0 0 .2rem rgba(37,99,176,.18); }

/* ── 分页 ── */
.page-link { color:var(--primary-light); }
.page-item.active .page-link { background:var(--primary-light); border-color:var(--primary-light); }

/* ── 等级标签 ── */
.level-normal  { background:#64748b; color:#fff; }
.level-high    { background:#d97706; color:#fff; }

/* ── 遮罩 ── */
.sidebar-overlay { display:none; position:fixed; inset:0; background:rgba(0,0,0,.4); z-index:99; }
.sidebar-overlay.show { display:block; }

/* ── 登录/注册页 ── */
.auth-card { border-radius:12px; box-shadow:0 8px 32px rgba(0,0,0,.12); }
.auth-brand { color:var(--primary); }

/* ── 响应式 ── */
@media (max-width: 768px) {
  .hero-banner { padding:32px 0; }
  .hero-banner h1 { font-size:1.5rem; }
  .stat-card .h2 { font-size:1.4rem; }
  .table-responsive { font-size:12px; }
  .media-card .card-body { padding:10px; }
}
@media (max-width: 576px) {
  .hide-xs { display:none !important; }
  .btn { font-size:13px; }
  .table { font-size:11px; }
  .table td,.table th { padding:.25rem .3rem; }
}
@media (max-width: 400px) {
  .card-body { padding:.75rem; }
  .hero-banner h1 { font-size:1.25rem; }
}
