/*
 * =========================================
 * KUSTOMISASI SIDEBAR MODERN - UNTUK ADMINLTE V2
 * =========================================
 */

/* 1. Mengubah container sidebar utama menjadi putih dengan sudut bulat */
.main-sidebar {
    background-color: #ffffff !important;
    box-shadow: 0 0 15px rgba(0, 0, 0, 0.1); /* Efek bayangan halus */
    border-right: none !important; /* Hapus garis batas kanan bawaan */
}

/* 2. Styling untuk setiap item menu (kondisi normal/tidak aktif) */
.sidebar-menu > li > a {
    color: #444444; /* Warna teks abu-abu gelap */
    padding: 12px 15px;
    margin: 8px 10px; /* Memberi jarak antar menu */
    border-radius: 8px; /* Sudut yang membulat untuk setiap item */
    transition: all 0.2s ease-in-out; /* Animasi halus */
}

/* 3. Styling untuk ikon */
.sidebar-menu > li > a > .fa {
    color: #555555; /* Warna ikon sedikit lebih gelap */
    width: 25px; /* Memberi ruang agar teks tidak terlalu mepet */
}

/* 4. STYLING UTAMA: Efek saat menu di-hover atau sedang aktif */
/* Kita gabungkan .active dan .treeview.menu-open agar submenu juga ter-highlight */
.sidebar-menu > li.active > a,
.sidebar-menu > li > a:hover,
.sidebar-menu > li.treeview.menu-open > a {
    background-color: #28a745 !important; /* Warna Latar Hijau */
    color: #ffffff !important; /* Warna Teks Putih */
    box-shadow: 0 4px 8px rgba(40, 167, 69, 0.3); /* Bayangan hijau halus */
}

/* 5. Mengubah warna ikon menjadi putih saat menu aktif/hover */
.sidebar-menu > li.active > a > .fa,
.sidebar-menu > li > a:hover > .fa,
.sidebar-menu > li.treeview.menu-open > a > .fa {
    color: #ffffff !important;
}

/* 6. Menghilangkan header menu dan panel user agar lebih bersih (opsional) */
.sidebar-menu .header,
.sidebar .user-panel {
    display: none;
}