@include('more.partials._header')
            <!--=====================================-->
            <!--=          Search Box Start         =-->
            <!--=====================================-->
            <section class="bg-accent">
                <div class="container">
                    <div class="search-box-wrap-layout3">
                        <div class="search-box-layout1">
                            @include('more.partials.search')
                        </div>
                    </div>
                </div>
            </section>
            <!--=====================================-->
            <!--=          Product Start         =-->
            <!--=====================================-->
            <section class="product-inner-wrap-layout1 bg-accent">
                <div class="container">
                    <div class="row">
                        {{-- <div class="col-xl-3 col-lg-4 sidebar-break-md sidebar-widget-area" id="accordion">
                            <div class="widget-bottom-margin-md widget-accordian widget-filter">
                                @include('more.categories.partials._filter')
                            </div>
                        </div> --}}
                        <div class="col-xl-12 col-lg-12">
                            <div class="product-filter-heading">
                                <div class="row align-items-center">
                                    <div class="col-md-6">
                                        <h2 class="item-title">
                                            '{{ $query }}' Search results
                                            {{-- {{ $total_ads }}
                                            @if ($total_ads > 1)
                                                ads
                                            @else
                                                ad
                                            @endif  --}}
                                            {{-- found --}}
                                        </h2>
                                    </div>
                                    <div class="col-md-6 d-flex justify-content-md-end justify-content-center">
                                        <div class="product-sorting">
                                            <div class="ordering-controller">
                                                <button class="ordering-btn dropdown-toggle" type="button" data-toggle="dropdown" aria-expanded="false">
                                                    Sort By
                                                </button>
                                                <div class="dropdown-menu">
                                                    <a class="dropdown-item" href="#">A to Z (title)</a>
                                                    <a class="dropdown-item" href="#">Z to A (title)</a>
                                                    <a class="dropdown-item" href="#">Data Added (oldest)</a>
                                                    <a class="dropdown-item" href="#">Most Viewed</a>
                                                    <a class="dropdown-item" href="#">Less Viewed</a>
                                                    <a class="dropdown-item" href="#">Price (low to high)</a>
                                                    <a class="dropdown-item" href="#">Price (high to low)</a>
                                                </div>
                                            </div>
                                            <div class="layout-switcher">
                                                <ul>
                                                    <li>
                                                        <a href="#" data-type="product-box-list" class="product-view-trigger">
                                                            <i class="fas fa-th-list"></i>
                                                        </a>
                                                    </li>
                                                    <li class="active">
                                                        <a class="product-view-trigger" href="#" data-type="product-box-grid">
                                                            <i class="fas fa-th-large"></i>
                                                        </a>
                                                    </li>
                                                </ul>
                                            </div>
                                        </div>
                                    </div>
                                </div>
                            </div>
                            <div id="product-view" class="product-box-grid">
                                <div class="row">
                                    @if ($total_ads > 0)
                                        @foreach ($ads as $ad)
                                            {{-- @if ($ad['status'] === 'published') --}}
                                                {{-- col-xl-3 col-lg-3 col-md-6 col-sm-6 col-xs-6 --}}
                                                {{--  --}}
                                                @include('more.categories.partials._products')
                                            {{-- @endif --}}
                                        @endforeach
                                    @else
                                        <div class="col-xl-12">
                                            <p>No Listing Ads posted for {{ $title }} category</p>
                                        </div>
                                    @endif
                                </div>
                            </div>
                            
                            {{-- Pagination --}}
                            <div class="pagination-layout1">
                                <div class="btn-prev 
                                    @if ($prev_page_url == null)
                                        disabled
                                    @endif
                                ">
                                    <a href="{{ $prev_page_url; }}">
                                        <i class="fas fa-angle-double-left"></i>
                                        Previous
                                    </a>
                                </div>
                                <div class="page-number">
                                    <a href="{{ $path; }}" class="active">
                                        {{ $current_page }}
                                    </a>
                                    <a href="{{ $next_page_url }}">{{ $current_page + 1 }}</a>
                                </div>
                                <div class="btn-next">
                                    <a href="{{ $next_page_url }}">Next<i class="fas fa-angle-double-right"></i></a>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
            </section>

@include('more.partials._footer')