@extends('frontend.master')
@section('home')




  <!-- ================================
    START BREADCRUMB AREA
================================= -->
<section class="breadcrumb-area section-padding img-bg-2">
   <div class="overlay"></div>

   <div class="container">

       <div class="breadcrumb-content d-flex flex-wrap align-items-center justify-content-between">
          
           <div class="section-heading">
               <h2 class="section__title text-white"> <a href="/"> <i class="la la-chevron-left icon text-white"> </i> </a>   All Products    </h2>
           </div>

           <ul class="generic-list-item generic-list-item-white generic-list-item-arrow d-flex flex-wrap align-items-center"> 
               <li> <a href="/" class="text-white"> Dashboard </a> </li>
                      
               <li class="text-white">   Collections  </li>

    
           </ul>

       </div><!-- end breadcrumb-content -->

   </div><!-- end container -->
</section><!-- end breadcrumb-area -->
<!-- ================================
   END BREADCRUMB AREA
================================= -->




@php
$categories = App\Models\Category::where('status', 1)->with(['products' => function ($query) {
    $query->where('status', 1)->where('language_id', 1)->orderBy('id', 'DESC');
}])->get();
@endphp




<section class="course-area pb-120px">
    <div class="container">

        <!-- section-heading -->
        <div class="section-heading text-center">
            
            <h4 class="pt-5 text-white"> COLLECTIONS  </h4>
            
            {{-- <span class="section-divider"></span> --}}

        </div><!-- end section-heading -->






          @foreach ($categories as $category)

         

          <h4 class="mt-5 text-white">  {{ $category->category_name}}  </h4>

        

          <div class="course-carousel owl-action-styled owl--action-styled mt-20px">


        
          @forelse ($category->products as $book)

              <div class="card card-item card-preview shadow" data-tooltip-content="#tooltip_content_3">

              <div class="card-image">
                 <a href="{{ route('frontend.show.product', $book->product_slug) }}" class="d-block">
                    <img class="card-img-top border border-dark rounded-lg img-fluid" style="border-width: 75px;" src="{{ asset($book->product_thumbnail) }}"  alt="Card image cap">

                    {{-- <h6 class="text-center py-3"><a href="{{ route('frontend.show.product', $book->product_slug) }}"> {{ $book->product_name }} </a></h6> --}}
                 </a>                    
              </div><!-- end card-image -->

              
            </div><!-- end card -->

            @empty

            <h5 class="text-primary" style="height:75px;"> Products Coming Soon  </h5>
                  
            @endforelse


    
          </div><!-- end tab-content -->




       
      @endforeach

   


</section>



    



   







@endsection