body {
    background-color: #f8f9fa;
}

/* --- Layout Utama --- */
.main-wrapper {
    display: flex;
    min-height: 100vh;
}

.sidebar-wrapper {
    width: 280px;
    flex-shrink: 0;
}

.content-wrapper {
    flex-grow: 1;
    padding: 2rem;
    overflow-y: auto;
}

/* --- Sidebar Desktop --- */
.sidebar {
    position: fixed;
    top: 0;
    bottom: 0;
    left: 0;
    width: 280px;
    z-index: 100;
    background-color: #212529; /* bg-dark */
    color: white;
}

/* --- Header Mobile --- */
.mobile-header {
    display: none; /* Sembunyikan di desktop */
}


/* === Media Query untuk Tampilan Mobile === */
@media (max-width: 767.98px) {
    .sidebar-wrapper {
        display: none; /* Sembunyikan pembungkus sidebar di mobile */
    }

    .mobile-header {
        display: flex; /* Tampilkan header mobile */
    }
    
    .content-wrapper {
        padding: 1rem;
        padding-top: 70px; /* Beri jarak dari header mobile */
    }
}

/* ======================================================= */
/* === KODE BARU UNTUK PERBAIKAN TAMPILAN === */
/* ======================================================= */

/* 1. Perbaikan untuk foto profil di sidebar */
.sidebar-profile-pic {
    width: 32px !important;
    height: 32px !important;
    object-fit: cover !important; 
    border: 1px solid #555;
}

/* 2. Perbaikan agar nama di sidebar terlihat (menjadi putih) */
.sidebar .dropdown strong, .offcanvas .dropdown strong {
    color: white !important;
}

/* 3. Perbaikan untuk foto profil di halaman Profil Saya */
.profile-pic-large {
    width: 180px;      
    height: 180px;     
    object-fit: cover; 
    border: 4px solid #dee2e6; 
}