@php
    $user = auth()->user();

    //LMS mobile top navbar menu structure
    $menuConfig = [
        [
            'title' => 'Home',
            'icon' => 'ki-outline ki-home-2',
            'link' => '/',
            'active-url' => 'home',
        ],
        [
            'title' => 'Courses',
            'icon' => 'ki-outline ki-book',
            'submenu' => [
                ['title' => 'All Courses', 'link' => '/courses'],
                ['title' => 'Course Categories', 'link' => '/categories'],
                ['title' => 'Featured Courses', 'link' => '/featured-courses'],
            ],
            'showMore' => false,
            'maxShownEntries' => 3,
        ],
        [
            'title' => 'About',
            'icon' => 'ki-outline ki-information-5',
            'link' => '/about',
            'active-url' => 'about',
        ],
        [
            'title' => 'Resources',
            'icon' => 'ki-outline ki-folder',
            'submenu' => [
                ['title' => 'Blog', 'link' => '/blog'],
                ['title' => 'FAQ', 'link' => '/faq'],
                ['title' => 'Help Center', 'link' => '/help'],
            ],
            'showMore' => false,
            'maxShownEntries' => 3,
        ],
        [
            'title' => 'Contact',
            'icon' => 'ki-outline ki-message-text-2',
            'link' => '/contact',
            'active-url' => 'contact',
        ],
    ];
    $secondaryMenuConfig = [
        'title' => 'Labels',
        'items' => [
            ['title' => 'Google Ads', 'color' => 'primary', 'badge' => 6],
            ['title' => 'AirStoke App', 'color' => 'success', 'badge' => 2],
            ['title' => 'Internal Tasks', 'color' => 'warning', 'badge' => 37],
            ['title' => 'Fitnes App', 'color' => 'danger', 'badge' => 4],
        ],
        'showMore' => true,
        'maxShownEntries' => 4,
        'moreText' => 'Show more',
        'lessText' => 'Show less',
        'collapsibleItems' => [
            ['title' => 'Oppo CRM', 'color' => 'info', 'badge' => 12],
            ['title' => 'Finance Dispatch', 'color' => 'warning', 'badge' => 25],
        ],
    ];

    function generateMenu($menuItems,  $level = 0)
    {
        $html = '';
        foreach ($menuItems as $item) {
            $hasSubmenu = !empty($item['submenu']);
            $menuItemClass = 'menu-item fs-6' . ($hasSubmenu ? ' menu-accordion' : '');
            $menuTitleClass = '';

            // Check if the current item or any of its children is active
            $isActive = false;

            if (!empty($item['link'])) {
                $itemPath = ltrim($item['link'], '/'); // Remove leading slash
                $isActive = Request::path() === $itemPath;
            }
            if (!$isActive && $hasSubmenu) {
                $isActive = checkActiveSubmenu($item['submenu']);
            }

            if ($isActive) {
                $menuItemClass .= ' hover show';
                // $menuTitleClass .= ' text-primary';
            }

            $menuItemClass .= $hasSubmenu ? ' menu-accordion' : '';

            $html .= '<div' . ($hasSubmenu ? ' data-kt-menu-trigger="click"' : '') . ' class="' . $menuItemClass . '">';
            $html .= '<!--begin:Menu link-->';
            if (!empty($item['link'])) {
                $html .= '<a href="' . $item['link'] . '" class="menu-link">';
            } else {
                $html .= '<span class="menu-link">';
            }

            if ($level === 0) {
                $html .= '<span class="menu-icon"><i class="' . $item['icon'] . ' fs-2"></i></span>';
            } else {
                $html .= '<span class="menu-bullet"><span class="bullet bullet-dot"></span></span>';
            }
            $html .= '<span class="menu-title ' . $menuTitleClass . '">' . $item['title'] . '</span>';
            if ($hasSubmenu) {
                $html .= '<span class="menu-arrow"></span>';
            }
            $html .= '</span>';
            if (!empty($item['link'])) {
                $html .= '</a>';
            }
            $html .= '<!--end:Menu link-->';

            if ($hasSubmenu) {
                $html .= '<!--begin:Menu sub-->';
                $html .=
                    '<div class="menu-sub menu-sub-accordion' .
                    (isset($item['active']) && $item['active'] ? ' show' : '') .
                    '">';
                if (!empty($item['showMore']) && !empty($item['maxShownEntries'])) {
                    $visibleItems = array_slice($item['submenu'], 0, $item['maxShownEntries']);
                    $hiddenItems = array_slice($item['submenu'], $item['maxShownEntries']);

                    $html .= generateMenu($visibleItems,  $level + 1);

                    if (!empty($hiddenItems)) {
                        $collapseId =
                            'kt_app_sidebar_menu_' . strtolower(str_replace(' ', '_', $item['title'])) . '_collapse';
                        $html .= '<div class="menu-inner flex-column collapse" id="' . $collapseId . '">';
                        $html .= generateMenu($hiddenItems,  $level + 1);
                        $html .= '</div>';

                        $html .= '<div class="menu-item">';
                        $html .= '<div class="menu-content">';
                        $html .=
                            '<a class="btn btn-flex btn-color-primary d-flex flex-stack fs-base p-0 ms-2 mb-2 toggle collapsible collapsed" data-bs-toggle="collapse" href="#' .
                            $collapseId .
                            '" data-kt-toggle-text="' .
                            $item['lessText'] .
                            '">';
                        $html .= '<span data-kt-toggle-text-target="true">' . $item['moreText'] . '</span>';
                        $html .= '<i class="ki-outline ki-minus-square toggle-on fs-2 me-0"></i>';
                        $html .= '<i class="ki-outline ki-plus-square toggle-off fs-2 me-0"></i>';
                        $html .= '</a>';
                        $html .= '</div>';
                        $html .= '</div>';
                    }
                } else {
                    $html .= generateMenu($item['submenu'],  $level + 1);
                }
                $html .= '</div>';
                $html .= '<!--end:Menu sub-->';
            }
            $html .= '</div>';
        }
        return $html;
    }

    function checkActiveSubmenu($submenu)
    {
        foreach ($submenu as $item) {
            if (!empty($item['link'])) {
                $itemPath = ltrim($item['link'], '/'); // Remove leading slash
                if (Request::path() === $itemPath) {
                    return true;
                }
            }
            if (!empty($item['submenu'])) {
                if (checkActiveSubmenu($item['submenu'])) {
                    return true;
                }
            }
        }
        return false;
    }

    function generateSecondaryMenu($config)
    {
        $html = '<div class="app-sidebar-menu-secondary menu menu-rounded menu-column px-3 ">';
        $html .= '<div class="menu-item menu-labels">';
        $html .= '<div class="menu-content d-flex flex-stack fw-bold text-gray-600 text-uppercase fs-7">';
        $html .= '<span class="menu-heading ps-1">' . $config['title'] . '</span>';
        $html .= '<a class="menu-btn ps-2" href="#"><i class="ki-outline ki-plus-square fs-2 text-success"></i></a>';
        $html .= '</div></div>';
        $html .= '<div class="app-sidebar-separator separator mx-4 mt-2 mb-2"></div>';

        $visibleItems = array_slice($config['items'], 0, $config['maxShownEntries']);
        $hiddenItems = array_slice($config['items'], $config['maxShownEntries']);

        foreach ($visibleItems as $item) {
            $html .= generateSecondaryMenuItem($item);
        }

        if (!empty($hiddenItems) || !empty($config['collapsibleItems'])) {
            $html .= '<div class="menu-inner flex-column collapse" id="kt_app_sidebar_menu_projects_collapse">';
            foreach ($hiddenItems as $item) {
                $html .= generateSecondaryMenuItem($item);
            }
            if (!empty($config['collapsibleItems'])) {
                foreach ($config['collapsibleItems'] as $item) {
                    $html .= generateSecondaryMenuItem($item);
                }
            }
            $html .= '</div>';

            $html .= '<div class="menu-item">';
            $html .=
                '<a class="menu-link menu-collapse-toggle toggle collapsible collapsed" data-bs-toggle="collapse" href="#kt_app_sidebar_menu_projects_collapse" data-kt-toggle-text="' .
                $config['lessText'] .
                '">';
            $html .= '<span class="menu-icon ps-2">';
            $html .= '<i class="ki-outline ki-down toggle-off fs-4 text-gray-700 me-0"></i>';
            $html .= '<i class="ki-outline ki-up toggle-on fs-4 text-gray-700 me-0"></i>';
            $html .= '</span>';
            $html .=
                '<span class="menu-title text-gray-600 fw-semibold" data-kt-toggle-text-target="true">' .
                $config['moreText'] .
                '</span>';
            $html .= '</a>';
            $html .= '</div>';
        }

        $html .= '</div>';
        return $html;
    }

    function generateSecondaryMenuItem($item)
    {
        $html = '<div class="menu-item">';
        $html .= '<a class="menu-link" href="#">';
        $html .=
            '<span class="menu-icon ps-2"><span class="bullet bullet-dot h-10px w-10px bg-' .
            $item['color'] .
            '"></span></span>';
        $html .= '<span class="menu-title text-gray-700 fw-bold fs-6">' . $item['title'] . '</span>';
        $html .= '<span class="menu-badge"><span class="badge badge-secondary">' . $item['badge'] . '</span></span>';
        $html .= '</a></div>';
        return $html;
    }
@endphp
<!--begin::Sidebar-->
<div id="kt_app_sidebar" class="app-sidebar flex-column d-md-none" data-kt-drawer="true" data-kt-drawer-name="app-sidebar"
    data-kt-drawer-activate="{default: true, lg: false}" data-kt-drawer-overlay="true" data-kt-drawer-width="250px"
    data-kt-drawer-direction="start" data-kt-drawer-toggle="#kt_app_sidebar_mobile_toggle">
    <!--begin::Wrapper-->
    <div class="app-sidebar-wrapper">
        <div id="kt_app_sidebar_wrapper" class="hover-scroll-y my-5 my-lg-2 mx-4" data-kt-scroll="true"
            data-kt-scroll-activate="{default: false, lg: true}" data-kt-scroll-height="auto"
            data-kt-scroll-dependencies="#kt_app_header" data-kt-scroll-wrappers="#kt_app_sidebar_wrapper"
            data-kt-scroll-offset="5px">
            <!--begin::Sidebar menu-->
            <div id="kt_app_sidebar_menu" data-kt-menu="true"
                class="app-sidebar-menu-primary menu menu-column menu-rounded menu-sub-indention menu-state-bullet-primary px-3 mb-5">