@extends('layouts.app')

@section('content')
<style>@media (max-width: 767px) {
    .mobileview {
         height: 1180px !important;
     }
 }
 </style>
    <div class="container-fluid mobileview mt-5"
        style="padding-top:35px; background:url(../images/banner/back-banner-quote.png); background-size:cover; height:750px;">
        <div class="row justify-content-center">
            <!-- Section 1: Above the form -->
            <div class="col-md-12 mb-4">
                <div class="card text-center p-4 shadow" style="background-color: rgba(245, 248, 250, 0.8);">
                    <h4 class="card-title text-primary">👋 Get Free Quote!</h4>
                    <p class="card-text text-secondary">
                        Register your free quote to access tailored medical services, connect with top hospitals, and get
                        the
                        best treatment options.
                    </p>
                </div>
            </div>
            <!-- Section 2: Left side with benefits -->
            <div class="col-md-12 mb-4">
                <div class="row  justify-content-center">
                    <div class="col-md-4 col-lg-4 mb-4">
                        <div class="card p-4 shadow" style="background-color: rgba(238, 245, 249, 0.8);">
                            <h4 class="card-title text-center text-primary">🌟 Benefits of Registering</h4>
                            <ul class="list-unstyled text-secondary">
                                <li>• Personalized Quotes</li>
                                <li>• Access to Top Hospitals</li>
                                <li>• Transparent Pricing</li>
                                <li>• Expert Consultation</li>
                                <li>• Secure Data Management</li>
                                <li>• Dedicated Support</li>
                            </ul>
                            <p class="card-text text-secondary">
                                Our quote registration process ensures you get the best healthcare solutions tailored to
                                your needs.
                                Experience seamless communication with hospitals and expert medical advice.
                            </p>
                        </div>
                    </div>
                    <!-- Section 3: Right side with the form -->
                    <div class="col-md-8 col-lg-6 mb-6">
                        <div id="quote-form" class="panel-body card p-2 shadow"
                            style="padding: 0; background:rgba(35,107,161,0.5); box-shadow : 5px 8px 5px #000;">
                            @if (Auth::guard('web')->check())
                                <div class="card text-center border-0">
                                    <div class="card-body">
                                        <h5 class="card-title">You are already logged in!</h5>
                                        <p class="card-text">Click the below button to view, create or update quotes:</p>
                                        <a class="btn btn-success" href="{{ route('patient.dashboard') }}" role="button">My
                                            Dashboard</a>
                                    </div>
                                </div>
                            @else
                                @component('components.CreateFirstQuoteForm')
                                @endcomponent
                            @endif
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>
    <!-- Footer section -->
    <footer class="mainfooter mt-1" role="contentinfo">
        <div class="footer-middle">
            <div class="container">
                <div class="row">
                    <div class="col-md-12 text-center mb-3">
                        <h4>Follow Us</h4>
                        <ul class="social-network social-circle">
                            <li><a href="https://www.facebook.com/groups/MyHospitalNow/" class="icoFacebook"
                                    title="Facebook" target="_blank"><i class="fa fa-facebook"></i></a></li>
                            <li><a href="https://www.linkedin.com/company/myhospitalnow/" class="icoLinkedin"
                                    title="Linkedin" target="_blank"><i class="fa fa-linkedin"></i></a></li>
                            <li><a href="https://twitter.com/myhospitalnow" class="icoTwitter" title="Twitter"
                                    target="_blank"><i class="fa fa-twitter"></i></a></li>
                        </ul>
                    </div>
                </div>
                <div class="row">
                    <ul class="list-unstyled list-inline mx-auto text-center" style="padding: 0 20px;">
                        <li class="list-inline-item my-2"><a href="/">Home</a></li>
                        <li class="list-inline-item my-2"><a href="https://www.cotocus.com/about/index.html">About Us</a></li>
                        <li class="list-inline-item my-2"><a href="/contact">Contact Us</a></li>
                        <li class="list-inline-item my-2"><a href="/hospitals">Hospitals</a></li>
                        <li class="list-inline-item my-2"><a href="/doctors">Doctors</a></li>
                        <li class="list-inline-item my-2"><a href="/blog">Blog</a></li>
                        <li class="list-inline-item my-2"><a href="https://www.myhospitalnow.com/contact">Support</a></li>
                        <li class="list-inline-item my-2"><a href="/terms_and_conditions">Terms/Conditions</a></li>
                        <li class="list-inline-item my-2"><a href="/privacy">Privacy</a></li>
                    </ul>
                </div>
                <div class="row">
                    <div class="col-md-12 copy">
                        <p class="text-center">&copy; {{ date('Y') }} - MyHospitalNow.com. All rights reserved.</p>
                    </div>
                </div>
            </div>
        </div>
    </footer>
    </div>
@endsection