
<section class="main-slider">
				<?php
				$slider_query = new WP_Query(array('post_type' => 'slides', 'order'=>'ASC', 'posts_per_page' => -1));
				?>
				<div class="swiper-container thm-swiper__slider" data-swiper-options='{"slidesPerView": 1, "loop": true,
                "effect": "fade",
                "pagination": {
                "el": "#main-slider-pagination",
                "type": "bullets",
                "clickable": true
                },
                "navigation": {
                "nextEl": "#main-slider__swiper-button-next",
                "prevEl": "#main-slider__swiper-button-prev"
                },
                "autoplay": {
                "delay": 5000
                }}'>
					<div class="swiper-wrapper">
						<?php if ($slider_query->have_posts()):?>
							<?php while ($slider_query->have_posts()):?>
								<?php $slider_query->the_post();
								$title = get_the_title();
								$description = get_the_excerpt();
								$url = get_post_meta(get_the_ID(), '_slide_link', true);
								$backgroundImg = get_the_post_thumbnail_url(get_the_ID() );
								?>
								<div class="swiper-slide">
									<div class="image-layer" style="background-image: url(<?= $backgroundImg;?>);">
									</div>
									<div class="slider-overlay"></div>
									<div class="container">
										<div class="row">
											<div class="col-xl-12">
												<div class="main-slider-content">
													<div class="main-slider-content__inner">
														
														<div class="big-title">
															<button class="btn btn-primary fw-bold text-white">WELCOME TO CARNET HOTEL </button>
															<h2><?= esc_html($title)?></h2>
														</div>
														<div class="text text-center">
															<p><?= esc_html($description)?></p>
															<a href="<?= esc_html($url)?>" class="text-link d-none">Read More</span></a>
														</div>
													</div>
												</div><!-- Slide Content !-->
											</div><!-- col !-->
										</div><!-- row !-->
									</div><!-- container !-->
								</div><!-- Swiper slide !-->
							<?php endwhile; ?>
							<!--End Single Swiper Slide-->
						<?php endif; ?>
					</div><!-- Swiper wrapper !-->
					<!-- If we need navigation buttons -->
					<div class="main-slider__nav">
                    <div class="swiper-button-prev" id="main-slider__swiper-button-next" tabindex="0" role="button" aria-label="Next slide">
                        <i class="bi bi-chevron-left"></i>
                    </div>
                    <div class="swiper-button-next" id="main-slider__swiper-button-prev" tabindex="0" role="button" aria-label="Previous slide">
                        <i class="bi bi-chevron-right"></i>
                    </div>
				</div><!-- swiper container !-->

			  <?php wp_reset_postdata(); ?>
			</section>
