@if (auth()->guard("web")->user()->account_type != "Salesmen")

<style>
    .hight_auto{
        height: 100% !important;
    }
    </style>
@endif

<div class="sidebar-wrapper sidebar-theme">
    <nav id="sidebar">
        <div class="fixed-profile">
            <div class="premium-border">
            @php $path = asset('/uploads/salesmen').'/'; @endphp
                <img src="{{ $path.auth()->guard('web')->user()->profile_image }}" class="profile-avatar"/>
            </div>
            <div class="mt-3">
                <h6 class="text-white font-14 mb-1">{{ auth()->guard("web")->user()->name }}</h6>
                <p class="text-white font-13 mb-0">{{auth()->guard("web")->user()->account_type}}</p>
            </div>
            <!-- <ul class="flex-row profile-option-container">
                <li class="option-item dropdown message-dropdown">
                    <div class="option-link-container dropdown-toggle" id="messageDropdown" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
                        <a class="option-link dropdown-toggle">
                            <i class="las la-envelope"></i>
                        </a>
                        <div class="text-left">
                            <h6>Mail</h6>
                            <p>3 New Mails</p>
                        </div>
                    </div>
                    <div class="dropdown-menu position-absolute md-container" aria-labelledby="messageDropdown">
                        <div class="nav-drop is-notification-dropdown">
                            <div class="inner">
                                <div class="nav-drop-header">
                                    <span class="text-black font-12 strong">3 new mails</span>
                                    <a class="text-muted font-12" href="#">
                                        Mark all read
                                    </a>
                                </div>
                                <div class="nav-drop-body account-items pb-0">
                                    <a class="account-item">
                                        <div class="media">
                                            <div class="user-img">
                                                <img class="rounded-circle avatar-xs" src="{{ asset('assets/common-assets/img/profile-11.jpg') }}" alt="profile">
                                            </div>
                                            <div class="media-body">
                                                <div class="">
                                                    <h6 class="text-dark font-13 mb-0 strong">Jennifer Queen</h6>
                                                    <p class="m-0 mt-1 font-10 text-muted">Permission Required</p>
                                                </div>
                                            </div>
                                        </div>
                                    </a>
                                    <a class="account-item marked-read">
                                        <div class="media">
                                            <div class="user-img">
                                                <img class="rounded-circle avatar-xs" src="{{ asset('assets/common-assets/img/profile-10.jpg') }}" alt="profile">
                                            </div>
                                            <div class="media-body">
                                                <div class="">
                                                    <h6 class="text-dark font-13 mb-0 strong">Lara Smith</h6>
                                                    <p class="m-0 mt-1 font-10 text-muted">Invoice needed</p>
                                                </div>
                                            </div>
                                        </div>
                                    </a>
                                    <a class="account-item marked-read">
                                        <div class="media">
                                            <div class="user-img">
                                                <img class="rounded-circle avatar-xs" src="{{ asset('assets/common-assets/img/profile-9.jpg') }}" alt="profile">
                                            </div>
                                            <div class="media-body">
                                                <div class="">
                                                    <h6 class="text-dark font-13 mb-0 strong">Victoria Williamson</h6>
                                                    <p class="m-0 mt-1 font-10 text-muted">Account need to be synced</p>
                                                </div>
                                            </div>
                                        </div>
                                    </a>
                                    <hr class="account-divider">
                                    <div class="text-center">
                                        <a class="text-primary strong font-13" href="apps_mail.html">View All</a>
                                    </div>
                                </div>
                            </div>
                        </div>
                    </div>
                </li>
                <li class="option-item dropdown notification-dropdown">
                    <a class="option-link-container" href="pages_notifications.html">
                        <div class="option-link">
                            <i class="las la-bell"></i>
                            <div class="blink">
                                <div class="circle"></div>
                            </div>
                        </div>
                        <div class="text-left">
                            <h6>Notifications</h6>
                            <p>4 Unread</p>
                        </div>
                    </a>
                </li>
            </ul> -->
        </div>
        @php
        $currenturl = url()->current();
        @endphp
        <ul class="list-unstyled menu-categories "@if (auth()->guard("web")->user()->account_type != "Salesmen") style="height:100% !important"  @endif  id="accordionExample">
            <li class="menu @if($currenturl == route('salesmen-dashboard')) active @endif">
                <a href="{{ route('salesmen-dashboard') }}" id="dashboard"  @if($currenturl == route('salesmen-dashboard')) data-active="true" @endif class="dropdown-toggle">
                    <i class="las la-home"></i>
                    <span>Dashboard</span>
                </a>
            </li>
            @if(auth()->guard("web")->user()->account_type == "Salesmen")
            <li class="menu @if($currenturl == route('salesmen-product-item-list')) active @endif ">
                <a href="{{ route('salesmen-product-item-list') }}" id="apps" @if($currenturl == route('salesmen-product-item-list')) data-active="true" @endif  class="dropdown-toggle">
                    <i class="lab la-medapps"></i>
                    <span>Product Item</span>
                </a>
            </li>

            <li class="menu @if($currenturl == route('salesmen-product-material-list')) active @endif ">
                <a href="{{ route('salesmen-product-material-list') }}" @if($currenturl == route('salesmen-product-material-list')) data-active="true" @endif  id="authPages" class="dropdown-toggle">
                    <span class="new-notification"></span>
                    <i class="las la-lock"></i>
                    <span>Product Material</span>
                </a>
            </li>
            <li class="menu @if($currenturl == route('salesmen-product-size-list')) active @endif ">
                <a href="{{ route('salesmen-product-size-list') }}" @if($currenturl == route('salesmen-product-size-list')) data-active="true" @endif id="otherPages" class="dropdown-toggle">
                    <i class="las la-file"></i>
                    <span>Product Size</span>
                </a>
            </li>
            <li class="menu @if($currenturl == route('salesmen-product-color-list')) active @endif ">
                <a href="{{ route('salesmen-product-color-list') }}"  @if($currenturl == route('salesmen-product-color-list')) data-active="true" @endif id="basicUI" class="dropdown-toggle">
                    <i class="las la-drafting-compass"></i>
                    <span>Product Color</span>
                </a>
            </li>
            <li class="menu @if($currenturl == route('salesmen-customer-list')) active @endif ">
                <a href="{{ route('salesmen-customer-list') }}" @if($currenturl == route('salesmen-customer-list')) data-active="true" @endif id="uiElements" class="dropdown-toggle">
                    <i class="lab la-elementor"></i>
                    <span>Customers</span>
                </a>
            </li>
            <li class="menu @if($currenturl == route('salesmen-image-category-list')) active @endif ">
                <a href="{{ route('salesmen-image-category-list') }}"  @if($currenturl == route('salesmen-image-category-list')) data-active="true" @endif id="basicUI" class="dropdown-toggle">
                    <i class="las la-drafting-compass"></i>
                    <span>Image Category</span>
                </a>
            </li>
          <li class="menu @if($currenturl == route('salesmen-system-setting')) active @endif ">
                <a href="{{ route('salesmen-system-setting') }}" id="forms" @if($currenturl == route('salesmen-system-setting')) data-active="true" @endif class="dropdown-toggle">
                    <i class="lab la-wpforms"></i>
                    <span>System</span>
                </a>
            </li>
            @endif
            <li class="menu @if($currenturl == route('salesmen-product-order-list')) active @endif ">
                <a href="{{ route('salesmen-product-order-list') }}" id="uiElements" @if($currenturl == route('salesmen-product-order-list')) data-active="true" @endif  class="dropdown-toggle">
                    <i class="lab la-elementor"></i>
                    <span>Product Order</span>
                </a>
            </li>
            <li class="menu @if($currenturl == route('salesmen-order-list')) active @endif ">
                <a href="{{ route('salesmen-order-list') }}" id="uiElements" @if($currenturl == route('salesmen-order-list')) data-active="true" @endif  class="dropdown-toggle">
                    <i class="lab la-elementor"></i>
                    <span>Orders</span>
                </a>
            </li>
            <li class="menu @if($currenturl == route('salesmen-furnish-product-order-list')) active @endif ">
                <a href="{{ route('salesmen-furnish-product-order-list') }}" id="forms" @if($currenturl == route('salesmen-furnish-product-order-list')) data-active="true" @endif class="dropdown-toggle">
                    <i class="lab la-elementor"></i>
                    <span>Finish <br> Product Orders</span>
                </a>
            </li>

        </ul>
        <div class="sidebar-submenu">
            <span class="sidebar-submenu-close" id="sidebarSubmenuClose">
                <i class="las la-times"></i>
            </span>
            <div class="submenu" id="dashboardMenu">
                <div class="submenu-info">
                    <div class="submenu-inner-info">
                        <h5 class="mb-3">Dashboard</h5>
                        <p>Lorem ipsum dolor sit sed ametctetur elit.</p>
                    </div>
                    <ul class="submenu-list">
                        <li class="active">
                            <a href="index-2.html"> Dashboard 1 </a>
                        </li>
                        <li>
                            <a href="index-3.html"> Dashboard 2 </a>
                        </li>
                        <li>
                            <a href="index-4.html"> Dashboard 3 </a>
                        </li>
                        <li>
                            <a href="index-5.html"> Dashboard 4 </a>
                        </li>
                        <li>
                            <a href="index-6.html"> Dashboard 5 </a>
                        </li>
                    </ul>
                </div>
            </div>
            <div class="submenu" id="appsMenu">
                <div class="submenu-info">
                    <div class="submenu-inner-info">
                        <h5 class="mb-3">Apps</h5>
                        <p>Sed ut perspiciatis unde omnis iste.</p>
                    </div>
                    <ul class="submenu-list">
                        <li>
                            <a href="apps_calendar.html"> Calender </a>
                        </li>
                        <li>
                            <a href="apps_chat.html"> Chat </a>
                        </li>
                        <li>
                            <a data-toggle="collapse" href="#appsCompanies" role="button" aria-expanded="false" aria-controls="collapseExample" class="dropdown-toggle">
                            Companies <i class="las la-angle-right sidemenu-right-icon"></i>
                            </a>
                            <ul class="sub-submenu-list collapse" id="appsCompanies">
                                <li>
                                    <a href="apps_companies.html"> List </a>
                                </li>
                                <li>
                                    <a href="apps_company_details.html"> Company Details </a>
                                </li>
                            </ul>
                        </li>
                        <li>
                            <a href="apps_contacts.html"> Contacts </a>
                        </li>
                        <li>
                            <a data-toggle="collapse" href="#appsEcommerce" role="button" aria-expanded="false" aria-controls="collapseExample" class="dropdown-toggle">
                            Ecommerce <i class="las la-angle-right sidemenu-right-icon"></i>
                            </a>
                            <ul class="sub-submenu-list collapse" id="appsEcommerce">
                                <li>
                                    <a href="apps_ecommerce.html"> Dashboard </a>
                                </li>
                                <li>
                                    <a href="apps_ecommerce_products.html"> Products </a>
                                </li>
                                <li>
                                    <a href="apps_ecommerce_product_details.html"> Product Details </a>
                                </li>
                                <li>
                                    <a href="apps_ecommerce_add_product.html"> Add Product </a>
                                </li>
                                <li>
                                    <a href="apps_ecommerce_orders.html"> Orders </a>
                                </li>
                                <li>
                                    <a href="apps_ecommerce_order_details.html"> Order Details </a>
                                </li>
                                <li>
                                    <a href="apps_ecommerce_customers.html"> Customers </a>
                                </li>
                                <li>
                                    <a href="apps_ecommerce_sellers.html"> Sellers </a>
                                </li>
                                <li>
                                    <a href="apps_ecommerce_cart.html"> Cart </a>
                                </li>
                                <li>
                                    <a href="apps_ecommerce_checkout.html"> Checkout </a>
                                </li>
                            </ul>
                        </li>
                        <li>
                            <a data-toggle="collapse" href="#appsEmail" role="button" aria-expanded="false" aria-controls="collapseExample" class="dropdown-toggle">
                            Email <i class="las la-angle-right sidemenu-right-icon"></i>
                            </a>
                            <ul class="sub-submenu-list collapse" id="appsEmail">
                                <li>
                                    <a href="apps_mail.html"> Inbox </a>
                                </li>
                                <li>
                                    <a href="apps_mail_details.html"> Email Details </a>
                                </li>
                                <li>
                                    <a href="apps_mail_create.html"> Compose Email </a>
                                </li>
                            </ul>
                        </li>
                        <li>
                            <a href="apps_file_manager.html"> File Manager </a>
                        </li>
                        <li>
                            <a href="apps_invoice.html"> Invoice List </a>
                        </li>
                        <li>
                            <a data-toggle="collapse" href="#appsNotes" role="button" aria-expanded="false" aria-controls="collapseExample" class="dropdown-toggle">
                            Notes <i class="las la-angle-right sidemenu-right-icon"></i>
                            </a>
                            <ul class="sub-submenu-list collapse" id="appsNotes">
                                <li>
                                    <a href="apps_notes.html"> List </a>
                                </li>
                                <li>
                                    <a href="apps_notes_details.html"> Note Details </a>
                                </li>
                                <li>
                                    <a href="apps_notes_create.html"> Creat Note </a>
                                </li>
                            </ul>
                        </li>
                        <li>
                            <a href="apps_social.html"> Social </a>
                        </li>
                        <li>
                            <a href="apps_taskList.html"> Task List </a>
                        </li>
                        <li>
                            <a data-toggle="collapse" href="#appsTickets" role="button" aria-expanded="false" aria-controls="collapseExample" class="dropdown-toggle">
                            Tickets <i class="las la-angle-right sidemenu-right-icon"></i>
                            </a>
                            <ul class="sub-submenu-list collapse" id="appsTickets">
                                <li>
                                    <a href="apps_tickets.html"> Ticket List </a>
                                </li>
                                <li>
                                    <a href="apps_ticket_details.html"> Ticket Details </a>
                                </li>
                            </ul>
                        </li>
                    </ul>
                </div>
            </div>
            <div class="submenu" id="authPagesMenu">
                <div class="submenu-info">
                    <div class="submenu-inner-info">
                        <h5 class="mb-3">Auth Pages</h5>
                        <p>Quis autem vel eum iure reprehenderit.</p>
                    </div>
                    <ul class="submenu-list" data-parent-element="#dashboard">
                        <li>
                            <a data-toggle="collapse" href="#authTypeOne" role="button" aria-expanded="false" aria-controls="collapseExample" class="dropdown-toggle">
                            Type 1 <i class="las la-angle-right sidemenu-right-icon"></i>
                            </a>
                            <ul class="sub-submenu-list collapse" id="authTypeOne">
                                <li>
                                    <a href="auth_login_1.html"> Login </a>
                                </li>
                                <li>
                                    <a href="auth_signup_1.html"> Register </a>
                                </li>
                                <li>
                                    <a href="auth_lock_screen_1.html"> Lock Screen </a>
                                </li>
                                <li>
                                    <a href="auth_forget_password_1.html"> Forget Password </a>
                                </li>
                                <li>
                                    <a href="auth_confirm_email_1.html"> Confirm Email </a>
                                </li>
                            </ul>
                        </li>
                        <li>
                            <a data-toggle="collapse" href="#authTypeTwo" role="button" aria-expanded="false" aria-controls="collapseExample" class="dropdown-toggle">
                            Type 2 <i class="las la-angle-right sidemenu-right-icon"></i>
                            </a>
                            <ul class="sub-submenu-list collapse" id="authTypeTwo">
                                <li>
                                    <a href="auth_login_2.html"> Login </a>
                                </li>
                                <li>
                                    <a href="auth_signup_2.html"> Register </a>
                                </li>
                                <li>
                                    <a href="auth_lock_screen_2.html"> Lock Screen </a>
                                </li>
                                <li>
                                    <a href="auth_forget_password_2.html"> Forget Password </a>
                                </li>
                                <li>
                                    <a href="auth_confirm_email_2.html"> Confirm Email </a>
                                </li>
                            </ul>
                        </li>
                        <li>
                            <a data-toggle="collapse" href="#authTypeThree" role="button" aria-expanded="false" aria-controls="collapseExample" class="dropdown-toggle">
                                Type 3
                                <span class="menu-badge badge-danger">New</span>
                            </a>
                            <ul class="sub-submenu-list collapse" id="authTypeThree">
                                <li>
                                    <a href="auth_login_3.html"> Login </a>
                                </li>
                                <li>
                                    <a href="auth_signup_3.html"> Register </a>
                                </li>
                                <li>
                                    <a href="auth_lock_screen_3.html"> Lock Screen </a>
                                </li>
                                <li>
                                    <a href="auth_forget_password_3.html"> Forget Password </a>
                                </li>
                                <li>
                                    <a href="auth_confirm_email_3.html"> Confirm Email </a>
                                </li>
                            </ul>
                        </li>
                    </ul>
                </div>
            </div>
            <div class="submenu" id="otherPagesMenu">
                <div class="submenu-info">
                    <div class="submenu-inner-info">
                        <h5 class="mb-3">Other Pages</h5>
                        <p>Nor again is there anyone who loves or pursues.</p>
                    </div>
                    <ul class="submenu-list">
                        <li>
                            <a href="pages_coming_soon.html"> Coming Soon </a>
                        </li>
                        <li>
                            <a href="pages_coming_soon_2.html"> Coming Soon 2 </a>
                        </li>
                        <li>
                            <a href="pages_contact_us.html"> Contact Form </a>
                        </li>
                        <li>
                            <a href="pages_contact_us_2.html"> Contact Form 2 </a>
                        </li>
                        <li>
                            <a data-toggle="collapse" href="#otherPagesError" role="button" aria-expanded="false" aria-controls="collapseExample" class="dropdown-toggle">
                                Error <i class="las la-angle-right sidemenu-right-icon"></i>
                            </a>
                            <ul class="sub-submenu-list collapse" id="otherPagesError">
                                <li>
                                    <a href="pages_error404.html"> 404 </a>
                                </li>
                                <li>
                                    <a href="pages_error500.html"> 500 </a>
                                </li>
                                <li>
                                    <a href="pages_error503.html"> 503 </a>
                                </li>
                                <li>
                                    <a href="pages_maintenance.html"> Maintenance </a>
                                </li>
                                <li>
                                    <a href="pages_error404_2.html"> 404 Two </a>
                                </li>
                                <li>
                                    <a href="pages_error500_2.html"> 500 Two </a>
                                </li>
                                <li>
                                    <a href="pages_error503_2.html"> 503 Two </a>
                                </li>
                                <li>
                                    <a href="pages_maintenance_2.html"> Maintenance Two </a>
                                </li>
                            </ul>
                        </li>
                        <li>
                            <a href="pages_faq.html"> FAQ </a>
                        </li>
                        <li>
                            <a href="pages_faq_2.html"> FAQ 2 </a>
                        </li>
                        <li>
                            <a href="pages_faq_3.html"> FAQ 3 </a>
                        </li>
                        <li>
                            <a href="pages_helpdesk.html"> Helpdesk </a>
                        </li>
                        <li>
                            <a href="pages_notifications.html"> Notifications </a>
                        </li>
                        <li>
                            <a href="pages_pricing.html"> Pricing </a>
                        </li>
                        <li>
                            <a href="pages_pricing_2.html"> Pricing 2 </a>
                        </li>
                        <li>
                            <a href="pages_privacy_policy.html"> Privacy Policy </a>
                        </li>
                        <li>
                            <a href="pages_profile.html"> Profile </a>
                        </li>
                        <li>
                            <a href="pages_profile_edit.html"> Profile Edit </a>
                        </li>
                        <li>
                            <a href="pages_search_result.html"> Search Result </a>
                        </li>
                        <li>
                            <a href="pages_search_result_2.html"> Search Result 2 </a>
                        </li>
                        <li>
                            <a href="pages_sitemap.html"> Sitemap </a>
                        </li>
                        <li>
                            <a href="pages_timeline.html"> Timeline </a>
                        </li>
                    </ul>
                </div>
            </div>
            <div class="submenu" id="basicUIMenu">
                <div class="submenu-info">
                    <div class="submenu-inner-info">
                        <h5 class="mb-3">Basic UI</h5>
                        <p>At vero eos et accusamus et iusto odio.</p>
                    </div>
                    <ul class="submenu-list">
                        <li>
                            <a href="basic_ui_accordion.html"> Accordions  </a>
                        </li>
                        <li>
                            <a href="basic_ui_animation.html"> Animation </a>
                        </li>
                        <li>
                            <a href="basic_ui_cards.html"> Bootstrap Cards </a>
                        </li>
                        <li>
                            <a href="basic_ui_carousel.html">Carousel</a>
                        </li>
                        <li>
                            <a href="basic_ui_countdown.html"> Countdown </a>
                        </li>
                        <li>
                            <a href="basic_ui_counter.html"> Counter </a>
                        </li>
                        <li>
                            <a href="basic_ui_dragitems.html">Drag Items</a>
                        </li>
                        <li>
                            <a href="basic_ui_lightbox.html"> Lightbox </a>
                        </li>
                        <li>
                            <a href="basic_ui_lightbox_side_open.html"> Lightbox Side Open</a>
                        </li>
                        <li>
                            <a href="basic_ui_list_groups.html"> List Group </a>
                        </li>
                        <li>
                            <a href="basic_ui_media_object.html"> Media Object </a>
                        </li>
                        <li>
                            <a href="basic_ui_modals.html"> Modals </a>
                        </li>
                        <li>
                            <a href="basic_ui_notifications.html"> Notifications </a>
                        </li>
                        <li>
                            <a href="basic_ui_scrollspy.html"> Scroll Spy </a>
                        </li>
                        <li>
                            <a href="basic_ui_session_timeout.html"> Session Timeout </a>
                        </li>
                        <li>
                            <a href="basic_ui_sweet_alerts.html"> Sweet Alerts </a>
                        </li>
                        <li>
                            <a href="basic_ui_tabs.html"> Tabs </a>
                        </li>
                        <li>
                            <a href="basic_ui_tour_tutorial.html"> Tour Tutorial </a>
                        </li>
                    </ul>
                </div>
            </div>
            <div class="submenu" id="uiElementsMenu">
                <div class="submenu-info">
                    <div class="submenu-inner-info">
                        <h5 class="mb-3">UI Elements</h5>
                        <p>Our being able to do what we like best.</p>
                    </div>
                    <ul class="submenu-list">
                        <li>
                            <a href="ui_elements_alerts.html"> Alerts </a>
                        </li>
                        <li>
                            <a href="ui_elements_avatar.html"> Avatar </a>
                        </li>
                        <li>
                            <a href="ui_elements_badges.html"> Badges </a>
                        </li>
                        <li>
                            <a href="ui_elements_breadcrumbs.html"> Breadcrumbs </a>
                        </li>
                        <li>
                            <a href="ui_elements_buttons.html"> Buttons </a>
                        </li>
                        <li>
                            <a href="ui_elements_colors.html"> Colors </a>
                        </li>
                        <li>
                            <a href="ui_elements_dropdowns.html"> Dropdown </a>
                        </li>
                        <li>
                            <a href="ui_elements_grid.html"> Grid </a>
                        </li>
                        <li>
                            <a href="ui_elements_jumbotron.html"> Jumbotron </a>
                        </li>
                        <li>
                            <a href="ui_elements_list_group.html"> List Group </a>
                        </li>
                        <li>
                            <a href="ui_elements_loading_spinners.html"> Loading Spinners </a>
                        </li>
                        <li>
                            <a href="ui_elements_pagination.html"> Pagination </a>
                        </li>
                        <li>
                            <a href="ui_elements_popovers.html"> Popovers </a>
                        </li>
                        <li>
                            <a href="ui_elements_progress_bar.html"> Progress Bar </a>
                        </li>
                        <li>
                            <a href="ui_elements_ribbons.html"> Ribbons </a>
                        </li>
                        <li>
                            <a href="ui_elements_tooltips.html"> Tooltips </a>
                        </li>
                        <li>
                            <a href="ui_elements_typography.html"> Typography </a>
                        </li>
                        <li>
                            <a href="ui_elements_video.html"> Video </a>
                        </li>
                    </ul>
                </div>
            </div>
            <div class="submenu" id="formsMenu">
                <div class="submenu-info">
                    <div class="submenu-inner-info">
                        <h5 class="mb-3">Forms</h5>
                        <p>Et harum quidem rerum facilis et expedita.</p>
                    </div>
                    <ul class="submenu-list">
                        <li>
                            <a data-toggle="collapse" href="#formControls" role="button" aria-expanded="false" aria-controls="collapseExample" class="dropdown-toggle">
                            Controls <i class="las la-angle-right sidemenu-right-icon"></i>
                            </a>
                            <ul class="sub-submenu-list collapse" id="formControls">
                                <li>
                                    <a href="forms_controls_base_input.html"> Base Input </a>
                                </li>
                                <li>
                                    <a href="forms_controls_input_groups.html"> Input Groups </a>
                                </li>
                                <li>
                                    <a href="forms_controls_checkbox.html"> Checkbox </a>
                                </li>
                                <li>
                                    <a href="forms_controls_radio.html"> Radio </a>
                                </li>
                                <li>
                                    <a href="forms_controls_switch.html"> Switch </a>
                                </li>
                            </ul>
                        </li>
                        <li>
                            <a data-toggle="collapse" href="#formWidgets" role="button" aria-expanded="false" aria-controls="collapseExample" class="dropdown-toggle">
                            Widgets <i class="las la-angle-right sidemenu-right-icon"></i>
                            </a>
                            <ul class="sub-submenu-list collapse" id="formWidgets">
                                <li>
                                    <a href="forms_widgets_picker.html"> Picker </a>
                                </li>
                                <li>
                                    <a href="forms_widgets_tagify.html"> Tagify </a>
                                </li>
                                <li>
                                    <a href="forms_widgets_touch_spin.html"> Touch Spin </a>
                                </li>
                                <li>
                                    <a href="forms_widgets_maxlength.html"> Max Length </a>
                                </li>
                                <li>
                                    <a href="forms_widgets_switch.html"> Switch </a>
                                </li>
                                <li>
                                    <a href="forms_widgets_select_splitter.html"> Select Splitter</a>
                                </li>
                                <li>
                                    <a href="forms_widgets_bootstrap_select.html"> Bootstrap Select </a>
                                </li>
                                <li>
                                    <a href="forms_widgets_select_2.html"> Select 2 </a>
                                </li>
                                <li>
                                    <a href="forms_widgets_input_masks.html"> Input Masks </a>
                                </li>
                                <li>
                                    <a href="forms_widgets_autogrow.html"> Autogrow </a>
                                </li>
                                <li>
                                    <a href="forms_widgets_range_slider.html"> Range Slider </a>
                                </li>
                                <li>
                                    <a href="forms_widgets_clipboard.html"> Clipboard </a>
                                </li>
                                <li>
                                    <a href="forms_widgets_typeahead.html"> Typeahead </a>
                                </li>
                                <li>
                                    <a href="forms_widgets_captcha.html"> Captcha </a>
                                </li>
                            </ul>
                        </li>
                        <li>
                            <a href="forms_validation.html"> Validation </a>
                        </li>
                        <li>
                            <a href="forms_layouts.html"> Layouts </a>
                        </li>
                        <li>
                            <a href="forms_text_editor.html"> Text Editor </a>
                        </li>
                        <li>
                            <a href="forms_file_upload.html"> File Upload </a>
                        </li>
                        <li>
                            <a href="forms_multiple_step.html"> Multiple Step </a>
                        </li>
                    </ul>
                </div>
            </div>
            <div class="submenu" id="mapsMenu">
                <div class="submenu-info">
                    <div class="submenu-inner-info">
                        <h5 class="mb-3">Maps</h5>
                        <p>Excepteur sint occaecat cupidatat proident.</p>
                    </div>
                    <ul class="submenu-list">
                        <li>
                            <a href="maps_leaflet_map.html"> Leaflet Map </a>
                        </li>
                        <li>
                            <a href="maps_vector_map.html"> Vector Map </a>
                        </li>
                    </ul>
                </div>
            </div>
            <div class="submenu" id="chartsMenu">
                <div class="submenu-info">
                    <div class="submenu-inner-info">
                        <h5 class="mb-3">Charts</h5>
                        <p>Nemo enim ipsam voluptatem quia voluptas.</p>
                    </div>
                    <ul class="submenu-list">
                        <li>
                            <a href="charts_apex_chart.html"> Apex Chart </a>
                        </li>
                        <li>
                            <a href="charts_chartlist.html"> Chartlist Charts </a>
                        </li>
                        <li>
                            <a href="charts_chartjs.html"> ChartJS </a>
                        </li>
                        <li>
                            <a href="charts_morris_chart.html"> Morris Charts </a>
                        </li>
                    </ul>
                </div>
            </div>
            <div class="submenu" id="starterKitMenu">
                <div class="submenu-info">
                    <div class="submenu-inner-info">
                        <h5 class="mb-3">Starter Kit</h5>
                        <p>Adipisci velit, sed quia non numquam eius.</p>
                    </div>
                    <ul class="submenu-list">
                        <li>
                            <a href="starter_kit_blank_page.html"> Blank Page </a>
                        </li>
                        <li>
                            <a href="starter_kit_breadcrumbs.html"> Breadcrumbs </a>
                        </li>
                    </ul>
                </div>
            </div>
            <div class="submenu" id="multiLevelMenu">
                <div class="submenu-info">
                    <div class="submenu-inner-info">
                        <h5 class="mb-3">Multi Level</h5>
                        <p>Quis autem vel eum iure reprehenderit qui.</p>
                    </div>
                    <ul class="submenu-list">
                        <li>
                            <a data-toggle="collapse" href="#multiLevelLevelTwo" role="button" aria-expanded="false" aria-controls="collapseExample" class="dropdown-toggle"> Level 2 <i class="las la-angle-right sidemenu-right-icon"></i> </a>
                            <ul class="collapse sub-submenu-list" id="multiLevelLevelTwo">
                                <li>
                                    <a href="javascript:void(0)"> Link 1 </a>
                                </li>
                                <li>
                                    <a href="javascript:void(0)"> Link 2 </a>
                                </li>
                            </ul>
                        </li>
                        <li>
                            <a data-toggle="collapse" href="#multiLevelLevelThree" role="button" aria-expanded="false" aria-controls="collapseExample" class="dropdown-toggle"> Level 3 <i class="las la-angle-right sidemenu-right-icon"></i> </a>
                            <ul class="collapse sub-submenu-list" id="multiLevelLevelThree">
                                <li>
                                    <a href="javascript:void(0)"> Link 1</a>
                                </li>
                                <li>
                                    <a data-toggle="collapse" href="#multiLevelLevelThreeOne" role="button" aria-expanded="false" aria-controls="collapseExample" class="dropdown-toggle"> Link 2 <i class="las la-angle-right sidemenu-right-icon"></i> </a>
                                    <ul class="collapse list-unstyled sub-sub-submenu-list" id="multiLevelLevelThreeOne">
                                        <li>
                                            <a href="javascript:void(0)"> Link 1</a>
                                        </li>
                                        <li>
                                            <a href="javascript:void(0)"> Link 2 </a>
                                        </li>
                                    </ul>
                                </li>
                            </ul>
                        </li>
                    </ul>
                </div>
            </div>
        </div>
    </nav>
</div>