/* Navbar sticky dengan jarak 10px dari atas */
.navbar-sticky {
    position: sticky;
    top: 16px;
    z-index: 50;
    background-color: white;
    box-shadow: 0 4px 6px -1px rgba(0, 0, 0, 0.1), 0 2px 4px -1px rgba(0, 0, 0, 0.06);
}

/* Efek hover pada link menu */
.nav-link {
    transition: background 0.15s;
}

.nav-link:hover {
    background-color: rgba(99, 102, 241, 0.1);
    border-radius: 0.375rem;
}

/* Link aktif (Beranda) */
.nav-link.active {
    background-color: rgba(99, 102, 241, 0.15);
    color: #4f46e5;
    border-radius: 0.375rem;
    font-weight: 600;
}

.nav-link.active i {
    color: #4f46e5;
}

/* ======================================== */
/* FIX UNTUK DROPDOWN - HILANGKAN GAP */
/* ======================================== */

/* Dropdown wrapper untuk menutup gap */
.dropdown-wrapper {
    position: relative;
    padding-top: 8px;
    margin-top: -8px;
}

/* Desktop dropdown - muncul saat hover dengan fix */
@media (min-width: 768px) {
    /* Parent group hover - menampilkan dropdown */
    .group:hover .dropdown-menu {
        display: block;
    }
    
    /* Dropdown menu dengan gap yang aman */
    .group .dropdown-menu {
        display: none;
        /* Jarak 4px dari menu utama */
        margin-top: 4px;
        /* Tambahkan pseudo-element sebagai jembatan */
        position: absolute;
        left: 0;
        z-index: 20;
    }
    
    /* Jembatan antara menu dan dropdown (invisible bridge) */
    .group .dropdown-menu::before {
        content: '';
        position: absolute;
        top: -12px;
        left: 0;
        right: 0;
        height: 12px;
        background: transparent;
        /* Membuat area tidak terlihat sebagai jembatan */
    }
    
    /* Hover pada dropdown item */
    .dropdown-item {
        transition: background 0.1s;
        cursor: pointer;
    }
    
    .dropdown-item:hover {
        background-color: #f1f5f9;
    }
    
    /* Sub dropdown level 2 */
    .subgroup .sub-dropdown-menu {
        display: none;
        /* Jarak 4px dari menu level 1 */
        margin-left: 4px;
        position: absolute;
        left: 100%;
        top: 0;
        z-index: 30;
    }
    
    /* Jembatan untuk sub dropdown */
    .subgroup .sub-dropdown-menu::before {
        content: '';
        position: absolute;
        left: -12px;
        top: 0;
        bottom: 0;
        width: 12px;
        background: transparent;
    }
    
    /* Sub dropdown muncul saat hover */
    .subgroup:hover .sub-dropdown-menu {
        display: block;
    }
    
    /* Pastikan dropdown tetap terbuka saat hover di dalamnya */
    .group:hover .dropdown-menu,
    .group .dropdown-menu:hover {
        display: block;
    }
    
    .subgroup:hover .sub-dropdown-menu,
    .subgroup .sub-dropdown-menu:hover {
        display: block;
    }
}

/* ======================================== */
/* MOBILE DROPDOWN - tetap pakai click */
/* ======================================== */

@media (max-width: 767px) {
    .dropdown-menu-mobile {
        display: none;
    }

    .dropdown-menu-mobile.open {
        display: block;
    }

    .sub-dropdown-mobile {
        display: none;
    }

    .sub-dropdown-mobile.open {
        display: block;
    }
}

/* Animasi halus */
.dropdown-menu,
.sub-dropdown-menu,
.dropdown-menu-mobile,
.sub-dropdown-mobile {
    transition: all 0.2s ease-in-out;
}

/* Menu mobile */
.mobile-menu {
    display: none;
}

.mobile-menu.open {
    display: block;
}

/* Scroll pada menu mobile */
.mobile-menu-scroll {
    max-height: 70vh;
    overflow-y: auto;
}

/* Mobile menu item - tanpa border */
.mobile-menu-item {
    border: none !important;
    border-radius: 0.5rem;
}

.mobile-menu-item:hover {
    background-color: #f8fafc;
}

/* Sub menu mobile - tanpa border */
.mobile-sub-item {
    border: none !important;
}

.mobile-sub-item:hover {
    background-color: #f8fafc;
}

/* Level 3 sub menu mobile */
.mobile-sub-sub-item {
    border: none !important;
}

.mobile-sub-sub-item:hover {
    background-color: #f8fafc;
}

/* Menghilangkan border pada semua elemen di mobile menu */
.mobile-menu * {
    border-color: transparent !important;
}

.mobile-menu .border-l-2 {
    border-left-color: #e5e7eb !important;
}

.mobile-menu .border-l-2 {
    border-left-width: 2px;
    border-left-style: solid;
}

/* ======================================== */
/* OPSIONAL: HOVER DELAY UNTUK LEBIH SMOOTH */
/* ======================================== */

.group .dropdown-menu {
    transition-delay: 0.05s;
}

.subgroup .sub-dropdown-menu {
    transition-delay: 0.05s;
}