@extends('frontend.layouts')
@section('content')

<section class="page-header d-flex align-items-center text-white"
         style="background: url('{{ asset('frontend/assets/images/he-1.png') }}') no-repeat center center; background-size: cover;">
    <div class="container text-center mt-5">
        <h1 class="fw-bold">Contact </h1>

        <nav aria-label="breadcrumb" class="mt-1">
            <ol class="breadcrumb justify-content-center bg-transparent mb-0">
                <li class="breadcrumb-item">
                    <a href="{{ route('index') }}" class="text-white text-decoration-none">
                        Home
                    </a>
                </li>
                <li class="breadcrumb-item active text-white" aria-current="page">
                    Contact
                </li>
            </ol>
        </nav>
    </div>
</section>

<section class="contact-section py-5">
    <div class="container">

        <!-- Title -->
        <div class="text-center mb-5">
            <h2 class="fw-bold">Contact</h2>
            <p class="text-muted">Md. Atique Ullah Siddique</p>
        </div>

        <!-- Row -->
        <div class="row justify-content-center">

            <!-- Form -->
            <div class="col-lg-6 col-md-8 col-12">
                <div class="contact-form p-4 h-100">

                    @if(session('success'))
                        <div class="alert alert-success">
                            {{ session('success') }}
                        </div>
                    @endif

                    <form action="{{ route('contact.store') }}" method="POST">
                        @csrf

                        <div class="mb-3">
                            <input type="text" name="name" class="form-control" placeholder="Your Name">
                        </div>

                        <div class="mb-3">
                            <input type="email" name="email" class="form-control" placeholder="Your Email">
                        </div>

                        <div class="mb-3">
                            <textarea name="message" class="form-control" rows="5" placeholder="Your Message"></textarea>
                        </div>

                        <button type="submit" class="btn btn-dark w-100">
                            Send Message
                        </button>

                    </form>

                </div>
            </div>

        </div>

    </div>
</section>

<style>
.contact-form{
    background:#ffffff;
    border-radius:12px;
    box-shadow:0 8px 25px rgba(59, 56, 56, 0.06);
}
</style>



@endsection