@extends('frontend.layout')

@section('pageHeading')
  @if (!empty($pageHeading))
    {{ $pageHeading->hotel_page_title }}
  @else
    {{ __('Restaurant') }}
  @endif
@endsection

@section('metaKeywords')
  @if (!empty($seoInfo))
    {{ $seoInfo->meta_keyword_hotels }}
  @endif
@endsection

@section('metaDescription')
  @if (!empty($seoInfo))
    {{ $seoInfo->meta_description_hotels }}
  @endif
@endsection

@section('content')
  <!-- Page title start-->
  @includeIf('frontend.partials.breadcrumb', [
      'breadcrumb' => $bgImg->breadcrumb?? 'Restaurant',
      'title' => !empty($pageHeading) ? $pageHeading->restaurant_page_title : 'Restaurant',
  ])
  <!-- Page title end-->

  
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/bootstrap-icons@1.10.5/font/bootstrap-icons.css">
<link rel="stylesheet" href="{{ asset('assets/css/restaurant.css') }}">

<style>
.text-gradient {
    background: #732034;
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
}

.hover-shadow:hover {
    transform: translateY(-3px);
    box-shadow: 0 8px 24px rgba(0, 0, 0, 0.1);
    transition: all 0.3s ease-in-out;
}
</style>
<!-- Listing-area start -->

<section class="restaurant-section">
        <div class="container">
            <div class="row content-wrapper">
                <!-- Image on Left -->
                <div class="col-lg-6">
                    <div class="image-container">
                        <img src="https://hospitality.testpentas.in/assets/img/life-style.jpg"
                            alt="GWI Restaurant Interior" class="restaurant-image">
                    </div>
                </div>

                <!-- Content on Right -->
                <div class="col-lg-6">
                    <div class="text-content">
                        <h2>WELCOME TO GWI RESTAURANT</h2>
                        <h3>Where Every Bite Tells a Story</h3>

                        <p>At GWI's 3-star restaurant, we focus on <span class="highlight-text">quality, comfort, and
                                flavor</span>. Our menu features freshly prepared dishes crafted with care—offering a
                            mix of local favorites and international classics.</p>

                        <p>Whether you're enjoying a relaxed breakfast, a casual lunch, or a hearty dinner, you can
                            expect friendly service, great taste, and a warm, welcoming atmosphere every time.</p>

                        <p>Because good food isn't just eaten—it's felt.</p>

                        <div class="cta-section">
                            <p>Book a table / Order online / Or just drop by. Your seat is waiting. 😊✨</p>
                        </div>
                        <div class="row features-section">
                            <div class="row">
                                <div class="col-md-4 mb-4">
                                    <div class="feature-card">
                                        <h3>Step Inside</h3>
                                    </div>
                                </div>
                                <div class="col-md-4 mb-4">
                                    <div class="feature-card">
                                        <h3>Savor The Aroma</h3>
                                    </div>
                                </div>
                                <div class="col-md-4 mb-4">
                                    <div class="feature-card">
                                        <h3>Let Your Taste Buds Explore</h3>
                                    </div>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
        </div>
    </section>

    <!-- Facilities Section -->
    <div class="container">


        <div class="scroller-section">
            <div class="scroller-title">RESTAURANT FACILITIES</div>
            <div class="scroller-container">
                <div class="scroller-track">
                    <!-- Original set of cards -->
                    <div class="facility-card">
                        <div class="facility-icon">
                            <i class="fas fa-palette"></i>
                        </div>
                        <div class="facility-name">Ambiance & Interior Design</div>
                    </div>
                    <div class="facility-card">
                        <div class="facility-icon">
                            <i class="fas fa-utensils"></i>
                        </div>
                        <div class="facility-name">Fine Dining Experience</div>
                    </div>
                    <div class="facility-card">
                        <div class="facility-icon">
                            <i class="fas fa-concierge-bell"></i>
                        </div>
                        <div class="facility-name">Service & Hospitality</div>
                    </div>
                    <div class="facility-card">
                        <div class="facility-icon">
                            <i class="fas fa-tablet-alt"></i>
                        </div>
                        <div class="facility-name">Technology & Convenience</div>
                    </div>
                    <div class="facility-card">
                        <div class="facility-icon">
                            <i class="fas fa-hand-sparkles"></i>
                        </div>
                        <div class="facility-name">Hygiene & Cleanliness</div>
                    </div>
                    <div class="facility-card">
                        <div class="facility-icon">
                            <i class="fas fa-award"></i>
                        </div>
                        <div class="facility-name">Premium Ingredients & Quality</div>
                    </div>

                    <!-- Duplicate set for seamless scrolling -->
                    <div class="facility-card">
                        <div class="facility-icon">
                            <i class="fas fa-palette"></i>
                        </div>
                        <div class="facility-name">Ambiance & Interior Design</div>
                    </div>
                    <div class="facility-card">
                        <div class="facility-icon">
                            <i class="fas fa-utensils"></i>
                        </div>
                        <div class="facility-name">Fine Dining Experience</div>
                    </div>
                    <div class="facility-card">
                        <div class="facility-icon">
                            <i class="fas fa-concierge-bell"></i>
                        </div>
                        <div class="facility-name">Service & Hospitality</div>
                    </div>
                    <div class="facility-card">
                        <div class="facility-icon">
                            <i class="fas fa-tablet-alt"></i>
                        </div>
                        <div class="facility-name">Technology & Convenience</div>
                    </div>
                    <div class="facility-card">
                        <div class="facility-icon">
                            <i class="fas fa-hand-sparkles"></i>
                        </div>
                        <div class="facility-name">Hygiene & Cleanliness</div>
                    </div>
                    <div class="facility-card">
                        <div class="facility-icon">
                            <i class="fas fa-award"></i>
                        </div>
                        <div class="facility-name">Premium Ingredients & Quality</div>
                    </div>
                </div>
            </div>
        </div>
    </div>

    <section class="py-5" style="background-color:  #fdfaf6; ">
        <div class="container">
            <div class="row g-5 align-items-center mb-5">
                <!-- Left: Section Image -->
                <div class="col-lg-6 d-flex justify-content-center">
                    <img src="https://www.jaypeehotels.com/blog/wp-content/uploads/2020/09/image11.jpg"
                        alt="Restaurant Cuisines" class=" cuisine-image" style="max-width: 100%;max-height: 100%;">
                </div>

                <!-- Right: Cuisine Cards in scrolling container -->
                <div class="col-lg-6">
                    <div class="cuisines-card">
                        <div class="cuisines-header">
                            <h5 class="mb-0 fw-semibold text-primary">🌍 CUISINES</h5>
                        </div>
                        <div class="cuisines-container">
                            <div class="scrolling-content">
                                <!-- First set of cuisine cards -->
                                <div class="row g-3">
                                    <div class="col-12">
                                        <div class="cuisine-card">
                                            <div class="cuisine-icon">
                                                <i class="fas fa-wine-glass-alt"></i>
                                            </div>
                                            <p class="mb-0"> French – Truffle dishes, foie gras, crème brûlée</p>
                                        </div>
                                    </div>
                                    <div class="col-12">
                                        <div class="cuisine-card">
                                            <div class="cuisine-icon">
                                                <i class="fas fa-fish"></i>
                                            </div>
                                            <p class="mb-0"> Japanese – Sushi, wagyu steak, miso black cod</p>
                                        </div>
                                    </div>
                                    <div class="col-12">
                                        <div class="cuisine-card">
                                            <div class="cuisine-icon">
                                                <i class="fas fa-pepper-hot"></i>
                                            </div>
                                            <p class="mb-0"> Thai – Pad Thai, tom yum soup, green curry</p>
                                        </div>
                                    </div>
                                    <div class="col-12">
                                        <div class="cuisine-card">
                                            <div class="cuisine-icon">
                                                <i class="fas fa-pizza-slice"></i>
                                            </div>
                                            <p class="mb-0"> Italian – Handmade pasta, risotto, wood-fired pizzas</p>
                                        </div>
                                    </div>
                                    <div class="col-12">
                                        <div class="cuisine-card">
                                            <div class="cuisine-icon">
                                                <i class="fas fa-drumstick-bite"></i>
                                            </div>
                                            <p class="mb-0"> American Steakhouse – Dry-aged steaks, BBQ ribs</p>
                                        </div>
                                    </div>
                                    <div class="col-12">
                                        <div class="cuisine-card">
                                            <div class="cuisine-icon">
                                                <i class="fas fa-utensil-spoon"></i>
                                            </div>
                                            <p class="mb-0"> Indian – Butter chicken, biryani, tandoori platters</p>
                                        </div>
                                    </div>
                                    <div class="col-12">
                                        <div class="cuisine-card">
                                            <div class="cuisine-icon">
                                                <i class="fas fa-leaf"></i>
                                            </div>
                                            <p class="mb-0"> Mediterranean – Hummus, seafood paella, Greek salads</p>
                                        </div>
                                    </div>
                                    <div class="col-12">
                                        <div class="cuisine-card">
                                            <div class="cuisine-icon">
                                                <i class="fas fa-water"></i>
                                            </div>
                                            <p class="mb-0"> Seafood – Oysters, grilled salmon, caviar platters</p>
                                        </div>
                                    </div>
                                    <div class="col-12">
                                        <div class="cuisine-card">
                                            <div class="cuisine-icon">
                                                <i class="fas fa-seedling"></i>
                                            </div>
                                            <p class="mb-0"> Vegan – Plant-based bowls, quinoa salads</p>
                                        </div>
                                    </div>
                                </div>

                                <!-- Duplicate set for seamless scrolling -->
                                <div class="row g-3 mt-4">
                                    <div class="col-12">
                                        <div class="cuisine-card">
                                            <div class="cuisine-icon">
                                                <i class="fas fa-wine-glass-alt"></i>
                                            </div>
                                            <p class="mb-0"> French – Truffle dishes, foie gras, crème brûlée</p>
                                        </div>
                                    </div>
                                    <div class="col-12">
                                        <div class="cuisine-card">
                                            <div class="cuisine-icon">
                                                <i class="fas fa-fish"></i>
                                            </div>
                                            <p class="mb-0"> Japanese – Sushi, wagyu steak, miso black cod</p>
                                        </div>
                                    </div>
                                    <div class="col-12">
                                        <div class="cuisine-card">
                                            <div class="cuisine-icon">
                                                <i class="fas fa-pepper-hot"></i>
                                            </div>
                                            <p class="mb-0"> Thai – Pad Thai, tom yum soup, green curry</p>
                                        </div>
                                    </div>
                                    <div class="col-12">
                                        <div class="cuisine-card">
                                            <div class="cuisine-icon">
                                                <i class="fas fa-pizza-slice"></i>
                                            </div>
                                            <p class="mb-0"> Italian – Handmade pasta, risotto, wood-fired pizzas</p>
                                        </div>
                                    </div>
                                    <div class="col-12">
                                        <div class="cuisine-card">
                                            <div class="cuisine-icon">
                                                <i class="fas fa-drumstick-bite"></i>
                                            </div>
                                            <p class="mb-0"> American Steakhouse – Dry-aged steaks, BBQ ribs</p>
                                        </div>
                                    </div>
                                    <div class="col-12">
                                        <div class="cuisine-card">
                                            <div class="cuisine-icon">
                                                <i class="fas fa-utensil-spoon"></i>
                                            </div>
                                            <p class="mb-0"> Indian – Butter chicken, biryani, tandoori platters</p>
                                        </div>
                                    </div>
                                    <div class="col-12">
                                        <div class="cuisine-card">
                                            <div class="cuisine-icon">
                                                <i class="fas fa-leaf"></i>
                                            </div>
                                            <p class="mb-0"> Mediterranean – Hummus, seafood paella, Greek salads</p>
                                        </div>
                                    </div>
                                    <div class="col-12">
                                        <div class="cuisine-card">
                                            <div class="cuisine-icon">
                                                <i class="fas fa-water"></i>
                                            </div>
                                            <p class="mb-0"> Seafood – Oysters, grilled salmon, caviar platters</p>
                                        </div>
                                    </div>
                                    <div class="col-12">
                                        <div class="cuisine-card">
                                            <div class="cuisine-icon">
                                                <i class="fas fa-seedling"></i>
                                            </div>
                                            <p class="mb-0"> Vegan – Plant-based bowls, quinoa salads</p>
                                        </div>
                                    </div>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </section>
    <section class="listing-area hotels pb-60 py-5 secret-ingredient-section">
        <!-- Floating spice elements -->
        <div class="floating-spice">🌿</div>
        <div class="floating-spice">🍂</div>
        <div class="floating-spice">🔥</div>
        <div class="floating-spice">✨</div>

        <div class="container">
            <div class="row justify-content-center text-center">
                <div class="col-lg-10">
                    <h2 class="section-title fw-bold mb-5 aos-init aos-animate" data-aos="fade-up">
                        🌟 OUR SECRET INGREDIENT
                    </h2>

                    <div class="card secret-card border-0 mb-4 aos-init aos-animate" data-aos="fade-up"
                        data-aos-delay="100">
                        <div class="card-body p-4 p-md-5">
                            <div class="secret-content">
                                Just like KFC has its legendary secret recipe, GWI Restaurant has its own unique flavor
                                formulas—crafted behind the scenes to deliver unforgettable taste experiences.<br><br>
                                With every bite, you'll feel the difference—because here at GWI, we don't just serve
                                food—we create moments worth savoring.
                            </div>
                        </div>
                    </div>


                </div>
            </div>
        </div>
    </section>
  @include('frontend.partials.map-modal')
@endsection

@section('script')
  <!-- Map JS -->
  @if ($basicInfo->google_map_api_key_status == 1)
    <script
      src="https://maps.googleapis.com/maps/api/js?key={{ $basicInfo->google_map_api_key }}&libraries=places&callback=initMap"
      async defer></script>
    <script src="{{ asset('assets/front/js/api-search-2.js') }}"></script>
  @endif
  {{-- <script src="{{ asset('assets/front/js/map-hotel.js') }}"></script>
  <script>
    "use strict";
    var featured_contents = {!! json_encode($featured_contents) !!};
    var hotel_contentss = {!! json_encode($currentPageData) !!};
    var searchUrl = "{{ route('frontend.search_hotel') }}";
    var getStateUrl = "{{ route('frontend.hotels.get-state') }}";
    var getCityUrl = "{{ route('frontend.hotels.get-city') }}";
    var getAddress = "{{ route('frontend.rooms.get-address') }}";
  </script>
  <script src="{{ asset('assets/front/js/hotel-search.js') }}"></script> --}}
@endsection