:root{
  --navy:#0B1426;--navy-mid:#152038;--navy-light:#1E2F4D;--gold:#C9963A;--gold-light:#E8B84B;
  --cream:#FAF7F2;--white:#fff;--text-dark:#0B1426;--text-muted:#5A6478;--text-light:#8A93A6;
  --border:#E2DDD4;--success:#22c55e;--error:#ef4444;--warning:#f59e0b;--sidebar-w:240px;
}
*{margin:0;padding:0;box-sizing:border-box}html{scroll-behavior:smooth}body{font-family:'DM Sans',sans-serif;background:var(--cream);color:var(--text-dark);min-height:100vh}

/* LOADING */
.loading{position:fixed;inset:0;z-index:9999;background:var(--navy);display:flex;align-items:center;justify-content:center;flex-direction:column;gap:16px}
.spinner{width:48px;height:48px;border:3px solid rgba(201,150,58,.2);border-top-color:var(--gold);border-radius:50%;animation:spin .8s linear infinite}
@keyframes spin{to{transform:rotate(360deg)}}
.loading p{color:rgba(255,255,255,.55);font-size:14px}

/* SIDEBAR */
.sidebar{position:fixed;top:0;left:0;bottom:0;width:var(--sidebar-w);background:var(--navy);border-right:1px solid rgba(201,150,58,.15);display:flex;flex-direction:column;z-index:100;overflow-y:auto}
.sidebar-brand{padding:20px;border-bottom:1px solid rgba(255,255,255,.06);display:flex;align-items:center;gap:10px}
.brand-logo{width:42px;height:42px;border-radius:0;display:flex;align-items:center;justify-content:center;overflow:hidden;background:none;color:var(--gold);font-weight:700}
.brand-logo img{width:42px;height:42px;object-fit:contain}
.brand-text h3{font-family:'Playfair Display',serif;font-size:14px;color:#fff}
.brand-text span{font-size:10px;color:var(--gold);letter-spacing:1.5px;text-transform:uppercase}
.sidebar-section{padding:16px 12px 8px;font-size:10px;color:rgba(255,255,255,.35);letter-spacing:2px;text-transform:uppercase;font-weight:600}
.sidebar-nav{padding:0 12px;flex:1}
.nav-item{display:flex;align-items:center;gap:10px;width:100%;border:0;background:transparent;color:rgba(255,255,255,.55);padding:10px 12px;border-radius:8px;margin-bottom:3px;cursor:pointer;font-size:13.5px;font-weight:500;font-family:'DM Sans',sans-serif;text-align:left}
.nav-item:hover{background:rgba(255,255,255,.06);color:#fff}
.nav-item.active{background:rgba(201,150,58,.12);color:var(--gold);border-left:3px solid var(--gold);padding-left:9px}
.nav-badge{margin-left:auto;background:var(--gold);color:var(--navy);font-size:10px;font-weight:700;padding:2px 7px;border-radius:10px}
.sidebar-bottom{padding:16px 12px;border-top:1px solid rgba(255,255,255,.06)}
.admin-info{display:flex;align-items:center;gap:10px;padding:10px 12px;margin-bottom:8px}
.admin-avatar{width:32px;height:32px;border-radius:50%;background:var(--gold);display:flex;align-items:center;justify-content:center;font-weight:700;font-size:12px;color:var(--navy);overflow:hidden}
.admin-avatar img{width:100%;height:100%;object-fit:cover}
.admin-name{font-size:13px;color:#fff;font-weight:600}
.admin-role{font-size:11px;color:var(--gold)}
.btn-logout{width:100%;padding:9px;background:rgba(239,68,68,.1);color:#fca5a5;border:1px solid rgba(239,68,68,.2);border-radius:7px;font-size:13px;font-weight:500;cursor:pointer}

/* TOPBAR */
.topbar{position:fixed;top:0;left:var(--sidebar-w);right:0;height:60px;z-index:99;background:#fff;border-bottom:1px solid var(--border);display:flex;align-items:center;justify-content:space-between;padding:0 28px}
.topbar-title{font-family:'Playfair Display',serif;font-size:22px;font-weight:700}
.topbar-right{display:flex;align-items:center;gap:12px}
.topbar-btn{padding:8px 16px;border-radius:8px;font-size:13px;font-weight:600;cursor:pointer;font-family:'DM Sans',sans-serif;text-decoration:none;display:inline-flex;align-items:center;gap:6px}
.btn-primary{background:var(--gold);color:var(--navy);border:none}
.btn-primary:hover{background:var(--gold-light)}
.btn-outline{background:#fff;color:var(--text-muted);border:1px solid var(--border)}
.btn-outline:hover{border-color:var(--gold);color:var(--gold)}

/* MAIN / PAGES */
.main{margin-left:var(--sidebar-w);padding-top:60px;min-height:100vh}
.page{display:none;padding:28px}
.page.active{display:block}
.stats-row{display:grid;grid-template-columns:repeat(4,1fr);gap:16px;margin-bottom:24px}
.stat-card{background:#fff;border-radius:14px;padding:22px;border:1px solid var(--border);display:flex;align-items:center;gap:16px}
.stat-icon{width:52px;height:52px;border-radius:12px;display:flex;align-items:center;justify-content:center;font-size:22px;background:rgba(201,150,58,.12)}
.stat-num{font-family:'Playfair Display',serif;font-size:28px;font-weight:700}
.stat-label{font-size:13px;color:var(--text-muted);margin-top:3px}
.stat-change{font-size:11px;margin-top:4px;color:var(--success)}

/* CARDS */
.card{background:#fff;border-radius:14px;padding:24px;border:1px solid var(--border);margin-bottom:20px}
.card-header{display:flex;align-items:center;justify-content:space-between;margin-bottom:20px;padding-bottom:16px;border-bottom:1px solid var(--border)}
.card-title{font-family:'Playfair Display',serif;font-size:18px;font-weight:700;display:flex;align-items:center;gap:8px}
.two-col{display:grid;grid-template-columns:1fr 1fr;gap:20px}

/* TABLE */
.table-wrap{overflow-x:auto}
table{width:100%;border-collapse:collapse;font-size:13.5px}
thead th{text-align:left;padding:10px 14px;font-size:11px;font-weight:700;color:var(--text-muted);text-transform:uppercase;letter-spacing:.5px;border-bottom:1px solid var(--border);background:var(--cream)}
tbody tr{border-bottom:1px solid var(--border)}
tbody tr:hover{background:var(--cream)}
tbody td{padding:12px 14px;vertical-align:middle}
.member-row{display:flex;align-items:center;gap:10px}
.row-avatar{width:34px;height:34px;border-radius:50%;display:flex;align-items:center;justify-content:center;font-weight:700;font-size:12px;color:#fff;overflow:hidden;flex-shrink:0}
.row-avatar img{width:100%;height:100%;object-fit:cover}
.row-name{font-weight:700}
.row-email{font-size:12px;color:var(--text-muted)}

/* BADGES */
.badge{display:inline-flex;align-items:center;padding:3px 10px;border-radius:20px;font-size:11px;font-weight:700}
.badge-active{background:#dcfce7;color:#166534}
.badge-pending{background:#fef3c7;color:#92400e}
.badge-member{background:#e0f2fe;color:#0369a1}
.badge-admin{background:rgba(201,150,58,.15);color:#92400e}

/* ACTION BUTTONS */
.action-btns{display:flex;gap:6px;flex-wrap:wrap}
.btn-sm{padding:5px 12px;border-radius:6px;font-size:12px;font-weight:600;cursor:pointer;border:0}
.btn-sm.edit{background:rgba(34,197,94,.1);color:#16a34a}
.btn-sm.remove{background:rgba(239,68,68,.1);color:var(--error)}
.btn-sm.promote{background:rgba(201,150,58,.12);color:var(--gold)}
.btn-sm.demote{background:rgba(59,130,246,.12);color:#3b82f6}

/* SEARCH */
.search-bar{display:flex;gap:12px;margin-bottom:20px;flex-wrap:wrap}
.search-input{flex:1;min-width:200px;padding:10px 16px;border:1.5px solid var(--border);border-radius:8px;font-size:14px;background:#fff;outline:none}
.search-input:focus{border-color:var(--gold)}

/* FORM */
.form-group{margin-bottom:16px}
.form-group label{display:block;font-size:12px;font-weight:700;color:var(--text-muted);text-transform:uppercase;letter-spacing:.5px;margin-bottom:6px}
.form-group input,.form-group select,.form-group textarea{width:100%;padding:10px 14px;border:1.5px solid var(--border);border-radius:8px;font-size:14px;font-family:'DM Sans',sans-serif;color:var(--text-dark);background:var(--cream);outline:none;resize:vertical}
.form-group input:focus,.form-group select:focus,.form-group textarea:focus{border-color:var(--gold);background:#fff;box-shadow:0 0 0 3px rgba(201,150,58,.1)}
.form-row{display:grid;grid-template-columns:1fr 1fr;gap:14px}

/* ITEM GRID (events/news cards) */
.item-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(280px,1fr));gap:16px}
.item-card{background:var(--cream);border-radius:12px;padding:18px;border:1px solid var(--border)}
.item-card h4{font-family:'Playfair Display',serif;font-size:16px;margin:6px 0}
.item-card p{font-size:13px;color:var(--text-muted);line-height:1.6}
.item-type{font-size:10px;font-weight:800;text-transform:uppercase;letter-spacing:1.5px;color:var(--gold)}
.item-meta{font-size:12px;color:var(--text-light);display:flex;gap:12px;margin-top:10px}
.item-actions{display:flex;gap:6px;margin-top:12px;padding-top:12px;border-top:1px solid var(--border)}
.empty-state{text-align:center;padding:50px 20px;color:var(--text-muted)}
.empty-state .icon{font-size:42px;margin-bottom:10px}

/* MODAL */
.modal-overlay{position:fixed;inset:0;z-index:9998;background:rgba(0,0,0,.6);display:none;align-items:center;justify-content:center;backdrop-filter:blur(4px)}
.modal-overlay.open{display:flex}
.modal{background:#fff;border-radius:18px;padding:32px;max-width:540px;width:90%;position:relative;max-height:90vh;overflow-y:auto}
.modal-close{position:absolute;top:14px;right:14px;width:30px;height:30px;border-radius:50%;background:var(--cream);border:0;cursor:pointer;font-size:16px}
.modal h3{font-family:'Playfair Display',serif;font-size:22px;margin-bottom:6px}
.modal p{font-size:13px;color:var(--text-muted);margin-bottom:24px}

/* TOAST */
.toast{position:fixed;bottom:24px;right:24px;z-index:99999;background:var(--navy);color:#fff;padding:13px 20px;border-radius:10px;font-size:14px;font-weight:600;border-left:3px solid var(--gold);transform:translateX(220px);opacity:0;transition:.35s;pointer-events:none}
.toast.show{transform:translateX(0);opacity:1}

/* RESPONSIVE */
@media(max-width:768px){
  .sidebar{transform:translateX(-100%)}
  .main{margin-left:0}
  .topbar{left:0}
  .stats-row{grid-template-columns:1fr 1fr}
  .two-col{grid-template-columns:1fr}
  .form-row{grid-template-columns:1fr}
}
.badge-rejected {
  background: rgba(239,68,68,.12);
  color: var(--error);
}

/* Scholarship table alignment fix */
#page-scholarship table {
  min-width: 1050px;
  table-layout: fixed;
}

#page-scholarship th:nth-child(1),
#page-scholarship td:nth-child(1) {
  width: 170px;
}

#page-scholarship th:nth-child(2),
#page-scholarship td:nth-child(2) {
  width: 120px;
}

#page-scholarship th:nth-child(3),
#page-scholarship td:nth-child(3) {
  width: 150px;
}

#page-scholarship th:nth-child(4),
#page-scholarship td:nth-child(4) {
  width: 150px;
}

#page-scholarship th:nth-child(5),
#page-scholarship td:nth-child(5) {
  width: 120px;
}

#page-scholarship th:nth-child(6),
#page-scholarship td:nth-child(6) {
  width: 150px;
}

#page-scholarship th:nth-child(7),
#page-scholarship td:nth-child(7) {
  width: 100px;
}

#page-scholarship th:nth-child(8),
#page-scholarship td:nth-child(8) {
  width: 140px;
}

#page-scholarship td {
  vertical-align: top;
}

#page-scholarship .row-name {
  line-height: 1.25;
  word-break: break-word;
}

#page-scholarship .row-email {
  line-height: 1.35;
  word-break: break-word;
}