<?php 
$expert_videographer_servicesec = get_theme_mod('expert_videographer_service_show_hide', true);

if ($expert_videographer_servicesec == '1') : 
?>
<section id="service-section">
  <div class="container"> 
    <div class="serv-head mb-3"> 
      <?php if (get_theme_mod('expert_videographer_section_small_text')) : ?>
        <p class="small-title"><?php echo esc_html(get_theme_mod('expert_videographer_section_small_text')); ?></p>
      <?php endif; ?>
      <?php if (get_theme_mod('expert_videographer_section_title')) : ?>
        <h2 class="text-capitalize mt-2" id="section-title"><?php echo esc_html(get_theme_mod('expert_videographer_section_title')); ?></h2>
      <?php endif; ?> 
    </div>

    <div class="owl-carousel owl-theme">
      <?php
      $expert_videographer_post_category = get_theme_mod('expert_videographer_offer_section_category','uncategorized');
      if ($expert_videographer_post_category) :
        $expert_videographer_category_id = term_exists($expert_videographer_post_category, 'category');
        if ($expert_videographer_category_id !== 0 && $expert_videographer_category_id !== null) :
          $expert_videographer_posts_to_show = get_theme_mod('expert_videographer_posts_to_show', 4);
          $expert_videographer_page_query = new WP_Query(array(
            'category_name' => esc_attr($expert_videographer_post_category),
            'posts_per_page' => $expert_videographer_posts_to_show,
          ));

          $expert_videographer_post_count = 0;
          if ($expert_videographer_page_query->have_posts()) :
            while ($expert_videographer_page_query->have_posts()) : $expert_videographer_page_query->the_post(); 
              $expert_videographer_post_count++;
      ?>
              <div class="item wow zoomInUp" data-wow-delay="0.5s">
                <div class="serv-box">
                  <div class="row">
                    <div class="col-lg-5 col-md-12 align-self-center pe-lg-0">
                      <div class="inner-box-image">
                        <?php if (has_post_thumbnail()) : ?>
                          <img src="<?php echo esc_url(get_the_post_thumbnail_url(null, 'full')); ?>" />
                        <?php else : ?>
                          <div class="serv-color"></div>
                        <?php endif; ?>
                      </div>
                    </div>
                    <div class="col-lg-6 col-md-12 align-self-center ps-lg-0">
                      <div class="inner-box text-start p-lg-3 px-md-3 py-md-3 p-3">
                          <h3 class="mb-2 text-capitalize"><a href="<?php the_permalink(); ?>"><?php the_title(); ?></a></h3>
                          <div class="service-category-name mt-2">
                              <?php
                              $categories = get_the_category();
                              if ( ! empty( $categories ) ) {
                                  // Get the first category
                                  $first_category = $categories[0];
                                  echo '<a href="' . esc_url( get_category_link( $first_category->term_id ) ) . '">' . esc_html( $first_category->name ) . '</a>';
                              }
                              ?>
                          </div>
                          <p class="main-serv-content my-2"><?php echo wp_trim_words( get_the_content(),25 );?></p> 
                        
                          <div class="serv-social-media mt-4">
                              <?php 
                                  $expert_videographer_serv_facebook_url = get_theme_mod('expert_videographer_serv_facebook_url' . $expert_videographer_post_count);
                                      if ($expert_videographer_serv_facebook_url != '') { ?>
                                          <a target="_blank" href="<?php echo esc_url($expert_videographer_serv_facebook_url); ?>">
                                              <i class="fab fa-facebook-f me-2"></i>
                                          </a>
                              <?php } ?>
                              <?php 
                                  $expert_videographer_serv_twitter_url = get_theme_mod('expert_videographer_serv_twitter_url' . $expert_videographer_post_count);
                                      if ($expert_videographer_serv_twitter_url != '') { ?>
                                          <a target="_blank" href="<?php echo esc_url($expert_videographer_serv_twitter_url); ?>">
                                              <i class="fab fa-instagram me-2"></i>
                                          </a>
                              <?php } ?>
                              <?php 
                                  $expert_videographer_serv_insta_url = get_theme_mod('expert_videographer_serv_insta_url' . $expert_videographer_post_count);
                                      if ($expert_videographer_serv_insta_url != '') { ?>
                                          <a target="_blank" href="<?php echo esc_url($expert_videographer_serv_insta_url); ?>">
                                              <i class="fab fa-youtube me-2"></i>
                                          </a>
                              <?php } ?>
                              <?php 
                                  $expert_videographer_serv_youtube_url = get_theme_mod('expert_videographer_serv_youtube_url' . $expert_videographer_post_count);
                                      if ($expert_videographer_serv_youtube_url != '') { ?>
                                          <a target="_blank" href="<?php echo esc_url($expert_videographer_serv_youtube_url); ?>">
                                              <i class="fab fa-twitter me-2"></i>
                                          </a>
                              <?php } ?>

                          </div>
                      </div>
                    </div>
                  </div>
                </div>
              </div>
            <?php endwhile; ?>
            <?php wp_reset_postdata(); ?>
          <?php else : ?>
            <div class="no-postfound"></div>
          <?php endif; ?>
        <?php endif; ?>
      <?php endif; ?>
    </div>
  </div>
</section>
<?php endif; ?>