@php
    $aboutLinks = [
        'About Us' => '/about',
        'Cookies Policy' => '/cookies-policy',
    ];

    // About links live in column 2, so the seeded /about row must not repeat in Customer Care.
    $careLinks = collect($footerMenus)->reject(fn ($menu) => $menu['destination_link'] === '/about')->values();

    if ($careLinks->isEmpty()) {
        $careLinks = collect([
            ['name' => 'Return & Refund Policy', 'destination_link' => '/return-refund-policy'],
            ['name' => 'Privacy Policy', 'destination_link' => '/privacy-policy'],
            ['name' => 'Terms & Conditions', 'destination_link' => '/terms-conditions'],
            ['name' => 'Help Center', 'destination_link' => '/help-center'],
        ]);
    }

    // FAQs is always offered, unless an admin already put it in the footer menu.
    if (! $careLinks->contains('destination_link', '/faq')) {
        $careLinks->push(['name' => 'FAQs', 'destination_link' => '/faq']);
    }

    $socialNetworks = [
        'facebook' => ['Facebook', 'bi-facebook'],
        'instagram' => ['Instagram', 'bi-instagram'],
        'youtube' => ['YouTube', 'bi-youtube'],
        'linkedin' => ['LinkedIn', 'bi-linkedin'],
        'x' => ['X', 'bi-twitter-x'],
    ];

    // Each key has a logo in components/storefront/payment-logos, except COD, which has no brand mark.
    $paymentMethods = ['sslcommerz' => 'SSLCommerz', 'bkash' => 'bKash', 'nagad' => 'Nagad', 'visa' => 'VISA', 'mastercard' => 'Mastercard', 'amex' => 'AMEX', 'cod' => 'Cash on Delivery (COD)'];
@endphp

<footer class="sm-footer">
    {{-- The product page shows its recommended products slider in this place instead. --}}
    @unless (request()->routeIs('storefront.product.show'))
    <div class="sm-footer-band">
        <div class="container py-4">
            <h2 class="h5">Suggested Items</h2>
            <p class="mb-3">A Trusted E-commerce Platform in Bangladesh that offers authentic and genuine products.</p>
            @if ($suggestedProducts->isNotEmpty())
                <x-storefront.product-grid :products="$suggestedProducts" />
            @endif
        </div>
    </div>
    @endunless

    <div class="container py-5">
        <div class="row g-4">
            <div class="col-12 col-lg-4">
                <h2 class="h5 sm-footer-brand">{{ $brand }}</h2>
                <ul class="list-unstyled sm-footer-contact">
                    <li><i class="bi bi-geo-alt" aria-hidden="true"></i> {{ $company['address'] ?? 'Dhaka, Bangladesh' }}</li>
                    <li><i class="bi bi-telephone" aria-hidden="true"></i> Hotline: <a href="tel:{{ $support['phone'] }}">{{ $support['phone'] }}</a> ({{ $support['hours'] }})</li>
                    <li><i class="bi bi-envelope" aria-hidden="true"></i> Support Email: <a href="mailto:{{ $support['email'] }}">{{ $support['email'] }}</a></li>
                </ul>
                <h3 class="h6">Follow Us</h3>
                <ul class="list-unstyled d-flex gap-2 mb-0">
                    @foreach ($socialNetworks as $key => [$label, $icon])
                        @php($socialUrl = $company['social'][$key] ?? '')
                        <li>
                            {{-- Only real https links: this is admin input printed into an href. --}}
                            @if (str_starts_with($socialUrl, 'https://'))
                                <a class="sm-social-link" href="{{ $socialUrl }}" target="_blank" rel="noopener noreferrer" aria-label="{{ $label }}"><i class="bi {{ $icon }}" aria-hidden="true"></i></a>
                            @else
                                {{-- shortcut: no social URLs are stored yet, add company.social fields to the Phase 9 settings form. --}}
                                <span class="sm-social-link sm-social-pending" role="img" aria-label="{{ $label }}"><i class="bi {{ $icon }}" aria-hidden="true"></i></span>
                            @endif
                        </li>
                    @endforeach
                </ul>
            </div>

            <nav class="col-6 col-lg-2" aria-labelledby="footer-about-heading">
                <h2 class="h6" id="footer-about-heading">About Us</h2>
                <ul class="list-unstyled sm-footer-links mb-0">
                    @foreach ($aboutLinks as $label => $link)
                        <li><a href="{{ url($link) }}">{{ $label }}</a></li>
                    @endforeach
                </ul>
            </nav>

            <nav class="col-6 col-lg-3" aria-labelledby="footer-care-heading">
                <h2 class="h6" id="footer-care-heading">Customer Care</h2>
                <ul class="list-unstyled sm-footer-links mb-0">
                    @foreach ($careLinks as $menu)
                        <li><a href="{{ url($menu['destination_link']) }}">{{ $menu['name'] }}</a></li>
                    @endforeach
                </ul>
            </nav>

            <div class="col-12 col-lg-3">
                <div class="sm-app-box">
                    <h2 class="h6">Install App for Exclusive Discounts</h2>
                    <p class="mb-3"><span class="sm-discount-badge">Get ৳250 Discount on your first order</span></p>
                    <div class="d-flex align-items-center gap-3">
                        <i class="bi bi-qr-code-scan sm-qr-badge" aria-hidden="true"></i>
                        {{-- shortcut: disabled until real app store URLs exist, add them to settings when the app ships. --}}
                        <div class="d-flex flex-column gap-2">
                            <button type="button" class="btn btn-sm btn-outline-secondary" disabled><i class="bi bi-apple" aria-hidden="true"></i> App Store</button>
                            <button type="button" class="btn btn-sm btn-outline-secondary" disabled><i class="bi bi-google-play" aria-hidden="true"></i> Google Play</button>
                        </div>
                    </div>
                </div>
            </div>
        </div>

        <div class="sm-footer-payments mt-4 pt-4">
            <h2 class="h6">Payment Methods &amp; Security</h2>
            <ul class="list-unstyled d-flex flex-wrap gap-2 mb-0">
                @foreach ($paymentMethods as $key => $label)
                    <li class="sm-pay-logo sm-pay-logo-{{ $key }}" title="{{ $label }}">
                        @if ($key === 'cod')
                            <i class="bi bi-cash-coin" aria-hidden="true"></i><span aria-hidden="true">COD</span><span class="visually-hidden">{{ $label }}</span>
                        @else
                            <x-dynamic-component :component="'storefront.payment-logos.'.$key" />
                        @endif
                    </li>
                @endforeach
            </ul>
        </div>
    </div>

    <div class="sm-footer-bottom">
        <div class="container py-3 small d-flex flex-column flex-sm-row justify-content-between gap-1 text-center text-sm-start">
            <span>&copy; Copyright {{ date('Y') }} {{ $brand }}. All Rights are Reserved.</span>
            <span>Currency: BDT (৳) | Secured by 256-Bit SSL</span>
        </div>
    </div>
</footer>