<!-- Sliding Photos !-->
<div id="carouselExampleFade" class="carousel slide carousel-fade" data-bs-ride="carousel">
    <?php
        $slider_query = new WP_Query(array('post_type' => 'slides', 'posts_per_page' => -1));
    ?>
    <div class="carousel-inner">
        <?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_url', true);
                    $backgroundImg = get_the_post_thumbnail_url(get_the_ID());
                ?>
                <div class="carousel-item active">
                    <img src="<?= $backgroundImg;?>" class="d-block w-100" alt="<?= esc_html($title)?>">
                    <div class="overlay"></div> <!-- Overlay div -->
                    <div class="carousel-caption">
                        <h1><?= esc_html($title)?></h1>
                        <p class="custom-width"><?= esc_html($description)?></p>
                        <div class="carousel-button">
                            <?php
                        $url = '/our-farm/';
                        ?>
                        <a href="/our-farm/" class="carousel-btn">
                          Read More <span class="material-symbols-outlined">
                                    trending_flat</span>
                        </a>
                        </div>
                    </div><!-- carousel-caption !-->
                </div><!-- carousel-item !-->
            <?php endwhile; ?>
            <!--End Single Slide-->
        <?php endif; ?>
    </div><!-- Corousel-inner !-->
    <button class="carousel-control-prev" type="button" data-bs-target="#carouselExampleFade" data-bs-slide="prev">
        <span class="carousel-control-prev-icon" aria-hidden="true"></span>
        <span class="visually-hidden">Previous</span>
    </button>
    <button class="carousel-control-next" type="button" data-bs-target="#carouselExampleFade" data-bs-slide="next">
        <span class="carousel-control-next-icon" aria-hidden="true"></span>
        <span class="visually-hidden">Next</span>
    </button>
    <?php wp_reset_postdata(); ?>
</div><!-- carouselExampleFade !-->