@extends('layouts.app')
@section('title','Contact Us - Journey of Life GCC')
@section('content')
<section style="background:#e0f2fe;padding:3rem 0">
  <div class="container">
    <h1 style="font-size:2.5rem;font-weight:800;color:#1e3a8a">Contact Us</h1>
  </div>
</section>
<section style="padding:4rem 0;background:white">
  <div class="container" style="max-width:600px">
    @if(session('success'))
    <div style="background:#f0fdf4;border:1px solid #bbf7d0;color:#15803d;padding:1rem;border-radius:8px;margin-bottom:1.5rem">
      ✅ {{ session('success') }}
    </div>
    @endif
    <form method="POST" action="{{ route('contact.store') }}" style="background:white;padding:2rem;border-radius:16px;box-shadow:0 8px 25px rgba(0,0,0,0.08)">
      @csrf
      <div style="margin-bottom:1.25rem"><label style="display:block;font-weight:600;margin-bottom:0.5rem">Your Name *</label>
        <input type="text" name="name" required style="width:100%;padding:0.75rem;border:1px solid #d1d5db;border-radius:8px;font-size:1rem"></div>
      <div style="margin-bottom:1.25rem"><label style="display:block;font-weight:600;margin-bottom:0.5rem">Email *</label>
        <input type="email" name="email" required style="width:100%;padding:0.75rem;border:1px solid #d1d5db;border-radius:8px;font-size:1rem"></div>
      <div style="margin-bottom:1.25rem"><label style="display:block;font-weight:600;margin-bottom:0.5rem">Phone</label>
        <input type="tel" name="phone" style="width:100%;padding:0.75rem;border:1px solid #d1d5db;border-radius:8px;font-size:1rem"></div>
      <div style="margin-bottom:1.25rem"><label style="display:block;font-weight:600;margin-bottom:0.5rem">Subject</label>
        <input type="text" name="subject" style="width:100%;padding:0.75rem;border:1px solid #d1d5db;border-radius:8px;font-size:1rem"></div>
      <div style="margin-bottom:1.5rem"><label style="display:block;font-weight:600;margin-bottom:0.5rem">Message *</label>
        <textarea name="message" required rows="5" style="width:100%;padding:0.75rem;border:1px solid #d1d5db;border-radius:8px;font-size:1rem;resize:vertical"></textarea></div>
      <button type="submit" style="background:#1e3a8a;color:white;border:none;padding:0.875rem 2.5rem;border-radius:8px;font-size:1rem;font-weight:600;cursor:pointer;width:100%">Send Message</button>
    </form>
  </div>
</section>
@endsection