In my bootstrap navbar the dropdown have submenus and the submenus also have submenus along with hyperlink.
When I am using in desktop the dropdown is showing the submenus on hover but in mobile it when the submenu is clicked then it hits the hyperlink and doesnot shows the other submenus. I want to have both of the feature like if submenu link is clicked then goes to the hyperlinked site and if icon is clicked then show the other submenu.

This is what I have tried

<nav class="navbar navbar-light bg-white navbar-static-top navbar-expand-lg header-sticky">
    <div class="container">
      <button type="button" class="navbar-toggler" data-bs-toggle="collapse" data-bs-target=".navbar-collapse"><i class="fas fa-align-left"></i></button>
      <a class="navbar-brand" href="#"> Navbar </a>
      <div class="navbar-collapse collapse justify-content-end">
        <ul class="nav navbar-nav">
          <li class="nav-item active"> <a class="nav-link" href="index.html">Home</a> </li>
          <li class="nav-item dropdown"> <a class="nav-link dropdown-toggle" data-bs-toggle="dropdown" aria-haspopup="true" aria-expanded="false" href="#">Dropdown <i class="fas fa-chevron-down fa-xs"></i></a> 

            <ul class="dropdown-menu">
               
              <li class="dropdown-submenu"><a class="dropdown-item dropdown-toggle" href="example.com">Dropdown 1 <i class="fas fa-chevron-right fa-xs"></i></a>
                  <ul class="dropdown-menu left-side">
                    
                    <li class="dropdown-submenu"><a class="dropdown-item dropdown-toggle" href="example2.com">Submenu 1 <i class="fas fa-chevron-right fa-xs"></i> </a>
                    
                      <ul class="dropdown-menu  left-side">
                        <li class="dropdown-submenu"><a class="dropdown-item dropdown-toggle" href="example3.com">Submenu 2 <i class="fas fa-chevron-right fa-xs"></i> </a>
                          
                          <ul class="dropdown-menu  left-side">
                            
                            <li><a class="dropdown-item" href="example4.com">Submenu 3</a></li>
                          </ul>
                        </li>
                        
                      </ul>
                    </li>
                        
                  </ul>
              </li>
                  
              
            </ul>

          </li>
          
        </ul>
      </div>
    </div>
  </nav>