@extends('layouts.app')

@section('meta_title', 'Contact Us - Get Support at Gletra')
@section('meta_description', 'Have questions? Contact the Gletra support team for any inquiries, assistance or feedback. We are here to help you 24/7.')

@section('content')
<div class="row py-3 py-md-5 justify-content-center">
    <div class="col-12 col-md-10 px-2 px-md-3">
        <div class="card shadow-sm border-0 overflow-hidden">
            <div class="row g-0">
                <div class="col-12 col-md-5 bg-primary text-white p-4 p-md-5 rounded-top rounded-md-start">
                    <h2 class="fw-bold mb-3 mb-md-4">Get in Touch</h2>
                    <p class="mb-4 mb-md-5">Have a question or need assistance? Our support team is here to help you 24/7.</p>
                    <div class="mb-3 mb-md-4">
                        <h6 class="fw-bold"><i class="bi bi-geo-alt-fill me-2"></i> Address</h6>
                        <p class="mb-0 small">123 Commerce Way, Tech District, San Francisco, CA</p>
                    </div>
                    <div class="mb-3 mb-md-4">
                        <h6 class="fw-bold"><i class="bi bi-envelope-fill me-2"></i> Email</h6>
                        <p class="mb-0 small">support@gletra.com</p>
                    </div>
                    <div class="mb-0 mb-md-4">
                        <h6 class="fw-bold"><i class="bi bi-telephone-fill me-2"></i> Phone</h6>
                        <p class="mb-0 small">+1 (555) 123-4567</p>
                    </div>
                </div>
                <div class="col-12 col-md-7 p-4 p-md-5">
                    @if(session('success'))
                        <div class="alert alert-success border-0 rounded-3 mb-3">{{ session('success') }}</div>
                    @endif
                    @if($errors->any())
                        <div class="alert alert-danger border-0 rounded-3 mb-3">{{ $errors->first() }}</div>
                    @endif
                    <form action="{{ route('contact.submit') }}" method="POST">
                        @csrf
                        <div class="row mb-3 g-3">
                            <div class="col-12 col-md-6">
                                <label class="form-label">Name</label>
                                <input type="text" name="name" class="form-control" value="{{ old('name', $prefill['name'] ?? '') }}" required>
                            </div>
                            <div class="col-12 col-md-6">
                                <label class="form-label">Email</label>
                                <input type="email" name="email" class="form-control" value="{{ old('email', $prefill['email'] ?? '') }}" required>
                            </div>
                        </div>
                        <div class="mb-3">
                            <label class="form-label">Subject</label>
                            <input type="text" name="subject" class="form-control" value="{{ old('subject', $prefill['subject'] ?? '') }}" required>
                        </div>
                        <div class="mb-3">
                            <label class="form-label">Message</label>
                            <textarea name="message" class="form-control" rows="5" required></textarea>
                        </div>
                        <button type="submit" class="btn btn-primary px-4 px-md-5 btn-lg w-100 w-md-auto">Send Message</button>
                    </form>
                </div>
            </div>
        </div>
    </div>
</div>
@endsection