@extends('layouts.landingapp')
   @section('content')
   <style>
       .categories__item.store-category{
    height: 140px;
    width: 140px;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    padding-left: 51px;
    margin-bottom: 26px;
    margin-right: 349px;
}
  .more p{
      transition: 0.5s all ease-in-out;
  }
 .more:hover p{
    letter-spacing: 2px;.

 }
 .check-now{
    font-size: 14px;
    color: #111111;
    text-transform: uppercase;
    font-weight: 600;
    position: relative;
    padding: 0 0 3px;
    display: inline-block;
 }
 .check-now:after {
    position: absolute;
    left: 0;
    bottom: 0;
    height: 2px;
    width: 100%;
    background: #ca1515;
    content: "";
}

.owl-carousel .owl-item img {
    display: block;
    width: 100%;
    height: 400px;
}

.carting {
    padding: 15px 15px 0 15px;
}



    </style>

      <!-- Categories Section Begin -->
   <section class="categories">
    <div class="container-fluid">
        <div class="row">
            <div class="table-responsive">
            <table class="table">
            <tr>
            @foreach(App\StoreCategory::latest()->get() as $item)
            <td class="p-0 m-0">           
                <div class=" p-0 m-0 item-category">
                    <a href="{{url('category-stores/'.$item->id)}}" class="more">
                        <div class="categories__item set-bg" data-setbg="{{url('storage/images/storecategory/'.$item->image)}}">
                        </div>
                        <div class="categories__text font_category font_category_text">
                            <center>
                            <h4 style="padding-left: 0;" >{{$item->title}}</h4>  </center>
                        </div>
                    </a>
                   
                </div> 
            </td>           
                @endforeach
            </tr>
        </table>
        </div>
            </div>
        </div>
    </section>
<!-- Categories Section End -->

<!-- Promoted Items -->
@if($Sliders->count())
<section class="banner set-bg">
    <div class="container-fluid">
        <div class="row">
            <div class="col-xl-12 col-lg-12 m-auto">
                <div class="banner__slider owl-carousel">
                @foreach($Sliders as $Slider)
                    <a href="{{ url('StoreProducts/'.$Slider->store_id)}}">
                    <div class="banner__item">
                        <div>
                            <img src="{{url('storage/images/sliderimages/'.$Slider->image)}}">
                          
                        </div>
                    </div>
                    </a>
                    @endforeach
               
                </div>
               
            </div>
        </div>
    </div>
</section>
@endif 

@if($Banner->count())
     <section style="background-image:none;">
        <div class="container-fluid">
            <div class="row">
                <div class="col-xl-12 col-lg-12 m-auto">
                    <div class="top-banner" onclick="window.location.href ='{{url('/Product')}}';">
                        <img src="{{url('storage/images/bannerimages/'.$Banner->image)}}">                     
                    </div>
                </div>
            </div>
        </div>
        </section>
@endif 


<!-- Promoted Stores and products -->
@if(App\PromotedStore::get()->count() != 0)
<div id="carouselExampleControls" class="carousel slide" data-ride="carousel">
    <div class="carousel-inner">
        @foreach(App\PromotedStore::get() as $PromotedStore)            
       
        <div class="carousel-item  @if($loop->first) active @endif">
            
            <section class="product spad">
                <div class="container">
                    <div class="row">
                        <div class="col-lg-12 col-md-12">
                            <a href="{{url('StoreProducts/'.$PromotedStore->Stores->id)}}">
                                <div class="section-title">
                                    <h4>{{$PromotedStore->Stores->title}}</h4>
                                </div>
                            </a>
                        </div>            
                    </div>
                    <div class="row property__gallery">
                        @if($PromotedStore->Stores->StorePromotedItems()->count() != 0)         
                            @foreach($PromotedStore->Stores->StorePromotedItems as $StorePromotedItem) 
                                 <div class="col-lg-3 col-md-4 col-6 col-sm-6">
                                    <a href="{{url('/shope/'.$StorePromotedItem->Product->id)}}">
                                    <div class="product__item">
                                        <div class="product__item__pic set-bg" data-setbg="{{url('storage/images/products/'.$StorePromotedItem->Product->image)}}">                                                                         
                                            <ul class="product__hover">
                                                @if($StorePromotedItem->Product->ProductProperties()->count() != 0)
                                                    @foreach($StorePromotedItem->Product->ProductProperties as $item)
                                                    <li>{{$item->product_property_type_value->title ?? ''}}</li>
                                                    @endforeach
                                                @endif
                                            </ul> 
                                        </div>
                                        <a href="{{url('/shope/'.$StorePromotedItem->Product->id)}}">
                                            <div class="product__item__text d-flex">
                                                <div class="w-50">
                                                <h6>{{$StorePromotedItem->Product->title}}</h6>                  
                                                <div class="product__price">@currency($StorePromotedItem->Product->sales_amount)<span>@currency($StorePromotedItem->Product->mrp)</span></div>
                                                </div>
                                                <div class="w-50">
                                                    <div class="fn-icon float-right pt-2">
                                                        <a href="{{url('/shope/'.$StorePromotedItem->Product->id)}}"><span class="icon_bag_alt"></span></a> 
                                                    </div>
                                                </div>                     
                                            </div>
                                        </a>
                                    </div>
                                    </a>
                                </div>  

                                @endforeach
                        @else 
                        <div class="col-lg-12 col-md-12 col-sm-12">                              
                            <div class="product__item">
                                <div class="card text-center">
                                    <div class="card-body">
                                        <h5 class="card-title">Sorry, No Items Available..!</h5>
                                    </div>
                                </div>
                            </div>                               
                        </div>
                        @endif
                    </div>
                </div>
            </section>

        </div>
       
        @endforeach
    </div>
    <a class="carousel-control-prev" href="#carouselExampleControls" role="button" data-slide="prev">
      <span class="carousel-control-prev-icon" aria-hidden="true"></span>
      <span class="sr-only">Previous</span>
    </a>
    <a class="carousel-control-next" href="#carouselExampleControls" role="button" data-slide="next">
      <span class="carousel-control-next-icon" aria-hidden="true"></span>
      <span class="sr-only">Next</span>
    </a>
  </div>
@endif

<!-- end promoted store and products -->


@if(App\AllSlider::Active()->where('place',1)->get()->count())
<section class="banner middle-banner set-bg">
    <div class="container-fluid">
        <div class="row">
            <div class="col-xl-12 col-lg-12 m-auto">
                <div class="banner__slider owl-carousel">
                    @foreach(App\AllSlider::Active()->where('place',1)->get() as $MiddleSlid)                  
                    <div class="banner__item">
                        <div>
                            <a href="{{url('/StoreProducts/'.$MiddleSlid->store_id)}}"><img src="{{asset('storage/images/allsliders/'.$MiddleSlid->image)}}"></a>
                        </div>                        
                    </div>
                    @endforeach
                </div>
            </div>
        </div>
    </div>
    </section>
@endif

<!-- Product Section Begin -->
<section class="product spad">
    <div class="container">
        <div class="col-lg-12 col-md-12">
            <div class="section-title">
                <h4>Lates Products</h4>
            </div>
        </div>
        
        <div class="row property__gallery">
            @foreach($data as $key=>$value )
            @if($key=='products') 
               @foreach($value as $product)
            <div class="col-lg-3 col-md-4 col-6 mix filter{{$product->stores->store_category_id}}">
            <div class="product__item mob_item product-select">
                    <div class="product__item__pic set-bg" data-setbg="{{asset('storage/images/products/'.$product->image)}}" onclick="window.location.href ='{{url('/shope/'.$product->id)}}';">
                    {{-- <div class="product__item__pic item_pic_home set-bg"  onclick="window.location.href ='{{url('/shope/'.$product->id)}}';"> --}}
                   
                    <img src="{{asset('storage/images/products/'.$product->image)}}">
                    <ul class="product__hover">                   
                        @if($product->ProductProperties()->count() != 0)
                            @foreach($product->ProductProperties as $item)
                            <li>{{$item->product_property_type_value->title ?? ''}}</li>
                            @endforeach
                        @endif
                    </ul>   
                    </div>
                    
                    <a href="{{url('/shope/'.$product->id)}}">
                    <div class="product__item__text d-flex">
                        <div class="w-50">
                        <h6>{{$product->title}}</h6>                  
                        <div class="product__price">@currency($product->sales_amount)<span>@currency($product->mrp)</span></div>
                        </div>
                        <div class="w-50">
                            <div class="fn-icon float-right pt-2">
                                <a href="{{url('/shope/'.$product->id)}}"><span class="icon_bag_alt"></span></a> 
                            </div>
                        </div>                     
                    </div></a>
                </div>
            </div>
            @endforeach
            @endif
            @endforeach
        </div>
    </div>
    </section>
    <!-- end product section -->

<!-- Promoted stores Section Begin -->
{{--@if(App\PromotedStore::get()->count() != 0)
<section class="product spad">
    <div class="container-fluid">
        <div class="row">
            <div class="col-lg-12 col-md-12">
                <div class="section-title">
                    <h4>Our Stores</h4>
                </div>
            </div>            
        </div>
        <div class="row property__gallery">         
           @foreach(App\PromotedStore::get() as $PromotedStore) 
            <div class="col-lg-4 col-md-4 col-sm-6">
                <a href="{{url('StoreProducts/'.$PromotedStore->Stores->id)}}">
                <div class="product__item">
                    <div class="product__item__pic set-bg" data-setbg="{{url('storage/images/store/'.$PromotedStore->Stores->image)}}">                        
                    </div>
                    <div class="product__item__text">
                        <h6><a href="{{url('StoreProducts/'.$PromotedStore->Stores->id)}}">{{$PromotedStore->Stores->title}}</a></h6>                        
                    </div>
                </div>
                </a>
            </div>
            @endforeach
        </div>
    </div>
</section>
@endif --}}
<!-- Promoted stores Section End -->

  <!-- Product Section Begin -->
{{-- <section class="product spad">
<div class="container">
    <div class="col-lg-12 col-md-12">
        <div class="section-title">
            <h4>Grocery</h4>
        </div>
    </div>
    <div class="row property__gallery">
       
           @foreach($dailyneeds as $product)
        <div class="col-lg-3 col-md-4 col-4 mix filter{{$product->stores->store_category_id}}">
        <div class="product__item mob_item">
            
                
                <div class="grocery_item_pic set-bg"  onclick="window.location.href ='{{url('/shope/'.$product->id)}}';">
               
                <img src="{{url('storage/images/products/'.$product->image)}}">   
                </div>                
                <a href="{{url('/shope/'.$product->id)}}">
                <div class="product__item__text">
                    <h6>{{$product->title}}</h6>                   
                    <div class="product__price">@currency($product->sales_amount)<span>@currency($product->mrp)</span></div>
                </div></a>
            </div>
        </div>
        @endforeach

    </div>
</div>
</section> --}} 

<!-- Product Section Begin -->
{{--<section class="product spad">
<div class="container">
    <div class="col-lg-12 col-md-12">
        <div class="section-title">
            <h4>Butchery</h4>
        </div>
    </div>
    <div class="row property__gallery">
       
           @foreach($butchery as $product)
        <div class="col-lg-3 col-md-4 col-4 mix filter{{$product->stores->store_category_id}}">
        <div class="product__item mob_item">
            
                
                <div class="grocery_item_pic set-bg"  onclick="window.location.href ='{{url('/shope/'.$product->id)}}';">
               
                <img src="{{url('storage/images/products/'.$product->image)}}">   
                </div>               
                <a href="{{url('/shope/'.$product->id)}}">
                <div class="product__item__text">
                    <h6>{{$product->title}}</h6>                   
                    <div class="product__price">@currency($product->sales_amount)<span>@currency($product->mrp)</span></div>
                </div></a>
            </div>
        </div>
        @endforeach

    </div>
</div>
</section> --}}

<!-- Product Section End -->

<!-- Product Section Begin -->
{{--<section class="product spad">
<div class="container">
    <div class="col-lg-12 col-md-12">
        <div class="section-title">
            <h4>Tasty Foods</h4>
        </div>
    </div>
    <div class="row property__gallery">
       
           @foreach($tastyfood as $product)
        <div class="col-lg-3 col-md-4 col-4 mix filter{{$product->stores->store_category_id}}">
        <div class="product__item mob_item">
            
                
                <div class="grocery_item_pic set-bg"  onclick="window.location.href ='{{url('/shope/'.$product->id)}}';">
               
                <img src="{{url('storage/images/products/'.$product->image)}}">   
                </div>                
                <a href="{{url('/shope/'.$product->id)}}">
                <div class="product__item__text">
                    <h6>{{$product->title}}</h6>                   
                    <div class="product__price">@currency($product->sales_amount)<span>@currency($product->mrp)</span></div>
                </div></a>
            </div>
        </div>
        @endforeach

    </div>
</div>
</section> --}}

<!-- st-->
@if(App\AllSlider::Active()->where('place',2)->get()->count())
<section class="banner set-bg">
    <div class="container-fluid">
        <div class="row">
            <div class="col-xl-12 col-lg-12 m-auto">
           <div class="banner__slider owl-carousel">
            @foreach(App\AllSlider::Active()->where('place',2)->get() as $MiddSlider)
                    <div class="banner__item">
                        <div>
                            <a href="{{url('/StoreProducts/'.$MiddSlider->store_id)}}"><img src="{{asset('storage/images/allsliders/'.$MiddSlider->image)}}"></a>                         
                        </div>
                    </div>
            @endforeach
                </div>
            </div>
        </div>
    </div>
    </section>
@endif
    <!-- -->

    {{-- <section style="background-image:none;">
        <div class="container-fluid">
            <div class="row">
                <div class="col-xl-12 col-lg-12 m-auto">
                    <div class="top-banner">
                      
                        <img src="{{url('storage/app/public/images/bannerimages/'.$Banner->image)}}">
                        <!-- <img src="{{asset('images/test1.jpg')}}"></div> -->
                    </div>
                </div>
            </div>
        </div>
        </section> --}}

<!-- Banner Section Begin -->



<!-- Product Section End -->

{{-- <section class="banner set-bg" data-setbg="{{ asset('ashion/img/banner/banner-1.jpg') }}">
<div class="container">
    <div class="row">
        <div class="col-xl-7 col-lg-8 m-auto">
            <div class="banner__slider owl-carousel">
                <div class="banner__item">
                    <div class="banner__text">
                        <span>The Chloe Collection</span>
                        <h1>The Project Jacket</h1>
                        <a href="#">Shop now</a>
                    </div>
                </div>
                <div class="banner__item">
                    <div class="banner__text">
                        <span>The Chloe Collection</span>
                        <h1>The Project Jacket</h1>
                        <a href="#">Shop now</a>
                    </div>
                </div>
                <div class="banner__item">
                    <div class="banner__text">
                        <span>The Chloe Collection</span>
                        <h1>The Project Jacket</h1>
                        <a href="#">Shop now</a>
                    </div>
                </div>
            </div>
        </div>
    </div>
</div>
</section>  --}}
<!-- Banner Section End -->

<section class="trend spad">
    <div class="container">
        <div class="row">
            @if(App\Product::Active()->latest()->take(3)->get()->count())
            <div class="col-lg-4 col-md-4 col-sm-6">
                <div class="trend__content">
                    <div class="section-title">
                        <h4>Hot Trend</h4>
                    </div>
                @foreach(App\Product::Active()->latest()->take(3)->get() as $hotproduct)
                <a href="{{url('/shope/'.$hotproduct->id)}}">    
                    <div class="trend__item">
                            <div class="trend__item__pic" style="width:25%;height:25%;">
                                <img src="{{asset('storage/images/products/'.$hotproduct->image)}}" style="width:100%;">
                            </div>
                            <div class="trend__item__text">
                                <h6>Chain bucket bag</h6>                            
                                <div class="product__price">$ 59.0</div>
                            </div>
                        </div>
                    </a>
                  @endforeach  
                   
                </div>
            </div>
            @endif

            @if($MostPriceProducts->count())
            <div class="col-lg-4 col-md-4 col-sm-6">
                <div class="trend__content">
                    <div class="section-title">
                        <h4>Most Price</h4>
                    </div>
                @foreach($MostPriceProducts  as $MostPriceProduct)
                <a href="{{url('/shope/'.$MostPriceProduct->id)}}">
                    <div class="trend__item">
                        <div class="trend__item__pic" style="width:25%;height:25%;">
                            <img src="{{asset('storage/images/products/'.$MostPriceProduct->image)}}" style="width:100%;">
                        </div>
                        <div class="trend__item__text">
                            <h6>{{$MostPriceProduct->title}}</h6>                            
                            <div class="product__price">@currency($MostPriceProduct->sales_amount)</div>
                        </div>
                    </div>
                </a>
                  @endforeach  
                   
                </div>
            </div>
            @endif

            @if($FeatureProducts->count())
            <div class="col-lg-4 col-md-4 col-sm-6">
                <div class="trend__content">
                    <div class="section-title">
                        <h4>Feature</h4>
                    </div>
                @foreach($FeatureProducts as $FeatureProduct)
                <a href="{{url('/shope/'.$FeatureProduct->id)}}">
                    <div class="trend__item">
                        <div class="trend__item__pic" style="width:25%;height:25%;">
                            <img src="{{asset('storage/images/products/'.$FeatureProduct->image)}}" style="width:100%;">
                        </div>
                        <div class="trend__item__text">
                            <h6>{{$FeatureProduct->title ?? ''}}</h6>                            
                            <div class="product__price">@currency($FeatureProduct->sales_amount)</div>
                        </div>
                    </div>
                </a>
                  @endforeach  
                   
                </div>
            </div>
            @endif

        
        </div>
    </div>
</section>

<section class="services spad">
    <div class="container">
        <div class="row">
            <div class="col-lg-3 col-md-4 col-sm-6">
                <div class="services__item">
                    <i class="fa fa-car"></i>
                    <h6>Free Shipping</h6>
                    <p>For all oder over $99</p>
                </div>
            </div>
            <div class="col-lg-3 col-md-4 col-sm-6">
                <div class="services__item">
                    <i class="fa fa-money"></i>
                    <h6>Money Back Guarantee</h6>
                    <p>If good have Problems</p>
                </div>
            </div>
            <div class="col-lg-3 col-md-4 col-sm-6">
                <div class="services__item">
                    <i class="fa fa-support"></i>
                    <h6>Online Support 24/7</h6>
                    <p>Dedicated support</p>
                </div>
            </div>
            <div class="col-lg-3 col-md-4 col-sm-6">
                <div class="services__item">
                    <i class="fa fa-headphones"></i>
                    <h6>Payment Secure</h6>
                    <p>100% secure payment</p>
                </div>
            </div>
        </div>
    </div>
</section>


<!-- Bottom Slider Start -->
@if(App\AllSlider::Active()->where('place',3)->get()->count())
<section class="banner set-bg">
    <div class="container-fluid">
        <div class="row">
            <div class="col-xl-12 col-lg-12 m-auto">
                <div class="banner__slider owl-carousel">
                    @foreach(App\AllSlider::Active()->where('place',3)->get() as $BottomSlider)
                    <div class="banner__item">
                        <div>
                            <a href="{{url('/StoreProducts/'.$BottomSlider->store_id)}}"><img src="{{asset('storage/images/allsliders/'.$BottomSlider->image)}}"></a> 
                        </div>
                        {{-- <div class="banner__text">
                            <span>The Chloe Collection</span>
                            <h1>The Project Jacket</h1>
                            <a href="#">Shop now</a>
                        </div> --}}
                    </div>
                    @endforeach
                   
                </div>
            </div>
        </div>
    </div>
    </section>
@endif
<!-- bottom Section End -->

<!-- Trend Section End -->

<!-- Discount Section Begin -->
{{-- <section class="discount">
<div class="container">
    <div class="row">
        <div class="col-lg-6 p-0">
            <div class="discount__pic">
                <img src="{{ asset('ashion/img/discount.jpg') }}" alt="">
            </div>
        </div>
        <div class="col-lg-6 p-0">
            <div class="discount__text">
                <div class="discount__text__title">
                    <span>Discount</span>
                    <h2>Summer 2019</h2>
                    <h5><span>Sale</span> 50%</h5>
                </div>
                <div class="discount__countdown" id="countdown-time">
                    <div class="countdown__item">
                        <span>22</span>
                        <p>Days</p>
                    </div>
                    <div class="countdown__item">
                        <span>18</span>
                        <p>Hour</p>
                    </div>
                    <div class="countdown__item">
                        <span>46</span>
                        <p>Min</p>
                    </div>
                    <div class="countdown__item">
                        <span>05</span>
                        <p>Sec</p>
                    </div>
                </div>
                <a href="#">Shop now</a>
            </div>
        </div>
    </div>
</div>
</section> --}}
<!-- Discount Section End -->

<!-- Services Section Begin -->
{{-- <section class="services spad">
<div class="container">
    <div class="row">
        <div class="col-lg-3 col-md-4 col-sm-6">
            <div class="services__item">
                <i class="fa fa-car"></i>
                <h6>Free Shipping</h6>
                <p>For all oder over $99</p>
            </div>
        </div>
        <div class="col-lg-3 col-md-4 col-sm-6">
            <div class="services__item">
                <i class="fa fa-money"></i>
                <h6>Money Back Guarantee</h6>
                <p>If good have Problems</p>
            </div>
        </div>
        <div class="col-lg-3 col-md-4 col-sm-6">
            <div class="services__item">
                <i class="fa fa-support"></i>
                <h6>Online Support 24/7</h6>
                <p>Dedicated support</p>
            </div>
        </div>
        <div class="col-lg-3 col-md-4 col-sm-6">
            <div class="services__item">
                <i class="fa fa-headphones"></i>
                <h6>Payment Secure</h6>
                <p>100% secure payment</p>
            </div>
        </div>
    </div>
</div>
</section> --}}
<!-- Services Section End -->

<!-- Instagram Begin -->
<div class="instagram">
<div class="container-fluid">
    <div class="row">
        <div class="col-lg-2 col-md-4 col-sm-4 p-0">
            <div class="instagram__item set-bg" data-setbg="{{ asset('ashion/img/instagram/insta-1.jpg') }}">
                <div class="instagram__text">
                    <i class="fa fa-instagram"></i>
                    <a href="#">@ Kartinn_shop</a>
                </div>
            </div>
        </div>
        <div class="col-lg-2 col-md-4 col-sm-4 p-0">
            <div class="instagram__item set-bg" data-setbg="{{ asset('ashion/img/instagram/insta-2.jpg') }}">
                <div class="instagram__text">
                    <i class="fa fa-instagram"></i>
                    <a href="#">@ Kartinn_shop</a>
                </div>
            </div>
        </div>
        <div class="col-lg-2 col-md-4 col-sm-4 p-0">
            <div class="instagram__item set-bg" data-setbg="{{ asset('ashion/img/instagram/insta-3.jpg') }}">
                <div class="instagram__text">
                    <i class="fa fa-instagram"></i>
                    <a href="#">@ Kartinn_shop</a>
                </div>
            </div>
        </div>
        <div class="col-lg-2 col-md-4 col-sm-4 p-0">
            <div class="instagram__item set-bg" data-setbg="{{ asset('ashion/img/instagram/insta-4.jpg') }}">
                <div class="instagram__text">
                    <i class="fa fa-instagram"></i>
                    <a href="#">@ Kartinn_shop</a>
                </div>
            </div>
        </div>
        <div class="col-lg-2 col-md-4 col-sm-4 p-0">
            <div class="instagram__item set-bg" data-setbg="{{ asset('ashion/img/instagram/insta-5.jpg') }}">
                <div class="instagram__text">
                    <i class="fa fa-instagram"></i>
                    <a href="#">@ Kartinn_shop</a>
                </div>
            </div>
        </div>
        <div class="col-lg-2 col-md-4 col-sm-4 p-0">
            <div class="instagram__item set-bg" data-setbg="{{ asset('ashion/img/instagram/insta-6.jpg') }}">
                <div class="instagram__text">
                    <i class="fa fa-instagram"></i>
                    <a href="#">@ Kartinn_shop</a>
                </div>
            </div>
        </div>
    </div>
</div>
</div>
<!-- Instagram End -->

<script>
    function add_to_cart(productID){
    
        $.get('/add-to-cart/'+productID, function(data){            
            document.getElementById("spanCartCount").innerHTML=data;
            $('#cartdiv').load(document.URL + '#cartdiv'); 

                });
    
    }

  
    </script>

@endsection