@extends('layouts.app')
@section('seo')
<title>Comprar {{ $category->category_es }} {{ ucfirst($brand) }} al Mejor Precio | {{infoEmail()->host}}</title>
    <meta name="description" content="En {{infoEmail()->host}} encuentra variedad de modelos de {{ $category->category_es }} de marca {{ ucfirst($brand) }} a precios bajos con envío gratuito dentro de México." />
@if ($category->type === 'battery')
    <meta name="keywords" content="{{ $category->category_es }} {{ ucfirst($brand) }},{{ $category->category_es }} {{ ucfirst($brand) }},cambiar {{ $category->category_es }} {{ ucfirst($brand) }},{{ $category->category_es }} {{ ucfirst($brand) }} precio.">
@else
    <meta name="keywords" content="{{ $category->category_es }} {{ ucfirst($brand) }},{{ $category->category_es }} {{ ucfirst($brand) }} universal,comprar {{ $category->category_es }} {{ ucfirst($brand) }},cable {{ $category->category_es }} {{ ucfirst($brand) }}.">
@endif
@stop
@section('canonical')
    <link rel="canonical" href="{{ route('brand',[strtolower(rawurlencode($brand)),$category->id]) }}">
@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>{{ $category->category_es }} {{ ucfirst($brand) }}</h1>
                        <ul class="page-breadcrumb">
                            <li><a href="/">Inicio</a></li>
                            <li><a href="{{ route('category',[strName($category->category),$category->id]) }}">{{ $category->category_es }}</a></li>
                            <li>{{ ucfirst($brand) }}</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>Hay {{ $products->total() }} productos.
                                           </p>
                                    </div>

                                </div>
                                <!-- Grid & List View End -->
                            </div>
                        </div>
                        <div class="row">
                            <div class="col-lg-3 order-lg-1 order-2">
                                <!-- Single Sidebar End  -->
                                <!-- Single Sidebar Start  -->
                                <div class="common-sidebar-widget">
                                    <h3 class="sidebar-title">Productos populares para dispositivos de {{ ucfirst($brand) }}</h3>
                                    <ul class="sidebar-list">
                                        @foreach($new as $val)
                                            <li><a href="{{ $val->url }}">» 
                                                {{ ucfirst($val->locale) }} de repuesto para {{ $val->jianjie2 }} {{ $val->jianjie1 }}
                                                
                                            </a>
                                            </li>
                                        @endforeach

                                    </ul>
                                </div>

                                @if(count($brands)>0)
                                    <div class="common-sidebar-widget">
                                        <h3 class="sidebar-title">Marca compatible</h3>
                                        <ul class="sidebar-tag">
                                            @foreach($brands as $b)
                                                <li>
                                                    <a href="{{ route('brand',[strtolower(rawurlencode($b->cs)),$b->category1]) }}">» {{ ucfirst($b->cs) }}</a>
                                                </li>
                                            @endforeach

                                        </ul>
                                    </div>
                                @endif
                                <!-- Single Sidebar End  -->
                            </div>
                            <div class="col-lg-9 order-lg-2 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-4 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;">¡Oferta!</span>
                                                                            </div>
                                                                            <a href="{{ $val->url }}">
                                                                                <img src="{{ $val->okpcode }}"
                                                                                     class="img-fluid"
                                                                                     alt="{{ ucfirst($val->locale) }} compatible con {{ $val->jianjie2 }} – Modelos {{ $val->jianjie1 }}">
                                                                            </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" style="display: -webkit-box;-webkit-line-clamp: 2;-webkit-box-orient: vertical;overflow: hidden;font-weight:unset;"><a
                                                                                    href="{{ $val->url }}">
                                                                                    
                                                                                    {{ ucfirst($val->locale) }} compatible con {{ $val->jianjie2 }} – Modelos {{ $val->jianjie1 }}
                                                                                </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