<?php
if (!get_theme_mod('wheel_alignment_service_enable_services_section', false)) {
    return;
}

$wheel_alignment_service_args = '';

wheel_alignment_service_render_service_section($wheel_alignment_service_args);

/**
 * Render Service Section.
 */
function wheel_alignment_service_render_service_section($wheel_alignment_service_args) { ?>
    <section id="wheel_alignment_service_trending_section" class="asterthemes-frontpage-section trending-section trending-style-1">
        <?php
        if (is_customize_preview()) :
            wheel_alignment_service_section_link('wheel_alignment_service_service_section');
        endif; ?>

        <div class="asterthemes-wrapper">
            <div class="services-section">
                <?php
                // Make sure to provide a default value for get_theme_mod calls.
                $wheel_alignment_service_heading_services_section = get_theme_mod('wheel_alignment_service_heading_services_section', '');
                if (!empty($wheel_alignment_service_heading_services_section)) {
                    $wheel_alignment_service_heading_words = explode(' ', $wheel_alignment_service_heading_services_section);
                    $wheel_alignment_service_last_word = array_pop($wheel_alignment_service_heading_words);
                    $wheel_alignment_heading_without_last_word = implode(' ', $wheel_alignment_service_heading_words);
                ?>
                    <h3><?php echo esc_html($wheel_alignment_heading_without_last_word); ?> <span class="last-word"><?php echo esc_html($wheel_alignment_service_last_word); ?></span></h3>
                <?php } ?>
                <div class="tab">
                    <?php
                    $wheel_alignment_service_featured_post = get_theme_mod('wheel_alignment_service_services_number', 0);
                    for ($wheel_alignment_service_j = 1; $wheel_alignment_service_j <= $wheel_alignment_service_featured_post; $wheel_alignment_service_j++) {
                        $wheel_alignment_service_main_id = get_theme_mod('wheel_alignment_service_services_text' . $wheel_alignment_service_j, '');
                        $wheel_alignment_service_tab_id = str_replace(' ', '-', $wheel_alignment_service_main_id);
                    ?>
                        <button class="tablinks" onclick="wheel_alignment_service_services_tab(event, '<?php echo esc_attr($wheel_alignment_service_tab_id); ?>')">
                            <?php echo esc_html($wheel_alignment_service_main_id); ?>
                        </button>
                    <?php } ?>
                </div>

                <?php for ($wheel_alignment_service_j = 1; $wheel_alignment_service_j <= $wheel_alignment_service_featured_post; $wheel_alignment_service_j++) { 
                    $wheel_alignment_service_main_id = get_theme_mod('wheel_alignment_service_services_text' . $wheel_alignment_service_j, '');
                    $wheel_alignment_service_tab_id = str_replace(' ', '-', $wheel_alignment_service_main_id); 
                ?>
                    <div id="<?php echo esc_attr($wheel_alignment_service_tab_id); ?>" class="tabcontent">
                        <div class="services_main_box">
                            <?php
                            $wheel_alignment_service_default_image_url = get_template_directory_uri() . '/resource/img/default.png'; // Update this with the actual path to your default image

                            $wheel_alignment_service_args = array(
                                'post_type' => 'post',
                                'post_status' => 'publish',
                                'category_name' => get_theme_mod('wheel_alignment_service_services_category' . $wheel_alignment_service_j),
                                'posts_per_page' => 3,
                            );
                            $wheel_alignment_service_arr_posts = new WP_Query($wheel_alignment_service_args);
                            if ($wheel_alignment_service_arr_posts->have_posts()) :
                                while ($wheel_alignment_service_arr_posts->have_posts()) : $wheel_alignment_service_arr_posts->the_post();
                            ?>
                                    <div class="services_inner_box">
                                        <?php if (has_post_thumbnail()) : ?>
                                            <?php the_post_thumbnail(); ?>
                                        <?php else : ?>
                                            <img src="<?php echo esc_url($wheel_alignment_service_default_image_url); ?>" alt="<?php echo esc_attr(get_the_title()); ?>">
                                        <?php endif; ?>
                                        <div class="services_content_box">
                                            <h4><a href="<?php the_permalink(); ?>"><?php the_title(); ?></a></h4>
                                            <?php the_excerpt(); ?>
                                        </div>
                                    </div>
                            <?php
                                endwhile;
                                wp_reset_postdata();
                            endif;
                            ?>
                        </div>
                    </div>
                <?php } ?>
            </div>
        </div>
    </section>
<?php
}