:root { --admin-primary: #008040; --admin-primary-dark:#00552b; --admin-bg:#f5f7f6; --admin-surface:#fff; --admin-border:#dfe7e2; --admin-text:#14201a; --admin-muted:#6d7c74; --admin-radius:14px; --admin-shadow:0 10px 28px rgba(16,32,24,.08); }
html[data-theme="dark"] { --admin-bg:#0d1310; --admin-surface:#141b17; --admin-border:#24302a; --admin-text:#e9efeb; --admin-muted:#8b9a92; }
.admin-body { min-height:100vh; background:var(--admin-bg); color:var(--admin-text); }
.admin-shell { display:flex; min-height:100vh; }
.admin-sidebar { width:265px; flex:0 0 265px; background:var(--admin-surface); border-right:1px solid var(--admin-border); position:sticky; top:0; height:100vh; overflow-y:auto; z-index:20; }
.admin-brand { display:flex; gap:12px; align-items:center; padding:20px 18px; border-bottom:1px solid var(--admin-border); }
.admin-brand img { width:42px; height:42px; object-fit:cover; border-radius:10px; }
.admin-brand strong { display:block; font-size:15px; }
.admin-brand small { display:block; color:var(--admin-muted); font-size:11px; margin-top:2px; }
.admin-nav { padding:14px 10px; }
.admin-nav-title { font-size:10px; text-transform:uppercase; letter-spacing:.14em; color:var(--admin-muted); padding:12px 10px 7px; font-weight:700; }
.admin-nav a { display:flex; align-items:center; gap:11px; color:var(--admin-text); padding:10px 11px; border-radius:10px; text-decoration:none; margin-bottom:3px; font-size:14px; }
.admin-nav a:hover, .admin-nav a.active { background:rgba(0,128,64,.10); color:var(--admin-primary); }
.admin-nav a i { width:19px; text-align:center; }
.admin-main { flex:1; min-width:0; }
.admin-topbar { min-height:70px; display:flex; align-items:center; justify-content:space-between; gap:14px; padding:14px 24px; background:var(--admin-surface); border-bottom:1px solid var(--admin-border); position:sticky; top:0; z-index:15; }
.admin-topbar .title { margin:0; font-size:19px; font-weight:700; }
.admin-content { padding:24px; max-width:1600px; }
.admin-card { background:var(--admin-surface); border:1px solid var(--admin-border); border-radius:var(--admin-radius); box-shadow:var(--admin-shadow); }
.admin-card-header { padding:17px 18px; border-bottom:1px solid var(--admin-border); display:flex; align-items:center; justify-content:space-between; gap:12px; }
.admin-card-body { padding:18px; }
.stat-card { padding:18px; height:100%; }
.stat-card .icon { width:44px; height:44px; display:grid; place-items:center; border-radius:12px; background:rgba(0,128,64,.1); color:var(--admin-primary); }
.stat-card .number { font-size:29px; font-weight:800; margin-top:12px; }
.stat-card .label { color:var(--admin-muted); font-size:13px; }
.help { border-left:4px solid var(--admin-primary); background:rgba(0,128,64,.07); border-radius:10px; padding:14px 16px; }
.help summary { cursor:pointer; font-weight:700; }
.help ol, .help ul { margin:10px 0 0 18px; }
.table-admin th { white-space:nowrap; font-size:12px; text-transform:uppercase; letter-spacing:.04em; color:var(--admin-muted); }
.table-admin td { vertical-align:middle; }
.thumb { width:56px; height:42px; object-fit:cover; border-radius:8px; border:1px solid var(--admin-border); background:#eee; }
.gallery-grid { display:grid; grid-template-columns:repeat(auto-fill,minmax(170px,1fr)); gap:12px; }
.gallery-item { border:1px solid var(--admin-border); border-radius:12px; overflow:hidden; background:var(--admin-surface); }
.gallery-item img { width:100%; height:120px; object-fit:cover; display:block; }
.gallery-item .meta { padding:10px; }
.preview-grid { display:grid; grid-template-columns:repeat(auto-fill,minmax(120px,1fr)); gap:10px; margin-top:10px; }
.preview-grid img { width:100%; height:95px; object-fit:cover; border-radius:10px; border:1px solid var(--admin-border); }
.form-label { font-weight:600; }
.required::after { content:' *'; color:#c62828; }
.sticky-actions { position:sticky; bottom:12px; padding:12px; background:color-mix(in srgb, var(--admin-surface) 94%, transparent); border:1px solid var(--admin-border); border-radius:12px; backdrop-filter:blur(8px); z-index:10; }
.sidebar-toggle { display:none; }
@media (max-width: 991.98px) {
  .admin-sidebar { position:fixed; left:-285px; transition:left .2s ease; box-shadow:0 20px 40px rgba(0,0,0,.18); }
  body.sidebar-open .admin-sidebar { left:0; }
  .sidebar-toggle { display:inline-flex; }
  .admin-content { padding:16px; }
}
@media (max-width:575.98px) { .admin-topbar { padding:12px 14px; } .admin-topbar .title { font-size:16px; } .admin-content { padding:12px; } }