/* ===== 全局重置 & 基础 ===== */
* { margin:0; padding:0; box-sizing:border-box; }
body { font-family: system-ui, -apple-system, 'Segoe UI', Roboto, 'Helvetica Neue', sans-serif; background:#f5f7f5; color:#1e2a1e; line-height:1.6; }
a { text-decoration:none; color:inherit; }
ul { list-style:none; }
img { max-width:100%; display:block; }
.container { max-width:1240px; margin:0 auto; padding:0 20px; }
:root {
    --green-dark: #1a4a2a;
    --green-primary: #2d8a4e;
    --green-light: #4caf7a;
    --green-bg: #e8f5e9;
    --green-hover: #237a42;
    --orange: #e8892c;
    --orange-light: #fdf0e0;
    --brown: #7a5a3a;
    --gray-light: #f0f2f0;
    --gray-border: #dce0dc;
    --shadow: 0 4px 20px rgba(0,0,0,0.06);
    --radius: 12px;
    --transition: 0.3s ease;
}
/* ===== 后台 ===== */
.admin-page { background:#f0f2f0; min-height:100vh; }
.admin-page .admin-header { background:var(--green-dark); color:#fff; padding:0 24px; height:60px; display:flex; align-items:center; justify-content:space-between; position:sticky; top:0; z-index:100; }
.admin-page .admin-header .logo-sm { font-size:20px; font-weight:700; }
.admin-page .admin-header .logo-sm i { margin-right:8px; }
.admin-page .admin-header .user { font-size:14px; display:flex; align-items:center; gap:12px; }
.admin-page .admin-header .user i { font-size:18px; }
.admin-page .admin-body { display:flex; min-height:calc(100vh - 60px); }
.admin-page .admin-side { width:220px; background:#fff; border-right:1px solid var(--gray-border); padding:20px 0; flex-shrink:0; }
.admin-page .admin-side a { display:block; padding:12px 24px; font-size:15px; color:#2a3a2a; border-left:3px solid transparent; transition:var(--transition); cursor:pointer; }
.admin-page .admin-side a:hover, .admin-page .admin-side a.active { background:var(--green-bg); border-left-color:var(--green-primary); color:var(--green-primary); }
.admin-page .admin-side a i { margin-right:12px; width:20px; }
.admin-page .admin-main { flex:1; padding:24px 28px; }
.admin-page .admin-main .stat-grid { display:grid; grid-template-columns:repeat(auto-fill, minmax(180px,1fr)); gap:18px; margin-bottom:28px; }
.admin-page .admin-main .stat-card { background:#fff; border-radius:var(--radius); padding:20px 22px; border:1px solid var(--gray-border); box-shadow:var(--shadow); }
.admin-page .admin-main .stat-card .num { font-size:28px; font-weight:700; color:var(--green-primary); }
.admin-page .admin-main .stat-card .label { color:#6a7a6a; font-size:14px; }
.admin-table { background:#fff; border-radius:var(--radius); border:1px solid var(--gray-border); overflow:auto; box-shadow:var(--shadow); }
.admin-table table { width:100%; border-collapse:collapse; font-size:14px; }
.admin-table th { background:var(--gray-light); text-align:left; padding:12px 18px; font-weight:600; color:var(--green-dark); }
.admin-table td { padding:12px 18px; border-top:1px solid var(--gray-border); }
.admin-table .badge { display:inline-block; padding:2px 14px; border-radius:20px; font-size:12px; font-weight:500; }
.badge.green { background:var(--green-bg); color:var(--green-primary); }
.badge.orange { background:var(--orange-light); color:var(--orange); }
.badge.gray { background:var(--gray-light); color:#6a7a6a; }
.admin-table .btn-sm { padding:4px 14px; border-radius:20px; border:none; background:var(--green-primary); color:#fff; font-size:12px; cursor:pointer; transition:var(--transition); }
.admin-table .btn-sm:hover { background:var(--green-hover); }
.admin-table .btn-sm.outline { background:transparent; border:1px solid var(--gray-border); color:#4a5a4a; }
.admin-table .btn-sm.outline:hover { border-color:var(--green-primary); color:var(--green-primary); }
.admin-login { display:flex; align-items:center; justify-content:center; min-height:100vh; background:linear-gradient(135deg, #e8f5e9 0%, #c8e6c9 100%); }
.admin-login .box { background:#fff; padding:40px 44px; border-radius:var(--radius); box-shadow:0 20px 60px rgba(0,0,0,0.08); width:380px; max-width:92%; }
.admin-login .box h2 { font-size:26px; color:var(--green-dark); margin-bottom:8px; text-align:center; }
.admin-login .box p { color:#6a7a6a; text-align:center; margin-bottom:24px; }
.admin-login .box label { font-weight:500; font-size:14px; display:block; margin-bottom:4px; color:var(--green-dark); }
.admin-login .box input { width:100%; padding:12px 16px; border:1px solid var(--gray-border); border-radius:8px; font-size:15px; margin-bottom:18px; transition:var(--transition); background:#fafbfa; }
.admin-login .box input:focus { outline:none; border-color:var(--green-primary); box-shadow:0 0 0 3px rgba(45,138,78,0.12); }
.admin-login .box .login-btn { width:100%; padding:12px; background:var(--green-primary); color:#fff; border:none; border-radius:8px; font-size:16px; font-weight:600; cursor:pointer; transition:var(--transition); }
.admin-login .box .login-btn:hover { background:var(--green-hover); }
/* ===== 响应式 ===== */
@media (max-width:992px) {
    .admin-page .admin-side { width:180px; }
    .admin-page .admin-main { padding:16px; }
    .product-grid { grid-template-columns:repeat(auto-fill, minmax(150px,1fr)); }
}
@media (max-width:600px) {
    .admin-page .admin-side { width:100%; border-right:none; border-bottom:1px solid var(--gray-border); padding:10px 0; display:flex; flex-wrap:wrap; gap:4px; }
    .admin-page .admin-side a { padding:8px 14px; font-size:13px; border-left:none; border-bottom:2px solid transparent; }
    .admin-page .admin-side a:hover, .admin-page .admin-side a.active { border-left:none; border-bottom-color:var(--green-primary); }
    .admin-page .admin-body { flex-direction:column; }
    .admin-page .admin-main { padding:12px; }
    .admin-page .admin-main .stat-grid { grid-template-columns:1fr 1fr; gap:10px; }
    .admin-page .admin-main .stat-card { padding:14px 16px; }
    .admin-page .admin-main .stat-card .num { font-size:22px; }
    .admin-page .admin-table { font-size:12px; }
    .admin-page .admin-table th, .admin-page .admin-table td { padding:8px 10px; }
    .admin-login .box { padding:28px 20px; }
    .product-grid { grid-template-columns:1fr 1fr; gap:12px; }
    .footer .container { grid-template-columns:1fr 1fr; gap:16px; }
}