<!-- Footer -->
<footer class="bg-dark text-white pt-5 pb-4 ">
    <div class="container">
        <div class="row ">
            <!-- Column 1: Logo -->
            <div class="col-md-3 col-lg-3 col-xl-3 mx-auto mb-4">
                <div class="bg-light d-md-flex align-items-center justify-content-center p-1">
                    <?= $this->Html->image($appSettings['SITE-LOGO'], ['class' => "img-fluid f-nav-logo mb-2"]) ?>
                </div>
                <?php foreach ($menus as $menu) { ?>
                    <?php if ($menu->slug == 'about-us') { ?>
                        <p><?= $this->Text->truncate(strip_tags($menu->content), 150, ['ellipsis' => '', 'exact' => false]) ?>
                        </p>
                    <?php } ?>
                <?php } ?>
            </div>


            <!-- Column 2: Quick Links -->
            <?php foreach ($footerMenus as $footerMenu) { ?>
                <div class="col-md-2 col-lg-2 col-xl-2 mx-auto mb-4 ">
                    <h6 class="text-uppercase font-weight-bold"> <?= h($footerMenu->name) ?></h6>
                    <?php foreach ($footerMenu->child_menus as $footerChildMenu) { ?>
                        <hr class="mb-2 mt-0 d-inline-block mx-auto"
                            style="width: 60px; background-color: #f8f9fa; height: 2px">
                        <p><a
                                href="<?= $this->Url->build(['controller' => $footerMenu->slug, 'action' => $footerChildMenu->slug]) ?>">
                                <?= $footerChildMenu->name ?>
                            </a>
                        </p>

                    <?php } ?>

                </div>
            <?php } ?>
            <!-- Column 3: Useful Links -->
            <!-- <div class="col-md-2 col-lg-2 col-xl-2 mx-auto mb-4">
                <h6 class="text-uppercase font-weight-bold">Useful Links</h6>
                <hr class="mb-2 mt-0 d-inline-block mx-auto"
                    style="width: 60px; background-color: #f8f9fa; height: 2px">
                <p><a href="#" class="text-white">Privacy Policy</a></p>
                <p><a href="#" class="text-white">Terms of Use</a></p>
                <p><a href="#" class="text-white">FAQ</a></p>
                <p><a href="#" class="text-white">Support</a></p>
            </div> -->

            <!-- Column 4: Contact Info and Social Links -->
            <div class="col-md-4 col-lg-4 col-xl-4 mx-auto mb-4">
                <h6 class="text-uppercase font-weight-bold">Contact</h6>
                <hr class="mb-2 mt-0 d-inline-block mx-auto"
                    style="width: 60px; background-color: #f8f9fa; height: 2px">
                <p><i class="fas fa-home mr-3"></i> 123, Main Street, City, Country</p>
                <p><i class="fas fa-envelope mr-3"></i> info@example.com</p>
                <p><i class="fas fa-phone mr-3"></i> +01 234 567 88</p>

                <!-- Social Links below contact info -->
                <h6 class="text-uppercase font-weight-bold mt-4">Follow us</h6>
                <a href="#" class="text-white me-4"><i class="bi bi-meta"></i></a>
                <a href="#" class="text-white me-4"><i class="bi bi-twitter-x"></i></a>
                <a href="#" class="text-white me-4"><i class="bi bi-instagram"></i></a>
                <a href="#" class="text-white me-4"><i class="bi bi-linkedin"></i></a>
            </div>
        </div>
    </div>


</footer>

<div class="bg-black p-3">
    <div class="container text-white">
        <div class="row">
            <div class="col-xs-12 col-sm-12 col-md-12 col-xl-12 col-xxl-12 d-flex justify-content-center">
                <p class="mb-0">&copy; <?php echo date("Y"); ?> <?= $appSettings['SITE-NAME']; ?>. All rights reserved.
                </p>
            </div>

        </div>
    </div>
</div>