@extends('layouts.front_app')
@section('content')
    <!-- Main Hero Section -->
    <section class="inner-page">
        <div class="container">
{{--            <h2 class="heading">Events</h2>--}}
        </div>
    </section>
    <!-- ! Main Hero Section -->

    <!-- Upcoming Show Section -->
    <section class="form-section">
        <div class="container">
            <div class="submissionForm">
                <h2 class="heading text-center text-dark mb-4">Event Information</h2>
                @if(session('success'))
                    <div class="alert alert-success">
                        {{ session('success') }}
                    </div>
                @endif
                <form action="{{ route('event.store') }}" method="post" enctype="multipart/form-data">
                    @csrf
                    <div class="row">
                        <div class="col-md-6">
                            <label>Preferred Contact</label>
                            <input type="text" class="form-control" name="preferred_contact"
                                   placeholder="Preferred Contact" required>
                            @error('preferred_contact')
                            <div class="text-danger">{{ $message }}</div>
                            @enderror
                        </div>
                        <div class="col-md-6">
                            <label>Email / Cell Phone</label>
                            <input type="text" class="form-control" name="email_or_cellphone"
                                   placeholder="Email / Cell Phone" required>
                            @error('email_or_cellphone')
                            <div class="text-danger">{{ $message }}</div>
                            @enderror
                        </div>
                        <div class="col-md-6">
                            <label>Event Name</label>
                            <input type="text" class="form-control" name="event_name" placeholder="Event Name" required>
                            @error('event_name')
                            <div class="text-danger">{{ $message }}</div>
                            @enderror
                        </div>
                        <div class="col-md-6">
                            <label for="">What's Your Vibe?</label>
                            <select name="vibe" class="form-control" id="" required>
                                <option value="1">Choose Among the Following</option>
                                <option value="2">Choose Among the Following</option>
                                <option value="3">Choose Among the Following</option>
                                <option value="4">Choose Among the Following</option>
                            </select>
                            @error('vibe')
                            <div class="text-danger">{{ $message }}</div>
                            @enderror
                        </div>
                        <div class="col-md-12">
                            <label for="">Organizer Name</label>
                            <input type="text" class="form-control" name="organizer_name" placeholder="Organizer Name"
                                   required>
                            @error('organizer_name')
                            <div class="text-danger">{{ $message }}</div>
                            @enderror
                        </div>

                        <!-- Event Location Fields -->
                        <div class="col-md-12">
                            <h2 class="heading text-center text-dark mb-4">Event Location</h2>
                        </div>
                        <div class="col-md-6">
                            <label for="">Venue Listing :</label>
                            <input type="text" class="form-control" name="venue_listing" placeholder="" required>
                            @error('venue_listing')
                            <div class="text-danger">{{ $message }}</div>
                            @enderror
                        </div>
                        <div class="col-md-6">
                            <label for="">Address 1 :</label>
                            <input type="text" class="form-control" name="address1" placeholder="" required>
                            @error('address1')
                            <div class="text-danger">{{ $message }}</div>
                            @enderror
                        </div>
                        <div class="col-md-6">
                            <label for="">Address 2 :</label>
                            <input type="text" class="form-control" name="address2" placeholder="" required>
                            @error('address2')
                            <div class="text-danger">{{ $message }}</div>
                            @enderror
                        </div>
                        <div class="col-md-6">
                            <label for="">Address 3 :</label>
                            <input type="text" class="form-control" name="address3" placeholder="" required>
                            @error('address3')
                            <div class="text-danger">{{ $message }}</div>
                            @enderror
                        </div>
                        <div class="col-md-6">
                            <label for="">City :</label>
                            <input type="text" class="form-control" name="city" placeholder="" required>
                            @error('city')
                            <div class="text-danger">{{ $message }}</div>
                            @enderror
                        </div>
                        <div class="col-md-6">
                            <label for="">State/Province :</label>
                            <input type="text" class="form-control" name="state" placeholder="" required>
                            @error('state')
                            <div class="text-danger">{{ $message }}</div>
                            @enderror
                        </div>
                        <div class="col-md-6">
                            <label for="">Zip/PostalCode :</label>
                            <input type="text" class="form-control" name="zip" placeholder="" required>
                            @error('zip')
                            <div class="text-danger">{{ $message }}</div>
                            @enderror
                        </div>
                        <div class="col-md-6">
                            <label for="">Location :</label>
                            <input type="text" class="form-control" name="location" placeholder="" required>
                            @error('location')
                            <div class="text-danger">{{ $message }}</div>
                            @enderror
                        </div>

                        <!-- Event Date Fields -->
                        <div class="col-md-12">
                            <h2 class="heading text-center text-dark mb-4">Event Date</h2>
                        </div>
                        <div class="col-md-6">
                            <label for="">Start Date :</label>
                            <input type="date" class="form-control" name="start_date" placeholder="" required>
                            @error('start_date')
                            <div class="text-danger">{{ $message }}</div>
                            @enderror
                        </div>
                        <div class="col-md-6">
                            <label for="">Time :</label>
                            <input type="time" class="form-control" name="time" placeholder="" required>
                            @error('time')
                            <div class="text-danger">{{ $message }}</div>
                            @enderror
                        </div>
                        <div class="col-md-6">
                            <label for="">Start Time :</label>
                            <input type="time" class="form-control" name="start_time" placeholder="" required>
                            @error('start_time')
                            <div class="text-danger">{{ $message }}</div>
                            @enderror
                        </div>
                        <div class="col-md-6">
                            <label for="">End Date :</label>
                            <input type="date" class="form-control" name="end_date" placeholder="" required>
                            @error('end_date')
                            <div class="text-danger">{{ $message }}</div>
                            @enderror
                        </div>

                        <div class="col-md-12">
                            <h2 class="heading text-center text-dark mb-4">Image Gallery</h2>
                        </div>
                        <div class="col-md-12">
                            <label for="">Image:</label>
                            <div class="file-info">
                                Media Support .jpg, .jpeg and.gif files: required minimum file size,
                                470 x 311 pixels (72 dpi).
                            </div>
                            <div class="full-page"></div>
                            <div class="file">
                                <span>Drag and Drop Files here</span>
                                <p class="text-dark">or use the "Browse" button below to find a file to add</p>
                                <input type="file" name="image"/>
                                <div class="btn themeBtn uploadBtn">Browse</div>
                            </div>
                            @error('image')
                            <div class="text-danger">{{ $message }}</div>
                            @enderror
                        </div>
                    </div>
                    <div class="col-md-12 text-center">
                        <button type="submit" class="btn themeBtn dark">Add Event</button>
                    </div>
                </form>
            </div>
        </div>
    </section>

    <!-- ! Upcoming Show Section -->
@endsection