/* 图像信息采集 · 管理后台 样式 — 微广融媒红黑主题 */
* { margin:0; padding:0; box-sizing:border-box; }
:root {
  --brand:#C8102E; --brand-dark:#8B0F22;
  --bg:#f4f5f7; --card:#fff; --line:#e8e8ec;
  --text:#1f2329; --muted:#8a8f99; --ok:#2E7D32; --warn:#e6a23c;
}
body { font-family: -apple-system, "Microsoft YaHei", sans-serif; background:var(--bg); color:var(--text); display:flex; min-height:100vh; }

/* 侧边栏 */
.sidebar { width:220px; background:#1c1c22; color:#fff; display:flex; flex-direction:column; flex-shrink:0; position:sticky; top:0; height:100vh; }
.brand { padding:24px 20px; display:flex; align-items:center; gap:12px; border-bottom:1px solid #2c2c34; }
.brand-logo { width:44px; height:44px; border-radius:10px; background:var(--brand); display:flex; align-items:center; justify-content:center; font-size:22px; font-weight:700; }
.brand-name { font-size:15px; font-weight:600; line-height:1.4; }
.brand-name small { color:#9a9aa3; font-weight:400; }
.nav { flex:1; padding:12px 0; }
.nav-item { display:block; padding:12px 22px; color:#b9b9c2; text-decoration:none; font-size:14px; transition:.15s; }
.nav-item:hover { background:#26262e; color:#fff; }
.nav-item.active { background:var(--brand); color:#fff; }
.sidebar-foot { padding:16px; border-top:1px solid #2c2c34; }
.login-box input { width:100%; padding:8px 10px; margin-bottom:8px; border:1px solid #3a3a44; background:#26262e; color:#fff; border-radius:6px; font-size:13px; }
.user-box { display:flex; align-items:center; justify-content:space-between; color:#ddd; font-size:14px; }

/* 主区 */
.main { flex:1; padding:0 24px 40px; min-width:0; }
.topbar { display:flex; align-items:center; justify-content:space-between; padding:20px 0; }
.topbar h1 { font-size:22px; }
.api-status { font-size:12px; padding:4px 10px; border-radius:20px; background:#ffe9e9; color:var(--brand); }
.api-status.on { background:#e8f5e9; color:var(--ok); }
.page-content { animation:.2s fadeIn; }
@keyframes fadeIn { from{opacity:0;transform:translateY(6px)} to{opacity:1;transform:none} }
.hidden { display:none; }

/* 卡片 */
.card { background:var(--card); border-radius:12px; padding:20px; margin-bottom:20px; box-shadow:0 1px 3px rgba(0,0,0,.06); }
.cards { display:grid; grid-template-columns:repeat(auto-fit,minmax(160px,1fr)); gap:16px; margin-bottom:20px; }
.card.stat { text-align:center; padding:24px; }
.stat-num { font-size:34px; font-weight:700; color:var(--brand); }
.stat-label { color:var(--muted); margin-top:6px; font-size:13px; }
.card h3 { margin-bottom:16px; font-size:16px; }

/* 表格 */
.table { width:100%; border-collapse:collapse; font-size:14px; }
.table th,.table td { padding:10px 12px; text-align:left; border-bottom:1px solid var(--line); }
.table th { color:var(--muted); font-weight:500; background:#fafafa; }
.table tr:hover td { background:#fafafa; }
.thumb { width:44px; height:56px; border-radius:4px; object-fit:cover; background:#0057A8; }
.tag { display:inline-block; padding:2px 10px; border-radius:20px; font-size:12px; }
.tag-passed { background:#e8f5e9; color:var(--ok); }
.tag-fail { background:#ffe9e9; color:var(--brand); }
.tag-checking { background:#fff7e6; color:var(--warn); }
.tag-none,.tag-pending { background:#f0f0f0; color:var(--muted); }

/* 按钮/表单 */
.btn { padding:8px 18px; border:1px solid var(--line); background:#fff; border-radius:6px; cursor:pointer; font-size:14px; transition:.15s; }
.btn:hover { border-color:var(--brand); color:var(--brand); }
.btn-primary { background:var(--brand); color:#fff; border-color:var(--brand); }
.btn-primary:hover { background:var(--brand-dark); color:#fff; }
.btn-ghost { background:transparent; border-color:#3a3a44; color:#ddd; }
.btn-block { width:100%; }
.toolbar { display:flex; gap:10px; margin-bottom:16px; flex-wrap:wrap; }
.toolbar input,.toolbar select,.form input,.form select,.form textarea { padding:8px 12px; border:1px solid var(--line); border-radius:6px; font-size:14px; }
.form label { display:block; margin:12px 0 6px; color:var(--muted); font-size:13px; }
.form textarea { width:100%; resize:vertical; }
.stats-inline { display:flex; gap:20px; flex-wrap:wrap; }
.stats-inline span { background:#f5f5f6; padding:8px 14px; border-radius:8px; font-size:13px; }
.export-actions { display:flex; gap:12px; flex-wrap:wrap; }
.muted { color:var(--muted); font-size:13px; margin-top:12px; }
