/* ============ Admin dashboard styles (mobile-first) ============ */
:root {
  --green-900:#23431f; --green-700:#3d6b35; --green-500:#6a994e; --green-100:#e6efe2;
  --cream:#f4f5f2; --ink:#22271f; --muted:#6b7267; --white:#fff; --red:#c0392b; --gold:#c9a227;
  --radius:12px; --shadow:0 4px 18px rgba(35,67,31,.08);
}
* { margin:0; padding:0; box-sizing:border-box; }
body { font-family:'Inter',system-ui,sans-serif; background:var(--cream); color:var(--ink); font-size:.95rem; }
a { color:var(--green-700); text-decoration:none; }
h1,h2,h3 { color:var(--green-900); }

.admin-shell { display:flex; min-height:100vh; }

.sidebar { position:fixed; z-index:60; top:0; bottom:0; left:-250px; width:240px; background:var(--green-900); color:#d7e3d0; display:flex; flex-direction:column; transition:left .25s; }
.sidebar.open { left:0; }
.sidebar-brand { padding:1.2rem 1.2rem 1rem; font-weight:700; font-size:1.05rem; color:#fff; border-bottom:1px solid rgba(255,255,255,.12); }
.sidebar nav { flex:1; overflow-y:auto; padding:.7rem 0; }
.sidebar nav a { display:block; padding:.62rem 1.2rem; color:#d7e3d0; font-size:.9rem; }
.sidebar nav a:hover { background:rgba(255,255,255,.08); color:#fff; }
.sidebar nav a.active { background:var(--green-700); color:#fff; border-left:4px solid var(--gold); padding-left:calc(1.2rem - 4px); }
.sidebar-foot { border-top:1px solid rgba(255,255,255,.12); padding:.7rem 0; }
.sidebar-foot a { display:block; padding:.45rem 1.2rem; color:#b9ccb0; font-size:.86rem; }
.sidebar-foot a:hover { color:#fff; }

.admin-main { flex:1; min-width:0; }
.admin-topbar { background:var(--white); box-shadow:0 1px 8px rgba(0,0,0,.06); display:flex; align-items:center; gap:1rem; padding:.75rem 1.2rem; position:sticky; top:0; z-index:50; }
.admin-topbar h1 { font-size:1.1rem; flex:1; }
.sidebar-toggle { background:none; border:0; font-size:1.4rem; cursor:pointer; color:var(--green-900); }
.topbar-user { font-size:.85rem; color:var(--muted); display:flex; align-items:center; gap:.5rem; }
.role-chip { background:var(--green-100); color:var(--green-700); font-size:.7rem; font-weight:700; padding:.15rem .55rem; border-radius:99px; text-transform:uppercase; letter-spacing:.05em; }

.admin-content { padding:1.4rem; max-width:1100px; }

/* Cards & stats */
.stat-grid { display:grid; grid-template-columns:1fr 1fr; gap:1rem; margin-bottom:1.6rem; }
.stat-card { background:var(--white); border-radius:var(--radius); box-shadow:var(--shadow); padding:1.1rem 1.2rem; }
.stat-card small { color:var(--muted); text-transform:uppercase; font-size:.68rem; letter-spacing:.08em; }
.stat-card strong { display:block; font-size:1.45rem; color:var(--green-700); margin-top:.2rem; }

.panel { background:var(--white); border-radius:var(--radius); box-shadow:var(--shadow); padding:1.4rem; margin-bottom:1.6rem; }
.panel h2 { font-size:1.05rem; margin-bottom:1rem; }

/* Tables */
.table-wrap { overflow-x:auto; }
table.admin-table { width:100%; border-collapse:collapse; background:var(--white); border-radius:var(--radius); overflow:hidden; box-shadow:var(--shadow); }
.admin-table th, .admin-table td { padding:.7rem .9rem; text-align:left; font-size:.88rem; border-bottom:1px solid #eef1ec; vertical-align:middle; }
.admin-table th { background:var(--green-100); color:var(--green-900); font-weight:600; white-space:nowrap; }
.admin-table tr:last-child td { border-bottom:0; }
.admin-table img.thumb, .admin-table video.thumb { width:64px; height:44px; object-fit:cover; border-radius:6px; display:block; }

/* Forms */
.form-group { margin-bottom:1rem; }
.form-group label { display:block; font-weight:600; font-size:.84rem; margin-bottom:.3rem; color:var(--green-900); }
.form-group input, .form-group textarea, .form-group select {
  width:100%; padding:.62rem .8rem; border:1.5px solid #d8ded4; border-radius:9px; font-family:inherit; font-size:.92rem; background:#fbfcfa;
}
.form-group input:focus, .form-group textarea:focus, .form-group select:focus { outline:none; border-color:var(--green-500); background:#fff; }
.form-row { display:grid; grid-template-columns:1fr; gap:0 1rem; }
.form-hint { font-size:.78rem; color:var(--muted); margin-top:.25rem; }

.btn { display:inline-block; padding:.55rem 1.2rem; border-radius:9px; font-weight:600; border:0; cursor:pointer; font-family:inherit; font-size:.88rem; transition:.15s; }
.btn-primary { background:var(--green-700); color:#fff; }
.btn-primary:hover { background:var(--green-900); }
.btn-outline { border:1.5px solid var(--green-700); color:var(--green-700); background:transparent; }
.btn-danger { background:#fdeaea; color:var(--red); }
.btn-danger:hover { background:var(--red); color:#fff; }
.btn-sm { padding:.32rem .7rem; font-size:.78rem; }

/* Badges */
.badge { font-size:.7rem; font-weight:700; padding:.18rem .55rem; border-radius:99px; text-transform:uppercase; letter-spacing:.04em; }
.badge-green { background:var(--green-100); color:var(--green-700); }
.badge-gold { background:#fdf3d7; color:#9a7b12; }
.badge-grey { background:#ececec; color:var(--muted); }
.badge-red { background:#fdeaea; color:var(--red); }

.alert { padding:.8rem 1.1rem; border-radius:9px; margin-bottom:1.1rem; font-size:.9rem; }
.alert-success { background:var(--green-100); color:var(--green-900); border:1px solid var(--green-500); }
.alert-error { background:#fdeaea; color:var(--red); border:1px solid #eebbbb; }

.inline-form { display:inline; }
.actions-cell { white-space:nowrap; }
.settings-tabs { display:flex; flex-wrap:wrap; gap:.4rem; margin-bottom:1.2rem; }
.settings-tabs a { padding:.42rem .95rem; border-radius:99px; background:var(--white); box-shadow:var(--shadow); font-size:.84rem; font-weight:600; }
.settings-tabs a.active { background:var(--green-700); color:#fff; }
.current-img { max-height:70px; border-radius:8px; margin-top:.4rem; }

/* Login page */
.login-wrap { min-height:100vh; display:grid; place-items:center; background:linear-gradient(150deg,var(--green-900),var(--green-700)); padding:1rem; }
.login-card { background:#fff; border-radius:16px; box-shadow:0 20px 60px rgba(0,0,0,.3); padding:2.2rem; width:min(400px,100%); }
.login-card h1 { font-size:1.25rem; margin-bottom:.3rem; }
.login-card p.sub { color:var(--muted); font-size:.86rem; margin-bottom:1.4rem; }

@media (min-width:900px) {
  .sidebar { left:0; }
  .admin-main { margin-left:240px; }
  .sidebar-toggle { display:none; }
  .stat-grid { grid-template-columns:repeat(4,1fr); }
  .form-row { grid-template-columns:1fr 1fr; }
}