<?php
/**
 * Template part for displaying services section
 *
 * @package HR Staffing Agency
 * @subpackage hr_staffing_agency
 */


$hr_staffing_agency_static_image = get_template_directory_uri() . '/assets/images/post-img3.png';
$hr_staffing_agency_our_servs = get_theme_mod('hr_staffing_agency_our_servs_setting', true);

if ($hr_staffing_agency_our_servs == '1') {

  $hr_staffing_agency_tab1_cat = get_theme_mod('hr_staffing_agency_tab1_category');
  $hr_staffing_agency_tab2_cat = get_theme_mod('hr_staffing_agency_tab2_category');
?>

<section id="our-services" class="py-5 px-md-0 px-3">
  <div class="container overlap-container">

    <div class="text-center">
      <div class="match-heading position-relative text-center">

        <h2 class="serv-short mt-0 mb-3 text-capitalize">
          <?php echo esc_html(get_theme_mod('hr_staffing_agency_featured_section_title')); ?>
        </h2>

        <!-- TABS -->
        <div class="main-serv-btn mt-xl-5 mt-lg-3 mt-md-3 mt-2">
          <a href="#tab1"
             class="text-capitalize me-2 mb-md-0 mb-3 serv-btn1 tab-btn active"
             data-tab="tab1">
             <?php echo esc_html(get_theme_mod('hr_staffing_agency_serv_btn_text1','For Employers')); ?>
          </a>
          <a href="#tab2"
             class="mb-3 mb-md-0 serv-btn2 tab-btn"
             data-tab="tab2">
             <?php echo esc_html(get_theme_mod('hr_staffing_agency_serv_btn_text2','For Job Seekers')); ?>
          </a>
        </div>
      </div>
    </div>

    <!-- TAB 1 -->
    <div class="owl-carousel mt-4 mt-lg-5 tab-content tab1" style="display:block;">
      <?php
      $hr_staffing_agency_query1 = new WP_Query(array(
        'category_name' => esc_html($hr_staffing_agency_tab1_cat),
        'posts_per_page' => absint(get_theme_mod('hr_staffing_agency_tab1_posts', 3)),
      ));
      if ($hr_staffing_agency_query1->have_posts()) :
        while ($hr_staffing_agency_query1->have_posts()) : $hr_staffing_agency_query1->the_post();
      ?>
      <div class="mb-4">
        <div class="cat-inner-box overlap-item">
          <?php if (has_post_thumbnail()) { ?>
            <img src="<?php echo esc_url(get_the_post_thumbnail_url()); ?>" />
          <?php } else { ?>
            <img src="<?php echo esc_url($hr_staffing_agency_static_image); ?>" class="post-color" />
          <?php } ?>
          <div class="mainserv-content text-start">
            <?php 
            $hr_staffing_agency_icon_index = $hr_staffing_agency_query1->current_post + 1;

            $hr_staffing_agency_services_icon = get_theme_mod(
                'hr_staffing_agency_tab1_icon_' . $hr_staffing_agency_icon_index,
                'fas fa-users'
            );

            if (!empty($hr_staffing_agency_services_icon)) : ?>
                <div class="icon mb-1">
                    <i class="<?php echo esc_attr($hr_staffing_agency_services_icon); ?> main-icon"></i>
                </div>
            <?php endif; ?>

            <h3 class="mt-0 mb-3">
                <a href="<?php the_permalink(); ?>"><?php the_title(); ?></a>
            </h3>
            </div>
        </div>
      </div>
      <?php endwhile; wp_reset_postdata(); endif; ?>
    </div>

    <!-- TAB 2 -->
    <div class="owl-carousel mt-4 mt-lg-5 tab-content tab2" style="display:none;">
      <?php
      $hr_staffing_agency_query2 = new WP_Query(array(
        'category_name' => esc_html($hr_staffing_agency_tab2_cat),
        'posts_per_page' => absint(get_theme_mod('hr_staffing_agency_tab2_posts', 3)),
      ));
      if ($hr_staffing_agency_query2->have_posts()) :
        while ($hr_staffing_agency_query2->have_posts()) : $hr_staffing_agency_query2->the_post();
      ?>
      <div class="mb-4">
        <div class="cat-inner-box overlap-item">
          <?php if (has_post_thumbnail()) { ?>
            <img src="<?php echo esc_url(get_the_post_thumbnail_url()); ?>" />
          <?php } else { ?>
            <img src="<?php echo esc_url($hr_staffing_agency_static_image); ?>" class="post-color" />
          <?php } ?>
          <div class="mainserv-content text-start">
            <?php 
            $hr_staffing_agency_icon_index = $hr_staffing_agency_query2->current_post + 1;

            $hr_staffing_agency_services_icon = get_theme_mod(
                'hr_staffing_agency_tab2_icon_' . $hr_staffing_agency_icon_index,
                'fas fa-user-tie'
            );

            if (!empty($hr_staffing_agency_services_icon)) : ?>
                <div class="icon mb-1">
                    <i class="<?php echo esc_attr($hr_staffing_agency_services_icon); ?> main-icon"></i>
                </div>
            <?php endif; ?>

            <h3 class="mt-0 mb-3">
                <a href="<?php the_permalink(); ?>"><?php the_title(); ?></a>
            </h3>
        </div>
        </div>
      </div>
      <?php endwhile; wp_reset_postdata(); endif; ?>
    </div>

  </div>
</section>

<?php } ?>