:root{
  --brand:#1e5f74;
  --brand-dark:#123a48;
  --accent:#f2a541;
  --ok:#2e8b57;
  --danger:#c0392b;
}
body{ background:#f4f6f8; font-family:'Segoe UI',Roboto,Arial,sans-serif; }

.app-navbar{ background:var(--brand-dark); position:sticky; top:0; z-index:1030; }

.app-wrapper{ display:flex; min-height:calc(100vh - 56px); }

.app-sidebar{
  width:230px; background:var(--brand); flex-shrink:0;
  transition:margin-left .2s ease;
}
.app-sidebar .nav-link{
  color:#e8f1f2; padding:.7rem 1.1rem; border-left:3px solid transparent; font-size:.92rem;
}
.app-sidebar .nav-link i{ width:20px; }
.app-sidebar .nav-link:hover{ background:rgba(255,255,255,.08); }
.app-sidebar .nav-link.active{ background:rgba(255,255,255,.15); border-left-color:var(--accent); font-weight:600; }

.app-content{ flex:1; padding:1.5rem; max-width:100%; overflow-x:auto; }

@media (max-width:991.98px){
  .app-sidebar{ position:fixed; left:0; top:56px; bottom:0; margin-left:-230px; z-index:1020; }
  .app-sidebar.show{ margin-left:0; }
}

.card-stat{ border:none; border-radius:14px; color:#fff; }
.card-stat.c1{ background:linear-gradient(135deg,#1e5f74,#0f3542); }
.card-stat.c2{ background:linear-gradient(135deg,#2e8b57,#1c5c39); }
.card-stat.c3{ background:linear-gradient(135deg,#f2a541,#c97f1c); }
.card-stat.c4{ background:linear-gradient(135deg,#c0392b,#8e2a20); }
.card-stat .icon{ font-size:2.2rem; opacity:.55; }

.table thead th{ background:var(--brand); color:#fff; font-size:.85rem; vertical-align:middle; }
.table td{ font-size:.88rem; vertical-align:middle; }

.badge-sertifikasi{ background:#2e8b57; }
.badge-ijazah{ background:#1e5f74; }
.badge-bentrok{ background:var(--danger); }

.jadwal-grid{ font-size:.8rem; }
.jadwal-grid th, .jadwal-grid td{ text-align:center; min-width:120px; }
.slot-isi{ background:#eaf6ef; border-radius:6px; padding:4px; cursor:pointer; }
.slot-isi:hover{ background:#d5f0e0; }
.slot-kosong{ color:#aaa; cursor:pointer; }
.slot-kosong:hover{ background:#f0f0f0; border-radius:6px; }

.login-wrapper{
  min-height:100vh; display:flex; align-items:center; justify-content:center;
  background:linear-gradient(135deg,var(--brand-dark),var(--brand));
}
.login-card{ border:none; border-radius:16px; box-shadow:0 15px 40px rgba(0,0,0,.25); overflow:hidden; }
.login-card .brand-side{
  background:linear-gradient(160deg,var(--brand),var(--brand-dark)); color:#fff; padding:2.5rem;
}

.eligible-item{ border:1px solid #ddd; border-radius:8px; padding:.5rem .8rem; margin-bottom:.4rem; cursor:pointer; }
.eligible-item:hover{ background:#f7f9fa; }
.eligible-item.selected{ border-color:var(--brand); background:#eaf3f5; }

@media print{
  .app-navbar, .app-sidebar, footer, .no-print{ display:none !important; }
  .app-content{ padding:0; }
}