/* =============================================
   ShangChen Admin - Independent Stylesheet
   ============================================= */

:root {
  --primary: #667eea;
  --primary-dark: #5a6fd6;
  --primary-light: #eef0ff;
  --accent: #764ba2;
  --text: #333;
  --text-light: #888;
  --text-lighter: #bbb;
  --bg: #f0f2f5;
  --white: #fff;
  --border: #eee;
  --border-dark: #ddd;
  --success: #52c41a;
  --warning: #faad14;
  --danger: #ff4d4f;
  --info: #1890ff;
  --radius: 8px;
  --radius-sm: 6px;
  --shadow: 0 1px 4px rgba(0,0,0,.06);
}

/* ── Reset ── */
*,*::before,*::after { box-sizing:border-box; margin:0; padding:0; }
html { font-size:14px; -webkit-text-size-adjust:100%; }
body {
  font-family: -apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,"Helvetica Neue",Arial,sans-serif;
  color: var(--text);
  background: var(--bg);
  min-height: 100vh;
  -webkit-tap-highlight-color: transparent;
  padding:0;
  max-width:none;
  box-shadow:none;
}
a { color: var(--text); text-decoration: none; }
img { max-width: 100%; vertical-align: middle; }
ul,ol { list-style: none; }
input,button,textarea,select { font:inherit; border:none; outline:none; }
button { cursor:pointer; }
input[type="number"]::-webkit-inner-spin-button,
input[type="number"]::-webkit-outer-spin-button { -webkit-appearance:none; margin:0; }
input[type="number"] { -moz-appearance:textfield; }

/* ── Admin Sidebar ── */
.sc-admin-sidebar {
  position:fixed; left:0; top:0; bottom:0; width:200px;
  background:#1e1e2d; color:#fff; overflow-y:auto; z-index:300;
  display:block;
}
.sc-admin-sidebar .logo {
  padding:20px; font-size:16px; font-weight:700;
  text-align:center; border-bottom:1px solid #333;
}
.sc-admin-sidebar a {
  display:flex; align-items:center; gap:10px; padding:12px 20px;
  color:rgba(255,255,255,.7); font-size:14px; transition:background .2s;
}
.sc-admin-sidebar a:hover,
.sc-admin-sidebar a.active {
  background:rgba(255,255,255,.1); color:#fff;
}

/* ── Admin Content ── */
.sc-admin-content {
  margin-left:200px; padding:20px; min-height:100vh;
}

/* ── Admin Cards ── */
.adm-card {
  background:#fff; border-radius:8px; padding:20px;
  box-shadow:0 1px 4px rgba(0,0,0,.06); margin-bottom:16px;
}

/* ── Dashboard Stats ── */
.adm-stat {
  display:grid; grid-template-columns:repeat(auto-fit,minmax(160px,1fr));
  gap:14px; margin-bottom:20px;
}
.adm-stat .card {
  background:#fff; border-radius:10px; padding:18px;
  text-align:center; box-shadow:0 1px 4px rgba(0,0,0,.06);
}
.adm-stat .card .num { font-size:26px; font-weight:700; color:var(--primary); }
.adm-stat .card .lbl { font-size:12px; color:var(--text-light); margin-top:4px; }

/* ── Tables ── */
table { width:100%; border-collapse:collapse; font-size:13px; }
th,td { padding:10px 12px; text-align:left; border-bottom:1px solid var(--border); }
th { background:var(--bg); font-weight:600; position:sticky; top:0; }

/* ── Buttons ── */
.adm-btn {
  display:inline-block; padding:5px 12px; border-radius:4px;
  font-size:12px; cursor:pointer; border:none;
  text-decoration:none; color:var(--text);
}
.adm-btn-p { background:var(--primary); color:#fff; }
.adm-btn-s { background:var(--success); color:#fff; }
.adm-btn-d { background:var(--danger); color:#fff; }
.adm-btn-w { background:var(--warning); color:#fff; }

/* ── Forms ── */
.adm-form label { display:block; font-size:13px; margin:10px 0 4px; color:var(--text-light); }
.adm-form input,
.adm-form select,
.adm-form textarea {
  width:100%; padding:8px 10px; border:1px solid var(--border-dark);
  border-radius:4px; font-size:13px; box-sizing:border-box;
}
.adm-form textarea { min-height:120px; resize:vertical; }

/* ── Actions ── */
.adm-actions { display:flex; gap:6px; }

/* ── Badges ── */
.badge {
  display:inline-block; padding:2px 8px; border-radius:10px;
  font-size:11px; color:#fff;
}
.badge-ok { background:var(--success); }
.badge-warn { background:var(--warning); }
.badge-err { background:var(--danger); }

/* ── Top Bar ── */
.adm-top {
  display:flex; justify-content:space-between; align-items:center;
  margin-bottom:16px; flex-wrap:wrap; gap:8px;
}

/* ── Login Page ── */
.login-page {
  background:linear-gradient(135deg,#667eea,#764ba2);
  display:flex; align-items:center; justify-content:center;
  min-height:100vh; padding:20px; max-width:none; box-shadow:none;
}
.login-box {
  background:#fff; border-radius:12px; padding:40px;
  width:100%; max-width:380px; box-shadow:0 20px 60px rgba(0,0,0,.2);
}
.login-box h2 { text-align:center; margin-bottom:24px; font-size:20px; }
.login-box .field { margin-bottom:16px; }
.login-box .field label { display:block; font-size:13px; color:#666; margin-bottom:6px; }
.login-box .field input {
  width:100%; padding:10px 12px; border:1px solid #ddd;
  border-radius:6px; font-size:14px; box-sizing:border-box;
}
.login-box .field input:focus { border-color:#667eea; outline:none; }
.login-box .btn {
  width:100%; padding:12px;
  background:linear-gradient(135deg,#667eea,#764ba2);
  color:#fff; border:none; border-radius:6px;
  font-size:15px; font-weight:600; cursor:pointer;
}
.login-box .btn:hover { opacity:.9; }
.login-box .err { color:#e74c3c; font-size:13px; text-align:center; margin-bottom:12px; }
.login-box .back { display:block; text-align:center; margin-top:16px; font-size:13px; color:#999; }

/* ── Responsive ── */
@media(max-width:768px) {
  .sc-admin-sidebar { display:none; }
  .sc-admin-content { margin-left:0; }
}