Third Level menu works, but it needs toggle icon in mobile to avoid hover problem

[usamas2]

Hi, thanks for the great navbar walker, I'm using it in my wordpress site with bootstrap 4.6
It works fine, even I use it with 3rd level menu and it looks fine in desktop

the problem is that, in mobile, we can't use hover effect to make the third level menu show,

I need to know how to add toggle-split icon ( .dropdown-toggle-split ) with the second level menu, so visitors can:

• Click on the dropdown-toggle-split of the 2nd level menu to show the 3rd level menu (which is sub-categories from 2nd level category)
• or click on the 2nd level menu to open the 2nd level menu category directly

here you are my code in header.php

<?php wp_nav_menu([ 'theme_location' => 'header-menu', 'depth' => 3, 'container' => 'div', 'container_class' => 'collapse navbar-collapse', 'container_id' => 'bs-example-navbar-collapse-1', 'menu_class' => 'nav navbar-nav', 'fallback_cb' => 'WP_Bootstrap_Navwalker::fallback', 'walker' => new WP_Bootstrap_Navwalker(), ]); ?>

and below is css code to help showing 3rd level menu

`/* multilevel navigation */
ul.dropdown-menu li > ul.dropdown-menu {
left: 100%;
top: 0;
}

ul.dropdown-menu li:hover > ul.dropdown-menu, ul.dropdown-menu li:focus > ul.dropdown-menu {
display: block;
}`

I hope I can get help fixing this issue