@extends('layouts.app')

@section('content')
    <div class="container content-container"  style="margin-top: 30px; padding-bottom: 40px; background:white">
        <div class="row content-row">
            @include('pages.product._sidebar')
            <div class="col-xl-9" id="primary">
                <div id="shop-breadcrumb">
                    <ul class="cms-breadcrumb">
                        <li><a class="breadcrumb-entry" href="/"> <i class="fas fa-home"></i>Home</a></li>
                        <li><a class="breadcrumb-entry" href="/">Shop</a></li>
                        <li><a class="breadcrumb-entry" href="/">Search Results</a></li>
                    </ul>
                </div>
                <div class="archive-topbar">
                    <div class="archive-topbar-heading">
                        <h2>Search results for: {{$term}}</h2>
                    </div>
                </div>
                <div class="shop-products_top mini-tab-title underline">
                    <div class="row align-items-center">
                        <div class="shop-grid-list col-12">
                            <div class="shop-products">
                                <div class="shop-products_bottom woocommerce">
                                    <div class="no-gutters-sm">
                                        @if($products->count() == 0)
                                            <div class="col-12">
                                                <div class="text-center btn-block ml-3 mr-3 p-4 alert alert-info">We
                                                    could not find any products when searching for:
                                                    <strong>{{ $term }}</strong></div>
                                            </div>
                                        @else
                                            <div class="col-12">
                                                <div class="woocommerce-notices-wrapper"></div>

                                                <ul class="products columns-4">
@php $count = 0; @endphp
                                                    @foreach($products as $productDB)
                                                        @php $product = App\Product::find($productDB->id); if($product == null) continue; @endphp
                                                        @php $category = $product->categories->first(); $count++; @endphp
                                                        <li class="product type-product post-520 status-publish first instock product_cat-cereals product_cat-jams-spreads product_tag-cereal product_tag-gluten-free product_tag-granola has-post-thumbnail taxable shipping-taxable purchasable product-type-simple">
                                                            <a href="{{ route('product', $product->id) }}"
                                                               class="woocommerce-LoopProduct-link woocommerce-loop-product__link">
                                                                <div class="product-inner">
                                                                    <div class="woocommerce-product-inner ">
                                                                        <div class="woocommerce-product-header">
                                                                            <a href="{{ route('product', $product->id) }}">
                                                                                <img width="113" height="187"
                                                                                     src="{{ ($product->getFirstMediaUrl('images', 'thumb') &&  $product->getFirstMediaUrl('images', 'thumb') != '') ? $product->getFirstMediaUrl('images', 'thumb') :  asset('/images/noimage.jpg') }}"
                                                                                     class="attachment-woocommerce_thumbnail size-woocommerce_thumbnail"
                                                                                     alt="" loading="lazy"
                                                                                     srcset="{{ ($product->getFirstMediaUrl('images', 'thumb') &&  $product->getFirstMediaUrl('images', 'thumb') != '') ? $product->getFirstMediaUrl('images', 'thumb') :  asset('/images/noimage.jpg') }}"
                                                                                     sizes="(max-width: 113px) 100vw, 113px"/>
                                                                            </a>
                                                                        </div>
                                                                        <div class="woocommerce-product-holder">
                                                                            <h3 class="woocommerce-product-title">
                                                                                <a href="{{ route('product', $product->id) }}">{{ $product->name }}</a>
                                                                            </h3>
                                                                            <div class="woocommerce-product-subtitle">{{ $category->name }}
                                                                            </div>
                                                                            <div class="woocommerce-product-attr">
                                                                                <div class="product-attr-inner attr-tooltip">
                                                                                    <a href="{{ route('category',$category->slug) }}">
                                                                                        @if($product->is_instant) <i
                                                                                                class=""
                                                                                                style="background-color: #89c33b; border-color: #89c33b;">I</i>
                                                                                        <span>Available for Instant Collection</span>
                                                                                        @else
                                                                                            <i class=""
                                                                                               style="background-color: #b4733b; border-color: #b4733b;">48H</i>
                                                                                            <span>Available within 48 Hours</span>
                                                                                        @endif
                                                                                    </a>
                                                                                </div>
                                                                            </div>
                                                                        </div>
                                                                        <div class="woocommerce-product-meta">

                                                        <span class="price"><span
                                                                    class="woocommerce-Price-amount amount"><bdi><span
                                                                            class="woocommerce-Price-currencySymbol">&pound;</span>{{ $product->getBuyablePrice() }}</bdi></span></span>
                                                                            <div class="woocommerce-add-to-cart">
                                                                                @if($product->hasSinglePrice())
                                                                                    <a href="?add-to-cart=520"
                                                                                       data-quantity="1"
                                                                                       class="button product_type_simple add_to_cart_button ajax_add_to_cart"
                                                                                       data-product_id="520"
                                                                                       data-product_sku=""
                                                                                       aria-label="Add &ldquo;{{ $product->name }}&rdquo; to your cart"
                                                                                       rel="nofollow">Add Cart</a>
                                                                                @else
                                                                                    <a href="{{ route('product', $product->id) }}"
                                                                                       class="button wc-forward product_type_simple add_to_cart_button"
                                                                                       aria-label="View &ldquo;{{ $product->name }}&rdquo;">View</a>
                                                                                @endif
                                                                            </div>
                                                                        </div>
                                                                    </div>
                                                                </div>
                                                            </a>
                                                        </li>
                                                    @endforeach
                                                </ul>
                                            </div>

                                            <div class="col-6">
                                                <div class="resultDetails">

                                                    Showing 1 - {{ $count }}
                                                    results
                                                    for
                                                    <strong>
                                                        {{ $term }}</strong>
                                                </div>

                                            </div>
                                        @endif
                                    </div>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>
@endsection