@extends('layouts.app')

@section('content')
    <!-- Navigation Start Here -->
    <nav id="defaultNav" class="navbar navbar-expand-lg navbar-light py-0"
        style="background-color:#2d99ca;position:fixed;top:0;right:0;left:0;z-index:1030;">
        <a class="navbar-brand" href="/"><img src="{{ asset('images/logo/myhospitalnow-logo.png') }}" alt="MyHospitalNow"
                style="width: 250px; height: 30pt;"></a>
        <button class="navbar-toggler" type="button" data-toggle="collapse" data-target="#navbarTogglerDemo02"
            aria-controls="navbarTogglerDemo02" aria-expanded="false" aria-label="Toggle navigation">
            <span class="navbar-toggler-icon"></span>
        </button>

        <div class="collapse navbar-collapse" id="navbarTogglerDemo02">
            <ul class="navbar-nav mr-auto mt-2 mt-lg-0">
                <li class="nav-item">
                    <a class="nav-link text-white" href="https://www.myhospitalnow.com/" style="font-size:15px;">Home
                        <span class="sr-only">(current)</span></a>
                    {{-- this is test --}}
                </li>
                <li class="nav-item">
                    <a href="https://www.myhospitalnow.com/hospitals/" class="nav-link text-white" style="font-size:15px;"
                        target="_blank">Hospitals</a>
                </li>
                <li class="nav-item">
                    <a href="https://www.myhospitalnow.com/doctors/" class="nav-link text-white" style="font-size:15px;"
                        target="_blank">Doctors</a>
                </li>
                 <li class="nav-item">
               <a href="https://www.myhospitalnow.com/nurses/" class="nav-link text-white" style="font-size:15px;"
                    target="_blank">Nurses</a>
            </li>
           
                 <li class="nav-item">
                <a href="https://www.myhospitalnow.com/products/" class="nav-link text-white" style="font-size:15px;"
                    target="_blank">Products</a>
            </li>
            
                <li class="nav-item">
                    <a href="https://www.myhospitalnow.com/contact/" class="nav-link  text-white" style="font-size:15px;"
                        target="_blank">Contact</a>
                </li>
                <li class="nav-item">
                    <a href="https://www.myhospitalnow.com/blog/" class="nav-link  text-white" style="font-size:15px;"
                        target="_blank">Blog</a>
                </li>
                <li class="nav-item">
                    <a href="https://www.myhospitalnow.com/doctors/pricing/" class="nav-link  text-white" style="font-size:15px;"
                        target="_blank">Pricing</a>
                </li>
                  <li class="nav-item">
                <a href="https://www.myhospitalnow.com/forum/" class="nav-link text-white" style="font-size:15px;"
                    target="_blank">Q&A Forum</a>
            </li>
                <!-- Social Media Icons -->
                <li class="nav-item d-flex align-items-center">
                    <a href="https://www.facebook.com/groups/MyHospitalNow/" target="_blank" class="nav-link p-2">
                        <div
                            style="width: 24px; height: 24px; background-color: white; border-radius: 35%; display: flex; justify-content: center; align-items: center;">
                            <i class="fab fa-facebook" style="color: #2d99ca; font-size: 15px;"></i>
                        </div>
                    </a>
                </li>
                <li class="nav-item d-flex align-items-center">
                    <a href="https://www.linkedin.com/company/myhospitalnow/" target="_blank" class="nav-link p-2">
                        <div
                            style="width: 24px; height: 24px; background-color: white; border-radius: 35%; display: flex; justify-content: center; align-items: center;">
                            <i class="fab fa-twitter" style="color: #2d99ca; font-size: 15px;"></i>
                        </div>
                    </a>
                </li>
                <li class="nav-item d-flex align-items-center">
                    <a href="https://www.twitter.com/myhospitalnow" target="_blank" class="nav-link p-2">
                        <div
                            style="width: 24px; height: 24px; background-color: white; border-radius: 35%; display: flex; justify-content: center; align-items: center;">
                            <i class="fab fa-linkedin" style="color: #2d99ca; font-size: 15px;"></i>
                        </div>
                    </a>
                </li>
            </ul>

            <ul class="navbar-nav">
                @guest
                    <li class="nav-item"><a style="font-size:17px;" href="https://www.myhospitalnow.com/login"
                            data-toggle="modal" data-target="#loginmodal" class="nav-link text-white">Login</a></li>
                    <li class="nav-item"><a data-toggle="modal" data-target="#registermodal"
                            href="https://www.myhospitalnow.com/register" style="font-size:17px;"
                            class="nav-link text-white">Register</a></li>
                @else
                    <li class="dropdown nav-item">
                        <a style="font-size:16px;margin-right:45px;" href="#" class="dropdown-toggle nav-link text-white"
                            data-toggle="dropdown" role="button" aria-expanded="false" aria-haspopup="true" v-pre>
                            {{ Auth::user()->name }} <span class="caret"></span>
                        </a>
                        <ul class="dropdown-menu" style="margin-right:45px;">
                            <li><a class="dropdown-item" href="{{ route('home') }}"><i class="fa fa-user"></i> Dashboard</a>
                            </li>
                            <li>
                                <a href="{{ route('logout') }}" class="dropdown-item fa fa-power-off">
                                    Logout
                                </a>
                            </li>
                        </ul>
                    </li>
                @endguest
            </ul>
        </div>
    </nav>
<!--<div class="modal fade" id="doctorBenefitsModal" tabindex="-1" role="dialog" aria-labelledby="doctorBenefitsModalLabel" aria-hidden="true">
  <div class="modal-dialog modal-lg" role="document" style="margin-top: 4vh;">
    <div class="modal-content">
      <div class="modal-header">
        <h5 class="modal-title w-100 text-center text-primary font-weight-bold" id="doctorBenefitsModalLabel">
          Doctors – Why Partner with MyHospitalNow?
        </h5>
        <button type="button" class="close" data-dismiss="modal" aria-label="Close">
          <span aria-hidden="true">&times;</span>
        </button>
      </div>

      <div class="modal-body">

        <p class="text-center font-weight-bold text-success mb-4">
          Start growing your medical practice today. Join MyHospitalNow and connect with patients who need your expertise!
        </p>

        <div class="row">
          <div class="col-md-6">
            <ul>
              <li><b>Access Verified Patient Inquiries</b>
                <ul>
                  <li>✔ Instantly connect with patients looking for experienced and trusted doctors.</li>
                  <li>✔ Receive detailed case information to provide targeted medical advice.</li>
                </ul>
              </li>
              <li><b>Grow Your Clinical Practice</b>
                <ul>
                  <li>✔ Boost your online visibility and reach new patients across the country.</li>
                  <li>✔ Turn potential inquiries into confirmed appointments seamlessly.</li>
                </ul>
              </li>
              <li><b>Simplify Patient Interaction</b>
                <ul>
                  <li>✔ Manage all appointment requests and inquiries from a single dashboard.</li>
                  <li>✔ Focus your time on high-intent, qualified patients.</li>
                </ul>
              </li>
            </ul>
          </div>

          <div class="col-md-6">
            <ul>
              <li><b>Strengthen Your Medical Profile</b>
                <ul>
                  <li>✔ Position yourself as a leading specialist in your field.</li>
                  <li>✔ Share your achievements and case studies to build trust and authority.</li>
                </ul>
              </li>
              <li><b>Exclusive Features for Registered Doctors</b>
                <ul>
                  <li>✔ Post health updates and treatment success stories.</li>
                  <li>✔ Participate in Q&A forums and engage with the community.</li>
                  <li>✔ Write and publish blogs on our platform.</li>
                  <li>✔ Access an appointment scheduler and patient record manager.</li>
                  <li>✔ Get listed as a Featured Doctor for more exposure.</li>
                </ul>
              </li>
            </ul>
          </div>
        </div>

        <hr>

        <h5 class="text-center mt-4">How It Works</h5>
        <div class="row text-center mt-3">
          <div class="col-md-4 mb-3">
            <h6><b>Create Your Profile</b></h6>
            <p>✔ Register and complete your professional profile to get listed.</p>
          </div>
          <div class="col-md-4 mb-3">
            <h6><b>Get Patient Requests</b></h6>
            <p>✔ Receive and respond to personalized consultation and appointment inquiries.</p>
          </div>
          <div class="col-md-4 mb-3">
            <h6><b>Build Patient Relationships</b></h6>
            <p>✔ Grow your patient base, reputation, and recurring consultations.</p>
          </div>
        </div>
      </div>
      <div class="modal-footer">
        <button type="button" class="btn btn-secondary" data-dismiss="modal">Close</button>
      </div>
    </div>
  </div>
</div>-->

    <!--Navigtion Ends Here-->
    <!--Registrtion Model Start Here-->
    <div class="container">
        <div class="row">
            <div class="col-sm-12 mt-1">
                <div class="card" style="margin-top:20px;">
                    <div class="card-header"
                        style="background-color:#2785e6; margin-bottom: 5px; padding-top: 3px; padding-bottom: 10px; text-align: center;">
                        SEARCH Doctor by Country, State & City
                    </div>
                    <div class="card-body" id="profile-filter" style="background-color: #e7eff9;" name="profile">
                        <form method="GET" action="{{ route('doctor.profile.filter') }}" id="hospital-profile-filter"
                            class="col-lg-12 col-sm-12 ">
                            {{ csrf_field() }}
                            <div class="row justify-content-center">
                                <div class="col-sm-6 col-md-12">
                                    <div class="row mt-1">
                                        <div class="col-sm-4 col-md-3">
                                            <select class="form-control  countries" id="country" name="country_id">
                                                <option value="">Country</option>
                                            </select>
                                        </div>
                                        <div class="col-sm-4 col-md-3">

                                            <select class="form-control states" id="state" name="state_id">
                                                <option value="">State</option>
                                            </select><br>
                                        </div>
                                        <div class="col-sm-4 col-md-3">
                                            <select class="form-control cities" id="city" name="city_id">
                                                <option value="">City</option>
                                            </select>
                                        </div>
                                        <div class="col-sm-4 col-md-3">
                                            <select class="form-control category" id="n_q_r_category" name="categoryId">
                                                <option disabled selected value="">Select Specialization</option>
                                            </select>
                                            <input type="hidden" id="categoryName" name="category">
                                        </div>
                                    </div>
                                </div>
                                <div class="col-sm-6 col-md-12">
                                    <div class="row mt-1">
                                        <div class="col-sm-6 col-md-8">

                                            <input type="text" class="form-control" id="inputSearch" name="Keyword"
                                                aria-describedby="emailHelp" placeholder="Search">
                                        </div>
                                        <div class="col-sm-6 col-md-4">
                                            <button type="button" class="btn btn-primary"
                                                id="doctor-profile-filter-submit">Search</button>
                                            <button type="button" class="btn btn-primary"
                                                id="doctor-filter-reset">Reset</button>
                                        </div>
                                    </div>

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

                    </div>
                </div>
            </div>
        </div>
    </div>
    <!--Registrtion Model Start Here-->

    <!-- doctor list start-->

    <section class="container">
        <div class="row">
            <div class="col-sm-9 col-md-9" id="profile-table" name="profile">
                @component('components.doctor-profile-list')
                @endcomponent
            </div>
            <div class="col-sm-3 col-md-3">
                <div class="card">
                    <div class="card-header text-center">
                        Top Premium & Featured Doctor
                    </div>
                </div>
                <div class="sticky-top">
                    @foreach (\App\Http\Controllers\DoctorController::getTopDoctors() as $doctor)
                        @if ($doctor->avatar == 'default.png')
                            <div class="card text-center mt-2">
                                <center><img class="card-img-top mt-2" src="{{ asset('images/default.png') }}"
                                        alt="{{ $doctor->name }}"
                                        style="height: 100px;width: 100px;border-radius: 50%; object-fit: cover;">
                                </center>
                                <div class="card-body">
                                    <a href="/doctors/{{ $doctor['slug'] }}" target="_blank">
                                        <p class="card-text">{{ $doctor->name }}</p>
                                    </a>
                                </div>
                            </div>
                        @else
                            <div class="card text-center">
                                <center><img class="card-img-top mt-2" src="storage/users/{{ $doctor->avatar }}"
                                        alt="{{ $doctor->name }}"
                                        style="height: 100px;width: 100px;border-radius: 50%; object-fit: cover;">
                                </center>
                                <div class="card-body">
                                    <a href="/doctors/{{ $doctor['slug'] }}" target="_blank">
                                        <p class="card-text">{{ $doctor->name }}</p>
                                    </a>
                                </div>
                            </div>
                        @endif
                    @endforeach

                </div>
            </div>
        </div>
    </section>
    <!-- doctor list end -->

    <!--Carousal list CSS Start-->

    <style>
        .demo {
            background: #f8f8f8;
            margin-top: 20px;
            padding: 30px;
        }

        .testimonial {
            margin: 0 20px 40px;
        }

        .testimonial .testimonial-content {
            padding: 35px 25px 35px 50px;
            margin-bottom: 35px;
            background: #fff;
            border: 1px solid #f0f0f0;
            position: relative;
        }

        .testimonial .testimonial-content:after {
            content: "";
            display: inline-block;
            width: 20px;
            height: 20px;
            background: #fff;
            position: absolute;
            bottom: -10px;
            left: 22px;
            -webkit-transform: rotate(45deg);
            transform: rotate(45deg);
        }

        .testimonial-content .testimonial-icon {
            width: 50px;
            height: 45px;
            background: #ff4242;
            text-align: center;
            font-size: 22px;
            color: #fff;
            line-height: 42px;
            position: absolute;
            top: 37px;
            left: -19px;
        }

        .testimonial-content .testimonial-icon:before {
            content: "";
            border-bottom: 16px solid #e41212;
            border-left: 18px solid transparent;
            position: absolute;
            top: -16px;
            left: 1px;
        }

        .testimonial .description {
            font-size: 15px;
            font-style: italic;
            color: #8a8a8a;
            line-height: 23px;
            margin: 0;
        }

        .testimonial .title {
            display: block;
            font-size: 18px;
            font-weight: 700;
            color: #525252;
            text-transform: capitalize;
            letter-spacing: 1px;
            margin: 0 0 5px 0;
        }

        .testimonial .post {
            display: block;
            font-size: 14px;
            color: #ff4242;
        }

        .owl-theme .owl-controls {
            margin-top: 10px;
        }

        .owl-theme .owl-controls .owl-page span {
            background: #ccc;
            opacity: 1;
            -webkit-transition: all 0.4s ease 0s;
            transition: all 0.4s ease 0s;
        }

        .owl-theme .owl-controls .owl-page.active span,
        .owl-theme .owl-controls.clickable .owl-page:hover span {
            background: #ff4242;
        }

        #mhn_con_doctors {
            padding: 30px;
            margin-top: 20px;
            background: #fff;
        }

        .mhn-img-circle {
            width: 100px;
            height: 100px;
            border-radius: 50px;
            border: 1px solid #14bef0;
        }

        .mhn-img-circle:hover {
            border: 2px solid #4190ad;
        }

        #mhn_con_doctors .btn-col-sky {
            color: #14bef0;
        }

        .mhn-margin-top-10 {
            margin-top: 10px;
        }

        .mhn-t-uppercase {
            text-transform: uppercase;
        }

        .mhn-font-14 {
            font-size: 14px;
        }

        .mhn-font-12 {
            font-size: 12px;
        }

        .mhn-font-bold {
            font-weight: 700;
        }

        #mhn_con_doctors .mhn-link a {
            text-decoration: none;
        }

        .mhn-margin-less {
            margin-top: 0;
        }


        /* .mhn-link{
             margin-top:40px;
         } */
        #consultButton {
            margin-bottom: 30px;
        }

        #header {
            text-transform: uppercase;
        }
    </style>

    <!-- mhn consult top doctors online section Start -->
    <section class="" style="Background-color: #FBFCFC;" id="mhn_con_doctors">
        <h3 id="header"><b>Consult top hospitals online for any health concern</b></h3>
        <span><small class="mhn-margin-less">Private online consultations with verified hospitals in all
                specialists</small></span>
        <!-- row starts -->
        <div class="row text-center mt-3">
            <!-- column 1 start -->
            @foreach (\App\Http\Controllers\PassportApi\HospitalManagementController::_getHospitals() as $hospital)
                <div class="col-sm-6 col-md-2 mhn-link">
                    {{-- <a href="/hospitals/{{$hospital['slug']}}" target="_blank"> --}}
                    <a href="/hospitals/{{ $hospital['slug'] }}" target="_blank">
                        @if ($hospital['avatar'] == 'hospital.png')
                            <img src="{{ asset('images/hospital.png') }}" alt="{{ $hospital['name'] }}"
                                class="mhn-img-circle" style=" object-fit: cover;">
                        @else
                            <img src="/hospitals/storage/hospital_profile/{{ $hospital['avatar'] }}"
                                alt="Acne ,Pimples or Skin Issues" class="mhn-img-circle" style=" object-fit: cover;">
                        @endif
                        <p class="mhn-font-14 mhn-font-bold">{{ $hospital['name'] }}</p>
                    </a>
                    <a href="https://www.myhospitalnow.com/get-started" target="_blank">
                        <span class="btn-col-sky mhn-margin-top-10 mhn-t-uppercase mhn-font-12" id="consultButton">Quote
                            Now</span>
                    </a>
                    <hr>
                </div>
            @endforeach
            <!-- column 1 end -->
            <!-- column 2 start -->
            {{-- <div class="col-sm-6 col-md-2">
            <img src="{{asset('images/home/cold-cough.svg')}}" alt="Cold, cough or fever" class="mhn-img-circle">
        <p class="mhn-font-14 mhn-font-bold">Cold, cough or <br>fever</p>
        <span class="btn-col-sky mhn-margin-top-10 mhn-t-uppercase mhn-font-12">Consult Now</span>
    </div>
    <!-- column 2 end -->
    <!-- column 3 start -->
    <div class="col-sm-6 col-md-2">
        <img src="{{asset('images/homepage/depression.svg')}}" alt="Depression or anxiety" class="mhn-img-circle">
        <p class="mhn-font-14 mhn-font-bold">Depression or <br>anxiety</p>
        <span class="btn-col-sky mhn-margin-top-10 mhn-t-uppercase mhn-font-12">Consult Now</span>
    </div>
    <!-- column 3 end -->
    <!-- column 4 start -->
    <div class="col-sm-6 col-md-2">
        <img src="{{asset('images/home/hair-transplant.svg')}}" alt="Hair Transplant" class="mhn-img-circle">
        <p class="mhn-font-14 mhn-font-bold">Hair<br> Transplant</p>
        <span class="btn-col-sky mhn-margin-top-10 mhn-t-uppercase mhn-font-12">Consult Now</span>
    </div>
    <!-- column 4 end -->
    <!-- column 5 start -->
    <div class="col-sm-6 col-md-2">
        <img src="{{asset('images/home/breast.svg')}}" alt="Hair Transplant" class="mhn-img-circle">
        <p class="mhn-font-14 mhn-font-bold">Breast Augmentation Surgery</p>
        <span class="btn-col-sky mhn-margin-top-10 mhn-t-uppercase mhn-font-12">Consult Now</span>
    </div>
    <!-- column 5 end -->
    <!-- column 6 start -->
    <div class="col-sm-6 col-md-2">
        <img src="{{asset('images/home/rhinoplasty.svg')}}" alt="Hair Transplant" class="mhn-img-circle">
        <p class="mhn-font-14 mhn-font-bold">Rhinoplasty <br>Surgery</p>
        <span class="btn-col-sky mhn-margin-top-10 mhn-t-uppercase mhn-font-12">Consult Now</span>
    </div> --}}
            <!-- column 6 end -->
        </div>
        <!-- row ends -->
    </section>

    <!-- mhn consult top doctors online section End -->

    <!-- what our customers say section start -->
    <section>
        <div class="demo">
            <h2 class="text-center mb-3">What our users have to say</h2>
            <div class="container">

                <div class="row">
                    <div class="col-md-12">
                        <div id="testimonial-slider" class="owl-carousel">
                            <div class="testimonial">
                                <div class="testimonial-content">
                                    <div class="testimonial-icon">
                                        <i class="fa fa-quote-left"></i>
                                    </div>
                                    <p class="description">
                                        Very easy to book,maintain history. Hassle free from older versions of booking
                                        appointment via telephone.
                                    </p>
                                </div>
                                <h3 class="title">Mr. Rajmohan Desai</h3>
                            </div>

                            <div class="testimonial">
                                <div class="testimonial-content">
                                    <div class="testimonial-icon">
                                        <i class="fa fa-quote-left"></i>
                                    </div>
                                    <p class="description">
                                        Very good app. Well thought out about booking/rescheduling/canceling an appointment.
                                    </p>
                                </div>
                                <h3 class="title">Kristina</h3>
                            </div>

                            <div class="testimonial">
                                <div class="testimonial-content">
                                    <div class="testimonial-icon">
                                        <i class="fa fa-quote-left"></i>
                                    </div>
                                    <p class="description">
                                        Very helpful. Far easier than doing same things on computer. Allows quick and easy
                                        search with speedy booking.
                                    </p>
                                </div>
                                <h3 class="title">Mr. Ravi Sharma</h3>
                            </div>

                            <div class="testimonial">
                                <div class="testimonial-content">
                                    <div class="testimonial-icon">
                                        <i class="fa fa-quote-left"></i>
                                    </div>
                                    <p class="description">
                                        Lorem ipsum dolor sit amet, consectetur adipiscing elit. Praesent bibendum dolor sit
                                        amet eros imperdiet.
                                    </p>
                                </div>
                                <h3 class="title">williamson</h3>
                            </div>

                            <div class="testimonial">
                                <div class="testimonial-content">
                                    <div class="testimonial-icon">
                                        <i class="fa fa-quote-left"></i>
                                    </div>
                                    <p class="description">
                                        Very easy to book. Hassle free from older versions of booking appointment via
                                        telephone. You should give a try.
                                    </p>
                                </div>
                                <h3 class="title">williamson</h3>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </section>
    <!-- what our customers say section end -->

    <!-- Download App Section Start -->
    <section class="container-fluid mt-4" id="app_download" style="padding-bottom:10px;">
        <h1 class="text-center"><i class="fa fa-download" aria-hidden="true">&nbsp;&nbsp;<b>Download the MyHospitalNow
                    app</b></i></h1>
        <div class="row">
            <!--Tab 1 Start-->
            <div class="col-sm-12 col-md-4 mb-4">
                <div class="mhn-install text-center">
                    <p><strong>Are you Patient?</strong></p>
                    <ul class="list-unstyled">
                        <li>Free Surgery Cost Estimation</li>
                        <li>Free Consulting with Best Hospital</li>
                        <li>Free Consulting with Best Doctors</li>
                        <li>Lowest Treatment Cost</li>
                        <li>World Class Hospitals Options</li>
                        <li>Tour to your Dream Country</li>
                    </ul>
                    <a href="https://play.google.com/store/apps/details?id=cotocus.myhospitalnow"><img class=""
                            src="{{ asset('images/homepage/google_badge.webp') }}" alt="" id="playstore"></a>
                    <img src="{{ asset('images/homepage/appstore_badge.webp') }}" alt="" id="appstore">
                </div>
            </div>
            <!--tab 1 End-->
            <!--tab 2 Start-->
            <div class="col-sm-12 col-md-4 mb-4">
                <div class="mhn-install text-center">
                    <p><strong>Are you Hospital?</strong></p>
                    <ul class="list-unstyled">
                        <li>Free International Surgery Query</li>
                        <li>Free Hospital Profile</li>
                        <li>Directly Interact with Patients</li>
                        <li>Free Services/Offer Publishing</li>
                        <li>Free Medical Tourism IT Platform</li>
                        <li>Free Case Management Software</li>
                    </ul>
                    <a href="https://play.google.com/store/apps/details?id=cotocus.myhositalnowhospitalhospital"><img
                            class="" src="{{ asset('images/homepage/google_badge.webp') }}" alt=""
                            id="playstore"></a>
                    <img src="{{ asset('images/homepage/appstore_badge.webp') }}" alt="" id="appstore">
                </div>
            </div>
            <!--tab 2 End-->
            <!--tab 3 Start-->
            <div class="col-sm-12 col-md-4 mb-4">
                <div class="mhn-install text-center">
                    <p><strong>Are you Doctor?</strong></p>
                    <ul class="list-unstyled">
                        <li>Free International Surgery Query</li>
                        <li>Free Doctor Profile</li>
                        <li>Directly Interact with Patients</li>
                        <li>Free Services/Offer Publishing</li>
                        <li>Free Medical Tourism IT Platform</li>
                        <li>Free Case Management Software</li>
                    </ul>
                    <a href="https://play.google.com/store/apps/details?id=cotocus.myhositalnowhospitaldoctor"><img
                            class="" src="{{ asset('images/homepage/google_badge.webp') }}" alt=""
                            id="playstore"></a>
                    <img src="{{ asset('images/homepage/appstore_badge.webp') }}" alt="" id="appstore">
                </div>
            </div>
            <!--tab 3 End-->

            {{-- <div class="col-sm-6 col-md-4 float-left">
                <img src="{{asset('images/homepage/myhospitalnow-app-download.svg')}}" alt="Myhospitalnow App Download"
        id="preview-right"> --}}
        </div>
        </div>
    </section>
    <!-- Download App Section End -->
  <!-- <script>
  $(document).ready(function(){
    $('#doctorBenefitsModal').modal('show');
  });
</script> -->
    <!-- SweetAlert2 JS -->
    <!-- SweetAlert2 CSS -->
    <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/sweetalert2@11/dist/sweetalert2.min.css">

    <script src="https://cdn.jsdelivr.net/npm/sweetalert2@11"></script>
 <link href="https://cdn.jsdelivr.net/npm/select2@4.0.13/dist/css/select2.min.css" rel="stylesheet" />
{{-- <script src="https://code.jquery.com/jquery-3.6.0.min.js"></script> --}}
<script src="https://cdn.jsdelivr.net/npm/select2@4.0.13/dist/js/select2.min.js"></script>
    <script src="{{ asset('js/blade-components/doctor_profile_filter.js') }}"></script>
    <script src="https://www.google.com/recaptcha/api.js" async defer></script>
    <script src="{{ asset('js/blade-components/country_state_city_category_accrediation.js') }}"></script>
    <script type="text/javascript">
        $.sidebar.initSideBar();
        $.sp_globals.toggleSPLoadingSpinner(false);
    </script>

    <script>
        $(document).ready(function() {
            $("#testimonial-slider").owlCarousel({
                items: 3,
                itemsDesktop: [1000, 3],
                itemsDesktopSmall: [980, 2],
                itemsTablet: [768, 2],
                itemsMobile: [650, 1],
                pagination: true,
                navigation: false,
                slideSpeed: 1000,
                autoPlay: true
            });
        });
    </script>
@endsection
@section('scripts')
    <script>
        $(document).ready(function() {
            // Event listener for Specialization Select (if not already handled in the included JS)
            $("#n_q_r_category").change(function() {
                var specialization = $('#n_q_r_category option:selected').text();
                // console.log("Selected Specialization:", specialization);
                $('#categoryName').val(specialization);
            });
        });
    </script>
@endsection