<section id="slider-section" class="slider-area home-slider">
  <!-- <div class="slideinning"></div> -->
  <!-- start of hero --> 
  <section class="hero-slider hero-style">
    <div class="pet_care_veterinary_centerswiper-container">
      <div class="swiper-wrapper">
        <?php for($p=1; $p<6; $p++) { ?>
        <?php if( get_theme_mod('slider'.$p,false)) { ?>
        <?php $querycolumns = new WP_query('page_id='.get_theme_mod('slider'.$p,true)); ?>
        <?php while( $querycolumns->have_posts() ) : $querycolumns->the_post(); 
          $image = wp_get_attachment_image_src(get_post_thumbnail_id() , true); ?>
        <?php 
          if(has_post_thumbnail()){
            $img = esc_url($image[0]);
          }
          if(empty($image)){
            $img = get_template_directory_uri().'/assets/images/default.png';
          }
        ?>
      <!-- <div class="container"> -->
        <div class="pet_care_veterinary_centerswiper-slide">
            <div class="container">
                <div class="pet_care_veterinary_centerslide-inner ">   
                    <div class="row m-0">
                        <div class="slidercontent">
                            <div class="trst-txt">
                              <div class="rounded-full"><span></span></div>
                              <svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-heart w-5 h-5 text-[#F06292] fill-[#F06292]" aria-hidden="true"><path d="M2 9.5a5.5 5.5 0 0 1 9.591-3.676.56.56 0 0 0 .818 0A5.49 5.49 0 0 1 22 9.5c0 2.29-1.5 4-3 5.5l-5.492 5.313a2 2 0 0 1-3 .019L5 15c-1.5-1.5-3-3.2-3-5.5"></path></svg>
                              <h5><?php echo esc_html(get_theme_mod('slider_trusttext', '🎉 Trusted by 10,000+ Pet Parents')); ?></h5>
                            </div>
                            <div class="slide-title">
                                <h3><?php echo esc_html(get_theme_mod('slider_subtitle', 'Premium Veterinary Care')); ?></h3>
                                <h2><?php the_title_attribute(); ?></h2>    
                            </div>     
                            <div class="slide-text"> 
                                <?php the_excerpt(); ?>
                            </div>
                            <div class="slide-btns">
                                <a class="btn-bookappoint" href="<?php echo esc_url(get_theme_mod('slider_btnlink1', '#')); ?>">
                                  <i class="fa-solid fa-phone"></i> <?php echo esc_html(get_theme_mod('slider_btntext1', 'Book Appointment')); ?> <i class="fa-solid fa-arrow-right-long"></i>
                                </a>
                                <a class="btn-exploreservices" href="<?php echo esc_url(get_theme_mod('slider_btnlink2', '#')); ?>">
                                  <i class="fa-regular fa-star"></i> <?php echo esc_html(get_theme_mod('slider_btntext2', 'Explore Services')); ?>
                                </a>
                            </div>
                        </div>   
                        <div class="sliderimg-content">
                            <div class="image">
                                <div class="icnbx">
                                    <i class="fa-solid fa-heart"></i>
                                </div>
                                <div class="imgbg"></div>
                                <div class="img2bg"></div>
                                <img class="slide-mainimg slidershape1" src="<?php echo esc_url($img); ?>" alt="<?php the_title_attribute(); ?>">

                            </div>
                            <div class="phbox">
                                <div class="phboxinn">
                                    <div class="row m-0">
                                        <div class="phicn">
                                            <i class="fa-solid fa-phone"></i> 
                                        </div>
                                        <div class="phconbx">
                                            <p><?php echo esc_html(get_theme_mod('slider_phonetext', '24/7 Emergency')); ?></p>
                                            <a href="tel:<?php echo esc_html(get_theme_mod('slider_phonenumber', '(555) 123-4567')); ?>">
                                              <?php echo esc_html(get_theme_mod('slider_phonenumber', '(555) 123-4567')); ?>
                                            </a>
                                        </div>
                                    </div>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
      <!-- </div> -->
        <?php endwhile;
           wp_reset_postdata(); ?>
        <?php } } ?>
        <div class="clear"></div> 

      </div>
       <!-- swipper controls -->
      <div class="pet_care_veterinary_centerswiper-pagination"></div>
      <div class="pet_care_veterinary_centerswiper-button-next">
        <i class="fa-solid fa-caret-left"></i>
      </div>
      <div class="pet_care_veterinary_centerswiper-button-prev">
        <i class="fa-solid fa-caret-left"></i>
      </div>
    </div>
  </section>
  <!-- end of hero slider -->
</section>


