.profile-header {
  background: linear-gradient(135deg, #1e40af, #3b82f6);
}

/* CSS untuk Halaman Dashboard Alumni Kustom */
.alumni-dashboard-page {
    background-color: #f8f9fa; /* Latar belakang area konten */
}

.alumni-sidebar {
    width: 280px; /* Lebar sidebar */
    position: fixed; /* Tetap di tempat saat scroll */
    top: 0;
    left: 0;
    height: 100vh;
    overflow-y: auto;
    z-index: 1000;
    transition: left 0.3s ease; /* Transisi untuk animasi */
}

.alumni-sidebar .nav-link {
    padding: 0.75rem 1rem;
    transition: background-color 0.2s ease-in-out;
}

.alumni-sidebar .nav-link:hover {
    background-color: rgba(255, 255, 255, 0.1);
}

.alumni-sidebar .nav-link.active {
    background-color: var(--bs-primary); /* Warna biru Bootstrap */
    font-weight: bold;
}

.alumni-content {
    margin-left: 280px; /* Lebar yang sama dengan sidebar */
    width: calc(100% - 280px); /* Lebar sisa */
    height: 100vh;
    transition: margin-left 0.3s ease; /* Transisi untuk konten saat sidebar muncul/hilang di desktop jika diperlukan */
}

/* Responsif untuk mobile - Off Canvas */
@media (max-width: 768px) {
    .alumni-sidebar {
        left: -280px; /* Sembunyikan sidebar ke kiri */
        /* position: fixed; sudah di atas */
        /* height: 100vh; sudah di atas */
        /* width: 280px; sudah di atas */
        /* z-index: 1050; dinaikkan sedikit agar di atas konten */
        background-color: #212529; /* Pastikan ada background */
        box-shadow: 0 0.5rem 1rem rgba(0, 0, 0, 0.15); /* Tambahkan shadow */
    }

    .alumni-sidebar.active {
        left: 0; /* Tampilkan sidebar */
    }

    .alumni-content {
        margin-left: 0; /* Konten mengisi seluruh layar */
        width: 100%;
        height: auto; /* Biarkan tinggi menyesuaikan konten */
        min-height: 100vh; /* Pastikan konten mengisi layar */
    }
    
    /* Tombol toggle hanya muncul di mobile */
    #sidebar-toggle-button { 
        display: block; 
        position: fixed; /* Agar tetap terlihat saat scroll */
        top: 15px;
        left: 15px;
        z-index: 1051; /* Di atas sidebar */
    }

    /* Opsional: Overlay gelap saat sidebar aktif di mobile */
    body.sidebar-open::before {
        content: '';
        position: fixed;
        top: 0;
        left: 0;
        width: 100%;
        height: 100%;
        background-color: rgba(0, 0, 0, 0.5);
        z-index: 1040; /* Di bawah sidebar tapi di atas konten */
        display: block;
    }
}

/* Sembunyikan tombol toggle di desktop */
@media (min-width: 769px) {
    #sidebar-toggle-button {
        display: none;
    }
}