<div class="responsive-menu">
    <a href="<?= home_url() ?>" class="logos">
        <?php get_template_part('parts/svg/logo') ?>
    </a>

    <?php wp_nav_menu(array('theme_location' => 'main-menu', 'menu_class' => 'responsive')) ?>

    <a href="tel:<?php echo str_replace(" ", "", get_field('phone', 'options')) ?>" class="contact phone">
        <i class="fa-solid fa-phone"></i>
        <span><?php the_field('phone', 'options') ?></span>
    </a>
    <a href="mailto:<?php the_field('email', 'options') ?>" class="contact email">
        <i class="fa-solid fa-envelope"></i>
        <span><?php the_field('email', 'options') ?></span>
    </a>
    <div class="social">
        <a href="<?php the_field('instagram', 'options') ?>" target="_blank">
            <i class="fa-brands fa-instagram"></i>
        </a>
        <a href="<?php the_field('facebook', 'options') ?>" target="_blank">
            <i class="fa-brands fa-square-facebook"></i>
        </a>
    </div>
</div>

<script>
    $(document).ready(function() {
        $("ul.responsive .menu-item-39").append('<span><i class="fa-solid fa-angle-down"></i></span>');

        $(".responsive-menu ul li span").on("click", function() {
            var obj = $(this).parent();
            $(this).parent().find("ul.sub-menu").fadeToggle("slow");
        });
    });
</script>