/* CSS variables for repeated values */
:root {
    --mobile-menu-spacing: 8px;
    --submenu-indent: 16px;
    --toggle-size: 26px;
    --border-radius: 4px;
}

/* Main mobile nav container */
#wrapper .fusion-mobile-nav-holder {padding-top:100px; margin-top:32px; align-items:flex-start;}
#wrapper .fusion-mobile-nav-holder .fusion-menu {margin-top:0; padding-top:0; text-align:left;}

/* Main menu items */
#wrapper .fusion-flyout-mobile-menu .fusion-menu > li {display:flex; flex-wrap:wrap; justify-content:space-between; align-items:center; border-bottom:1px solid;}
#wrapper .fusion-flyout-mobile-menu .fusion-menu > li:last-child {border-bottom:0;}

/* Active menu item states */
#wrapper .fusion-flyout-mobile-menu .fusion-menu > li.fusion-mobile-current-nav-item > a > span,
#wrapper .fusion-flyout-mobile-menu .fusion-menu > li.fusion-mobile-current-nav-item li.fusion-mobile-current-nav-item > a > span {color:var(--awb-color7);}

/* Submenu structure ordering */
#wrapper .fusion-flyout-mobile-menu .fusion-menu > li > ul {order:3; width:100% !important;}
#wrapper .fusion-flyout-mobile-menu .fusion-menu > li > a {order:1; flex:1; padding:var(--mobile-menu-spacing) 0 !important;}
#wrapper .fusion-flyout-mobile-menu .fusion-menu .menu-item-has-children > div.submenu-toggle {order:2;}

/* Submenu toggle button */
#wrapper .fusion-flyout-mobile-menu .fusion-menu .menu-item-has-children .submenu-toggle {width:var(--toggle-size); height:var(--toggle-size); border:1px solid; border-radius:var(--border-radius); display:flex; align-items:center; justify-content:center; transition:all 0.3s;}
#wrapper .fusion-flyout-mobile-menu .fusion-menu .menu-item-has-children .submenu-toggle i {font-size:16px; transition:transform 0.3s;}

/* Active toggle state */
#wrapper .fusion-flyout-mobile-menu .fusion-menu .menu-item-has-children .submenu-toggle.active {background:var(--awb-color7);}
#wrapper .fusion-flyout-mobile-menu .fusion-menu .menu-item-has-children .submenu-toggle.active i {transform:rotate(180deg); color:#fff;}

/* Submenu items */
#wrapper .fusion-flyout-mobile-menu .fusion-menu .menu-item-has-children > ul li {display:flex; padding:var(--mobile-menu-spacing) 0;}
#wrapper .fusion-flyout-mobile-menu .fusion-menu .menu-item-has-children > ul li:last-child {border:none;}
#wrapper .fusion-flyout-mobile-menu .fusion-menu .menu-item-has-children > ul li a {margin-left:var(--submenu-indent); padding:0; width:100%; font-weight:500; font-size:16px; line-height:1.2;}

/* Button styling */
#wrapper .fusion-flyout-mobile-menu .fusion-menu > li.button {border:2px solid var(--primary); margin-top:16px; padding:0 !important;}
#wrapper .fusion-flyout-mobile-menu .fusion-menu > li.button a {padding:12px 24px !important;}
#wrapper .fusion-flyout-mobile-menu .fusion-menu > li.button a span {color:#fff;}
#wrapper .fusion-flyout-mobile-menu .fusion-menu > li.button:hover a span {color:var(--primary);}