/* DROPDOWN SIMPLE - LANGSUNG BERFUNGSI */

/* HAPUS SEMUA OVERFLOW HIDDEN - PAKSA VISIBLE */
* {
    overflow: visible !important;
}

html, body, header, #stickyheader, .header-style2, .header7, .category-header7, .custom-container, .header-contain, .category-contain, .category-left, .category-right, .menu-block, #main-nav, #main-menu, .container, .container-fluid, .row, .col-12, section {
    overflow: visible !important;
    overflow-x: visible !important;
    overflow-y: visible !important;
}

/* HAPUS SEMUA BORDER DI NAVIGASI */
#main-menu, #main-menu *, #main-nav, #main-nav *, .category-header7, .category-header7 *, .menu-block, .menu-block * {
    border: none !important;
    border-width: 0 !important;
    border-style: none !important;
    border-color: transparent !important;
    outline: none !important;
    box-shadow: none !important;
}

/* MENU LINKS - HAPUS BORDER */
#main-menu > li > a, #main-menu > li > a.nav-link-transparent {
    background: transparent !important;
    color: #000000 !important;
    font-weight: bold !important;
    border: none !important;
    outline: none !important;
    box-shadow: none !important;
    padding: 8px 15px !important;
    font-size: 12px !important;
    text-transform: uppercase !important;
    text-decoration: none !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    white-space: nowrap !important;
    height: auto !important;
    line-height: 1.2 !important;
    border-radius: 0 !important;
}

#main-menu > li > a:hover, #main-menu > li > a.nav-link-transparent:hover {
    color: #e74c3c !important;
    background: transparent !important;
    border: none !important;
    outline: none !important;
    box-shadow: none !important;
}

/* ICON CHEVRON DROPDOWN - TAMPILKAN KEMBALI */
#main-menu > li > a i.fa-chevron-down {
    margin-left: 6px !important;
    font-size: 10px !important;
    color: #000000 !important;
    display: inline-block !important;
    transition: transform 0.2s ease !important;
}

#main-menu > li > a:hover i.fa-chevron-down {
    color: #e74c3c !important;
}

#main-menu > li:hover > a i.fa-chevron-down {
    transform: rotate(180deg) !important;
}

/* DROPDOWN BASIC STYLING */
#main-menu > li {
    position: relative !important;
}

#main-menu > li > ul {
    position: absolute !important;
    top: 100% !important;
    left: 0 !important;
    z-index: 999999 !important;
    background: white !important;
    border: 1px solid #ddd !important;
    border-radius: 5px !important;
    box-shadow: 0 4px 8px rgba(0,0,0,0.1) !important;
    min-width: 200px !important;
    padding: 5px 0 !important;
    margin: 2px 0 0 0 !important;
    display: none !important;
    list-style: none !important;
    overflow: visible !important;
}

#main-menu > li:hover > ul {
    display: block !important;
    overflow: visible !important;
}

#main-menu > li > ul > li {
    width: 100% !important;
    margin: 0 !important;
    padding: 0 !important;
    overflow: visible !important;
    border: none !important;
}

#main-menu > li > ul > li > a {
    display: block !important;
    padding: 10px 15px !important;
    color: #333 !important;
    text-decoration: none !important;
    font-size: 14px !important;
    border: none !important;
    background: transparent !important;
    text-transform: none !important;
    height: auto !important;
    border-radius: 0 !important;
    overflow: visible !important;
    outline: none !important;
    box-shadow: none !important;
}

#main-menu > li > ul > li > a:hover {
    background: #e74c3c !important;
    color: white !important;
    border: none !important;
    outline: none !important;
    box-shadow: none !important;
}

/* MOBILE */
@media (max-width: 768px) {
    * {
        overflow: visible !important;
    }
    
    #main-menu > li > ul {
        position: fixed !important;
        top: 60px !important;
        left: 10px !important;
        right: 10px !important;
        width: calc(100vw - 20px) !important;
        z-index: 9999999 !important;
        overflow: visible !important;
    }
}