@section('css')
    <style>
        .imagem{
            position:relative;
         }
         .imagem-esgotado {
            width:180px; /* largura da imagem máscara */
            height:180px; /* altura da imagem máscara */
            position:absolute;
            z-index: 100 !important;
            top:25%;
            /*background:url('storage/img/carimbo-esgotado.png') 0 0 no-repeat; /* imagem máscara */
         }
    </style>
@endsection
@if($products)
     <!-- Container -->
    <div class="row wow fadeIn justify-content-center">
        @foreach($products as $product)
            <!-- Column -->
            <div class="col-sm-2 m-1 d-flex align-items-stretch">

                <!--Card-->
                <div class="card">

                <!--Card image-->
                <div class="view">
                    <a class="black-text title-principal" href="{{ route('front.get.product', [str_slug($product->slug), $product->id]) }}">
                            @if($product->quantity === 0)
                                <div class="imagem-esgotado"> <img src="{{ asset('storage/img/carimbo-esgotado.png') }}" alt="{{ $product->name }}" class="card-img-top" /> </div>
                            @endif
                            @if(isset($product->cover))
                                <a class="black-text title-principal " href="{{ route('front.get.product', [str_slug($product->slug), $product->id]) }}"><img src="{{ asset("$product->cover") }}" alt="{{ $product->name }}" class="card-img-top"></a>
                            @else
                                <img src="https://placehold.it/263x330" alt="{{ $product->name }}" class="card-img-top" />
                            @endif
                        </a>
                    <a href="#">
                    <div class="mask rgba-white-slight"></div>
                    </a>
                </div>

                <!--Card content-->
                <div class="card-body">
                    <!--Title-->
                    <span class="card-title">
                        <!--Category & Title-->
                        <a class="black-text title-principal " href="{{ route('front.get.product', [str_slug($product->slug), $product->id]) }}"> <span class="d-inline-block m-1 z-depth-1 w-100" style="max-width: 350px;">{{ $product->name }}</span>
                        </a>
                        </span>
                    <!--Text-->
                    <p class="card-text">
                    @if(!is_null($product->attributes->where('default', 1)->first()))
                            @if(!is_null($product->attributes->where('default', 1)->first()->sale_price))
                                {{ number_format($product->attributes->where('default', 1)->first()->sale_price, 2, ',', '.') }}
                                <p class="text text-danger">Promoção!</p>
                            @else
                                {{ number_format($product->attributes->where('default', 1)->first()->price, 2, ',', '.') }}
                            @endif
                        @else
                            @if ($product->sale_price && ($product->sale_price_ini < date("Y-m-d")) && ($product->sale_price_fim >= date("Y-m-d")))
                                <span class="font-italic" style="text-decoration: line-through; color:red;opacity:0.65; -moz-opacity: 0.65; filter: alpha(opacity=65);">{{ config('cart.currency_symbol') }} {{ number_format($product->price, 2, ',', '.') }}</span> {{ config('cart.currency_symbol') }} {{ number_format($product->sale_price, 2, ',', '.') }}
                            @else
                                <span class="">{{ config('cart.currency_symbol') }} {{ number_format($product->price, 2, ',', '.') }}</span>
                            @endif
                        @endif
                        <!-- Efetua mostra de parcelas, caso esteja configurado -->
                        @if(config('payees.parcels') > 0)
                            @php
                                $valor = 0.00;
                                $parcela = 0;
                                $preco_valido = (($product->sale_price_ini < date("Y-m-d")) && ($product->sale_price_fim >= date("Y-m-d"))) ? $product->sale_price ?? $product->price : $product->price;
                                for($p = 1 ; $p <= config('payees.parcels') ; $p++) {
                                    if (round($preco_valido / $p, 2) > config('payees.parcel_min')) {
                                        $valor = round($preco_valido / $p, 2);
                                        $parcela = $p;
                                    }
                                }
                            @endphp
                            <span class="font-italic"><small>em até {{ $parcela }} x de {{ config('cart.currency_symbol') }} {{ number_format($valor, 2, ',', '.') }}</small></span>
                        @endif
                        @if(config('payees.discount') > 0)
                            @php
                                $valor_calculo = (($product->sale_price_ini < date("Y-m-d")) && ($product->sale_price_fim >= date("Y-m-d"))) ? $product->sale_price ?? $product->price : $product->price;
                                $valor_desconto = round($valor_calculo * (config('payees.discount') / 100));
                                $valor_vista = ($valor_calculo - $valor_desconto);
                            @endphp
                            <span class="font-italic"><small>ou por  {{ config('cart.currency_symbol') }} {{ number_format($valor_vista, 2, ',', '.') }} à vista</small></span>
                        @endif
                        <p><span class="font-italic"><small>* Disponível para Curitiba e região</small></span></p>
                        <div class="position-absolute fixed-bottom mt-1 p-1">
                                @if($product->quantity > 0)
                                    <form action="{{ route('cart.store') }}" class="form-inline" method="post">
                                    {{ csrf_field() }}
                                    <input type="hidden" name="quantity" value="1" />
                                    <input type="hidden" name="product" value="{{ $product->id }}">

                                        <button id="add-to-cart-btn-{{ $produto->id }}" type="submit" class="btn btn-opera btn-rounded btn-md btn-block" data-toggle="modal" data-target="#cart-modal"> <i class="fas fa-shopping-basket"></i> Comprar</button>
                                    </form>
                                @else
                                    <button type="button" class="btn btn-danger btn-rounded btn-lg btn-block" disabled>Indisponível</button>
                                @endif
                        </div>
                    </p>
                </div>

                </div>
                <!--/.Card-->

            </div>
            <!-- Column -->
        @endforeach
    </div>
    <!-- Container -->
    @if($products instanceof \Illuminate\Contracts\Pagination\LengthAwarePaginator)
        <div class="row">
            <div class="col-md-12">
                <div class="pull-left">{{ $products->links() }}</div>
            </div>
        </div>
    @endif
@else
    <p class="alert alert-warning">Nenhum produto encontrado para esta busca.</p>
@endif