<?php
/**
 * Template part for displaying services section
 *
 * @package Babysitter Childcare
 * @subpackage babysitter_childcare
 */
?>

<?php $babysitter_childcare_static_image = get_stylesheet_directory_uri() . '/assets/images/header_img.png'; ?>

<section id="about" class="clearfix my-md-5 my-3 px-md-0 px-2">
    <div class="container">
        <div class="row">
            <?php
            $babysitter_childcare_about_page = array();
            $babysitter_childcare_mod = absint(get_theme_mod('babysitter_childcare_about_page'));
            if ('page-none-selected' != $babysitter_childcare_mod) {
                $babysitter_childcare_about_page[] = $babysitter_childcare_mod;
            }
            if (!empty($babysitter_childcare_about_page)) :
                $babysitter_childcare_args = array(
                    'post_type' => 'page',
                    'post__in' => $babysitter_childcare_about_page,
                    'orderby' => 'post__in',
                );
                $babysitter_childcare_query = new WP_Query($babysitter_childcare_args);
                if ($babysitter_childcare_query->have_posts()) :
                    while ($babysitter_childcare_query->have_posts()) : $babysitter_childcare_query->the_post(); ?>
                      <div class="col-lg-7 col-md-7 col-12 mb-md-2 mb-5">
                        <div class="position-relative">
                          <div class="row">
                            <div class="col-lg-7 col-md-7 col-8 position-relative">
                              <div class="about-main-img">
                                <?php if (has_post_thumbnail()) { ?>
                                    <img src="<?php the_post_thumbnail_url('full'); ?>" alt="<?php the_title_attribute(); ?>" />
                                <?php } else { ?>
                                    <img src="<?php echo esc_url($babysitter_childcare_static_image); ?>" alt="<?php esc_attr_e('Default image', 'babysitter-childcare'); ?>" />
                                <?php } ?>
                              </div>
                                <div class="rating-col">
                                    <div class="row rating-box">
                                        <div class="col-lg-4 col-md-4 col-4 align-self-center px-0 position-relative">
                                            <?php 
                                            $babysitter_childcare_selected_category = get_theme_mod('babysitter_childcare_about_catData', 'select');
                                            if ($babysitter_childcare_selected_category != 'select') { ?>
                                                <div class="abt-cat">
                                                    <div class="owl-carousel m-0">
                                                        <?php
                                                        $babysitter_childcare_abtpage_query = new WP_Query(array(
                                                            'category_name' => esc_attr($babysitter_childcare_selected_category),
                                                            'posts_per_page' => -1,
                                                        ));
                                                        if ($babysitter_childcare_abtpage_query->have_posts()) :
                                                            while ($babysitter_childcare_abtpage_query->have_posts()) : $babysitter_childcare_abtpage_query->the_post(); ?>
                                                                <div class="abt-imagebox">
                                                                    <?php if (has_post_thumbnail()) { ?>
                                                                        <img src="<?php the_post_thumbnail_url(); ?>" alt="<?php the_title_attribute(); ?>" />
                                                                    <?php } else { ?>
                                                                        <img src="<?php echo esc_url($babysitter_childcare_static_image); ?>" alt="<?php esc_attr_e('Default image', 'babysitter-childcare'); ?>" />
                                                                    <?php } ?>
                                                                </div>
                                                            <?php endwhile;
                                                            wp_reset_postdata();
                                                        else : ?>
                                                            <p><?php esc_html_e('No posts found in this category.', 'babysitter-childcare'); ?></p>
                                                        <?php endif; ?>
                                                    </div>
                                                </div>
                                            <?php } ?>
                                        </div>
                                        <div class="col-lg-8 col-md-8 col-8 align-self-center">
                                            <div class="customer-review"><?php esc_html_e('Our Happy Customer', 'babysitter-childcare'); ?></div>
                                            <div class="customzer-rating">
                                                <span><?php echo esc_html(get_theme_mod('babysitter_childcare_customer_review', '')); ?></span>
                                            </div>
                                        </div>
                                    </div>
                                </div>
                            </div>
                            <div class="col-lg-5 col-md-5 col-4 about-img px-md-0">
                                <?php if (get_theme_mod('babysitter_childcare_abt_image') != '') { ?>
                                    <img src="<?php echo esc_url(get_theme_mod('babysitter_childcare_abt_image')); ?>" alt="" />
                                <?php } ?>
                            </div>
                          </div>
                        </div>
                      </div>
                    <?php endwhile; ?>
                    <div class="col-lg-5 col-md-5 about-box">
                        <?php if (get_theme_mod('babysitter_childcare_about_short_heading') != '') { ?>
                            <h2 class="abt-title text-capitalize"><?php echo esc_html(get_theme_mod('babysitter_childcare_about_short_heading', '')); ?></h2>
                        <?php } ?>
                        <?php while ($babysitter_childcare_query->have_posts()) : $babysitter_childcare_query->the_post(); ?>
                            <h3><a href="<?php the_permalink(); ?>" class="text-capitalize"><?php the_title(); ?></a></h3>
                            <p class="about-content"><?php echo wp_trim_words(get_the_content(), 70); ?></p>
                            <div class="abt-btn my-4">
                                <a href="<?php the_permalink(); ?>"><?php esc_html_e('View More', 'babysitter-childcare'); ?></a>
                            </div>
                            <?php if (get_theme_mod('babysitter_childcare_trusted_heading') != '') { ?>
                                <h4 class="abt-trusted-text text-center mb-2"><?php echo esc_html(get_theme_mod('babysitter_childcare_trusted_heading', '')); ?></h4>
                            <?php } ?>
                            <div class="row">
                                <div class="col-lg-4 col-md-4 col-4">
                                    <?php if (get_theme_mod('babysitter_childcare_moms_enrolled_counter') != '') { ?>
                                        <div class="text-center">
                                            <div class="trust-counter mb-2"><?php echo esc_html(get_theme_mod('babysitter_childcare_moms_enrolled_counter', '')); ?></div>
                                            <div class="trust-counter-text"><?php esc_html_e('Moms Enrolled', 'babysitter-childcare'); ?></div>
                                        </div>
                                    <?php } ?>
                                </div>
                                <div class="col-lg-4 col-md-4 col-4">
                                    <?php if (get_theme_mod('babysitter_childcare_integrated_counter') != '') { ?>
                                        <div class="text-center">
                                            <div class="trust-counter mb-2"><?php echo esc_html(get_theme_mod('babysitter_childcare_integrated_counter', '')); ?></div>
                                            <div class="trust-counter-text"><?php esc_html_e('Integrated Center', 'babysitter-childcare'); ?></div>
                                        </div>
                                    <?php } ?>
                                </div>
                                <div class="col-lg-4 col-md-4 col-4">
                                    <?php if (get_theme_mod('babysitter_childcare_professionals') != '') { ?>
                                        <div class="text-center">
                                            <div class="trust-counter mb-2"><?php echo esc_html(get_theme_mod('babysitter_childcare_professionals', '')); ?></div>
                                            <div class="trust-counter-text"><?php esc_html_e('Professional', 'babysitter-childcare'); ?></div>
                                        </div>
                                    <?php } ?>
                                </div>
                            </div>
                        <?php endwhile; ?>
                        <?php wp_reset_postdata(); ?>
                    </div>
                <?php else : ?>
                    <div class="no-postfound"><?php esc_html_e('No posts found', 'babysitter-childcare'); ?></div>
                <?php endif; ?>
            <?php endif; ?>
            <div class="clearfix"></div>
        </div>
    </div>
</section>
