@extends('layouts.website')
@section('content')
<style>
    .contact-section { padding: 60px 0; }
        .contact-box { background: #fff; border-radius: 8px; padding: 30px; box-shadow: 0 4px 20px rgba(0,0,0,0.08); }
        .contact-info i { font-size: 22px; margin-right: 10px; color: #0D6EFD; }
        .contact-info p { margin: 10px 0; }
        .form-control { height: 48px; }
        textarea.form-control { height: auto; }
</style>
<section class="image-section">
    <div class="breadcrumb-container">
        <nav aria-label="breadcrumb">
            <ol class="breadcrumb">
                <li class="breadcrumb-item"><a href="{{url('/')}}">Home</a></li>
                <li class="breadcrumb-item active"><a href="{{url('contact-us')}}">Contact Us</a></li>
            </ol>
        </nav>
    </div>
</section>




    <!-- CONTACT SECTION -->
        <div class="container">
            <div class="title-innerpage mb-5">
                <h3>Contact Us</h3>
                <p>We would love to hear from you. Feel free to reach out anytime!</p>
               </div>


            <div class="row g-4">

                <!-- Contact Info -->
                <div class="col-lg-4">
                    <div class="contact-box contact-info h-100">
                        <h4 class="fw-bold mb-3">Get in Touch</h4>

                        <p>
                            <i class="bi bi-geo-alt-fill"></i>
                            <strong>Address:</strong><br>
                           {{site_configuration()->address}}
                        </p>

                        <p>
                            <i class="bi bi-envelope-fill"></i>
                            <strong>Email:</strong><br>
                            {{site_configuration()->email}}
                        </p>

                        <p>
                            <i class="bi bi-telephone-fill"></i>
                            <strong>Phone:</strong><br>
                           +91 {{site_configuration()->phone_number
                        }}
                        </p>
                    </div>
                </div>

                <!-- Contact Form -->
                <div class="col-lg-8">
                    <div class="contact-box">
                        <h4 class="fw-bold mb-3">Send Us a Message</h4>

                        <form>
                            <div class="row g-3">

                                <div class="col-md-6">
                                    <label class="form-label fw-semibold">Full Name</label>
                                    <input type="text" class="form-control" placeholder="Enter your name">
                                </div>

                                <div class="col-md-6">
                                    <label class="form-label fw-semibold">Email Address</label>
                                    <input type="email" class="form-control" placeholder="Enter your email">
                                </div>

                                <div class="col-md-6">
                                    <label class="form-label fw-semibold">Phone</label>
                                    <input type="text" class="form-control" placeholder="+91 1234567890">
                                </div>

                                <div class="col-md-6">
                                    <label class="form-label fw-semibold">Subject</label>
                                    <input type="text" class="form-control" placeholder="Subject">
                                </div>

                                <div class="col-12">
                                    <label class="form-label fw-semibold">Message</label>
                                    <textarea class="form-control" rows="5" placeholder="Write your message"></textarea>
                                </div>

                                <div class="col-12 text-end">
                                    <button type="submit" class="btn btn-primary px-4 py-2">
                                        Send Message
                                    </button>
                                </div>

                            </div>
                        </form>
                    </div>
                </div>

            </div>

        </div>
    </section>




</div>
@endsection