@php
    $types = \App\Models\Ecommerce\ProductType::where('show_in_menu', 1)->orderBy('sorting')->limit(7)->get();
    $search_products = \App\Models\Ecommerce\Product::with('supplier')->select('id','name','generic_name','price','discount','image','supplier_id','strength')
            ->latest()->take(20)->get();
@endphp
<header class="menu">
    <div class="container">
        <div class="row">
            <div class="col-sm-12 col-md-12 d-md-flex desktopmenu">
                <div class="col-sm-12 col-md-4 col-lg-3 d-md-flex justify-content-md-start" id="menupart1">
                    <div class="logo">
                        <a href="{{ url('/') }}" class="logo">
                            <img src="{{ asset('storage/images/ecommerce/'.setting('logo')) }}" alt="">
                        </a>
                    </div>
                </div>

                <div class="col-sm-12 col-md-8 col-lg-9 d-md-flex menupart2 align-items-center" id="menupart2">
                    <!--search section-->
                    <div class="container searchfield">
                        <form class="position-relative">
                            <div class="md-form form-sm form-2 pl-0 ">
                                <input onfocus="searching()" onkeyup="search()" class="form-control"
                                       id="searchInputField" type="text" value=""
                                       placeholder="{{ __('pages.Search by name or generic') }}" aria-label="Search" name="query">
                                <div class="append-icon">
                                    <i class="fas fa-search text-grey" aria-hidden="true"></i>
                                </div>
                            </div>
                            <div class="search-suggestion-box d-none" id="scrollableDiv">
                                <div class="infinite-scroll-component__outerdiv">
                                    <div class="infinite-scroll-component" id="searchResult">
                                        @include('frontend.includes.search_result')
                                    </div>
                                </div>
                            </div>
                        </form>
                    </div>

                    <div class="w-50">
                        <ul class="navbar_right shop-action-menu">
                            <li class="nav-item">
                                <div id="google_translate_element" lang="en" aria-label="Language (English‎)"></div>
                            </li>
                            <li class="menu-item">
                                <a href="{{ route('customer.order.track') }}" class="rounded-menu">
                                    <i class="fa fa-truck-fast"></i>
                                </a>
                            </li>
                            <li class="menu-item">
                                <a href="{{ route('front.cart') }}" class="rounded-menu">
                                    <div class="count">
                                        @if (session('front_cart'))
                                            {{ count(session('front_cart')) }}
                                        @else
                                            0
                                        @endif
                                    </div>
                                    <i class="fa-solid fa-cart-shopping"></i>
                                </a>
                            </li>
                            <li class="menu-item">
                                <div class="dropdown user-dropdown">
                                    <a class="rounded-menu" href="javascript:" data-bs-toggle="dropdown">
                                        <i class="fa-solid fa-user"></i>
                                    </a>
                                    <ul class="dropdown-menu">
                                        @if (auth()->guard('customer')->check())
                                            <li>
                                                <a class="dropdown-item" href="{{ route('customer.dashboard') }}">
                                                    <i class="fa-solid fa-gauge"></i> {{ __('pages.Dashboard') }}
                                                </a>
                                            </li>
                                           <li>
                                               <a class="dropdown-item" href="{{ route('customer.profile') }}">
                                                   <i class="fa-solid fa-user"></i> {{ __('pages.Profile') }}
                                               </a>
                                           </li>

                                           <li>
                                               <a class="dropdown-item" href="{{ route('customer.order') }}">
                                                   <i class="fa-solid fa-box-open"></i> {{ __('pages.Orders') }}
                                               </a>
                                           </li>
                                            <li>
                                                <a class="dropdown-item" href="{{ route('customer.logout') }}">
                                                    <i class="fa-solid fa-power-off"></i> {{ __('pages.Logout') }}
                                                </a>
                                            </li>
                                        @else
                                            <li>
                                                <a class="dropdown-item" href="{{ route('customer.login') }}">
                                                    <i class="fa-solid fa-right-to-bracket"></i> {{ __('pages.Login') }}
                                                </a>
                                            </li>
                                            <li>
                                                <a class="dropdown-item" href="{{ route('customer.register') }}">
                                                    <i class="fa-solid fa-user"></i> {{ __('pages.Create an account') }}
                                                </a>
                                            </li>
                                        @endif
                                    </ul>
                                </div>
                            </li>
                        </ul>
                    </div>
                </div>
            </div>

            <div class="mobile-navigation d-block d-lg-none">
                <div class="navigation-header">
                    <a href="{{ url('/') }}" class="logo">
                        <img src="{{ asset('storage/images/ecommerce/'.setting('logo')) }}" alt="">
                    </a>
                    <ul class="navbar_right shop-action-menu">
                        <li class="menu-item">
                            <a href="{{ route('customer.order.track') }}" class="rounded-menu">
                                <i class="fa fa-truck-fast"></i>
                            </a>
                        </li>
                        <li class="menu-item">
                            <a href="{{ route('front.cart') }}" class="rounded-menu">
                                <div class="count">
                                    @if (session('front_cart'))
                                        {{ count(session('front_cart')) }}
                                    @else
                                        {{ __('pages.0') }}
                                    @endif
                                </div>
                                <i class="fa-solid fa-cart-shopping"></i>
                            </a>
                        </li>
                        <li class="menu-item">
                            <div class="dropdown user-dropdown">
                                <a class="rounded-menu" href="javascript:" data-bs-toggle="dropdown">
                                    <i class="fa-solid fa-user"></i>
                                </a>
                                <div class="dropdown-menu">
                                    @if (auth()->guard('customer')->check())
                                        <a class="dropdown-item" href="{{ route('customer.dashboard') }}">
                                            <i class="fa-solid fa-gauge"></i> {{ __('pages.Dashboard') }}
                                        </a>
                                        <a class="dropdown-item" href="{{ route('customer.profile') }}">
                                            <i class="fa-solid fa-user"></i> {{ __('pages.Profile') }}
                                        </a>
                                        <a class="dropdown-item" href="{{ route('customer.order') }}">
                                            <i class="fa-solid fa-box-open"></i> {{ __('pages.Orders') }}
                                        </a>
                                        <a class="dropdown-item" href="{{ route('customer.logout') }}">
                                            <i class="fa-solid fa-power-off"></i> {{ __('pages.Logout') }}
                                        </a>
                                    @else
                                        <a class="dropdown-item" href="{{ route('customer.login') }}">
                                            <i class="fa-solid fa-right-to-bracket"></i> {{ __('pages.Login') }}
                                        </a>
                                        <a class="dropdown-item" href="{{ route('customer.register') }}">
                                            <i class="fa-solid fa-user"></i>{{ __('pages.Create an account') }}
                                        </a>
                                    @endif
                                </div>
                            </div>
                        </li>
                    </ul>
                </div>
                <div class="navigation-footer">
                    <div class="searchfield">
                        <form class="position-relative">
                            <div class="md-form form-sm form-2 pl-0 ">
                                <input onfocus="mobileSearching()" onkeyup="mobileSearch()" class="form-control"
                                       id="mobileSearchInputField" type="text" value=""
                                       placeholder="{{ __('pages.Search by name or generic') }}" aria-label="Search" name="query">
                                <div class="append-icon">
                                    <i class="fas fa-search text-grey" aria-hidden="true"></i>
                                </div>
                            </div>
                            <div class="search-suggestion-box d-none"  id="mobileScrollableDiv">
                                <div class="infinite-scroll-component__outerdiv">
                                    <div class="infinite-scroll-component" id="mobileSearchResult">
                                        @include('frontend.includes.search_result')
                                    </div>
                                </div>
                            </div>
                        </form>
                    </div>
                    <button id="sidebarOpenHandler" class="sidebar-handler-button">
                        <i class="fa-solid fa-bars"></i>
                    </button>
                </div>
                <div class="navigation-sidebar">
                    <div class="sidebar-header">
                        <div class="logo">
                            <a href="{{ url('/') }}" class="logo">
                                <img src="{{ asset('storage/images/ecommerce/'.setting('logo')) }}" alt="">
                            </a>
                        </div>
                        <a href="javascript:void(0)" id="sidebarCloseHandler" class="sidebar-close-button">
                            <i class="fa fa-times"></i>
                        </a>
                    </div>
                    <ul class="sidebar-menus">
                        <li>
                            <a href="{{ url('/') }}">{{ __('pages.Home') }}</a>
                        </li>
                        @foreach($types as $type)
                            <li>
                                <a href="{{ route('front.products', $type->slug) }}">{{ $type->title }}</a>
                            </li>
                        @endforeach
                    </ul>
                </div>
            </div>
        </div>
    </div>
</header>
<div class="menu_wrap">
    <div class="container">
        <div class="col-md-12 d-md-flex menulist justify-content-center" id="menupart21">
            <ul>
                <li>
                    <a href="{{ url('/') }}">{{ __('pages.Home') }}</a>
                </li>
                @foreach($types as $type)
                    <li>
                        <a href="{{ route('front.products', $type->slug) }}">{{ $type->title }}</a>
                    </li>
                @endforeach
            </ul>
        </div>
    </div>
</div>