
<!-- ======================== FOOTER ======================== -->
<footer class="footer bg-dark text-white pt-5 pb-3 mt-5">
    <div class="container">
        <div class="row g-4">
            <div class="col-lg-4 col-md-6">
                <h5 class="fw-bold mb-3"><?= htmlspecialchars($settings['site_name']??'KURSI JOK') ?></h5>
                <p class="text-secondary small"><?= htmlspecialchars($settings['footer_about']??'') ?></p>
                <div class="d-flex gap-2 mt-3">
                    <?php if (!empty($settings['facebook'])): ?><a href="<?= $settings['facebook'] ?>" target="_blank" class="btn btn-sm btn-outline-secondary rounded-circle p-0" style="width:34px;height:34px;line-height:32px;text-align:center;"><i class="bi bi-facebook"></i></a><?php endif; ?>
                    <?php if (!empty($settings['instagram'])): ?><a href="<?= $settings['instagram'] ?>" target="_blank" class="btn btn-sm btn-outline-secondary rounded-circle p-0" style="width:34px;height:34px;line-height:32px;text-align:center;"><i class="bi bi-instagram"></i></a><?php endif; ?>
                    <?php if (!empty($settings['twitter'])): ?><a href="<?= $settings['twitter'] ?>" target="_blank" class="btn btn-sm btn-outline-secondary rounded-circle p-0" style="width:34px;height:34px;line-height:32px;text-align:center;"><i class="bi bi-twitter-x"></i></a><?php endif; ?>
                    <?php if (!empty($settings['youtube'])): ?><a href="<?= $settings['youtube'] ?>" target="_blank" class="btn btn-sm btn-outline-secondary rounded-circle p-0" style="width:34px;height:34px;line-height:32px;text-align:center;"><i class="bi bi-youtube"></i></a><?php endif; ?>
                </div>
            </div>
            <div class="col-lg-2 col-md-6 col-6">
                <h6 class="fw-semibold mb-3 text-uppercase" style="font-size:.8rem;letter-spacing:.05em;" data-en="Quick Links" data-id="Tautan Cepat">Quick Links</h6>
                <ul class="list-unstyled small">
                    <li class="mb-1"><a href="index.php" class="text-secondary text-decoration-none hover-white" data-en="Home" data-id="Beranda">Home</a></li>
                    <li class="mb-1"><a href="about.php" class="text-secondary text-decoration-none hover-white" data-en="About Us" data-id="Tentang Kami">About Us</a></li>
                    <li class="mb-1"><a href="product.php" class="text-secondary text-decoration-none hover-white" data-en="Product" data-id="Produk">Product</a></li>
                    <li class="mb-1"><a href="brand.php" class="text-secondary text-decoration-none hover-white" data-en="Brand" data-id="Brand">Brand</a></li>
                    <li class="mb-1"><a href="our-project.php" class="text-secondary text-decoration-none hover-white" data-en="Our Project" data-id="Proyek Kami">Our Project</a></li>
                </ul>
            </div>
            <div class="col-lg-2 col-md-6 col-6">
                <h6 class="fw-semibold mb-3 text-uppercase" style="font-size:.8rem;letter-spacing:.05em;" data-en="Services" data-id="Layanan">Services</h6>
                <ul class="list-unstyled small">
                    <li class="mb-1"><a href="product.php?cat=automotive" class="text-secondary text-decoration-none">Automotive</a></li>
                    <li class="mb-1"><a href="product.php?cat=interior" class="text-secondary text-decoration-none">Interior</a></li>
                    <li class="mb-1"><a href="product.php?cat=marine" class="text-secondary text-decoration-none">Marine</a></li>
                    <li class="mb-1"><a href="price.php" class="text-secondary text-decoration-none" data-en="Price List" data-id="Daftar Harga">Price List</a></li>
                    <li class="mb-1"><a href="catalog.php" class="text-secondary text-decoration-none" data-en="Catalog" data-id="Katalog">Catalog</a></li>
                </ul>
            </div>
            <div class="col-lg-4 col-md-6">
                <h6 class="fw-semibold mb-3 text-uppercase" style="font-size:.8rem;letter-spacing:.05em;" data-en="Contact Us" data-id="Hubungi Kami">Contact Us</h6>
                <ul class="list-unstyled small text-secondary">
                    <li class="mb-2 d-flex gap-2"><i class="bi bi-geo-alt-fill text-accent mt-1 flex-shrink-0"></i><?= nl2br(htmlspecialchars($settings['site_address']??'')) ?></li>
                    <li class="mb-2 d-flex gap-2"><i class="bi bi-telephone-fill text-accent flex-shrink-0"></i><?= htmlspecialchars($settings['site_phone']??'') ?></li>
                    <li class="mb-2 d-flex gap-2"><i class="bi bi-envelope-fill text-accent flex-shrink-0"></i><?= htmlspecialchars($settings['site_email']??'') ?></li>
                </ul>
            </div>
        </div>
        <hr class="border-secondary mt-4">
        <div class="row align-items-center">
            <div class="col-md-6 text-center text-md-start">
                <small class="text-secondary">&copy; <?= date('Y') ?> <?= htmlspecialchars($settings['site_name']??'Kursi Jok') ?>. All rights reserved.</small>
            </div>
            <div class="col-md-6 text-center text-md-end">
                <small class="text-secondary"><a href="admin/" class="text-secondary text-decoration-none">Admin Panel</a></small>
            </div>
        </div>
    </div>
</footer>

<!-- ======================== FLOATING BUTTONS ======================== -->
<!-- WhatsApp Button - Bottom Left -->
<a href="https://wa.me/<?= htmlspecialchars($settings['site_whatsapp']??'') ?>?text=Halo%2C+saya+ingin+bertanya+tentang+produk+Anda" 
   target="_blank" class="float-btn float-wa" title="Chat WhatsApp" id="waBtn">
    <i class="bi bi-whatsapp"></i>
    <span class="float-btn-label" data-en="WhatsApp Us" data-id="Chat WhatsApp">Chat WhatsApp</span>
</a>

<!-- Popup/Info Button - Bottom Right -->
<button class="float-btn float-popup" onclick="showPopup()" title="Promo & Info" id="popupBtn">
    <i class="bi bi-bell-fill"></i>
    <span class="float-pulse"></span>
</button>

<!-- Popup Modal -->
<div class="popup-overlay" id="popupOverlay" onclick="closePopup()"></div>
<div class="popup-box" id="popupBox">
    <button class="popup-close" onclick="closePopup()"><i class="bi bi-x-lg"></i></button>
    <?php if (!empty($settings['popup_image'])): ?>
        <img src="<?= htmlspecialchars($settings['popup_image']) ?>" alt="Promo" class="popup-img" onerror="this.style.display='none'">
    <?php endif; ?>
    <div class="popup-body">
        <h5 class="fw-bold"><?= htmlspecialchars($settings['popup_title']??'Special Offer') ?></h5>
        <p class="text-muted"><?= htmlspecialchars($settings['popup_content']??'') ?></p>
        <?php if (!empty($settings['popup_button_text'])): ?>
            <a href="<?= htmlspecialchars($settings['popup_button_link']??'#') ?>" class="btn btn-dark w-100"><?= htmlspecialchars($settings['popup_button_text']) ?></a>
        <?php endif; ?>
    </div>
</div>

<script src="https://cdn.jsdelivr.net/npm/bootstrap@5.3.3/dist/js/bootstrap.bundle.min.js"></script>
<script src="assets/js/main.js"></script>
</body>
</html>
