@import url('https://fonts.googleapis.com/css2?family=Koulen&family=Noto+Sans+Khmer:wght@400;500;600;700&family=Inter:wght@400;500;600;700&display=swap');

:root{
  --bg:#0B0C10; --bg-elevated:#14161C; --card:#1B1E26; --card-hover:#22252F;
  --border:#2A2D37; --crimson:#C81E3A; --crimson-dim:#7A1526; --gold:#D4A94F;
  --text:#EDE8E2; --text-muted:#8B8F9C;
  --font-display:'Koulen','Noto Sans Khmer',sans-serif;
  --font-body:'Noto Sans Khmer','Inter',sans-serif;
  --radius:10px;
}
*{ box-sizing:border-box; }
body{ margin:0; background:var(--bg); color:var(--text); font-family:var(--font-body); }
a{ color:inherit; text-decoration:none; }

.admin-layout{ display:flex; min-height:100vh; }
.admin-sidebar{
  width:230px; flex-shrink:0; background:var(--bg-elevated); border-right:1px solid var(--border);
  padding:22px 16px; position:sticky; top:0; height:100vh;
}
.admin-sidebar .logo{ font-family:var(--font-display); font-size:22px; margin-bottom:28px; display:block; }
.admin-sidebar .logo span{ color:var(--crimson); }
.admin-sidebar nav a{
  display:flex; align-items:center; gap:10px; padding:11px 14px; border-radius:8px;
  color:var(--text-muted); font-weight:600; font-size:14.5px; margin-bottom:4px;
}
.admin-sidebar nav a:hover{ background:var(--card); color:var(--text); }
.admin-sidebar nav a.active{ background:var(--crimson); color:#fff; }
.admin-sidebar .logout{ margin-top:24px; display:block; color:var(--text-muted); font-size:13.5px; }

.admin-main{ flex:1; padding:28px 32px; max-width:1100px; }
.admin-topbar{ display:flex; align-items:center; justify-content:space-between; margin-bottom:24px; }
.admin-topbar h1{ font-family:var(--font-display); font-size:26px; margin:0; }

.card{ background:var(--card); border:1px solid var(--border); border-radius:var(--radius); padding:22px; }
.stat-grid{ display:grid; grid-template-columns:repeat(auto-fit, minmax(180px,1fr)); gap:16px; margin-bottom:26px; }
.stat-card{ background:var(--card); border:1px solid var(--border); border-radius:var(--radius); padding:20px; }
.stat-card .n{ font-family:var(--font-display); font-size:32px; color:var(--gold); }
.stat-card .l{ color:var(--text-muted); font-size:13.5px; }

table{ width:100%; border-collapse:collapse; }
th, td{ text-align:left; padding:12px 14px; border-bottom:1px solid var(--border); font-size:14px; }
th{ color:var(--text-muted); font-weight:600; font-size:12.5px; text-transform:uppercase; letter-spacing:.4px; }
tr:hover td{ background:var(--card-hover); }
.table-thumb{ width:40px; height:56px; object-fit:cover; border-radius:4px; background:var(--bg-elevated); }

.btn{ display:inline-flex; align-items:center; gap:6px; padding:9px 16px; border-radius:6px; font-weight:700; font-size:13.5px; border:1px solid transparent; }
.btn-primary{ background:var(--crimson); color:#fff; }
.btn-outline{ border-color:var(--border); color:var(--text); background:transparent; }
.btn-outline:hover{ border-color:var(--gold); color:var(--gold); }
.btn-danger{ background:var(--crimson-dim); color:#fff; }
.btn-gold{ background:var(--gold); color:#1a1300; }
.btn-sm{ padding:6px 12px; font-size:12.5px; }

.field{ margin-bottom:16px; }
.field label{ display:block; font-size:13.5px; font-weight:600; margin-bottom:6px; color:var(--text-muted); }
.field input, .field select, .field textarea{
  width:100%; background:var(--bg-elevated); border:1px solid var(--border); color:var(--text);
  padding:11px 13px; border-radius:6px; font-size:14.5px; font-family:inherit;
}
.field textarea{ resize:vertical; min-height:100px; }
.field-row{ display:grid; grid-template-columns:1fr 1fr; gap:16px; }

.alert{ padding:11px 14px; border-radius:6px; font-size:13.5px; margin-bottom:18px; }
.alert-error{ background:rgba(200,30,58,.12); border:1px solid var(--crimson); color:#ff8fa0; }
.alert-success{ background:rgba(80,180,120,.12); border:1px solid #4caf7d; color:#8fe8b6; }

.badge{ padding:3px 10px; border-radius:20px; font-size:11.5px; font-weight:700; }
.badge-ongoing{ background:rgba(212,169,79,.15); color:var(--gold); }
.badge-completed{ background:rgba(80,180,120,.15); color:#8fe8b6; }

.auth-wrap{ min-height:100vh; display:flex; align-items:center; justify-content:center; padding:20px; }
.auth-card{ width:100%; max-width:380px; background:var(--card); border:1px solid var(--border); border-radius:var(--radius); padding:36px; }
.auth-card h1{ font-family:var(--font-display); font-size:26px; margin:0 0 4px; text-align:center; }
.auth-card .sub{ text-align:center; color:var(--text-muted); font-size:13.5px; margin-bottom:24px; }

@media (max-width:800px){
  .admin-layout{ flex-direction:column; }
  .admin-sidebar{ width:100%; height:auto; position:static; }
  .field-row{ grid-template-columns:1fr; }
}