@extends('web.layouts.main')
@section('content')
  <main>
        <!--Start header -->
        <header class="header">
            <div class="container">
                <div class="swiper-container header-swiper">
                    <div class="swiper-wrapper">
                        @foreach($sliders as $row)
                        <div class="swiper-slide">
                            <div class="item">
                                <div class="col-md-6">
                                    <div class="text-box">
                                        <h5 class="subtitle text-white mb-3">{{sliderdescription($row->id,'title')}}</h5>
                                        <h1 class="title text-white mb-4"><b>{{sliderdescription($row->id,'name')}} </b></h1>
                                        <p class="det">
                                            {!!sliderdescription($row->id,'description')!!}
                                        </p>
                                        <a href="{{$row->link}}" target="_blank" class="butn border-white-butn mt-4"><span class="zi-5">{{__('web.reserve_now')}}</span></a>
                                    </div>
                                </div>
                                <img src="{{asset($row->image)}}" alt="" class="bg"/>
                            </div>
                        </div>
                        @endforeach
                    </div>
                    <!-- Add Pagination -->
                    <div class="swiper-pagination"></div>
                </div>
            </div>
            <div class="social-links">
                <a href="{{settings('facebook')}}" target="_blank"><i class="fa-brands fa-facebook-f"></i></a>
                <a href="{{settings('twitter')}}" target="_blank"><i class="fa-brands fa-twitter"></i></a>
                <a href="{{settings('instagram')}}" target="_blank"><i class="fa-brands fa-instagram"></i></a>
            </div>
        </header>
        <!-- Start about-sec -->
        <section class="about-sec section">
            <div class="container">
                <div class="row">
                    <div class="col-lg-6">
                        <div class="text-box">
                            <p class="color-secondary mb-3 wow tracking-in-expand-fwd-bottom">{{__('web.electron_exper')}}</p>
                            <h2 class="title mb-3 wow tracking-in-expand-fwd-top"><b>{!! pagedescription($about->id,'title') !!}</b></h2>
                            <h2 class="title wow tracking-in-expand-fwd-top">{!! pagedescription($about->id,'name') !!}</h2>
                            <p class="p color-gray mt-4 wow fadeInUp">
                            {!! pagedescription($about->id,'description') !!}
                                                        </p>
                            <!--<div class="row mt-4">-->
                            <!--    <div class="col-6">-->
                            <!--        <p class="label wow text-focus-in"><i class="fa-solid fa-circle-check"></i> إصلاح فوري</p>-->
                            <!--    </div>-->
                            <!--    <div class="col-6">-->
                            <!--        <p class="label wow text-focus-in"><i class="fa-solid fa-circle-check"></i> متابعة مستمرة</p>-->
                            <!--    </div>-->
                            <!--</div>-->
                            <a href="{{getCurrentLocale().'/aboutus'}}" class="butn border-butn mt-4 wow zoomIn"><span class="zi-5">{{__('web.read_more')}}</span></a>
                        </div>
                    </div>
                    <div class="col-lg-6">
                        <img src="{{asset($about->image)}}" class="sec-img lg-img wow text-focus-in"/>
                        <div class="row mt-4">
                            <div class="col-md-6">
                                <div class="img-box">
                                    <img src="{{asset($second->banner)}}" alt="" class="sec-img wow text-focus-in"/>
                                    <a data-fancybox href="{{$second->youtube}}" class="play-btn wow zoomIn">
                                        <i class="fas fa-play"></i>
                                    </a>
                                </div>
                            </div>
                            <div class="col-md-6">
                                <div class="text center-vr wow text-focus-in">
                                    <h5 class="subtitle">{!! pagedescription($second->id,'title') !!}</h5>
                                    <p class="p color-gray mb-0">{!! pagedescription($second->id,'description') !!}</p>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </section>
        <!-- Start services-sec -->
        <section class="services-sec section">
            <div class="container">
                <div class="row">
                    <div class="col-md-6">
                        <div class="swiper-container text-service-swiper">
                            <div class="swiper-wrapper">
                                
                                @foreach($banners as $row)
                                <div class="swiper-slide">
                                    <div class="text-box mt-5">
                                        <h5 class="subtitle text-white mb-3">{{sliderdescription($row->id,'title')}}</h5>
                                        <h1 class="title text-white mb-4"><b>{{sliderdescription($row->id,'name')}}</b></h1>
                                        <p class="p color-gray mb-5">
{!! sliderdescription($row->id,'description') !!}       
</p>
                                        <div class="row">
                                            <div class="col-6">
                                                <p class="label text-white"><i class="fa-solid fa-circle-check"></i> {{sliderdescription($row->id,'adv_one')}}</p>
                                            </div>
                                            <div class="col-6">
                                                <p class="label text-white"><i class="fa-solid fa-circle-check"></i> {{sliderdescription($row->id,'adv_two')}} </p>
                                            </div>
                                            <div class="col-6">
                                                <p class="label text-white"><i class="fa-solid fa-circle-check"></i> {{sliderdescription($row->id,'adv_three')}} </p>
                                            </div>
                                            <div class="col-6">
                                                <p class="label text-white"><i class="fa-solid fa-circle-check"></i> {{sliderdescription($row->id,'adv_four')}} </p>
                                            </div>
                                        </div>
                                        <a href="{{$row->link}}" target="_blank" class="butn border-white-butn mt-5"><span class="zi-5">{{__('web.order_service')}}</span></a>

                                    </div>
                                </div>
                                @endforeach
                            </div>
                        </div>
                    </div>
                    <div class="col-md-6">
                        <div class="swiper-container img-service-swiper">
                            <div class="swiper-wrapper">
                                 @foreach($banners as $row)
                                <div class="swiper-slide">
                                    <div class="img-box">
                                        <img src="{{asset($row->image)}}" alt="" class="sec-img"/>
                                        <div class="content">
                                            <h4 class="title text-white"><b>{{sliderdescription($row->id,'name')}} </b></h4>
                                            <p class="p">
{!! sliderdescription($row->id,'description') !!}                                               </p>
                                        </div>
                                    </div>
                                </div>
                                @endforeach
                            </div>
                        </div>
                        <div class="text-center">
                            <div class="swiper-pagination position-relative mt-3"></div>
                        </div>
                    </div>
                </div>
            </div>
        </section>
        <!-- Start feedback-sec -->
        <section class="feedback-sec section">
            <div class="container">
                <div class="text-box text-center mb-5 pb-2">
                    <p class="color-secondary mb-3 wow tracking-in-expand-fwd-bottom">{{__('web.review')}}</p>
                    <h1 class="title mb-3 wow tracking-in-expand-fwd-top"><b>{{__('web.review_us')}}</b></h1>
                    <p class="p wow fadeInUp">{{__('web.review_desc')}}</p>
                </div>
                <div class="swiper-container feedback-swiper">
                    <div class="swiper-wrapper pb-5">
                        @foreach($reviews as $row)
                        <div class="swiper-slide">
                            <div class="item">
                                <div class="img-box">
                                    <img src="{{asset($row->image)}}" alt="" class="sec-img"/>
                                    <span class="icon"><i class="fa-solid fa-quote-right"></i></span>
                                </div>
                                <div class="prof-data text-center mt-4">
                                    <h5 class="name"><b>{{reviewdescription($row->id,'user')}} </b></h5>
                                    <p class="job">{{reviewdescription($row->id,'job')}}</p>
                                </div>
                                <div class="content-box">
                                    <div class="stars">
                                        @for($i=0;$i < $row->rate;$i++)
                                        <i class="fas fa-star active"></i>
                                        @endfor
                                        @for($i=0;$i < (5-$row->rate);$i++)
                                        <i class="fas fa-star"></i>
                                        @endfor
                                    </div>
                                    <p class="feedback_p">
                                        {!!reviewdescription($row->id,'description')!!}
                                          </p>
                                </div>
                            
                            </div>
                        </div>
                        @endforeach
                    </div>
                    <!-- Add Pagination -->
                    <div class="swiper-pagination"></div>
                </div>
            </div>
        </section>
        <!-- Start gallery-sec -->
        <section class="gallery-sec section pt-0">
            <div class="container">
                <div class="row">
                    <div class="col-lg-3 col-md-6">
                        <a href="{{asset($gallery->image)}}" data-fancybox="{{url('')}}/assets/web/images">
                            <img src="{{asset($gallery->image)}}" alt="" class="sec-img sm-img wow text-focus-in"/>
                        </a>
                        <a href="{{asset($gallery->image_1)}}" data-fancybox="{{url('')}}/assets/web/images">
                            <img src="{{asset($gallery->image_1)}}" alt="" class="sec-img sm-img wow text-focus-in"/>
                        </a>
                    </div>
                    <div class="col-lg-3 col-md-6">
                        <a href="{{asset($gallery->image_2)}}" data-fancybox="{{url('')}}/assets/web/images">
                            <img src="{{asset($gallery->image_2)}}" alt="" class="sec-img lg-img wow text-focus-in"/>
                        </a>
                    </div>
                    <div class="col-lg-6">
                        <div class="text-box center-vr">
                            <h2 class="title mb-4 wow tracking-in-expand-fwd-bottom"><b>{!!gallerydescription($gallery->id,'name')!!}  </b></h2>
                            <p class="p wow fadeInUp">
                            {!!gallerydescription($gallery->id,'description')!!}                            </p>
                            <a href="{{$gallery->link}}" target="_blank" class="butn primary-butn mt-4 wow zoomIn"><span class="zi-5">{{__('web.read_more')}}</span></a>
                        </div>
                    </div>
                </div>
            </div>
        </section>
        <!-- Start partners-sec -->
        <section class="partners-sec section pt-0">
            <div class="container">
                <div class="text-box text-center mb-4">
                    <p class="color-secondary mb-3 wow tracking-in-expand-fwd-bottom">{{__('web.partners')}}</p>
                    <h1 class="title mb-3 wow tracking-in-expand-fwd-top"><b> {{__('web.partners')}} </b></h1>
                </div>
                <div class="swiper-container partners-swiper pb-3">
                    <div class="swiper-wrapper pt-5 pb-5">
                        @foreach($partners as $row)
                        <div class="swiper-slide">
                            <img src="{{asset($row->image)}}" alt="" class="partner-logo"/>
                        </div>
                        @endforeach
                    </div>
                    <!-- Add Pagination -->
                    <div class="swiper-pagination"></div>
                </div>
            </div>
        </section>
    </main>

       @push('js')
   <script>
        function selectcat(elem){
        let data = $(elem).val();
      $.ajax({
          url : {!! json_encode(url(getCurrentLocale().'/selectcat/')) !!}+'/'+data,
          type: 'GET',              
          data: 'dataform',
          success:function(data)
          {
           
              $('#stores').html(data);
          }
       
        })
        }
        
    </script>
   @endpush
@stop