* { margin:0; padding:0; box-sizing:border-box; font-family: Arial, Helvetica, sans-serif; }
body { background:#f4f6fb; }

/* ---------- Login Page ---------- */
.login-wrap { min-height:100vh; display:flex; align-items:center; justify-content:center; background:linear-gradient(135deg,#000066,#3a0ca3); }
.login-box { background:#fff; width:380px; border-radius:10px; padding:36px 32px; box-shadow:0 15px 35px rgba(0,0,0,0.3); }
.login-box h1 { color:#000066; font-size:20px; text-align:center; margin-bottom:6px; }
.login-box .brand-logo { width:80px; height:80px; border-radius:50%; display:block; margin:0 auto 14px; object-fit:cover; }
.login-box .sub { text-align:center; font-size:12px; color:#888; margin-bottom:24px; }
.login-box .form-group { margin-bottom:16px; }
.login-box label { display:block; font-size:13px; color:#000066; font-weight:bold; margin-bottom:6px; }
.login-box input { width:100%; padding:11px 12px; border:1px solid #ccd; border-radius:6px; font-size:14px; }
.login-box button {
  width:100%; padding:12px; background:#FF6600; border:none; color:#fff; font-weight:bold;
  border-radius:6px; text-transform:uppercase; font-size:14px; cursor:pointer; margin-top:6px;
}
.login-box button:hover { background:#e05a00; }
.error-msg { background:#ffe6e6; color:#c0392b; padding:10px; border-radius:6px; font-size:13px; margin-bottom:16px; text-align:center; }
.success-msg { background:#e6ffed; color:#1e7e34; padding:10px; border-radius:6px; font-size:13px; margin-bottom:16px; text-align:center; }

/* ---------- Admin Layout ---------- */
.admin-layout { display:flex; min-height:100vh; }
.sidebar { width:230px; background:#000066; color:#fff; flex-shrink:0; }
.sidebar-brand { padding:22px 20px; font-size:20px; font-weight:900; border-bottom:1px solid #1a1a8c; display:flex; align-items:center; gap:10px; }
.sidebar-brand img { width:38px; height:38px; border-radius:50%; object-fit:cover; }
.sidebar-brand span { display:block; font-size:11px; font-weight:normal; color:#FFFF00; letter-spacing:1px; }
.sidebar nav { display:flex; flex-direction:column; padding:14px 0; }
.sidebar nav a {
  color:#cfd8ff; text-decoration:none; padding:13px 22px; font-size:14px; display:flex; align-items:center; gap:10px;
}
.sidebar nav a i { width:16px; }
.sidebar nav a:hover, .sidebar nav a.active { background:#00008f; color:#fff; }
.sidebar nav a.logout-link { margin-top:auto; color:#ffb3b3; border-top:1px solid #1a1a8c; }

.main-content { flex:1; padding:30px 34px; }
.topbar { display:flex; justify-content:space-between; align-items:center; margin-bottom:26px; }
.topbar h1 { color:#000066; font-size:24px; }
.topbar .welcome { font-size:13px; color:#666; }

.stats-row { display:flex; gap:20px; margin-bottom:26px; flex-wrap:wrap; }
.stat-card { background:#fff; border-radius:10px; padding:20px 26px; box-shadow:0 4px 12px rgba(0,0,51,0.08); flex:1; min-width:180px; }
.stat-card .num { font-size:28px; font-weight:900; color:#000066; }
.stat-card .label { font-size:13px; color:#777; margin-top:4px; }

.panel { background:#fff; border-radius:10px; padding:26px; box-shadow:0 4px 12px rgba(0,0,51,0.08); margin-bottom:26px; }
.panel h2 { color:#000066; font-size:17px; margin-bottom:18px; }

.form-inline { display:flex; gap:14px; flex-wrap:wrap; align-items:flex-end; }
.form-inline .form-group { flex:1; min-width:160px; }
.form-inline label { display:block; font-size:12px; font-weight:bold; color:#000066; margin-bottom:6px; }
.form-inline input, .form-inline select { width:100%; padding:10px; border:1px solid #ccd; border-radius:6px; font-size:14px; }
.btn { background:#FF6600; color:#fff; border:none; padding:11px 22px; border-radius:6px; font-weight:bold; cursor:pointer; font-size:13px; text-transform:uppercase; }
.btn:hover { background:#e05a00; }
.btn-danger { background:#c0392b; }
.btn-danger:hover { background:#96281b; }
.btn-success { background:#1e7e34; }
.btn-success:hover { background:#155d27; }

.status-badge { padding:5px 12px; border-radius:20px; font-size:11px; font-weight:bold; text-transform:uppercase; }
.status-pending { background:#fff3cd; color:#8a6d1d; }
.status-approved { background:#e6ffed; color:#1e7e34; }
.status-rejected { background:#ffe6e6; color:#c0392b; }
.status-pass { background:#e6ffed; color:#1e7e34; }
.status-fail { background:#ffe6e6; color:#c0392b; }
.bulk-bar { display:flex; justify-content:flex-end; margin-bottom:12px; }
.action-group { display:flex; gap:8px; }
.table-photo { width:50px; height:50px; border-radius:50%; object-fit:cover; border:2px solid #000066; }

table { width:100%; border-collapse:collapse; margin-top:20px; }
table th { background:#000066; color:#fff; text-align:left; padding:12px; font-size:13px; text-transform:uppercase; }
table td { padding:12px; border-bottom:1px solid #eee; font-size:14px; color:#333; }
table tr:hover { background:#f8f9ff; }

.gallery-admin-grid { display:grid; grid-template-columns:repeat(5,1fr); gap:16px; margin-top:20px; }
.gallery-admin-item { position:relative; border-radius:8px; overflow:hidden; box-shadow:0 4px 10px rgba(0,0,0,0.15); aspect-ratio:1/1; }
.gallery-admin-item img { width:100%; height:100%; object-fit:cover; }
.gallery-admin-item form { position:absolute; top:6px; right:6px; }
.gallery-admin-item button { background:rgba(192,57,43,0.9); color:#fff; border:none; border-radius:50%; width:26px; height:26px; cursor:pointer; }