<?php
/*
Template Name: Fedex Integration
*/

get_header('new');
?>

<section class="section banner supply-chain-banner pb-5 no-lazy">
    <div class="container">
        <div class="row mt-xl-5 mt-lg-0">
            <div class="col-lg-6">
                <div class="text-cont mt-0">
                    <h1 class="banner-heading"><?php echo get_field('banner_heading'); ?></h1>
                    <p class="banner-content">
                        <?php echo get_field('banner_description'); ?>
                    </p>
					<?php $highlights = get_field('banner_highlights'); ?>
                    <ul>
                        <?php if ($highlights && is_array($highlights)) : ?>
                            <?php foreach ($highlights as $highlight) : ?>
                                <li>
                                    <img src="<?php echo get_template_directory_uri(); ?>/assets/img/apparel-inventory-management/tick.webp" alt="tick" class="img-fluid">
                                    <?php echo $highlight['item']; ?>
                                </li>
                            <?php endforeach; ?>
                        <?php endif; ?>
                    </ul>
                    <div class="banner-btns">
						<?php $cta_1 = get_field('banner_cta_1'); ?>
						 <?php if (!is_null($cta_1)) : ?>
                        <a href="<?php echo esc_url($cta_1['url']); ?>" class="primary animated-cta-btn <?php echo is_modal_link($cta_1['url']); ?>"><?php echo $cta_1['title']; ?></a>
						<?php endif; ?>
						<?php $cta_2 = get_field('banner_cta_2'); ?>
						<?php if (!is_null($cta_2)) : ?>
                        <a href="<?php echo esc_url($cta_2['url']); ?>" class="border-gradient-btn animated-btn <?php echo is_modal_link($cta_2['url']); ?>"><?php echo $cta_2['title']; ?>
                            <svg width="14" height="11" viewBox="0 0 14 11" fill="none" xmlns="http://www.w3.org/2000/svg">
                                <path d="M5.35816 0.0996094H7.95016L13.3502 5.49961L7.95016 10.8996H5.35816L9.82216 6.43561H0.660156V4.56361H9.82216L5.35816 0.0996094Z" fill="black"/>
                            </svg>
                        </a>
						<?php endif; ?>
                    </div>
                </div>
            </div>
            <div class="col-lg-6">
                <div class="img-cont">
					<?php
	$desktop_img_url = get_field('banner_image');
	$mobile_img_url  = get_field('banner_mobile_image');
?>
    <picture>
        <source class="no-lazy" media="(max-width: 767px)" srcset="<?php echo $mobile_img_url ? $mobile_img_url : $desktop_img_url ?>">
        <img src="<?php echo $desktop_img_url;?>" loading="eager" fetchpriority="high" decoding="async" width="636" height="490" class="img-fluid no-lazy" alt="<?php echo strip_tags(get_field('banner_heading')); ?>">
    </picture>
                </div>
            </div>
        </div>
    </div>
</section>

<!-- Certifications section start -->
<?php get_template_part('templates-parts/pages/certificates');?>
<!-- Certifications section end -->

<!-- why integrate fedex wms section start -->
<section class="section why-integrate-fedex bg-white pt-0">
  <div class="container">
    <div class="row justify-content-between align-items-start">
      <div class="col-lg-6 col-xl-5">
        <h2 class="section-title text-center text-lg-start">
          <?php the_field('why_integ_fedex_wms_section_title'); ?>
        </h2>
      </div>

      <div class="col-lg-6 col-xl-5">
        <p class="section-content text-center text-lg-start">
          <?php the_field('why_integ_fedex_wms_section_text'); ?>
        </p>
      </div>
    </div>

    <div class="row align-items-start g-4 mt-0 mt-lg-2 flex-column-reverse flex-lg-row">
      <div class="col-lg-6">
        <div class="features-wrap">
          <ul class="features">
            <?php if (have_rows('why_integ_fedex_wms_section_lists')) : ?>
              <?php while (have_rows('why_integ_fedex_wms_section_lists')) : the_row(); ?>
                <li class="feature-item">
                  <span class="icon-bubble" aria-hidden="true">
                    <?php the_sub_field('why_integ_fedex_wms_section_lists_icon'); ?>
                  </span>

                  <h3 class="feature-title">
                    <?php the_sub_field('why_integ_fedex_wms_section_lists_title'); ?>
                  </h3>

                  <p class="feature-text">
                    <?php the_sub_field('why_integ_fedex_wms_section_lists_text'); ?>
                  </p>
                </li>
              <?php endwhile; ?>
            <?php endif; ?>
          </ul>
        </div>

        <?php $btn = get_field('why_integ_fedex_wms_section_button'); ?>
        <div class="demo-btn-wrapper text-center text-lg-start mt-4 mt-lg-5">
          <?php if ($btn) : ?>
            <a href="<?php echo esc_url($btn['url']); ?>" class="primary animated-cta-btn">
              <?php echo $btn['title']; ?>
            </a>
        </div>
        <?php endif; ?>
        </div>

      <div class="col-lg-6">
        <div class="img-cont">
          <?php $img = get_field('why_integ_fedex_wms_section_image'); ?>
          <?php if ($img) : ?>
            <img src="<?php echo $img?>" alt="<?php wp_strip_all_tags(the_field('why_integ_fedex_wms_section_title'));?>" class="img-fluid" loading="lazy" width="636" height="485">
          <?php endif; ?>
        </div>
      </div>
    </div>
  </div>
</section>
<!-- why integrate fedex wms section end -->

<?php
$cta_text = get_field('dashboard_access_cta_text');
$btn_text = get_field('dashboard_access_cta_button_text');
$btn_url  = get_field('dashboard_access_cta_button_url');
$cta_img  = get_field('dashboard_access_cta_image');

$img_url = '';
$img_alt = '';

if (is_array($cta_img)) {
  $img_url = $cta_img['url'] ?? '';
  $img_alt = $cta_img['alt'] ?? '';
} elseif (is_numeric($cta_img)) {
  // IMPORTANT: handle numeric-string like "4505" too
  $img_id  = (int) $cta_img;
  $img_url = wp_get_attachment_url($img_id);
  $img_alt = get_post_meta($img_id, '_wp_attachment_image_alt', true);
} elseif (is_string($cta_img)) {
  // real URL string
  $img_url = $cta_img;
}

if (!empty(trim((string)$cta_text))) : ?>
<section class="section dashboard-access-cta wms-business-cta">
  <div class="container">
    <div class="box">
      <div class="row align-items-center">
        <div class="col-lg-6">
          <div class="img-cont slide-right">
            <?php if (!empty($img_url)): ?>
              <img src="<?php echo esc_url($img_url); ?>"
                   alt="<?php echo esc_attr($img_alt); ?>"
                   class="img-fluid" loading="lazy">
            <?php endif; ?>
          </div>
        </div>
        <div class="col-lg-6">
          <div class="text-cont slide-left">
            <?php echo wp_kses_post($cta_text); ?>

            <?php if (!empty($btn_text) && !empty($btn_url)): ?>
              <a href="<?php echo esc_url($btn_url); ?>" class="accent-btn animated-cta-btn">
                <?php echo esc_html($btn_text); ?>
              </a>
            <?php endif; ?>

          </div>
        </div>
      </div>
    </div>
  </div>
</section>
<?php endif; ?>


<!-- section how-wms-workflows start -->
<section class="section how-wms-workflows bg-white pt-0">
  <div class="container">

    <div class="text-cont">
      <h2 class="section-title text-center">
        <?php the_field('how_works_wms_workflows_section_title'); ?>
      </h2>

      <p class="section-content text-center">
        <?php the_field('how_works_wms_workflows_section_text'); ?>
      </p>
    </div>

    <div class="row gy-4">
      <?php if(have_rows('how_works_wms_workflows_cards_repeater')): $i=1; ?>
        <?php while(have_rows('how_works_wms_workflows_cards_repeater')): the_row(); ?>

          <div class="col-lg-4 col-md-6">
            <div class="wms-workflow-card">

              <div class="workflow-img">
                <img src="<?php echo get_sub_field('how_works_wms_workflows_card_image'); ?>" class="img-fluid" loading="lazy">
              </div>

              <div class="workflow-content">
                <div class="workflow-step">
                  <span><?php echo str_pad($i, 2, '0', STR_PAD_LEFT); ?></span>
                </div>

                <h3 class="workflow-title">
                  <?php the_sub_field('how_works_wms_workflows_card_title'); ?>
                </h3>

                <p class="workflow-text">
                  <?php the_sub_field('how_works_wms_workflows_card_text'); ?>
                </p>
              </div>

            </div>
          </div>

        <?php $i++; endwhile; ?>
      <?php endif; ?>
    </div>

    <?php $btn = get_field('how_works_wms_workflows_section_button'); ?>
    <?php if($btn): ?>
      <div class="demo-btn-wrapper text-center mt-4 mt-lg-5">
        <a href="<?php echo $btn['url']; ?>" class="primary animated-cta-btn">
          <?php echo $btn['title']; ?>
        </a>
      </div>
    <?php endif; ?>

  </div>
</section>
<!-- section how-wms-workflows  end-->


<!-- Multiples of Integration Section Start  -->
<section class="section multiples-of-integration">
  <div class="container">
    <div class="text-cont">
      <h2 class="section-title text-center">
        <?php the_field('integration_wms_cards_section_title'); ?>
      </h2>

      <p class="section-content text-center">
        <?php the_field('integration_wms_cards_section_text'); ?>
      </p>
    </div>

    <div class="row gy-4">
      <?php if (have_rows('integration_wms_cards_repeater')) : ?>
        <?php while (have_rows('integration_wms_cards_repeater')) : the_row(); ?>
          <?php $img = get_sub_field('integration_wms_cards_image'); ?>
          <div class="col-lg-4 col-md-6">
            <div class="integration-card">
              <div class="integration-logo">
                <?php if ($img) : ?>
                  <img src="<?php echo $img; ?>" alt="integration logo" class="img-fluid" loading="lazy">
                <?php endif; ?>
              </div>

              <p class="integration-text">
                <?php the_sub_field('integration_wms_cards_text'); ?>
              </p>
            </div>
          </div>
        <?php endwhile; ?>
      <?php endif; ?>
    </div>

    <?php $btn = get_field('integration_wms_cards_section_button'); ?>
    <div class="demo-btn-wrapper text-center mt-4 mt-lg-5">
      <?php if ($btn) : ?>
        <a href="<?php echo esc_url($btn['url']); ?>" class="primary animated-cta-btn">
          <?php echo $btn['title']; ?>
        </a>
      <?php endif; ?>
    </div>
  </div>
</section>
<!-- Multiples of Integration Section End  -->


<section class="section wms-amazon-success implementing-timeline bg-white">
  <div class="container">

    <div class="text-cont text-center">
      <h2 class="section-title"><?php the_field('wms_section_title'); ?></h2>
      <p class="section-content"><?php the_field('wms_section_description'); ?></p>
    </div>

    <?php if(have_rows('wms_tabs')): ?>
      <div class="responsive-tabs">
        <div class="row mt-lg-5">

          <!-- Tab Links -->
          <div class="col-lg-12">
            <ul class="nav nav-tabs" role="tablist">
              <?php $i=0; while(have_rows('wms_tabs')): the_row(); ?>
                <li class="nav-item">
                  <button id="tab-link-<?php echo $i; ?>"
                          data-bs-target="#tab-pane-<?php echo $i; ?>"
                          class="nav-link <?php echo $i==0?'active':''; ?>"
                          data-bs-toggle="tab" role="tab" type="button">
                    <?php the_sub_field('wms_tab_title'); ?>
                  </button>
                </li>
              <?php $i++; endwhile; ?>
            </ul>
          </div>

          <!-- Tab Content -->
          <div class="col-lg-12">
            <div id="tab-content-container" class="tab-content" role="tablist">

              <?php $i=0; while(have_rows('wms_tabs')): the_row(); ?>
                <div id="tab-pane-<?php echo $i; ?>"
                     class="card tab-pane fade <?php echo $i==0?'show active':''; ?>"
                     role="tabpanel" aria-labelledby="tab-link-<?php echo $i; ?>">

                  <div class="card-header" role="tab" id="heading-<?php echo $i; ?>">
                    <h5 class="mb-0">
                      <button class="<?php echo $i!=0?'collapsed':''; ?>"
                              data-bs-toggle="collapse"
                              data-bs-target="#collapse-<?php echo $i; ?>"
                              aria-expanded="<?php echo $i==0?'true':'false'; ?>"
                              aria-controls="collapse-<?php echo $i; ?>" type="button">
                        <?php the_sub_field('wms_tab_heading'); ?>
                      </button>
                    </h5>
                  </div>

                  <div id="collapse-<?php echo $i; ?>"
                       class="collapse <?php echo $i==0?'show':''; ?>"
                       data-bs-parent="#tab-content-container"
                       role="tabpanel" aria-labelledby="heading-<?php echo $i; ?>">

                    <div class="card-body">
                      <div class="powered-tools-wrapper">
                        <div class="row gy-3">
                          <div class="col-lg-6">
                            <div class="img-cont">
                              <?php $img = get_sub_field('wms_tab_image'); ?>
                              <?php if($img): ?>
                                <img src="<?php echo $img['url']; ?>"
                                     alt="<?php echo $img['alt']; ?>"
                                     class="img-fluid" loading="lazy">
                              <?php endif; ?>
                            </div>
                          </div>

                          <div class="col-lg-6">
                            <div class="powered-tools-content">
                              <p class="powered-tools-text"><?php the_sub_field('wms_tab_description'); ?></p>
                            </div>
                          </div>
                        </div>
                      </div>
                    </div>

                  </div>
                </div>
              <?php $i++; endwhile; ?>

            </div>
          </div>

        </div>
      </div>
    <?php endif; ?>

    <?php $btn = get_field('wms_amazon_section_button'); ?>
    <?php if($btn): ?>
      <div class="demo-btn-wrapper text-center mt-4 mt-lg-5">
        <a href="<?php echo esc_url($btn['url']); ?>" class="primary animated-cta-btn">
          <?php echo $btn['title']; ?>
        </a>
      </div>
    <?php endif; ?>
  </div>
</section>



<!-- industry benefits section start -->
<?php 
$industry = [
    'category' => 'fedex-wms-integration',
];
get_template_part('templates-parts/pages/industry-benefits',null,$industry)?>
<!-- industry benefits section end -->


<?php
$section_title = get_field('walmart_partnerships_section_title');
$section_content = get_field('walmart_partnerships_section_content');
$logo_rows = get_field('walmart_partnerships_logo_rows');
$cta_text = get_field('walmart_partnerships_cta_text');
$cta_link = get_field('walmart_partnerships_cta_link');
?>

<?php if ($section_title || $logo_rows): ?>
<section class="section powerful-partnerships walmart-wms-powerful-partnerships" style="background-color: #F6FAFF;">
    <div class="container">
        <div class="text-cont text-center">
            <?php if ($section_title): ?>
                <h2 class="section-title mb-4"><?php echo wp_kses_post($section_title); ?></h2>
            <?php endif; ?>

            <?php if ($section_content): ?>
                <p class="section-content"><?php echo esc_html($section_content); ?></p>
            <?php endif; ?>
        </div>
    </div>

    <?php if ($logo_rows): ?>
    <div class="container-fluid px-0">
        <div class="row">
            <div class="col-lg-12">
                <div class="logos-parent-wrapper">
                    <?php foreach ($logo_rows as $row_index => $row): ?>
                        <div class="logo-marquee">
                            <div class="marquee-content owl-partners <?php echo $row_index === 1 ? 'owl-partners-2' : ''; ?>">
                                <?php if (!empty($row['walmart_partnerships_logos'])): ?>
                                    <?php foreach ($row['walmart_partnerships_logos'] as $logo): ?>
                                        <?php $image = $logo['walmart_partnerships_logo_image']; ?>
                                        <?php if ($image): ?>
                                        <div class="item">
                                            <?php if (!empty($logo['walmart_partnerships_logo_link'])): ?>
                                                <a href="<?php echo esc_url($logo['walmart_partnerships_logo_link']); ?>">
                                                    <img src="<?php echo esc_url($image['url']); ?>" alt="<?php echo esc_attr($image['alt']); ?>" class="img-fluid" loading="lazy">
                                                </a>
                                            <?php else: ?>
                                                <img src="<?php echo esc_url($image['url']); ?>" alt="<?php echo esc_attr($image['alt']); ?>" class="img-fluid" loading="lazy">
                                            <?php endif; ?>
                                        </div>
                                        <?php endif; ?>
                                    <?php endforeach; ?>
                                <?php endif; ?>
                            </div>
                        </div>
                    <?php endforeach; ?>
                </div>
            </div>
        </div>

        <?php if ($cta_text): ?>
        <div class="demo-btn-wrapper text-center mt-4">
            <a href="<?php echo esc_url($cta_link);?>" class="primary animated-cta-btn">
                <?php echo $cta_text; ?>
            </a>
        </div>
        <?php endif; ?>
    </div>
    <?php endif; ?>
</section>
<?php endif; ?>


<!-- case studies start -->
<?php 
$portfolio = ['class' => 'bg-white'];
get_template_part('templates-parts/pages/case-studies',null,$portfolio);?>
<!-- case studies end -->


<!-- CTA start -->
<?php $ctas = [
    'class' => 'fedex-integration-cta pt-0',
    'heading_class' => 'cta-title',
    'para_class' => 'cta-description',
	'col_left_class' => 'col-lg-6',
    'col_right_class' => 'col-lg-6',
    'button_class' => 'accent-btn',
]; 
get_template_part('templates-parts/pages/3pl-client-portal-cta',null,$ctas);?>
<!-- CTA end -->


<?php
    $args = [
        'category' => 'fedex-wms-integration',
        'class'    => 'bg-white'
    ];
    get_template_part('templates-parts/pages/faqs-new', null, $args);
?>


<?php
get_footer();
?>


<script>
    $('.about-our-product-slider').owlCarousel({
        loop:false,
        margin:10,
        nav:false,
        dots: false,
        responsive:{
            0:{
                items:1
            },
            600:{
                loop:true,
                items:3
            },
            1000:{
                items:5
            }
        }
    });
    $('.real-feedback-slider').owlCarousel({
        loop:false,
        margin:40,
        nav:false,
        dots:false,
        dotsData:true,
        responsive:{
            0:{
                items:1
            },
            768:{
                items:2,
                margin:20
            },
            1000:{
                items:2
            }
        }
    });
    // industries benefits carousel
   $('.bigcommerce-industries-slider').owlCarousel({
        loop: true,
        margin: 20,
        nav: true,
        dots: false,
        navText: [
            `<svg width="20" height="13" viewBox="0 0 20 13" fill="none" xmlns="http://www.w3.org/2000/svg">
                <path d="M17.8516 5.18826C18.5419 5.18826 19.1016 5.7479 19.1016 6.43826C19.1016 7.12861 18.5419 7.68825 17.8516 7.68825L17.8516 6.43825L17.8516 5.18826ZM1.24915 7.68825C0.558798 7.68825 -0.000846863 7.12861 -0.000846863 6.43825C-0.000846863 5.7479 0.558798 5.18825 1.24915 5.18825V6.43825V7.68825ZM4.51982 0.362182C5.01015 -0.123791 5.8016 -0.12026 6.28757 0.370069C6.77355 0.860397 6.77001 1.65185 6.27969 2.13782L5.39976 1.25L4.51982 0.362182ZM3.57041 3.06309L4.45034 3.95091L3.57041 3.06309ZM3.57041 9.81341L2.69048 10.7012L3.57041 9.81341ZM6.27969 10.7387C6.77001 11.2247 6.77355 12.0161 6.28757 12.5064C5.8016 12.9968 5.01015 13.0003 4.51982 12.5143L5.39976 11.6265L6.27969 10.7387ZM1.26979 6.11312L0.0298233 5.95508V5.95507L1.26979 6.11312ZM1.26979 6.76338L0.0298233 6.92143V6.92143L1.26979 6.76338ZM17.8516 6.43825L17.8516 7.68825L1.24915 7.68825V6.43825V5.18825L17.8516 5.18826L17.8516 6.43825ZM5.39976 1.25L6.27969 2.13782L4.45034 3.95091L3.57041 3.06309L2.69048 2.17528L4.51982 0.362182L5.39976 1.25ZM3.57041 9.81341L4.45034 8.92559L6.27969 10.7387L5.39976 11.6265L4.51982 12.5143L2.69048 10.7012L3.57041 9.81341ZM3.57041 3.06309L4.45034 3.95091C3.70003 4.69456 3.21366 5.17927 2.88976 5.58259C2.58169 5.96619 2.52481 6.15312 2.50976 6.27117L1.26979 6.11312L0.0298233 5.95507C0.12709 5.19196 0.491079 4.57683 0.940529 4.01718C1.37414 3.47726 1.98192 2.87754 2.69048 2.17528L3.57041 3.06309ZM3.57041 9.81341L2.69048 10.7012C1.98192 9.99897 1.37414 9.39925 0.940529 8.85932C0.491079 8.29968 0.12709 7.68454 0.0298233 6.92143L1.26979 6.76338L2.50976 6.60534C2.52481 6.72339 2.58169 6.91032 2.88976 7.29391C3.21366 7.69723 3.70003 8.18195 4.45034 8.92559L3.57041 9.81341ZM1.26979 6.11312L2.50976 6.27117C2.49562 6.38213 2.49562 6.49438 2.50976 6.60534L1.26979 6.76338L0.0298233 6.92143C-0.0110703 6.6006 -0.0110703 6.27591 0.0298233 5.95508L1.26979 6.11312Z" fill="black"/>
            </svg>`,
            `<svg width="20" height="13" viewBox="0 0 20 13" fill="none" xmlns="http://www.w3.org/2000/svg">
                <path d="M1.25 5.18826C0.559644 5.18826 -6.17226e-08 5.7479 0 6.43826C6.17226e-08 7.12861 0.559644 7.68826 1.25 7.68826L1.25 6.43826L1.25 5.18826ZM17.8524 7.68825C18.5428 7.68825 19.1024 7.12861 19.1024 6.43825C19.1024 5.7479 18.5428 5.18825 17.8524 5.18825L17.8524 6.43825L17.8524 7.68825ZM14.5817 0.362182C14.0914 -0.123791 13.3 -0.12026 12.814 0.370069C12.328 0.860397 12.3315 1.65185 12.8219 2.13782L13.7018 1.25L14.5817 0.362182ZM15.5312 3.0631L14.6512 3.95091L14.6512 3.95091L15.5312 3.0631ZM15.5312 9.81341L16.4111 10.7012L16.4111 10.7012L15.5312 9.81341ZM12.8219 10.7387C12.3315 11.2247 12.328 12.0161 12.814 12.5064C13.3 12.9968 14.0914 13.0003 14.5817 12.5143L13.7018 11.6265L12.8219 10.7387ZM17.8318 6.11312L19.0717 5.95508L19.0717 5.95507L17.8318 6.11312ZM17.8318 6.76338L19.0717 6.92143L19.0717 6.92143L17.8318 6.76338ZM1.25 6.43826L1.25 7.68826L17.8524 7.68825L17.8524 6.43825L17.8524 5.18825L1.25 5.18826L1.25 6.43826ZM13.7018 1.25L12.8219 2.13782L14.6512 3.95091L15.5312 3.0631L16.4111 2.17528L14.5817 0.362182L13.7018 1.25ZM15.5312 9.81341L14.6512 8.92559L12.8219 10.7387L13.7018 11.6265L14.5817 12.5143L16.4111 10.7012L15.5312 9.81341ZM15.5312 3.0631L14.6512 3.95091C15.4015 4.69456 15.8879 5.17927 16.2118 5.58259C16.5199 5.96619 16.5768 6.15312 16.5918 6.27117L17.8318 6.11312L19.0717 5.95507C18.9745 5.19196 18.6105 4.57683 18.161 4.01718C17.7274 3.47726 17.1196 2.87754 16.4111 2.17528L15.5312 3.0631ZM15.5312 9.81341L16.4111 10.7012C17.1196 9.99897 17.7274 9.39925 18.161 8.85932C18.6105 8.29968 18.9745 7.68454 19.0717 6.92143L17.8318 6.76338L16.5918 6.60534C16.5768 6.72339 16.5199 6.91032 16.2118 7.29391C15.8879 7.69723 15.4015 8.18195 14.6512 8.92559L15.5312 9.81341ZM17.8318 6.11312L16.5918 6.27117C16.6059 6.38213 16.6059 6.49438 16.5918 6.60534L17.8318 6.76338L19.0717 6.92143C19.1126 6.6006 19.1126 6.27591 19.0717 5.95508L17.8318 6.11312Z" fill="black"/>
            </svg>`
        ],
        responsive: {
            0: { items: 1 },
            600: { items: 2.5 },
            1000: { items: 2.5 }
        }
    });
</script>

<script>
    // *********************************** Powerful Partnerships Logos Continious motion Animation Script Start ***********************************
    function createInfiniteScroll(containerSelector, speed, direction = "left") {
        const container = document.querySelector(containerSelector);
        const items = [...container.children];
        let animationFrameId = null;

        // Clone items to ensure infinite scroll
        items.forEach(item => {
            const clone = item.cloneNode(true);
            container.appendChild(clone);
        });

        // Calculate total width of items (including clones)
        let totalWidth = 0;
        [...container.children].forEach(item => {
            const style = window.getComputedStyle(item);
            const margin = parseFloat(style.marginLeft) + parseFloat(style.marginRight);
            totalWidth += item.offsetWidth + margin;
        });

        container.style.width = `${totalWidth}px`;

        let offset = 0;
        const step = speed / 60;

        function scroll() {
            offset += direction === "left" ? -step : step;

            // Reset offset to loop seamlessly
            if (direction === "left" && Math.abs(offset) >= totalWidth / 2) {
                offset = 0;
            } else if (direction === "right" && offset >= 0) {
                offset = -totalWidth / 2;
            }

            container.style.transform = `translateX(${offset}px)`;
            animationFrameId = requestAnimationFrame(scroll);
        }

        scroll();

        // Pause on hover
        container.addEventListener("mouseenter", () => {
            if (animationFrameId) cancelAnimationFrame(animationFrameId);
        });

        container.addEventListener("mouseleave", () => {
            scroll();
        });
    }

    document.addEventListener("DOMContentLoaded", () => {
        createInfiniteScroll('.owl-partners', 50, "left");  // Scroll left
        createInfiniteScroll('.owl-partners-2', 50, "right"); // Scroll right
    });
    // *********************************** Powerful Partnerships Logos Continious motion Animation Script End ***********************************
</script>