    <!-- Footer Start -->
    <section class="final-footer">
        <div class="container-fluid  text-light footer pt-5 mt-5 wow fadeIn" data-wow-delay="0.1s">
            <div class="container py-3">
                <div class="row g-5">

                    <div class="col-lg-3 col-md-6">
                        <!-- <h4 class="text-white mb-3">About Us</h4> -->
                        <img src="img/icon/footer.png" alt="" style="width: 130px; height: 80px;">

                        <p class="mt-3">KWIKSTOP RECYCLING SOLUTIONS Pvt. Ltd. is an initiative started to remove the complexity out of the process of electronic assets management & recycling.
                        </p>
                        
                        <div class="d-flex pt-2">
                            
                             <a class="btn btn-outline-light btn-social" href="https://www.facebook.com/kwikstoprecycling%20%20"><i class="fab fa-facebook-f"></i></a>
                             
                            <a class="btn btn-outline-light btn-social" href="https://www.instagram.com/kwikstoprecycling/?igsh=MWlkNzh5a29oZ3F2YQ%3D%3D&utm_source=qr"target="_blank"><i class="fab fa-instagram"></i></a>
                            
                            <a class="btn btn-outline-light btn-social" href="#"><i class="fab fa-linkedin-in"></i></a>
                            
                            <a class="btn btn-outline-light btn-social" href="https://www.youtube.com/watch?v=lCXOJgCJtr4" target="_blank"><i class="fab fa-youtube"></i></a>
                            
                            </div>
                        
                    </div>


                    <div class="col-lg-2 col-5">
                        <h4 class="text-white mb-3">Quick Link</h4>
                        <a class="btn btn-link" href="<?php path() ?>">Home</a>
                        <a class="btn btn-link" href="<?php path() ?>/about">About Us</a>
                        
                        <a class="btn btn-link" href="<?php path() ?>/gallery">Gallery</a>
                        
                        <a class="btn btn-link" href="<?php path() ?>/blog">Blog</a>
                        
                        <a class="btn btn-link" href="<?php path() ?>/career">Career</a>
                        
                        <a class="btn btn-link" href="<?php path() ?>/contact">Contact Us</a>

                    </div>


                    <div class="col-lg-3 col-7">
                        <h4 class="text-white mb-3">Resources</h4>
                        <!--<a class="btn btn-link" href="">Garbage Pickup</a>-->
                        <!--<a class="btn btn-link" href="">Dumpster Rental</a>-->
                        <?php
                        $ser = mysqli_query($conn, "SELECT * FROM tbl_service where category='Resources'");
                        while($rof = mysqli_fetch_array($ser))
                        {
                            $service = $rof['title'];
                            $slug = $rof['slug'];
                        ?>
                        <a class="btn btn-link" href="<?php path(); ?>/<?php echo $slug; ?>"><?php echo $service; ?></a>
                        <?php
                        }
                        ?>
                    </div>



                    <div class="col-lg-4 col-md-6">
                        <h4 class="text-white mb-3">Contact</h4>
                        
                        <p class="mb-2"> <a href="https://maps.app.goo.gl/JwY7HtcTyTC8fJj76" target=_"blank" style="color:white;"> <i class="fa fa-map-marker-alt me-3"></i>Unit 1: I - 3 UPSIDC Sikandrabad Industrial Area,Dist bulandshahar 203206 </a></p>
                        
                        <p class="mb-2"> <a href="https://maps.app.goo.gl/5ST1NF1BT6P5HamC8" style="color:white;"> <i class="fa fa-map-marker-alt me-3"></i>Unit 2: A3 - 32, Gopalpur Industrial Area Sikandrabad Dist bulandshahar 203205 </a></p>
                        
                        
                        <p class="mb-2"> <a href="tel:18001209022" style="color:white;"> <i class="fa-solid fa-phone me-3"></i>1800-120-9022 </a> </p>
                        
                        
                        <p class="mb-2"> <a href="tel:+91-9654936111" style="color:white;"> <i class="fa-solid fa-phone me-3"></i>+91-9654936111 </a> </p>
                        
                        <p class="mb-2">  <a href="mailto:info@kwikrecycle.com" style="color:white;"> <i class="fa fa-envelope me-3"></i>info@kwikrecycle.com </a> </p>

                        
                    </div>
                </div>
            </div>

            <div class="container">
                <div class="copyright">
                    <div class="row">
                        <div class="col-md-12 text-center  mb-3 mb-md-0">
                            &copy; All Right Reserved.
                            Designed & Developed By <a class="border-bottom" href="https://wedigitalindia.com/" target="_blank">Wedigital India</a>
                        </div>

                    </div>
                </div>
            </div>

        </div>
    </section>
    <!-- Footer End -->



    <!-- whatsapp icon starts here -->

    <a href="https://api.whatsapp.com/send?phone=+919654936111&text=Hey." class="whatsapp" target="_blank">
        Chat Now
    </a>


    <a href="https://api.whatsapp.com/send?phone=+919654936111&text=Hey." class="whatsapp-btn" target="_blank">
        <i class="fa-brands fa-whatsapp my-float"></i>
    </a>
    <!-- whatsapp icon starts here -->




    <!-- calling button starts here -->

    <a href="tel:+91-9654936111" class="call-now" target="_blank">
        Call Now
    </a>


    <section class="call-btn">
        <a class="telephone" href="tel:+91-9654936111"><i class="fa fa-phone"></i><span class="num"></span>
        </a>
    </section>
    <!-- calling button starts here -->


    <!-- Back to Top -->
    <!-- <a href="#" class="btn btn-lg btn-primary btn-lg-square back-to-top"><i class="bi bi-arrow-up"></i></a> -->
    <!-- Back to Top -->


    <!-- JavaScript Libraries -->
    <script src="https://code.jquery.com/jquery-3.4.1.min.js"></script>
    <script src="https://cdn.jsdelivr.net/npm/bootstrap@5.0.0/dist/js/bootstrap.bundle.min.js"></script>
    <script src="<?php path() ?>/lib/wow/wow.min.js"></script>
    <script src="<?php path() ?>/lib/easing/easing.min.js"></script>
    <script src="<?php path() ?>/lib/waypoints/waypoints.min.js"></script>
    <script src="<?php path() ?>/lib/owlcarousel/owl.carousel.min.js"></script>

    <!-- ==== gallery ==== -->
    <script src="https://cdnjs.cloudflare.com/ajax/libs/fancybox/3.5.7/jquery.fancybox.min.js"></script>


    <!-- Template Javascript -->
    <script src="<?php path() ?>/js/main.js"></script>
    
    <script>
    function checkInputPhoneValidation(element) {
  let phoneNumber = element.value.replace(/\D/g, ''); // Filter to numbers
  if (phoneNumber.length > 10) {
    phoneNumber = phoneNumber.substr(0, 10); // Keep only the first 10 digits
  }
  element.value = phoneNumber;

  // Display warning if the phone number is less than 10 characters
  const warningElement = element.parentNode.querySelector('span.warning');
  if (phoneNumber.length < 10 && phoneNumber.length > 0) {
    if (!warningElement) {
      const warning = document.createElement('span');
      warning.textContent = 'The phone number should consist of 10 digits.';
      warning.style.color = 'red';
      warning.classList.add('warning');
      element.parentNode.appendChild(warning);
    }
    element.removeAttribute('valid'); // Remove 'valid' attribute if not meeting rules
    // or can use: element.setAttribute('valid', 'false');
  } else if (phoneNumber.length < 10 && element.hasAttribute('required') && element.getAttribute('required').toLowerCase() !== 'false') {
    element.removeAttribute('valid');
    // or can use: element.setAttribute('valid', 'false');
  } else {
    if (warningElement) {
      warningElement.remove();
    }
    element.setAttribute('valid', 'true'); // Add 'valid' attribute if meeting rules
  }
}

function addInputPhoneValidation(element) {
  element.addEventListener('input', function () {
    checkInputPhoneValidation(this);
  });
}

/**
 * Querying all input fields with the 'phone' class
 * and associating an event listener with each of them.
 */
const phoneElements = document.querySelectorAll('input.phone');
phoneElements.forEach((phoneElement) => {
  addInputPhoneValidation(phoneElement);
  // Perform initial validation without triggering the input event
  checkInputPhoneValidation(phoneElement);
});

/**
 * Function to log the 'phoneElements' to the console
 * - JUST DEBUG FUNCTION
 */
function logPhoneElements() {
  document.querySelectorAll('input.phone').forEach((e) => console.log(e, `- Valid? ${isValidInputPhone(e)}`));
}

/**
 * Function to check if the input phone field is valid
 * - The input element to check
 * - True if valid, false otherwise
 */
function isValidInputPhone(element) {
  if (element.hasAttribute('required') && element.getAttribute('required').toLowerCase() !== 'false') {
    return element.value.length === 10 && Boolean(element.getAttribute('valid'));
  } else {
    return Boolean(element.getAttribute('valid'));
  }
}

/**
 * Submit function that checks if all input phone fields are valid
 */

</script>