/* ARMADA — gaya tambahan di atas Bootstrap 5 */
:root{
  --biru-tua:#0f2d52;
  --biru:#1c4e8a;
  --biru-muda:#e8f0fa;
  --lebar-sidebar:250px;
}
body{
  background:#f2f5f9;
  font-size:.9rem;
  padding-top:56px;
  min-height:100vh;
}
.bg-utama{background:var(--biru-tua)!important;}

/* ---------- Logo ---------- */
.kotak-logo{
  display:inline-flex;align-items:center;justify-content:center;
  width:38px;height:38px;border-radius:8px;background:#fff;padding:3px;flex:0 0 auto;
}
.kotak-logo img{max-width:100%;max-height:100%;object-fit:contain;}
.logo-masuk{max-width:190px;height:auto;display:block;margin:0 auto;}
.logo-cetak{display:none;}
@media print{
  .logo-cetak{display:block;max-width:150px;margin-bottom:.75rem;}
}

/* ---------- Halaman login ---------- */
.halaman-login{
  padding-top:0;
  background:linear-gradient(135deg,#0f2d52 0%,#1c4e8a 55%,#2c7bbf 100%);
}
.logo-bulat{
  width:64px;height:64px;border-radius:50%;
  background:var(--biru-tua);color:#fff;
  display:flex;align-items:center;justify-content:center;font-size:1.9rem;
}

/* ---------- Sidebar ---------- */
.sidebar{
  position:fixed;top:56px;left:0;bottom:0;width:var(--lebar-sidebar);
  background:var(--biru-tua);overflow-y:auto;z-index:1020;
}
.sidebar-mobile{background:var(--biru-tua);width:var(--lebar-sidebar);}
.menu-grup{
  padding:.85rem 1rem .3rem;font-size:.68rem;letter-spacing:.08em;
  text-transform:uppercase;color:rgba(255,255,255,.4);font-weight:700;
}
.menu-item{
  display:flex;align-items:center;gap:.65rem;
  padding:.55rem 1rem;color:rgba(255,255,255,.82);
  text-decoration:none;font-size:.855rem;border-left:3px solid transparent;
}
.menu-item i{width:18px;text-align:center;font-size:1rem;}
.menu-item:hover{background:rgba(255,255,255,.08);color:#fff;}
.menu-item.active{background:rgba(255,255,255,.14);color:#fff;border-left-color:#4da3ff;font-weight:600;}

.konten{margin-left:0;min-height:calc(100vh - 130px);}
@media (min-width:992px){ .konten{margin-left:var(--lebar-sidebar);} .teks-kaki{margin-left:var(--lebar-sidebar);} }
.teks-kaki{padding:.75rem 0;font-size:.78rem;color:#6c757d;border-top:1px solid #e3e7ee;background:#fff;}

/* ---------- Komponen ---------- */
.judul-halaman{font-size:1.15rem;font-weight:700;color:var(--biru-tua);margin:0;}
.card{border:1px solid #e4e9f0;border-radius:.6rem;}
.card-header{background:#fff;border-bottom:1px solid #eef1f6;font-weight:600;font-size:.9rem;}
.kartu-statistik{border-left:4px solid var(--biru);}
.kartu-statistik .nilai{font-size:1.35rem;font-weight:700;line-height:1.2;}
.kartu-statistik .label{font-size:.72rem;text-transform:uppercase;letter-spacing:.04em;color:#6c757d;font-weight:600;}
.kartu-statistik .ikon{font-size:1.7rem;opacity:.25;}

.table{font-size:.83rem;}
.table>thead{background:var(--biru-muda);}
.table>thead th{color:var(--biru-tua);font-weight:600;white-space:nowrap;font-size:.78rem;text-transform:uppercase;letter-spacing:.02em;}
.table td,.table th{vertical-align:middle;}
.tabel-gulir{overflow-x:auto;-webkit-overflow-scrolling:touch;}
.form-label{font-size:.8rem;font-weight:600;color:#41556e;margin-bottom:.2rem;}
.form-control,.form-select{font-size:.85rem;}
.wajib::after{content:" *";color:#dc3545;}
.btn{font-size:.85rem;}
.badge{font-weight:600;font-size:.7rem;}
.nowrap{white-space:nowrap;}
.text-mono{font-family:ui-monospace,SFMono-Regular,Menlo,monospace;font-size:.8rem;}
@media print{
  .sidebar,.navbar,.teks-kaki,.no-print{display:none!important;}
  .konten{margin-left:0;}
  body{padding-top:0;background:#fff;}
}