@extends('frontend.layout.navbar')
@section('title', 'Contact Us')
@section('content')
    <div class="relative w-full h-full -z-10">
        <img src="{{ asset('image/contact/Contact Us Banner.png') }}" class="absolute inset-0 object-cover w-full h-full">
        <div class="relative container mx-auto py-[20rem]">
            <div class="flex flex-col justify-center">
                <p class="p-5 text-2xl font-bold text-white md:text-6xl">Contact Us</p>
            </div>
        </div>
    </div>


    <div class="container max-w-screen-xl mx-auto mb-20">
        <div class="grid-cols-1 grid md:grid-cols-6 -mt-[15rem]  shadow-2xl">
            <div class="col-span-6 p-5 bg-white">
                <p class="text-xl  font-semibold  text-[#3e4424]">Send us A Message</p>
                <form method="POST" action="{{ route('contact.store') }}">
                    @csrf
                    <div class="text-xs">
                        <div class="mt-10">
                            <label class=" ml-2 text-[#3e4424]">Name*</label>
                            <input type="text" class="w-full h-10 border-0 text-xl border-b-2 border-gray-300" name="name"
                                id="name" value="{{ old('name') }}">
                            @error('name')
                                <p class="mt-1 text-sm text-red-500">{{ $message }}</p>
                            @enderror
                        </div>
                         <div class="mt-10">
                            <label class=" ml-2 text-[#3e4424]">Contact Number*</label>
                            <input type="text" class="w-full h-10 border-0 text-xl border-b-2 border-gray-300" name="number"
                                id="number" value="{{ old('number') }}">
                            @error('number')
                                <p class="mt-1 text-sm text-red-500">{{ $message }}</p>
                            @enderror
                        </div>
                        <div class="mt-10">
                            <label class="ml-2 text-[#3e4424]">Email*</label>
                            <input class="w-full border-0 h-10 border-b-2 text-xl border-gray-300" type="email" name="email"
                                id="email" value="{{ old('email') }}">
                            @error('email')
                                <p class="mt-1 text-sm text-red-500">{{ $message }}</p>
                            @enderror
                        </div>
                        <div class ="mt-10">
                            <label class=" ml-2 text-[#3e4424]">Message*</label>
                            <textarea name="message" id="message" class="w-full text-xl border-0 border-b-2 border-gray-300 " rows="4">{{ old('message') }}</textarea>
                            @error('message')
                                <p class="mt-1 text-sm text-red-500">{{ $message }}</p>
                            @enderror
                        </div>
                        <div
                            class="mt-10  flex justify-start   mb-10 text-white ">
                            <button class="text-white w-[7rem] py-3 bg-gradient-to-r from-[#73b21d] via-[#a1da50] to-[#73b21d]  hover:opacity-90 transition transform transition-transform duration-300 ease-in-out hover:scale-110">Submit</button>
                        </div>
                    </div>
                  </form>
            </div>
            <!--<div class="col-span-2 p-5 bg-gray-100 ">-->
            <!--    <p class="text-2xl text-[#3e4424] font-semibold">Contact Information</p>-->
            <!--    <p class="text-sm mt-10 leading-8  text-[#3e4424]">UrbanEast Developments Inc. G/F JJ's Commune, Loyola St. Bo. Obrero, Davao City, Philippines 8000</p>-->
            <!--    <p class="mt-5 text-sm leading-8">TELEPHONE #:<span class="text-[#b6c09d]">-->
            <!--            +63.82.222.4433</span> </p>-->
            <!--</div>-->
        </div>

    </div>
@endsection
{{-- <img src="{{ asset('image/invest/Map.png') }}" class="absolute inset-0 "> --}}