/* ===============================================
   ULTIMATE SUBMENU HAD BRAND STYLING
   Maximum specificity override for complete submenu branding
   =============================================== */

/* Force HAD brand styling on submenu container with maximum specificity */
html body.body5.homepage .vl-header-area5 .container .row .col-lg-7 .vl-main-menu nav ul li.has-dropdown .sub-menu,
html body.body5 .vl-header-area5 .vl-main-menu ul li.has-dropdown .sub-menu,
html body .vl-header-area5 .vl-main-menu ul li .sub-menu,
html body .vl-main-menu ul li .sub-menu,
html body .has-dropdown .sub-menu,
html body .dropdown-menu {
    background: linear-gradient(135deg, #1E5F99 0%, #2E9BD8 100%) !important;
    border: 2px solid #FF6600 !important;
    border-radius: 8px !important;
    box-shadow: 0 8px 24px rgba(30, 95, 153, 0.3), 0 0 0 1px rgba(255, 102, 0, 0.2) !important;
    padding: 8px 0 !important;
    margin-top: 12px !important;
    min-width: 280px !important;
    backdrop-filter: blur(10px) !important;
}

/* Override any existing background or border styles */
html body .vl-main-menu ul li .sub-menu::before {
    background: none !important;
    border: none !important;
}

/* Submenu items with HAD branding */
html body.body5.homepage .vl-header-area5 .container .row .col-lg-7 .vl-main-menu nav ul li.has-dropdown .sub-menu li a,
html body.body5 .vl-header-area5 .vl-main-menu ul li.has-dropdown .sub-menu li a,
html body .vl-header-area5 .vl-main-menu ul li .sub-menu li a,
html body .vl-main-menu ul li .sub-menu li a,
html body .has-dropdown .sub-menu li a,
html body .sub-menu li a,
html body .dropdown-menu .dropdown-item {
    color: #FFFFFF !important;
    background: transparent !important;
    padding: 14px 20px !important;
    font-size: 15px !important;
    font-weight: 500 !important;
    border-radius: 0 !important;
    transition: all 0.3s ease !important;
    display: block !important;
    text-align: left !important;
    border-bottom: 1px solid rgba(255, 255, 255, 0.1) !important;
    margin: 0 !important;
    text-decoration: none !important;
}

/* Remove border from last submenu item */
html body .sub-menu li:last-child a,
html body .dropdown-menu .dropdown-item:last-child {
    border-bottom: none !important;
}

/* Submenu hover effects with HAD orange */
html body.body5.homepage .vl-header-area5 .container .row .col-lg-7 .vl-main-menu nav ul li.has-dropdown .sub-menu li a:hover,
html body.body5 .vl-header-area5 .vl-main-menu ul li.has-dropdown .sub-menu li a:hover,
html body .vl-header-area5 .vl-main-menu ul li .sub-menu li a:hover,
html body .vl-main-menu ul li .sub-menu li a:hover,
html body .has-dropdown .sub-menu li a:hover,
html body .sub-menu li a:hover,
html body .dropdown-menu .dropdown-item:hover {
    color: #FFFFFF !important;
    background: #FF6600 !important;
    padding-left: 28px !important;
    border-radius: 6px !important;
    margin: 0 8px !important;
    border-bottom: none !important;
    transform: translateX(5px) !important;
    box-shadow: 0 2px 8px rgba(255, 102, 0, 0.3) !important;
}

/* Active submenu item styling */
html body .sub-menu li a.active,
html body .dropdown-menu .dropdown-item.active {
    color: #FFFFFF !important;
    background: #FF6600 !important;
    font-weight: 600 !important;
    border-radius: 6px !important;
    margin: 0 8px !important;
    border-bottom: none !important;
    box-shadow: 0 2px 8px rgba(255, 102, 0, 0.3) !important;
}

/* HAD orange accent bar at top of submenu */
html body .vl-main-menu ul li .sub-menu::after,
html body .dropdown-menu::after {
    content: "" !important;
    position: absolute !important;
    top: 0 !important;
    left: 0 !important;
    height: 4px !important;
    width: 100% !important;
    background: linear-gradient(90deg, #FF6600 0%, #FF8533 100%) !important;
    border-radius: 8px 8px 0 0 !important;
    z-index: 10 !important;
}

/* Submenu arrow pointer */
html body .vl-main-menu ul li .sub-menu::before {
    content: "" !important;
    position: absolute !important;
    top: -8px !important;
    left: 20px !important;
    width: 0 !important;
    height: 0 !important;
    border-left: 8px solid transparent !important;
    border-right: 8px solid transparent !important;
    border-bottom: 8px solid #FF6600 !important;
    z-index: 11 !important;
}

/* Override template variables */
html body .vl-main-menu .sub-menu,
html body .has-dropdown .sub-menu,
html body .dropdown-menu {
    --vtc-bg-white1: #1E5F99 !important;
    --vtc-bg-white2: #1E5F99 !important;
    --vtc-bg-white3: #1E5F99 !important;
    --vtc-text-title-1: #FFFFFF !important;
    --vtc-text-title-2: #FFFFFF !important;
    --vtc-text-pera-1: #FFFFFF !important;
    --vtc-text-pera-2: #FFFFFF !important;
    --ztc-text-text-2: #FFFFFF !important;
}

/* Mobile submenu styling */
.vl-offcanvas .vl-main-menu ul li .sub-menu {
    background: rgba(30, 95, 153, 0.9) !important;
    border: 1px solid #FF6600 !important;
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.3) !important;
    backdrop-filter: blur(5px) !important;
}

/* Responsive adjustments */
@media (min-width: 992px) {
    html body .vl-main-menu ul li .sub-menu {
        position: absolute !important;
        top: 100% !important;
        left: 0 !important;
        z-index: 999 !important;
        opacity: 0 !important;
        visibility: hidden !important;
        transform: translateY(10px) scale(0.95) !important;
        transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1) !important;
    }
    
    html body .vl-main-menu ul li:hover > .sub-menu {
        opacity: 1 !important;
        visibility: visible !important;
        transform: translateY(0) scale(1) !important;
    }
}

/* Focus states for accessibility */
html body .sub-menu li a:focus,
html body .dropdown-menu .dropdown-item:focus {
    outline: 3px solid #FF6600 !important;
    outline-offset: -3px !important;
    background: rgba(255, 102, 0, 0.3) !important;
}

/* Force override any conflicting styles */
html body .sub-menu {
    background-color: #1E5F99 !important;
    background-image: linear-gradient(135deg, #1E5F99 0%, #2E9BD8 100%) !important;
}