/**
 * Fix Sub Menu - Align submenu items evenly (fix thò ra thụt vào)
 * Flatsome Child Theme
 */

/* Fix submenu items alignment - ensure all items have same padding */
.nav-dropdown-default .nav-column > li > a,
.nav-dropdown-default.nav-column > li > a,
.sub-menu.nav-column.nav-dropdown-default > li > a {
    padding-left: 20px !important;
    padding-right: 20px !important;
    padding-top: 10px !important;
    padding-bottom: 10px !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
    margin-top: 0 !important;
    margin-bottom: 0 !important;
    text-align: left !important;
    display: block !important;
    width: 100% !important;
    box-sizing: border-box !important;
}

/* Remove any margin from parent container that causes misalignment */
.nav-dropdown-default .nav-column > li,
.nav-dropdown-default.nav-column > li,
.sub-menu.nav-column.nav-dropdown-default > li {
    margin: 0 !important;
    padding: 0 !important;
    display: block !important;
    width: 100% !important;
    box-sizing: border-box !important;
}

/* Ensure consistent border for all items */
.nav-dropdown-default .nav-column > li > a {
    border-bottom: 1px solid #ececec !important;
    border-left: none !important;
    border-right: none !important;
    border-top: none !important;
}

/* Remove border from last item */
.nav-dropdown-default .nav-column > li:last-child > a {
    border-bottom: none !important;
}

/* Fix active/current items to have same padding */
.nav-dropdown-default .nav-column > li.active > a,
.nav-dropdown-default .nav-column > li.current-menu-item > a,
.nav-dropdown-default .nav-column > li.current-menu-parent > a,
.nav-dropdown-default .nav-column > li.current-menu-ancestor > a,
.sub-menu.nav-column.nav-dropdown-default > li.active > a,
.sub-menu.nav-column.nav-dropdown-default > li.current-menu-item > a {
    padding-left: 20px !important;
    padding-right: 20px !important;
    padding-top: 10px !important;
    padding-bottom: 10px !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
}

/* Remove any pseudo elements that might cause misalignment */
.nav-dropdown-default .nav-column > li > a:before,
.nav-dropdown-default .nav-column > li > a:after,
.nav-dropdown-default .nav-column > li.active > a:before,
.nav-dropdown-default .nav-column > li.active > a:after,
.sub-menu.nav-column.nav-dropdown-default > li > a:before,
.sub-menu.nav-column.nav-dropdown-default > li > a:after {
    display: none !important;
    content: none !important;
}

/* Ensure submenu container has consistent padding */
.nav-dropdown-default {
    padding: 20px !important;
}

.nav-dropdown-default .nav-column,
.sub-menu.nav-column.nav-dropdown-default {
    margin: 0 !important;
    padding: 0 !important;
    list-style: none !important;
}

/* Fix any text indentation issues */
.nav-dropdown-default .nav-column > li > a,
.sub-menu.nav-column.nav-dropdown-default > li > a {
    text-indent: 0 !important;
    line-height: 1.3 !important;
}

/* Ensure menu items are properly aligned vertically */
.nav-dropdown-default .nav-column > li {
    vertical-align: top !important;
}

/* Fix for nested submenus if any */
.nav-dropdown-default .nav-column .sub-menu > li > a {
    padding-left: 20px !important;
    padding-right: 20px !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
}

/* Ensure consistent width for all items */
.nav-dropdown-default .nav-column {
    width: 100% !important;
}

.nav-dropdown-default .nav-column > li {
    width: 100% !important;
}

/* Remove any transform or positioning that might cause misalignment */
.nav-dropdown-default .nav-column > li > a {
    position: relative !important;
    transform: none !important;
    -webkit-transform: none !important;
}

/* Fix hover states to maintain alignment */
.nav-dropdown-default .nav-column > li:hover > a {
    padding-left: 20px !important;
    padding-right: 20px !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
}

/* Fix nav-dropdown-col submenu positioning - align to the right of parent */
.nav-dropdown-col {
    position: relative !important;
}

/* Submenu of nav-dropdown-col should be positioned to the right, aligned with parent */
.nav-dropdown-col > .sub-menu.nav-column.nav-dropdown-default {
    position: absolute !important;
    left: 100% !important;
    top: 0 !important;
    right: auto !important;
    bottom: auto !important;
    margin-left: 0 !important;
    margin-top: 0 !important;
    min-width: 240px !important;
    width: auto !important;
    z-index: 999 !important;
    background: #fff !important;
    box-shadow: 2px 2px 5px rgba(130, 130, 130, 0.3) !important;
    border: 1px solid #d2d2d2 !important;
}

/* Ensure parent item doesn't break layout */
.nav-dropdown-col > a {
    position: relative !important;
}

/* Fix for when nav-dropdown-col is inside nav-dropdown */
.nav-dropdown > .nav-dropdown-col {
    position: relative !important;
}

.nav-dropdown > .nav-dropdown-col > .sub-menu.nav-column.nav-dropdown-default {
    position: absolute !important;
    left: 100% !important;
    top: 0 !important;
    margin-left: 0 !important;
    margin-top: 0 !important;
}

/* Ensure submenu items inside nav-dropdown-col submenu maintain alignment */
.nav-dropdown-col > .sub-menu.nav-column.nav-dropdown-default > li > a {
    padding-left: 20px !important;
    padding-right: 20px !important;
    padding-top: 10px !important;
    padding-bottom: 10px !important;
    margin: 0 !important;
}

/* Ensure submenu positioning works correctly when visible */
.nav-dropdown-col:hover > .sub-menu.nav-column.nav-dropdown-default,
.nav-dropdown > .nav-dropdown-col:hover > .sub-menu.nav-column.nav-dropdown-default,
.nav-dropdown-col.active > .sub-menu.nav-column.nav-dropdown-default,
.nav-dropdown-col.current-menu-item > .sub-menu.nav-column.nav-dropdown-default,
.nav-dropdown-col.current-menu-parent > .sub-menu.nav-column.nav-dropdown-default {
    position: absolute !important;
    left: 100% !important;
    top: 0 !important;
    margin-left: 0 !important;
    margin-top: 0 !important;
}

/* Mobile responsive - maintain alignment on small screens */
@media only screen and (max-width: 768px) {
    .nav-dropdown-default .nav-column > li > a,
    .sub-menu.nav-column.nav-dropdown-default > li > a {
        padding-left: 15px !important;
        padding-right: 15px !important;
    }
    
    .nav-dropdown-default .nav-column > li.active > a,
    .sub-menu.nav-column.nav-dropdown-default > li.active > a {
        padding-left: 15px !important;
        padding-right: 15px !important;
    }
    
    /* On mobile, submenu might need to stack below instead of beside */
    .nav-dropdown-col > .sub-menu.nav-column.nav-dropdown-default {
        position: relative !important;
        left: auto !important;
        top: auto !important;
        margin-left: 0 !important;
        margin-top: 0 !important;
    }
}

