@extends('frontend.layouts.app')

@section('title')
@endsection

@section('seo')
<title>Events Form | Anisabel Suites</title>
<meta property="og:locale" content="en_US" />
<meta property="og:url" content="" />
<meta property="og:type" content="website" />
<meta property="og:title" content="Events Form | Anisabel Suites" />
<meta property="og:description" content="" />
<meta property="og:site_name" content="Events Form | Anisabel Suites" />
<meta property="og:image" content="{{ asset('images/thumbnail.png') }}" />
<meta property="og:thumbnail" content="{{ asset('images/thumbnail.png') }}" />
@endsection

@section('content')
<div class="bg-other" style="background-image: url('{{ asset('images/Forms.jpg') }}')"></div>

<div class="container my-5" id="event-inquiry-section">
    @if (session('success'))
    <div class="container alert alert-success">
        {{ session('success') }}
    </div>
    @endif
    <div class="row justify-content-center">
        <div class="col-12 col-md-6 px-3">
            <img src="{{ asset('images/logo-dining.png') }}" class="img-fluid mb-2" alt="Menu" width="550" data-aos="zoom-in-down">
            <div data-aos="zoom-in-right">
                <h1 class="fw-bold color-mid mb-lg-5 lh-base text-center">
                    A central spot, <br>
                    just steps away from <br>
                    all your city destinations. <br>
                    Tucked at the heart of Davao City <br>
                    <b>ANISABEL SUITES</b> <br>
                    is a destination worth finding. <br>
                    Just 15 minutes from the Davao International Airport, <br>
                    nestled in a quiet residential area <br>
                    24-hour public transportation, <br>
                    conveniently close to most <br>
                    to business and commercial establishments, <br>
                    shopping malls, dining, <br>
                    entertainment areas, and adventure parks.
                </h1>
            </div>
        </div>

        <div class="col-12 col-md-6" data-aos="zoom-in-left">
            <h1 class="fw-bold color-mid">Event Inquiry Form</h1>
            <form action="{{ route('book-now') }}" method="POST">
                @csrf
                <!-- Hidden fields for session data -->
                <input type="hidden" name="event_id" value="{{ session('selected_event') }}">
                <input type="hidden" name="attendees" value="{{ session('pax') }}">
                <input type="hidden" name="preferred_time" value="{{ session('preferred_time') }}">
                <input type="hidden" name="event_name" value="{{ session('event_name') }}">

                <!-- Display hidden field data in visible fields -->
                <div class="row gy-4 mb-4">
                    <div class="col-12 col-md-6 col-xl-6">
                        <div>
                            <label for="fname" class="form-label fw-bold color-mid">First Name*</label>
                            <input type="text" class="form-control rounded" name="first_name" id="fullname" placeholder="" style="border:1px solid #895c00;">
                            @error('first_name')
                            <span class="text-danger">{{ $message }}</span>
                            @enderror
                        </div>
                    </div>
                    <div class="col-12 col-md-6 col-xl-6">
                        <div>
                            <label for="lname" class="form-label fw-bold color-mid">Last Name*</label>
                            <input type="text" class="form-control rounded" name="last_name" id="fullname" placeholder="" style="border:1px solid #895c00;">
                            @error('last_name')
                            <span class="text-danger">{{ $message }}</span>
                            @enderror
                        </div>
                    </div>
                    <div class="col-12 col-md-6 col-xl-6">
                        <div>
                            <label for="email" class="form-label fw-bold color-mid">Email Address*</label>
                            <input type="email" class="form-control rounded" name="email" id="email" placeholder="" style="border:1px solid #b19357;">
                            @error('email')
                            <span class="text-danger">{{ $message }}</span>
                            @enderror
                        </div>
                    </div>
                    <div class="col-12 col-md-6 col-xl-6">
                        <div>
                            <label for="contact" class="form-label fw-bold color-mid">Contact No*</label>
                            <input type="number" class="form-control rounded" name="contact" id="contact" placeholder="" style="border:1px solid #b19357;">
                            @error('contact')
                            <span class="text-danger">{{ $message }}</span>
                            @enderror
                        </div>
                    </div>
                    <div class="col-12 col-md-6 col-xl-6">
                        <div>
                            <label for="company" class="form-label fw-bold color-mid">Name of Company*</label>
                            <input type="text" class="form-control rounded" name="company" id="company" placeholder="" style="border:1px solid #b19357;">
                            @error('company')
                            <span class="text-danger">{{ $message }}</span>
                            @enderror
                        </div>
                    </div>
                    <div class="col-12 col-md-6 col-xl-6">
                        <div>
                            <label for="contact" class="form-label fw-bold color-mid">Industry*</label>
                            <input type="text" class="form-control rounded" name="industry" id="industry" placeholder="" style="border:1px solid #b19357;">
                            @error('industry')
                            <span class="text-danger">{{ $message }}</span>
                            @enderror
                        </div>
                    </div>
                </div>

                <h1 class="fw-bold color-mid">Event Details</h1>

                <div class="row gy-4 mb-4">
                    <div class="col-12 col-md-6 col-xl-6">
                        <label for="number" class="form-label fw-bold color-mid">Number of guests*</label>
                        <input type="number" class="form-control rounded" name="attendees" id="number" style="border:1px solid #b19357;" value="{{ session('pax') }}">
                        @error('attendees')
                        <span class="text-danger">{{ $message }}</span>
                        @enderror
                    </div>

                    <div class="col-12 col-md-6 col-xl-6">
                        <div>
                            <label for="date" class="form-label fw-bold color-mid">Preferred Date*</label>
                            <input type="date" class="form-control rounded" name="preferred_date" id="date" placeholder="" style="border:1px solid #b19357;" value="{{ session('preferred_time') }}">
                            @error('preferred_date')
                            <span class="text-danger">{{ $message }}</span>
                            @enderror
                        </div>
                    </div>

                    <div class="col-12 col-md-6 col-xl-6">
                        <label for="time" class="form-label fw-bold color-mid">Preferred Time*</label>
                        <select class="form-control rounded" name="preferred_time" id="time" style="border:1px solid #b19357;">
                            <option value="" disabled>Select Time</option>
                            <option value="9 - 12" {{ session('preferred_time') == '9 - 12' ? 'selected' : '' }}>9 - 12</option>
                            <option value="1 - 5" {{ session('preferred_time') == '1 - 5' ? 'selected' : '' }}>1 - 5</option>
                            <option value="6 - 10" {{ session('preferred_time') == '6 - 10' ? 'selected' : '' }}>6 - 10</option>
                            <option value="9 - 5pm" {{ session('preferred_time') == '9 - 5pm' ? 'selected' : '' }}>9 - 5pm</option>
                        </select>
                        @error('preferred_time')
                        <span class="text-danger">{{ $message }}</span>
                        @enderror
                    </div>

                    <div class="col-12 col-md-6 col-xl-6">
                        <label for="event_type" class="form-label fw-bold color-mid">What Type of Event*</label>
                        <select class="form-control rounded" name="event" id="event_type" style="border:1px solid #b19357;">
                            <!-- Placeholder option -->
                            <option value="" selected disabled>Select Event Type</option>
                            <!-- Display the saved event type directly from the session -->
                            <option value="{{ session('event_name') }}" selected>
                                {{ session('event_name') }}
                            </option>
                        </select>
                        @error('event')
                        <span class="text-danger">{{ $message }}</span>
                        @enderror
                    </div>
                    <div class="">
                        <label for="request" class="form-label fw-bold color-mid">Special Request *</label>
                        <textarea type="text" class="form-control rounded" name="request" id="request" rows="6" style="border:1px solid #b19357;"></textarea>
                    </div>
                </div>

                <button type="submit" class="btn btn-primary rounded w-100" style="background-color:#b19357; border: none;">Submit</button>
            </form>
        </div>
    </div>
</div>
@endsection