jQuery(document).ready(function ($){
let stack=[];
function addTap(selector, handler){
$(document).on('click touchend', selector, function(e){
if(e.type==='touchend') e.preventDefault();
handler.call(this, e);
});
}
$('.menu-item-has-children').each(function(){
if(!$(this).find('.submenu-arrow').length){
$(this).children('a').after('<span class="submenu-arrow"></span>');
}});
addTap('.cosmod-menu-toggle', function (){
$('.cosmod-mobile-menu').addClass('active');
$('.cosmod-overlay').addClass('active');
});
addTap('.menu-close, .cosmod-overlay', function (){
$('.cosmod-mobile-menu').removeClass('active');
$('.cosmod-overlay').removeClass('active');
$('.cosmod-menu-toggle').removeClass('active');
$('.menu-panel').not(':first').remove();
$('.menu-panel:first').addClass('active');
stack=[];
});
addTap('.submenu-arrow', function(e){
e.stopPropagation();
let parent=$(this).closest('.menu-item-has-children');
let submenu=parent.children('.sub-menu');
if(submenu.length){
let title=parent.children('a').text().trim().toUpperCase();
let newPanel=$('<div class="menu-panel"></div>');
let header=`
<div class="menu-header">
<span class="menu-back"></span>
<span class="menu-title-text">${title}</span>
<span class="menu-close"></span>
</div>
`;
newPanel.append(header);
let clonedMenu=submenu.clone();
clonedMenu.find('.sub-menu').hide();
clonedMenu.show();
newPanel.append(clonedMenu);
$('.cosmod-mobile-menu').append(newPanel);
setTimeout(function(){
$('.menu-panel').removeClass('active');
newPanel.addClass('active');
}, 10);
stack.push(newPanel);
}});
addTap('.menu-back', function (){
let current=stack.pop();
if(current){
current.remove();
$('.menu-panel:last').addClass('active');
}});
});