@extends('souqwaqif.layouts.app')
@section('content')
<section class="slider_section innerslider_section">
    <div id="carouselExampleCaptions" class="carousel slide carousel-fade" data-bs-ride="carousel">
      <div class="carousel-indicators">
        @php $i = 0; @endphp
        @foreach($banners as $banner)
          <button type="button" data-bs-target="#carouselExampleCaptions" data-bs-slide-to="{{$i}}" {!! $i==0 ? 'class="active"  aria-current="true"': '' !!} aria-label="Slide {{$i+1}}"></button>
          @php $i++; @endphp
        @endforeach
      </div>
      <div class="carousel-inner">
        @php $i = 0; @endphp
        @foreach($banners as $banner)
            <div class="carousel-item  slide {{ $i==0 ? 'active': '' }}" data-bs-interval="10000">
                <img src="{{isset($banner->image)?asset('storage/banners/'.$banner->image):asset('/images/no-image.png')}}" class="d-block w-100" alt="...">
                <div class="carousel-caption d-md-block">
                    <div>
                        {{-- <h1>{{trans('headings.aboutus-list')}} </h1> --}}
                        {!! $banner->description !!}
                    </div>
                </div>
            </div>
          @php $i++; @endphp
        @endforeach
      </div>
      <button class="carousel-control-prev" type="button" data-bs-target="#carouselExampleCaptions" data-bs-slide="prev"> <span class="carousel-control-prev-icon" aria-hidden="true"></span> <span class="visually-hidden">Previous</span> </button>
      <button class="carousel-control-next" type="button" data-bs-target="#carouselExampleCaptions" data-bs-slide="next"> <span class="carousel-control-next-icon" aria-hidden="true"></span> <span class="visually-hidden">Next</span> </button>
    </div>
  </section>
  <section class="diningpage-section section-padding">
    <div class="container">
      <div class="row">
        <div class="col-lg-12 text-center wow fadeInUp"  data-wow-duration="1s" data-wow-delay=".5s">
          <h2>{{trans('headings.restorant_coffee')}}</h2>
        </div>
      </div>
      <div class="row">
        <div class="col-lg-12">
          @if($restaurants->isNotEmpty())
            @php $temp = 1; @endphp
            <div id="{{str_replace(' ', '', $restaurants[0]['description'])}}" class="flex_sec pro_service_section wow fadeInUp diningpadding"  data-wow-duration="1s" data-wow-delay=".5s" >
              <div class="flex_image_div position-relative">
                <div class="owl-carousel dining_carousel owl-theme">
                  @foreach($restaurants as $restaurant)
                    <div class="item"> 
                      <a href="{{ asset('storage/dining/'.$restaurant->image) }}" data-fancybox="images" data-caption=""> 
                        <img src="{{ asset('storage/dining/'.$restaurant->image) }}"/> 
                      </a> 
                    </div>
                    @php $rest = $restaurant; @endphp
                  @endforeach
                </div>
              </div>
              <div class="flex_content_div">
                <div class="dining_content">
                  <h3>{!!$rest->description!!}</h3>
                  <p>{{$rest->hours_of_operation}}</p>
                  <a href="{{isset($rest->menu_pdf)?asset('storage/dining/'.$rest->menu_pdf):''}}" class="btn primary_btn">{{trans('headings.view_menu')}}</a> </div>
              </div>
            </div>
          @endif
          @if($lounges->isNotEmpty())
            @php $temp = 2; @endphp
            <div id="{{str_replace(' ', '', $lounges[0]['description'])}}" class="flex_sec pro_service_section wow fadeInUp diningpadding"  data-wow-duration="1s" data-wow-delay=".5s">
              <div class="flex_image_div position-relative">
                <div class="owl-carousel dining_carousel1 owl-theme">
                  @foreach($lounges as $lounge)
                    <div class="item"> 
                      <a href="{{ asset('storage/dining/'.$lounge->image) }}" data-fancybox="images" data-caption=""> 
                        <img src="{{ asset('storage/dining/'.$lounge->image) }}"/> 
                      </a> 
                    </div>
                    @php $loun = $lounge; @endphp
                  @endforeach
                </div>
              </div>
              <div class="flex_content_div">
                <div class="dining_content">
                  <h3>{!!$loun->description!!}</h3>
                  <p>{{$loun->hours_of_operation}}</p>
                  <a href="{{isset($loun->menu_pdf)?asset('storage/dining/'.$loun->menu_pdf):''}}" class="btn primary_btn">{{trans('headings.view_menu')}}</a> </div>
              </div>
            </div>
          @endif
          @if($room_sirvice->isNotEmpty())
            <div id="{{str_replace(' ', '', $room_sirvice[0]['description'])}}"  class="flex_sec pro_service_section wow fadeInUp diningpadding"  data-wow-duration="1s" data-wow-delay=".5s">
              <div class="flex_image_div position-relative">
                <div class="owl-carousel dining_carousel2 owl-theme">
                  @foreach($room_sirvice as $sirvice)
                    <div class="item"> 
                      <a href="{{ asset('storage/dining/'.$sirvice->image) }}" data-fancybox="images" data-caption=""> 
                        <img src="{{ asset('storage/dining/'.$sirvice->image) }}"/> 
                      </a> 
                    </div>
                    @php $room = $sirvice; @endphp
                  @endforeach
                </div>
              </div>
              <div class="flex_content_div">
                <div class="dining_content">
                  <h3>{!!$room->description!!}</h3>
                  <p>{{$room->hours_of_operation}}</p>
                  <a href="{{isset($room->menu_pdf)?asset('storage/dining/'.$room->menu_pdf):''}}" class="btn primary_btn">{{trans('headings.view_menu')}}</a> </div>
              </div>
            </div>
          @endif
        </div>
      </div>
    </div>
  </section>
  @if($foods->isNotEmpty())
    <section class="cuisineslider-section section-padding">
      <div class="container">
        <div class="row">
          <div class="col-lg-12 mb-4 wow fadeInUp"  data-wow-duration="1s" data-wow-delay=".5s">
            <div class="head-title text-start"> <span class="title-top title-top-left">{{trans('headings.worldclass_dishes')}}</span>
              <h2>{{trans('headings.international-food')}}</h2>
            </div>
          </div>
        </div>
      </div>
      <div class=" cuisine_carousel_block">
        <div class="row">
          <div class="col-lg-12 wow fadeInUp"  data-wow-duration="1s" data-wow-delay=".7s">
            <div class="owl-carousel cuisine_carousel owl-theme">
              @foreach($foods as $food)
                <div class="item">
                  <div class="cuisine_block">
                    <div class="forimg_animate">
                      <div class="imgsec">
                        <figure class="effect-apollo"> <img class="w-100" src="{{ asset('storage/dining/'.$food->image) }}"/>
                          <figcaption> </figcaption>
                        </figure>
                      </div>
                    </div>
                    <div class="cuisine_block_content">
                      <div class="cuisine_name"> {!! implode('</span></div>',explode('</span>',$food->description))!!}
                      <div class="res_timing"><i class="bi bi-clock"></i> {{$food->hours_of_operation}}</div>
                    </div>
                  </div>
                </div>
              @endforeach 
            </div>
          </div>
        </div>
      </div>
    </section>
  @endif

@endsection