@extends('layouts.front.front')
@section('maincontent')
 <section class="slick-slider-custom">   
      <div id="my-pics" class="carousel slide" data-ride="carousel">
         <ol class="carousel-indicators">
            <li data-target="#my-pics" data-slide-to="0" class="active"></li>
            <li data-target="#my-pics" data-slide-to="1"></li>
            <li data-target="#my-pics" data-slide-to="2"></li>
            <!--li data-target="#my-pics" data-slide-to="3"></li>
            <li data-target="#my-pics" data-slide-to="4"></li>
            <li data-target="#my-pics" data-slide-to="5"></li-->
         </ol>

      <div class="carousel-inner" role="listbox">
         <!--div class="item active">
            <a href="{{ route('front.shop.shop-by-category', ['c1' => 'kurta-set']) }}">
               <img src="{{ asset('front-shop/images/banner/banner1.webp') }}" alt="Sunset over beach">
            </a>
         </div>
         <div class="item" >
            <a href="{{ route('front.shop.shop-by-category', ['c1' => 'kurta-set']) }}">
               <img src="{{ asset('front-shop/images/banner/banner2.webp') }}" alt="Sunset over beach">
            </a>
         </div>
         <div class="item" >
            <a href="{{ route('front.shop.shop-by-category', ['c1' => 'kurta-set']) }}">
               <img src="{{ asset('front-shop/images/banner/banner3.webp') }}" alt="Sunset over beach">
            </a>
         </div-->
         <div class="item active">
            <a href="{{ route('front.shop.shop-by-category', ['c1' => 'kurta-set']) }}">
               <img loading="lazy" src="{{ asset('front-shop/images/banner/banner4.webp') }}" alt="Sunset over beach">
            </a>
         </div>
         <div class="item">
            <a href="{{ route('front.shop.shop-by-category', ['c1' => 'kurta-set']) }}">
               <img loading="lazy" src="{{ asset('front-shop/images/banner/banner5.webp') }}" alt="Sunset over beach">
            </a>
         </div>
         <div class="item">
            <a href="{{ route('front.shop.shop-by-category', ['c1' => 'kurta-set']) }}">
               <img loading="lazy" src="{{ asset('front-shop/images/banner/banner6.webp') }}" alt="Sunset over beach">
            </a>
         </div>
         </div>
         <a class="left carousel-control" href="#my-pics" role="button" data-slide="prev">
            <span class="icon-prev" aria-hidden="true"></span>
            <span class="sr-only">Previous</span>
         </a>
         <a class="right carousel-control" href="#my-pics" role="button" data-slide="next">
            <span class="icon-next" aria-hidden="true"></span>
            <span class="sr-only">Next</span>
         </a>
         </div>
      </div>
 </section> 

  <section class="static-section">
     <div class="container">
      <h1 class="text-center seperator">New Arrivals</h1>
       <div class="static-slide">
         <a href="#"><img loading="lazy" src="{{ asset('front-shop/images/show-ban-slide.jpg') }}" align="show-ban-slide"></a>
       </div>
     </div>
  </section>

<!--section class="container">
      <div class="layout-heading justify-space-between align-center">
          <h2 class="text-center seperator">Category Collection</h2>
        </div>
        <div class="product-layout-section custom-grid-product-layout-section">
           <div class="row">
              <div class="col-md-3 col-sm-3">
                <div class="placeholder-image-portfolio-panel placeholder-image-portfolio-panel-layout">
                   <div class="prel-gutter">
                      <a href="{{ route('front.shop.shop-by-category', ['c1' => 'kurtis']) }}">
                        <div class="dynamic-img-container">
                           <img loading="lazy" src="{{ asset('front-shop/images/kurti.jpg') }}">
                        </div>
                        <div class="image-gradient"></div>
                        <div class="caption-dynamic-img-container product-layout-caption-dynamic-img-container">
                           <div class="title-layout-product">Kurti Collection </div>
                           <div class="layout-shop-now btn btn-danger">Shop Now</div>
                        </div>
                      </a>
                   </div>
                </div>
              </div>

              <div class="col-md-3 col-sm-3">
                <div class="placeholder-image-portfolio-panel placeholder-image-portfolio-panel-layout">
                   <div class="prel-gutter">
                      <a href="{{ route('front.shop.shop-by-category', ['c1' =>'bottoms']) }}">
                        <div class="dynamic-img-container">
                           <img loading="lazy" src="{{ asset('front-shop/images/bottom.webp') }}">
                        </div>
                        <div class="image-gradient"></div>
                        <div class="caption-dynamic-img-container product-layout-caption-dynamic-img-container">
                           <div class="title-layout-product">Bottom Collection </div>
                           <div class="layout-shop-now btn btn-danger">Shop Now</div>
                        </div>
                      </a>
                   </div>
                </div>
              </div>

              <div class="col-md-3 col-sm-3">
                <div class="placeholder-image-portfolio-panel placeholder-image-portfolio-panel-layout">
                   <div class="prel-gutter">
                      <a href="{{ route('front.shop.shop-by-category', ['c1' => 'dress']) }}">
                        <div class="dynamic-img-container">
                           <img loading="lazy" src="{{ asset('front-shop/images/dress.jpg') }}">
                        </div>
                        <div class="image-gradient"></div>
                        <div class="caption-dynamic-img-container product-layout-caption-dynamic-img-container">
                           <div class="title-layout-product">Dress Collection </div>
                           <div class="layout-shop-now btn btn-danger">Shop Now</div>
                        </div>
                      </a>
                   </div>
                </div>
              </div>

              <div class="col-md-3 col-sm-3">
                <div class="placeholder-image-portfolio-panel placeholder-image-portfolio-panel-layout">
                   <div class="prel-gutter">
                      <a href="{{ route('front.shop.shop-by-category', ['c1' => 'top-tunic']) }}">
                        <div class="dynamic-img-container">
                           <img loading="lazy" src="{{ asset('front-shop/images/top-tunic.jpg') }}">
                        </div>
                        <div class="image-gradient"></div>
                        <div class="caption-dynamic-img-container product-layout-caption-dynamic-img-container">
                           <div class="title-layout-product">Top & Tunic Collection </div>
                           <div class="layout-shop-now btn btn-danger">Shop Now</div>
                        </div>
                      </a>
                   </div>
                </div>
              </div>

              <div class="seperator clearfix"></div>

              <div class="col-md-3 col-sm-3">
                <div class="placeholder-image-portfolio-panel placeholder-image-portfolio-panel-layout">
                   <div class="prel-gutter">
                      <a href="{{ route('front.shop.shop-by-category', ['c1' => 'kurta-set']) }}">
                        <div class="dynamic-img-container">
                           <img loading="lazy" src="{{ asset('front-shop/images/kurtaset.jpg') }}">
                        </div>
                        <div class="image-gradient"></div>
                        <div class="caption-dynamic-img-container product-layout-caption-dynamic-img-container">
                           <div class="title-layout-product">Kurta Set Collection </div>
                           <div class="layout-shop-now btn btn-danger">Shop Now</div>
                        </div>
                      </a>
                   </div>
                </div>
              </div>

              <div class="col-md-3 col-sm-3">
                <div class="placeholder-image-portfolio-panel placeholder-image-portfolio-panel-layout">
                   <div class="prel-gutter">
                      <a href="{{ route('front.shop.shop-by-category', ['c1' => 'jackets']) }}">
                        <div class="dynamic-img-container">
                           <img loading="lazy" src="{{ asset('front-shop/images/jacket.webp') }}">
                        </div>
                        <div class="image-gradient"></div>
                        <div class="caption-dynamic-img-container product-layout-caption-dynamic-img-container">
                           <div class="title-layout-product">Jackets Collection </div>
                           <div class="layout-shop-now btn btn-danger">Shop Now</div>
                        </div>
                      </a>
                   </div>
                </div>
              </div>


              <div class="col-md-3 col-sm-3">
                <div class="placeholder-image-portfolio-panel placeholder-image-portfolio-panel-layout">
                   <div class="prel-gutter">
                      <a href="{{ route('front.shop.shop-by-category', ['c1' => 'stole-and-scarf']) }}">
                        <div class="dynamic-img-container">
                           <img loading="lazy" src="{{ asset('front-shop/images/stole.webp') }}">
                        </div>
                        <div class="image-gradient"></div>
                        <div class="caption-dynamic-img-container product-layout-caption-dynamic-img-container">
                           <div class="title-layout-product">Stole N Scarves Collection </div>
                           <div class="layout-shop-now btn btn-danger">Shop Now</div>
                        </div>
                      </a>
                   </div>
                </div>
              </div>

              <div class="col-md-3 col-sm-3">
                <div class="placeholder-image-portfolio-panel placeholder-image-portfolio-panel-layout">
                   <div class="prel-gutter">
                      <a href="{{ route('front.shop.shop-by-category', ['c1' => 'jewellery']) }}">
                        <div class="dynamic-img-container">
                           <img loading="lazy" src="{{ asset('front-shop/images/jewellery3.jpeg') }}">
                        </div>
                        <div class="image-gradient"></div>
                        <div class="caption-dynamic-img-container product-layout-caption-dynamic-img-container">
                           <div class="title-layout-product">Jewellery Collection </div>
                           <div class="layout-shop-now btn btn-danger">Shop Now</div>
                        </div>
                      </a>
                   </div>
                </div>
              </div> 
           </div>
        </div>
</section-->

<!---------------------Kurtis Product  Section ------------------------------------------------>

<section class="container">
        <div class="layout-heading justify-space-between align-center">
          <h1 class="text-center seperator"><a href="{{ route('front.shop.shop-by-category', ['c1' => 'kurti']) }}">Kurtis</a>
          <span ><a class="btn btn-danger" href="{{ route('front.shop.shop-by-category', ['c1' => 'kurti']) }}">View All</a></span>
          </h1>
        </div>
        <div class="product-layout-section custom-grid-product-layout-section scroll-custom-grid-product-layout-section">
           <div class="row">             
            @foreach($kurtis as $kurti)            
              <div class="col-md-3 col-sm-3">
                <div class="placeholder-image-portfolio-panel placeholder-image-portfolio-panel-layout">
                   <div class="prel-gutter">
                      <a href="{{ route('front.shop.shop-product-details', ['code' => $kurti->article,'color' => $kurti->color,'pid' => $kurti->id]) }}">
                        <div class="dynamic-img-container">