@extends('layouts.front.app')

@section('og')
<meta property="og:locale" content="{{ app()->getLocale() }}"/>
<meta property="og:type" content="home"/>
<meta property="og:title" content="{{ config('app.name') }} - Home"/>
<meta property="og:site_name" content="{{ config('app.name') }}"/>
<meta property="og:description" content="{{ config('site.description') }}"/>
@endsection

@section('content')

@include(config('site.domain').'.layouts.front.category')

<section>
  <div class="container mt-5">
    
    <hr class="custom">
    
    <div class="row info-icones">
      
      <div class="col-lg col-6">
        <div class="row">
          <div class="col-lg-4">
            <div class="view">
              <img src="{{asset('storage/images/ciadasloucas/frete.png')}}" height="45" alt="compre no site e retire na loja">
            </div>
          </div>
          <div class="col-lg pl-0">
            <h5 class="font-weight-bold secondary-text">RETIRE NA LOJA</h5>
            <h6 class="font-weight-bold fourth-text">Veja as condições</h6>
          </div>
        </div>
      </div>
      
      <div class="col-lg col-6">
        <div class="row">
          <div class="col-lg-4">
            <div class="view">
              <img src="{{asset('storage/images/ciadasloucas/card.png')}}" height="55" alt="parcelamento no cartão de crédito">
            </div>
          </div>
          <div class="col-lg pl-0">
            <h5 class="font-weight-bold secondary-text">ATÉ {{ config('cart.parc_sem_juros') }}X S/ JUROS</h5>
            <h6 class="font-weight-bold fourth-text">No cartão de crédito</h6>
          </div>
        </div>
      </div>
      
      <div class="col-lg col-6">
        <div class="row">
          <div class="col-lg-3">
            <div class="view">
              <img src="{{asset('storage/images/ciadasloucas/preco.png')}}" height="55" alt="precos excluisivos para o site">
            </div>
          </div>
          <div class="col-lg px-0">
            <h5 class="font-weight-bold secondary-text">PREÇOS EXCLUSIVOS</h5>
            <h6 class="font-weight-bold fourth-text">Em compras no site</h6>
          </div>
        </div>
      </div>
      
      <div class="col-lg col-6">
        <div class="row">
          <div class="col-lg-4">
            <div class="view">
              <img src="{{asset('storage/images/ciadasloucas/promocao.png')}}" height="55" alt="promocoes toda semana">
            </div>
          </div>
          <div class="col-lg pl-0">
            <h5 class="font-weight-bold secondary-text">PROMOÇÕES</h5>
            <h6 class="font-weight-bold fourth-text">Toda semana</h6>
          </div>
        </div>
      </div>
      
    </div>
    
    <hr class="custom">
    
  </div>
</section>

<section>
  
  {{-- Area 1 --}}
  
  <div class="container mt-5">
    <div class="cat-1">
      
      <h2 class="font-weight-bold h1-responsive title-group font-montserrat secondary-text">
        Promoções
      </h2>
      
      <div class="d-lg-block d-none">
        <div class="carousel-ciadasloucas">
          @include(config('site.domain').'.front.products.product-carousel', ['products' => $promocionais])
        </div>
      </div>
      
      <div class="d-block d-lg-none">
        @include(config('site.domain').'.front.products.product-list-mobile', ['products' => $promocionais->take(6)])
      </div>
      
    </div>
    
  </div>
  
  
  {{-- Area 2 --}}
  <div class="container">
    <div class="cat-2">
      
      <h2 class="font-weight-bold h1-responsive title-group font-montserrat secondary-text">
        Recentes
      </h2>
      
      <div class="d-lg-block d-none">
        <div class="carousel-ciadasloucas">
          @include(config('site.domain').'.front.products.product-carousel', ['products' => $novos])
        </div>
      </div>
      
      <div class="d-block d-lg-none">
        @include(config('site.domain').'.front.products.product-list-mobile', ['products' => $novos->take(6)])
      </div>
      
    </div>
  </div>
  
  {{-- Area 3 --}}
  <div class="container">
    <div class="cat-3">
      
      <h2 class="font-weight-bold h1-responsive title-group font-montserrat secondary-text">
        Destaque
      </h2>
      
      <div class="d-lg-block d-none">
        <div class="carousel-ciadasloucas">
          @include(config('site.domain').'.front.products.product-carousel', ['products' => $products])
        </div>
      </div>
      
      <div class="d-block d-lg-none">
        @include(config('site.domain').'.front.products.product-list-mobile', ['products' => $products->take(6)])
      </div>
      
    </div>
  </div>
  
</section>



@endsection