@extends('layouts.app')
@section('seo')
<title>Los más vendidos | {{infoEmail()->host}}</title>
    <meta name="description" content="Nuestros productos más populares en función de las ventas. Actualizado frecuentemente." />
    <meta name="keywords" content="Los más vendidos.">
@stop
@section('content')
    <!-- Page Banner Section Start -->
    <div class="page-banner-section section bg-image" data-bg="/assets/images/bg/breadcrumb.png">
        <div class="container">
            <div class="row">
                <div class="col">

                    <div class="page-banner text-left">
                        <h1>Los más vendidos</h1>
                        <ul class="page-breadcrumb">
                            <li><a href="/">Inicio</a></li>
                            <li>Mas vendidos</li>
                        </ul>
                    </div>

                </div>
            </div>
        </div>
    </div>
    <!-- Page Banner Section End -->
    <!-- Shop Section Start -->
    <div
        class="shop-section section pt-60 pt-lg-40 pt-md-30 pt-sm-20 pt-xs-30  pb-70 pb-lg-50 pb-md-40 pb-sm-60 pb-xs-50">
        <div class="container">
            <div class="row">
                <div class="col-12">
                    <div class="shop-area">
                        <div class="row">
                            <div class="col-12">
                                <!-- Grid & List View Start -->
                                <div class="shop-topbar-wrapper d-flex justify-content-between align-items-center">
                                    <div class="grid-list-option d-flex">
                                        <p>
                                            Mostrando {{ $products->firstItem() }}-{{ $products->lastItem() }} de {{ $products->total() }}</p>
                                    </div>

                                </div>
                                <!-- Grid & List View End -->
                            </div>
                        </div>
                        <div class="row">
                            <div class="col-lg-12 order-lg-1 order-1">
                                <div class="row">
                                    <div class="col-12">
                                        <div class="shop-product">
                                            <div id="myTabContent-2" class="tab-content">
                                                <div id="grid" class="tab-pane fade active show">
                                                    <div class="product-grid-view">
                                                        <div class="row">
                                                            @foreach($products as $val)
                                                                <div class="col-lg-3 col-md-6 col-sm-6">
                                                                    <!--  Single Grid product Start -->
                                                                    <div class="single-grid-product mb-40">
                                                                        <div class="product-image">
                                                                            <div class="product-label">
                                                                                <span style="width: 100px;position: absolute;top: 10px;z-index: 10;padding: 4px 9px;border-radius: 8px;font-size: 13px;font-weight: 700;color: #fff;background: #eb0029;">Top venta</span>
                                                                            </div>
                                                                            <a href="{{ $val->url }}">
                                                                                <img src="{{ $val->okpcode }}"
                                                                                     class="img-fluid"
                                                                                     alt="{{ ucfirst($val->locale) }} de repuesto {{ $val->jianjie1 }} para {{ $val->jianjie2 }}">
                                                                            </a>
                                                                            <div class="product-action">
                                                                                <ul>
                                                                                    <li><a href="{{ $val->url }}"><i
                                                                                                class="fa fa-cart-plus"></i></a>
                                                                                    </li>

                                                                                </ul>
                                                                            </div>
                                                                        </div>
                                                                        <div class="product-content">
                                                                            <h3 class="title"><a
                                                                                    href="{{ $val->url }}">
                                                                                    {{ ucfirst($val->locale) }} de repuesto {{ $val->jianjie1 }} para {{ $val->jianjie2 }}
                                                                                    </a>
                                                                            </h3>
                                                                            <p class="product-price"><span
                                                                                    class="discounted-price">{{ $val->price_symbol }}</span>
                                                                                <span
                                                                                    class="main-price discounted">{{ $val->price_old }}</span>
                                                                            </p>
                                                                        </div>
                                                                    </div>
                                                                    <!--  Single Grid product End -->
                                                                </div>
                                                            @endforeach


                                                        </div>
                                                    </div>
                                                </div>
                                                
                                            </div>
                                        </div>
                                    </div>
                                </div>
                                <div class="row mb-30 mb-sm-40 mb-xs-30">
                                    <div class="col">
                                        {{ $products->links() }}
                                    </div>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>
@stop