<?php

/**
 * Title: Footer with colophon, 4 columns
 * Slug: papacafe/footer
 * Categories: footer
 * Block Types: core/template-part/footer
 * Description: A footer section with a colophon and 4 columns.
 */
?>
<?php
$footer_sections = [
    'copyright' => get_option('footer_copyright', ''),
    'address' => get_option('footer_address', ''),
    'phone' => get_option('footer_phone', ''),
    'bc' => get_option('footer_bc', ''),
    'gmail' => get_option('footer_gmail', ''),
    'facebook' => get_option('footer_facebook', ''),
    'youtube' => get_option('footer_youtube', ''),
    'instagram' => get_option('footer_instagram', ''),
    //image
    'logo' => get_option('footer_logo', ''),
    'free_shipping' => get_option('footer_free_shipping', ''),
    'free_return' => get_option('footer_free_return', ''),
    'customer_service' => get_option('footer_customer_service', ''),
    'zalo_icon' => get_option('footer_zalo_logo', ''),
];
?>
<footer class="footer-section bg-grey pt-60">
    <div class="container">
        <div class="footer-items">
            <div class="footer-item item-2">
                <div class="icon">
                    <img src="<?php echo $footer_sections['free_shipping']; ?>"
                        alt="icon" loading="lazy">
                </div>
                <div class="content">
                    <h4 class="title">Miễn phí vận chuyển</h4>
                    <span>Đối với đơn hàng cafe trên 1.000.000 ₫ trong nội thành TPHCM</span>
                </div>
            </div>
            <div class="footer-item item-2">
                <div class="icon">
                    <img src="<?php echo $footer_sections['free_return']; ?>"
                        alt="icon" loading="lazy">
                </div>
                <div class="content">
                    <h4 class="title">Miễn phí đổi trả</h4>
                    <span class="mb-2">
                        - 3 ngày với cafe nếu không ưng ý và tiệm cafe Papa' sẽ mix lại tỷ lệ mới
                    </span>
                    <span>
                        - 15 ngày với đồ gỗ
                    </span>
                </div>
            </div>
            <div class="footer-item item-2">
                <div class="icon">
                    <img src="<?php echo $footer_sections['customer_service']; ?>"
                        alt="icon" loading="lazy">
                </div>
                <div class="content">
                    <h4 class="title">Dịch vụ chăm sóc khách hàng</h4>
                    <span> phản hồi trong khung giờ hành chính ngay - ngoài giờ thì nếu còn thức - Papa' sẽ trả lời
                        (Ngoài giờ Papa' chăm con nhỏ nên hơi bận mong Quý khách thông cảm!)</span>
                </div>
            </div>
        </div>
        <div class="row footer-widget-wrap pb-60">
            <div class="col-lg-4 col-md-6">
                <div class="footer-widget">
                    <div class="widget-header">
                        <h3 class="widget-title">Thông tin công ty</h3>
                    </div>
                    <!-- <img src="./Trang chủ - Đặc sản Việt Nam _ Cà phê, Đồ gỗ và Đặc sản 3 miền_files/da-thong-bao-bct.webp"
                        loading="lazy" alt="Đã thông báo Bộ Công Thương"> -->
                    <div>
                        Bản quyền thuộc về: <?php echo $footer_sections['copyright']; ?>
                        <br>
                        Địa chỉ: <?php echo $footer_sections['address']; ?>
                        <br>
                        Điện thoại: <a href="<?php echo $footer_sections['phone']; ?>"><?php echo $footer_sections['phone']; ?></a>
                        <br>
                        MSDN: <?php echo $footer_sections['bc']; ?> - Cấp bởi Sở KHĐT TP. Hồ Chí Minh
                    </div>
                </div>
            </div>
            <div class="col-lg-3 col-md-6">
                <div class="footer-widget">
                    <div class="widget-header">
                        <h3 class="widget-title">Liên hệ</h3>
                    </div>
                    <span>Có thắc mắc? Hãy liên hệ chúng tôi</span>
                    <div class="footer-contact">
                        <div class="icon"><i class="fa-sharp fa-solid fa-phone-volume"></i></div>
                        <div class="content">
                            <a href="tel: <?php echo $footer_sections['phone']; ?>"><?php echo $footer_sections['phone']; ?></a>
                        </div>
                    </div>
                    <div class="footer-contact mt-10">
                        <div class="icon"><i class="fa-sharp fa-solid fa-envelope"></i></div>
                        <div class="content">
                            <a href="mailto:<?php echo $footer_sections['gmail']; ?>"><?php echo $footer_sections['gmail']; ?></a>
                        </div>
                    </div>
                    <ul class="schedule-list">
                        <li><span>Thứ Hai - Thứ Sáu:</span>8:00 sáng - 6:00 tối</li>
                        <li><span>Thứ Bảy:</span>8:00 sáng - 6:00 tối</li>
                        <li><span>Chủ Nhật:</span> Nghỉ</li>
                    </ul>
                </div>
            </div>
            <div class="col-lg-2 col-md-6">
                <div class="footer-widget">
                    <div class="widget-header">
                        <h3 class="widget-title">Liên kết mạng xã hội</h3>
                    </div>
                    <ul class="footer-list social">
                        <li><i class="fa-brands fa-facebook-f"></i><a
                                href="<?php echo $footer_sections['facebook']; ?>">Facebook</a></li>
                        <li><i class="fa-brands fa-youtube"></i><a
                                href="<?php echo $footer_sections['youtube']; ?>">Youtube</a></li>
                        <li><i class="fa-brands fa-instagram"></i><a
                                href="<?php echo $footer_sections['instagram']; ?>">Instagram</a></li>
                    </ul>
                </div>
            </div>
            <div class="col-lg-3 col-md-6">
                <div class="footer-widget footer-col-4 d-flex justify-content-md-start justify-content-center">
                    <img src="<?php echo $footer_sections['logo']; ?>"
                        width="250" height="250" alt="Footer logo" loading="lazy">
                </div>
            </div>
        </div>
    </div>
    <div class="copyright-area">
        <div class="container">
            <div class="row copyright-content">
                <div class="col-lg-6 offset-lg-6">
                    <p>Copyright 2024 <span>©Vietnam Regional Specialities</span>. All Right Reserved</p>
                </div>
            </div>
        </div>
    </div>
</footer>
<!-- ./ footer-section -->

<div class="zalo-container" style="bottom: 40px;">
    <a id="zalo-btn" href="https://zalo.me/0815588181" target="_blank" rel="noopener nofollow">
        <div class="animated_zalo infinite zoomIn_zalo cmoz-alo-circle"></div>
        <div class="animated_zalo infinite pulse_zalo cmoz-alo-circle-fill"></div>
        <span><img src="<?php echo $footer_sections['zalo_icon']; ?>"
                alt="Contact Me on Zalo" width="50" height="50" loading="lazy"></span>
    </a>
</div>
<div id="scroll-percentage"
    style="background: conic-gradient(var(--rr-color-theme-primary) 0%, var(--rr-color-common-white) 0%);" class="">
    <span id="scroll-percentage-value">0%</span>
</div>
<?php wp_footer(); ?>
<script type="text/javascript">
    $(function() {
        const filter = 'nhung-cai-ban'
        if (filter) {
            scrollAndFilter('.' + filter)
        }
    })

    function scrollAndFilter(filterValue) {
        // Scroll to the filter section
        $('html, body').animate({
                scrollTop: $('#filter-section').offset().top
            },
            500
        )

        // Trigger the filter
        $('.project-filter li').removeClass('active')
        $('.project-filter li[data-filter="' + filterValue + '"]').addClass('active')

        const filterItems = $('.filter-items')
        filterItems
            .isotope({
                filter: filterValue,
                animationOptions: {
                    duration: 750,
                    easing: 'linear',
                    queue: false
                }
            })
            .one('arrangeComplete', function() {
                if (filterItems.hasClass('opacity-0')) {
                    filterItems.removeClass('opacity-0')
                }
            })
    }
</script>



<span class="glasp-extension"
    style="display: block; width: 320px; margin: unset; padding: unset; border: unset; border-radius: unset; outline: unset; background-color: unset; box-shadow: unset; position: fixed; top: 40px; right: 24px; z-index: 9999;"><template
        shadowrootmode="open">
        <div class="glasp-extension" style="font-family: Inter;">
            <div class="fixed top-15 right-6 z-50 flex flex-col items-end space-y-2"></div>
        </div>
    </template></span>
<div class="glasp-extension"
    style="display: block; width: unset; margin: unset; padding: unset; border: unset; border-radius: unset; outline: unset; background-color: unset; box-shadow: unset; position: fixed; bottom: 16px; right: 16px; z-index: 9999;">
    <template shadowrootmode="open">
        <div class="glasp-extension" style="font-family: Inter;"></div>
    </template>
</div>
</body>

</html>