@php
    $all_stores = \DB::table('stores')->where('active', 1)->orderBy('id', 'asc')->get();
    $menu_items = \App\Models\MenuItem::where('menu_id', !isset($ecommerce) ? 1 : 2)->whereNull('parent_menu_item_id')->with('children_menu')->orderBy('order_number')->get();
    $store_slug = isset($store) ? $store->slug : 'palm-desert';
@endphp
@if(!isset($ecommerce))
<header>
    <div class="headers-row">
        <div class="menu-left menuu">
            <div class="search-wrap">
                <a href="javascript:void(0)"><img src="{{ asset('images/search.svg') }}" alt="Search Products"></a>
                <div class="searchArea">
                    <form action="{{ route('search', $store_slug) }}">
                        <div class="search_site">
                            <input type="text" placeholder="Search..." name="keyword">
                            <button type="submit">Search</button>
                        </div>
                        <span class="close_search"><i class="fa fa-times"></i></span>
                    </form>
                </div>
            </div>
            <nav>
                <ul class="left-side">
                    @foreach($menu_items as $menu_item)
                    <li {{ $menu_item->categories || $menu_item->children_menu->isNotEmpty() ? 'class="hasMenu"' : '' }}>
                        <a href="{{ $menu_item->get_url_with_store($store_slug) ?? 'javascript:void(0)' }}" {!! $menu_item->open_in_new_tab ? 'target="_blank"' : '' !!}>{{ $menu_item->label }}</a>
                        @if($menu_item->categories)
                        <ul>
                            @foreach(Helper::getMainCategories() as $category)
                                @php
                                    $sub_categories = Helper::getSubCategories($category->id)->get();
                                @endphp

                                @if ($sub_categories->isEmpty())
                                    <li>
                                        <a href="{{ route('category', [$store_slug, $category->slug]) }}" {!! $menu_item->open_in_new_tab ? 'target="_blank"' : '' !!}>
                                            @if(!empty($category->image))
                                                <img src="{{ $category->image }}" class="effects-image" style="margin-right: 8px;">
                                            @endif
                                            {{ $category->name }}
                                        </a>
                                    </li>
                                @else
                                    <li class="has-sub-menu">
                                        <a href="{{ route('category', [$store_slug, $category->slug]) }}" {!! $menu_item->open_in_new_tab ? 'target="_blank"' : '' !!}>
                                            @if(!empty($category->image))
                                                <img src="{{ $category->image }}" class="effects-image" style="margin-right: 8px;">
                                            @endif
                                            {{ $category->name }}
                                        </a>
                                        <ul>
                                            @foreach($sub_categories as $sub_category)
                                                <li>
                                                    <a href="{{ route('category', [$store_slug, $sub_category->slug]) }}" {!! $menu_item->open_in_new_tab ? 'target="_blank"' : '' !!}>
                                                        @if(!empty($sub_category->image))
                                                            <img src="{{ $sub_category->image }}" class="effects-image" style="margin-right: 8px;">
                                                        @endif
                                                        {{ $sub_category->name }}
                                                    </a>
                                                </li>
                                            @endforeach
                                        </ul>
                                    </li>
                                @endif
                            @endforeach
                        </ul>
                        @elseif($menu_item->children_menu->isNotEmpty())
                        <ul>
                            @foreach($menu_item->children_menu as $child_menu)
                            <li><a href="{{ $child_menu->get_url_with_store($store_slug) ?? 'javascript:void(0)' }}" {!! $child_menu->open_in_new_tab ? 'target="_blank"' : '' !!}>{{ $child_menu->label }}</a></li>
                            @endforeach
                        </ul>
                        @endif
                    </li>
                    @endforeach
                </ul>
            </nav>
        </div>
        <div class="site-logo">
            <a href="{{ route('home') }}"><img src="{{ mix('images/logo.png') }}" alt="logo"></a>
        </div>
        <div class="menu-right menuu">
            <nav>
                <ul class="right-side">
                    <li><a href="{{ url('/our-brands') }}">Our Brands</a></li>
                    <li><a href="{{ url('/new-fresh-drops') }}">New this Week</a></li>
                </ul>
            </nav>
            <div class="cart">
                <a href="{{ route('view-cart', 'palm-desert') }}"><img src="{{ mix('images/shopping-bag.svg') }}" alt=""></a>
            </div>
        </div>
    </div>
    <div class="mobileMenu-wrapper">
        <div class="siteLogo">
            <a href="{{ route('home') }}"><img src="{{ mix('images/logo.png') }}" alt="logo"></a>
        </div>
        <div class="mobileMenu">
            <nav>
                <ul>
                    @foreach($menu_items as $menu_item)
                    <li {!! $menu_item->categories || $menu_item->children_menu->isNotEmpty() ? 'class="hasMenu"' : '' !!}>
                        <a href="{{ $menu_item->get_url_with_store($store_slug) ?? 'javascript:void(0)' }}" class="main-item" {!! $menu_item->open_in_new_tab ? 'target="_blank"' : '' !!}>{{ $menu_item->label }}{!! $menu_item->categories || $menu_item->children_menu->isNotEmpty() ? ' <span class="subChild"><i class="fa fa-angle-down"></i></span>' : '' !!}</a>
                        @if($menu_item->categories)
                        <ul>
                            @foreach(Helper::getMainCategories() as $category)
                            <li>
                                <a href="{{ route('category', [$store_slug, $category->slug]) }}"  style="justify-content: inherit;" {!! $menu_item->open_in_new_tab ? 'target="_blank"' : '' !!}>
                                    @if(!empty($category->image))
                                        <img src="{{ $category->image }}" class="effects-image">
                                    @endif
                                    <span style="padding-left: 5px;color: #646464">{{ $category->name }}</span>
                                </a>
                            </li>
                            @endforeach
                        </ul>
                        @elseif($menu_item->children_menu->isNotEmpty())
                        <ul>
                            @foreach($menu_item->children_menu as $child_menu)
                            <li><a href="{{ $child_menu->get_url_with_store($store_slug) ?? 'javascript:void(0)' }}" {!! $child_menu->open_in_new_tab ? 'target="_blank"' : '' !!}>{{ $child_menu->label }}</a></li>
                            @endforeach
                        </ul>
                        @endif
                    </li>
                    @endforeach
                    <li><a href="{{ url('/our-brands') }}" class="main-item">Our brands</a></li>
                    <li><a href="{{ url('/new-fresh-drops') }}" class="main-item">New This Week</a></li>
                    <li><a href="{{ route('contact-us', $store_slug) }}" class="main-item">Contact Us</a></li>
                    <li><a href="{{ route('store-details') }}" class="main-item">Hours & Store Details</a></li>
                </ul>
            </nav>
        </div>    
        <div class="toggless">
            <div class="cart">
                <a href="{{ route('view-cart', 'palm-desert') }}"><img src="{{ mix('images/shopping-bag.svg') }}" alt="Shopping Cart"></a>
            </div>
            <div class="search-wrap">
                <a href="javascript:void(0)"><img src="{{ asset('images/search.svg') }}" alt="Search Products"></a>
                <div class="searchArea">
                    <form action="{{ route('search', 'palm-desert') }}">
                        <div class="search_site">
                            <input type="text" placeholder="Search..." name="keyword">
                            <button type="submit">Search</button>
                        </div>
                        <span class="close_search"><i class="fa fa-times"></i></span>
                    </form>
                </div>
            </div>
            <div class="menu-toggler">
                <span></span>
                <span></span>
                <span></span>
            </div>
        </div>            
    </div>
</header>
@else
    <header class="ecommerce-nav">
        <div class="headers-row">
            <div class="site-logo">
                <a href="{{ route('home') }}"><img src="{{ mix('images/logo.png') }}" alt="logo"></a>
            </div>
            <div class="menu-right menuu">
                <nav>
                    <ul class="right-side">
                        <li class="active"><a href="{{ route('shop-all', $store->slug) }}">Shop All</a></li>
                        @foreach($menu_items as $menu_item)
                        <li {{ $menu_item->categories || $menu_item->children_menu->isNotEmpty() ? 'class="hasMenu"' : '' }}>
                            <a href="{{ $menu_item->get_url_with_store($store_slug) ?? 'javascript:void(0)' }}" {!! $menu_item->open_in_new_tab ? 'target="_blank"' : '' !!}>{{ $menu_item->label }}</a>
                            @if($menu_item->categories)
                            <ul>
                                @foreach(Helper::getMainCategories() as $category)
                                    @php
                                        $sub_categories = Helper::getSubCategories($category->id)->get();
                                    @endphp

                                    @if ($sub_categories->isEmpty())
                                        <li>
                                            <a href="{{ route('category', [$store_slug, $category->slug]) }}" {!! $menu_item->open_in_new_tab ? 'target="_blank"' : '' !!}>
                                                @if(!empty($category->image))
                                                    <img src="{{ $category->image }}" class="effects-image" style="margin-right: 8px;">
                                                @endif
                                                {{ $category->name }}
                                            </a>
                                        </li>
                                    @else
                                        <li class="has-sub-menu">
                                            <a href="{{ route('category', [$store_slug, $category->slug]) }}" {!! $menu_item->open_in_new_tab ? 'target="_blank"' : '' !!}>
                                                @if(!empty($category->image))
                                                    <img src="{{ $category->image }}" class="effects-image" style="margin-right: 8px;">
                                                @endif
                                                {{ $category->name }}
                                            </a>
                                            <ul>
                                                @foreach($sub_categories as $sub_category)
                                                    <li>
                                                        <a href="{{ route('category', [$store_slug, $sub_category->slug]) }}" {!! $menu_item->open_in_new_tab ? 'target="_blank"' : '' !!}>
                                                            @if(!empty($sub_category->image))
                                                                <img src="{{ $sub_category->image }}" class="effects-image" style="margin-right: 8px;">
                                                            @endif
                                                            {{ $sub_category->name }}
                                                        </a>
                                                    </li>
                                                @endforeach
                                            </ul>
                                        </li>
                                    @endif
                                @endforeach
                            </ul>
                            @elseif($menu_item->children_menu->isNotEmpty())
                            <ul>
                                @foreach($menu_item->children_menu as $child_menu)
                                <li><a href="{{ $child_menu->get_url_with_store($store_slug) ?? 'javascript:void(0)' }}" {!! $child_menu->open_in_new_tab ? 'target="_blank"' : '' !!}>{{ $child_menu->label }}</a></li>
                                @endforeach
                            </ul>
                            @endif
                        </li>
                        @endforeach
                    </ul>
                </nav>
                <div class="search-wrap">
                    <a href="javascript:void(0)"><img src="{{ asset('images/search.svg') }}" alt="Search Products"></a>
                    <div class="searchArea">
                        <form action="{{ route('search', $store_slug) }}">
                            <div class="search_site">
                                <input type="text" placeholder="Search..." name="keyword">
                                <button type="submit">Search</button>
                            </div>
                            <span class="close_search"><i class="fa fa-times"></i></span>
                        </form>
                    </div>
                </div>
                <div class="cart">
                    <a href="{{ route('view-cart', $store_slug) }}"><img src="{{ mix('images/shopping-bag.svg') }}" alt=""></a>
                </div>
            </div>
        </div>
        <div class="mobileMenu-wrapper">
            <div class="siteLogo">
                <a href="{{ route('home') }}"><img src="{{ mix('images/logo.png') }}" alt="logo"></a>
            </div>
            <div class="mobileMenu">
                <nav>
                    <ul>
                        <li class="main-item"><a href="{{ route('shop-all', $store->slug) }}">Shop All</a></li>
                        @foreach($menu_items as $menu_item)
                        <li {!! $menu_item->categories || $menu_item->children_menu->isNotEmpty() ? 'class="hasMenu"' : '' !!}>
                            <a href="{{ $menu_item->get_url_with_store($store_slug) ?? 'javascript:void(0)' }}" class="main-item" {!! $menu_item->open_in_new_tab ? 'target="_blank"' : '' !!}>{{ $menu_item->label }}{!! $menu_item->categories || $menu_item->children_menu->isNotEmpty() ? ' <span class="subChild"><i class="fa fa-angle-down"></i></span>' : '' !!}</a>
                            @if($menu_item->categories)
                            <ul>
                                @foreach(Helper::getMainCategories() as $category)
                                <li>
                                    <a href="{{ route('category', [$store_slug, $category->slug]) }}"  style="justify-content: inherit;" {!! $menu_item->open_in_new_tab ? 'target="_blank"' : '' !!}>
                                        @if(!empty($category->image))
                                            <img src="{{ $category->image }}" class="effects-image">
                                        @endif
                                        <span style="padding-left: 5px;color: #646464">{{ $category->name }}</span>
                                    </a>
                                </li>
                                @endforeach
                            </ul>
                            @elseif($menu_item->children_menu->isNotEmpty())
                            <ul>
                                @foreach($menu_item->children_menu as $child_menu)
                                <li><a href="{{ $child_menu->get_url_with_store($store_slug) ?? 'javascript:void(0)' }}" {!! $child_menu->open_in_new_tab ? 'target="_blank"' : '' !!}>{{ $child_menu->label }}</a></li>
                                @endforeach
                            </ul>
                            @endif
                        </li>
                        @endforeach
                        <li><a href="{{ route('contact-us', $store_slug) }}" class="main-item">Contact Us</a></li>
                        <li><a href="{{ route('store-details') }}" class="main-item">Hours & Store Details</a></li>
                    </ul>
                </nav>
            </div>    
            <div class="toggless">
                <div class="search-wrap">
                    <a href="javascript:void(0)"><img src="{{ asset('images/search.svg') }}" alt="Search Products"></a>
                    <div class="searchArea">
                        <form action="{{ route('search', $store_slug) }}">
                            <div class="search_site">
                                <input type="text" placeholder="Search..." name="keyword">
                                <button type="submit">Search</button>
                            </div>
                            <span class="close_search"><i class="fa fa-times"></i></span>
                        </form>
                    </div>
                </div>
                <div class="cart">
                    <a href="{{ route('view-cart', $store_slug) }}"><img src="{{ mix('images/shopping-bag.svg') }}" alt="Shopping Cart"></a>
                </div>
                <div class="menu-toggler">
                    <span></span>
                    <span></span>
                    <span></span>
                </div>
            </div>            
        </div>
    </header>
@endif