<footer class="site-footer">

   
    <div class="container">
        <div class="footer-grid">

          
            <div class="footer-about f1">
                <?php 
                $footer_logo = get_field('footer_logo', 'option');
                if ( $footer_logo ) : ?>
                    <a href="<?php echo esc_url(home_url('/')); ?>">
                        <img src="<?php echo esc_url($footer_logo['url']); ?>" alt="<?php echo esc_attr($footer_logo['alt']); ?>" class="footer-logo">
                    </a>
                <?php endif; ?>

                <?php if ( get_field('footer_description', 'option') ) : ?>
                    <p><?php the_field('footer_description', 'option'); ?></p>
                <?php endif; ?>

                <div class="social">
                    <?php if ( get_field('footer_facebook', 'option') ) : ?>
                        <a href="<?php the_field('footer_facebook', 'option'); ?>" target="_blank"><img src="<?php bloginfo('template_url'); ?>/assets/img/facebook.webp" alt=""></a>
                    <?php endif; ?>

                    <?php if ( get_field('footer_instagram', 'option') ) : ?>
                        <a href="<?php the_field('footer_instagram', 'option'); ?>" target="_blank"><img src="<?php bloginfo('template_url'); ?>/assets/img/instagram.webp" alt=""></a>
                    <?php endif; ?>
                </div>
            </div>

            
            <div class="footer-links f2">
                <?php
                wp_nav_menu([
                    'theme_location' => 'footer_menu',
                    'container'      => false,
                    'items_wrap'     => '<ul>%3$s</ul>',
                ]);
                ?>
            </div>
			
			<div class="footer-links f3">
                <?php
                wp_nav_menu([
                    'theme_location' => 'services_menu',
                    'container'      => false,
                    'items_wrap'     => '<ul>%3$s</ul>',
                ]);
                ?>
            </div>

            
            <div class="footer-contact f4">

                <?php if ( get_field('header_address', 'option') ) : ?>
                <div class="contact-item">
                    <img src="<?php bloginfo('template_url'); ?>/assets/img/location.webp" alt="">
                    <span><?php the_field('header_address', 'option'); ?></span>
                </div>
                <?php endif; ?>

                <?php if ( get_field('footer_email', 'option') ) : ?>
                <div class="contact-item">
                    <img src="<?php bloginfo('template_url'); ?>/assets/img/envelope.webp" alt="">
                    <a href="mailto:<?php the_field('footer_email', 'option'); ?>">
                        <?php the_field('footer_email', 'option'); ?>
                    </a>
                </div>
                <?php endif; ?>

                <?php 
                $phone = get_field('header_phone', 'option');
                if ( $phone ) :
                    $phone_link = preg_replace('/[^0-9+]/', '', $phone);
                ?>
                <div class="contact-item">
                    <img src="<?php bloginfo('template_url'); ?>/assets/img/phone.webp" alt="">
                    <a href="tel:<?php echo esc_attr($phone_link); ?>">
                        <?php echo esc_html($phone); ?>
                    </a>
                </div>
                <?php endif; ?>

            </div>

        </div>
    </div>

   
    <div class="container">
        <div class="footer-divider"></div>
    </div>

   
    <div class="footer-bottom">
        <?php the_field('footer_copyright', 'option'); ?>
    </div>

    

</footer>



   <!--footer-->    
    <script src="https://code.jquery.com/jquery-3.6.0.min.js"></script>
    <script>
        document.addEventListener("DOMContentLoaded", function() {

  const menuToggle = document.getElementById("customMenuToggle");
  const mobileMenu = document.getElementById("customMobileMenu");
  const menuClose  = document.getElementById("customMenuClose");

  menuToggle.addEventListener("click", function() {
    mobileMenu.classList.add("custom-active");
  });

  menuClose.addEventListener("click", function() {
    mobileMenu.classList.remove("custom-active");
  });

  // ---------- Submenu Toggle ----------
  const menuItems = document.querySelectorAll(".custom-menu-list li");

  menuItems.forEach(item => {
    if (item.querySelector(".sub-menu")) {
      item.classList.add("has-child");

      item.querySelector("a").addEventListener("click", function(e) {
        e.preventDefault();
        item.classList.toggle("custom-active");
      });
    }
  });

});

    </script>


<?php wp_footer(); ?>