<?php
// css below for Checkout flow... probably belongs in the SCSS
?>
<style>
    .cart-summary {
        background-color: #f4f4f4;
    }

    .cart-summary .image-wrapper {
        width: 100%;
    }

    .bi-check {
        font-size: 2rem;
    }

    .image-wrapper img {
        display: block;
        margin: 0 auto;
        width: 60%;
    }

    .woocommerce-order-received .woocommerce-order-details {
        display: none;
        visibility: hidden;
    }
</style>

<?php
wp_footer();

$stylesheet = get_field('style_sheet');
// default to consumer brand if we don't have the ACF option for the current page
if (!$stylesheet) {
    $stylesheet = "consumer-brand";
}
$company_logo = get_field('footer_company_logo', 'option');
$facebook_url = get_field('facebook_url', 'option');
$linkedin_url = get_field('linkedin_url', 'option');
$youtube_url = get_field('youtube_url', 'option');
$consumer_phone_number = get_field('consumer_phone_number', 'option');
$business_phone_number = get_field('business_phone_number', 'option');
$copyright_info = get_field('copyright_info', 'option');
$privacy_policy_link = get_field('privacy_policy_link', 'option');
$terms_of_use_link = get_field('terms_of_use_link', 'option');
$sitemap_link = get_field('sitemap_link', 'option');
$incident_report_link = get_field('incident_report_link', 'option');
$consumer_disclaimer = get_field('consumer_disclaimer', 'option');
$business_disclaimer = get_field('business_disclaimer', 'option');
$caution_info = get_field('caution_info', 'option');
$banner_bottom = get_field('banner_bottom', 'option');
$banner_link = get_field('banner_link', 'option');
$col_1_consumer_menu_title = get_field('col_1_consumer_menu_title', 'option');
$col_2_consumer_menu_title = get_field('col_2_consumer_menu_title', 'option');
$col_3_consumer_menu_title = get_field('col_3_consumer_menu_title', 'option');
$col_4_consumer_menu_title = get_field('col_4_consumer_menu_title', 'option');

?>

<footer class="site-footer <?php echo $stylesheet; ?>">
    <div class="footer-wrapper bg-color-navy-sky pt-5 pb-2">
        <div class="container">
            <div class="d-flex justify-content-center pb-2 mt-1">
                <img class="img-fluid footer-logo" src="<?php echo $company_logo['url']; ?>" alt="<?php echo $company_logo['alt']; ?>" />
            </div>
            <div class="row">
                <div class="text-xs-center text-md-start col-md-3 mt-3">
                    <h6 class="text-uppercase text-white opacity-75 m-0"><?php echo $col_1_consumer_menu_title; ?></h6>
                    <?php
                    wp_nav_menu(array(
                        'theme_location' => 'col-one-consumer-menu',
                        'container' => false,
                        'menu_class' => '',
                        'fallback_cb' => '__return_false',
                        'items_wrap' => '<ul id="%1$s" class="footer-nav-list %2$s">%3$s</ul>',
                        'depth' => 2,
                        'walker' => new bootstrap_5_wp_nav_menu_walker()
                    ));
                    ?>
                </div>
                <div class="text-xs-center text-md-start col-md-3 mt-3">
                    <h6 class="text-uppercase text-white opacity-75 m-0"><?php echo $col_2_consumer_menu_title; ?></h6>
                    <?php
                    wp_nav_menu(array(
                        'theme_location' => 'col-two-consumer-menu',
                        'container' => false,
                        'menu_class' => '',
                        'fallback_cb' => '__return_false',
                        'items_wrap' => '<ul id="%1$s" class="footer-nav-list %2$s">%3$s</ul>',
                        'depth' => 2,
                        'walker' => new bootstrap_5_wp_nav_menu_walker()
                    ));
                    ?>
                </div>
                <div class="text-xs-center text-md-start col-md-3 mt-3">
                    <h6 class="text-uppercase text-white opacity-75 m-0"><?php echo $col_3_consumer_menu_title; ?></h6>
                    <?php
                    wp_nav_menu(array(
                        'theme_location' => 'col-three-consumer-menu',
                        'container' => false,
                        'menu_class' => '',
                        'fallback_cb' => '__return_false',
                        'items_wrap' => '<ul id="%1$s" class="footer-nav-list %2$s">%3$s</ul>',
                        'depth' => 2,
                        'walker' => new bootstrap_5_wp_nav_menu_walker()
                    ));
                    ?>
                </div>
                <div class="text-xs-center text-md-start col-md-3 mt-3">
                    <h6 class="text-uppercase text-white opacity-75 m-0"><?php echo $col_4_consumer_menu_title ?></h6>
                    <h3 class="text-nowrap text-white footer-phone">
                        <i class="fa-solid fa-phone-volume color-white" aria-hidden="true" style="padding-top: 4px; padding-right: 4px;"></i>
                        <?php if ($stylesheet == 'consumer-brand') : ?>
                            <a class="text-decoration-none text-white" href="tel:<?php echo $consumer_phone_number; ?>"><?php echo $consumer_phone_number; ?></a>
                        <?php else : ?>
                            <a class="text-decoration-none text-white" href="tel:<?php echo $business_phone_number; ?>"><?php echo $business_phone_number; ?></a>
                        <?php endif; ?>
                    </h3>

                    <div class="d-flex social-icons">
                        <div class="me-3">
                            <a arialabel="Facebook" href="<?php echo $facebook_url; ?>">
                                <i class="fa-brands fa-facebook" aria-hidden="true" title="Link to Medicalalert Facebook page"></i>
                            </a>
                        </div>
                        <div class="me-3">
                            <a aria-label="LinkedIn" href="<?php echo $linkedin_url; ?>">
                                <i class="fa-brands fa-linkedin" aria-hidden="true" title="Link to Medicalalert LinkedIn page"></i>
                            </a>
                        </div>
                        <div>
                            <a aria-label="YouTube" href="<?php echo $youtube_url; ?>">
                                <i class="fa-brands fa-youtube" aria-hidden="true" title="Link to Medicalalert YouTube page"></i>
                            </a>
                        </div>
                    </div>
                </div>
            </div>

            <div class="row w-100 pt-4">
                <div class="col">
                    <div class="text-white text-center">
                        <a class="text-decoration-none text-white fs-xs" href="<?php echo $privacy_policy_link['url']; ?>">Privacy Policy</a><span class="px-2">|</span>
                        <a class="text-decoration-none text-white fs-xs" href="<?php echo $terms_of_use_link['url']; ?>">Terms of Use</a><span class="px-2">|</span>
                        <a class="text-decoration-none text-white fs-xs" href="<?php echo $sitemap_link['url']; ?>">Sitemap</a><span class="px-2">|</span>
                        <a class="text-decoration-none text-white fs-xs" href="<?php echo $incident_report_link['url']; ?>">Submit Incident Report</a><span class="px-2"></span>
                    </div>
                </div>
            </div>

            <div class="row w-100 p-1">
                <div class="col">
                    <div class="text-white text-center fs-xs">© <?php echo date("Y"); ?> <?php echo $copyright_info; ?><span class="px-2"></div>
                </div>
            </div>
        </div>
    </div>
    <div class="footer-bottom pl-5">
        <div class="container">
            <div class="row">
                <div class="col fs-xs">
                    <?php echo $consumer_disclaimer; ?>
                </div>
            </div>
            <div class="row">
                <div class="col fs-xs">
                    <?php echo $caution_info; ?>
                </div>
            </div>
        </div>
    </div>
</footer>


<?php if ($banner_bottom && $stylesheet == 'consumer-brand') : ?>
    <div class="fixed-bottom py-1 banner-bottom">
        <div class="container-fluid banner-bottom-wrapper">
            <div class="row">
                <div class="col-12 p-0">
                    <?php if ($banner_link) : ?>
                        <a class="text-white banner-bottom-link" href="<?php echo $banner_link['url'] ?>">
                            <h5 class="text-white m-0 banner-bottom-text">
                                <?php echo $banner_bottom; ?>
                                <span class="text-nowrap banner-link-title"><?php echo $banner_link['title'] ?></span>
                            </h5>
                        </a>
                    <?php endif; ?>
                    <i class="fa fa-window-close banner-bottom-close" aria-hidden="true"></i>
                </div>
            </div>
        </div>
    </div>
<?php endif; ?>

<script>
    $(window).on('load', function() {
        $bannerBottom = $('.banner-bottom');
        $bannerBottomClose = $('.banner-bottom-close');

        $bannerBottomClose.on('click', function() {
            $bannerBottom.fadeOut();
            sessionStorage.setItem('bannerBottom', 'shown');
        });

        if (!sessionStorage.getItem('bannerBottom')) {
            $bannerBottom.show();
        }
    });
</script>

<script type="text/javascript" src="//cdn.jsdelivr.net/gh/kenwheeler/slick@1.8.1/slick/slick.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.1.1/js/all.min.js" integrity="sha512-6PM0qYu5KExuNcKt5bURAoT6KCThUmHRewN3zUFNaoI6Di7XJPTMoT6K0nsagZKk2OB4L7E3q1uQKHNHd4stIQ==" crossorigin="anonymous" referrerpolicy="no-referrer"></script>
</body>

</html>