CSS for Current Menu Item

This is what I’ve got to make it so the menu icons are underlined with dashes and then a solid line on hover and active state:

.html_header_top .av_bottom_nav_header #header_main_alternate .main_menu ul:first-child>li>a, span.avia-menu-text {
text-decoration: none;
border-bottom: 1px dashed #CF7E41;
-webkit-transition: .5s;
-moz-transition: .5s;
transition: .5s ease-out;
background-image: none!important;
}

.html_header_top .av_bottom_nav_header #header_main_alternate .main_menu ul:first-child>li:hover>a, span.avia-menu-text:hover {
border-bottom: 1px solid;
text-decoration: none;
-webkit-transition: .5s;
-moz-transition: .5s;
transition: .5s ease-out;
background-image: none!important;
}

#top h1 a, #top h2 a, #top h3 a, #top h4 a, #top h5 a, #top h6 a, #top #header .av-main-nav>li a, span.avia-menu-text, span.avia-menu-text:hover {
border-bottom-width: 2px;
-webkit-transition: .5s;
-moz-transition: .5s;
transition: .5s ease-out;
}

.menu-item-mega-parent.current-menu-item a>span.avia-menu-text {
border-bottom: 2px solid!important;
}

Yes, when you are at https://dev15.curlyhost.com/product/straight-corn-whisky/ I want the Spirits to have a solid underline and Straight Corn Whiskey to have a solid underline but NOT all of the other ones under Spirits unless they get hovered on. Does that make sense?

Just implemented and commented out:

/*.menu-item-mega-parent.current-menu-item a>span.avia-menu-text {
border-bottom: 2px solid!important;
}
*/

How do I also get the parent to hover along with the sub item?