body { font-family: 'Plus Jakarta Sans', sans-serif; background-color: #f1f5f9; }
.custom-scroll::-webkit-scrollbar { width: 4px; }
.custom-scroll::-webkit-scrollbar-thumb { background: #cbd5e1; border-radius: 10px; }
.card-santri:hover { transform: translateY(-2px); transition: 0.2s; box-shadow: 0 10px 15px -3px rgba(0,0,0,0.1); }
.btn-delete-kelas { opacity: 0.6; transition: 0.2s; }
.btn-delete-kelas:hover { opacity: 1; color: white !important; }
.btn-filter-active { background-color: #16a34a !important; color: white !important; border-color: #15803d !important; }
.filter-terlambat { background-color: #f59e0b !important; color: white !important; border-color: #d97706 !important; }
.filter-seragam { background-color: #ef4444 !important; color: white !important; border-color: #dc2626 !important; }
.filter-alfa { background-color: #7c3aed !important; color: white !important; border-color: #6d28d9 !important; }
.seragam-gender-tab { background: transparent; color: #94a3b8; }
.seragam-gender-tab.active-sg { background: #fff; color: #b45309; box-shadow: 0 1px 2px rgba(0,0,0,0.1); }
.absen-tab-btn { background: transparent; color: #64748b; }
.absen-tab-btn.active-tab { background: #fff; color: #1e3a8a; box-shadow: 0 1px 3px rgba(0,0,0,0.1); border: 1px solid #dbeafe; }
.absen-status-input { width: 48px; text-align: center; border: 1px solid #e2e8f0; border-radius: 8px; padding: 4px; font-weight: 700; }
.absen-jamke-input { width: 100%; border: 1px solid #e2e8f0; border-radius: 8px; padding: 4px 6px; font-weight: 600; font-size: 11px; }

/* Staf Kesiswaan: "lepas baju" modal (Input Terlambat & Seragam, Input Absen,
   Memo Perizinan) biar nongol nyatu di halaman (bukan jendela modal mengambang)
   pas dipilih dari hamburger menu - display:none/flex-nya tetap diatur lewat JS. */
.kesiswaan-inline-modal { position: static !important; background: transparent !important; backdrop-filter: none !important; z-index: auto !important; padding: 0 !important; align-items: stretch !important; justify-content: flex-start !important; }
/* Modal inline yang posisinya di luar #mainApp (langsung di <body>, mis. Sakit
   Harian/Perizinan Pulang buat staf asrama) - samain lebar & jarak tepinya dengan
   konten dashboard, biar gak mepet ujung layar. */
body > .kesiswaan-inline-modal { max-width: 72rem; margin: 0 auto 1.5rem; padding: 0 1rem !important; }
@media (min-width: 768px) { body > .kesiswaan-inline-modal { padding: 0 1.5rem !important; } }
.kesiswaan-inline-modal > div { max-width: 100% !important; max-height: none !important; box-shadow: none !important; border: 1px solid #e2e8f0; }