Menu hover not working when adding Log In / Register in header

Ok, fixed the blue upon hover by modifying the code to:

add_filter( 'wp_nav_menu_items', 'add_loginout_link', 3, 2 );
function add_loginout_link( $items, $args ) {
    if (is_user_logged_in() && $args->theme_location == 'avia') {
        $items .= '<li class="menu-item menu-item-type-post_type menu-item-object-page menu-item-top-level "><a href="'. get_permalink( wc_get_page_id( 'myaccount' ) ) .'">My Account
	<span class="avia-bullet"></span>
	<span class="avia-menu-fx">
		<span class="avia-arrow-wrap">
			<span class="avia-arrow"></span>
		</span>
	</span>
</a>
</li>';
        $items .= '<li class="menu-item menu-item-type-post_type menu-item-object-page menu-item-top-level "><a href="'. wp_logout_url( get_permalink( wc_get_page_id( 'myaccount' ) ) ) .'">Log Out
	<span class="avia-bullet"></span>
	<span class="avia-menu-fx">
		<span class="avia-arrow-wrap">
			<span class="avia-arrow"></span>
		</span>
	</span>
</a>
</li>';
    }
    elseif (!is_user_logged_in() && $args->theme_location == 'avia') {
        $items .= '<li class="menu-item menu-item-type-post_type menu-item-object-page menu-item-top-level "><a href="' . get_permalink( wc_get_page_id( 'myaccount' ) ) . '">Log In / Register
	<span class="avia-bullet"></span>
	<span class="avia-menu-fx">
		<span class="avia-arrow-wrap">
			<span class="avia-arrow"></span>
		</span>
	</span>
</a>
</li>';
    }
    return $items;
}

However, the blue line usually shows up as solid when you’re on that page and it doesn’t carry through for the pages I added using the code below (e.g. If I’m on the “About” page, the “About” header will be underlined. If I’m on the “My Account” page, which I’ve added through the above, the “My Account” link remains without decoration.)

It looks like the main issue is that the CSS class for that link is not updating. Any other page has:
li class="menu-item menu-item-type-post_type menu-item-object-page current-menu-item page_item page-item-3328 current_page_item menu-item-top-level "

whereas the pages I just created don’t update the class and retain:
li class="menu-item menu-item-type-post_type menu-item-object-page menu-item-top-level "

This suggests to me that the code provided above isn’t inserting itself properly into the avia functions. Can you advise on how to add the “Log In / Register,” “My Account,” and “Log Out” pages properly?

Thanks!

Yes, the menu is set as Enfold Main Menu on Appearance > Menus panel. The underline is only broken on the links I hacked aka the “Log in / Register” button where I used the code from https://kriesi.at/support/topic/woocommerce-account-loginlogout-not-wp-account/?login_error

For instance, try doing this to duplicate what I’m seeing:
1. Click “Log in / Register.”
2. When the page loads, you’ll note that the blue underline is missing under “Log in / Register.”
3. Click “Browse meals.”
4. When the page loads, you’ll note that there is a blue underline under “Browse meals.” This is my desired behavior for all menu items.

Hope that helps clarify the problem. Appreciate the help!