@php
    $cols = [
        'Product' => [
           /* ['Features', 'features'],
            ['Pricing', 'pricing'],
            ['How It Works', 'how-it-works'], */
        ],
        'Company' => [
           /* ['About Us', 'about'],
            ['Blog', 'blog.index'],
            ['Contact', 'contact'], */
        ],
        'Resources' => [
           /* ['Help', 'contact'],
            ['Sign in', 'login'],
            ['Create account', 'register'], */
        ],
        'Legal' => [
            ['Privacy Policy', null],
            ['Terms of Service', null],
        ],
    ];
@endphp

<footer class="border-t border-gray-200 bg-gray-50 dark:border-gray-800 dark:bg-gray-950">
    <div class="mx-auto max-w-7xl px-4 py-12 sm:px-6 lg:px-8">
        <div class="grid grid-cols-2 gap-8 md:grid-cols-3 lg:grid-cols-6">
            {{-- Brand + newsletter --}}
            <div class="col-span-2">
                <a href="{{ url('/') }}" class="flex items-center gap-2">
                    <x-application-logo class="h-8 w-8" />
                    <span class="text-lg font-bold text-gray-900 dark:text-white">{{ config('app.name') }}</span>
                </a>
                <p class="mt-3 max-w-xs text-sm text-gray-600 dark:text-gray-400">Smart meeting scheduler — plan meetings, set availability, send invites, and never miss a thing.</p>
                <form class="mt-4 flex max-w-xs gap-2">
                    <input type="email" placeholder="Your email" class="w-full rounded-lg border-gray-300 text-sm focus:border-brand-500 focus:ring-brand-500 dark:border-gray-700 dark:bg-gray-900 dark:text-white">
                    <button type="button" class="shrink-0 rounded-lg bg-brand-600 px-3 py-2 text-sm font-semibold text-white hover:bg-brand-700">Subscribe</button>
                </form>
            </div>

            @foreach ($cols as $heading => $links)
                <div>
                    <h3 class="text-sm font-semibold text-gray-900 dark:text-white">{{ $heading }}</h3>
                    <ul class="mt-3 space-y-2">
                        @foreach ($links as [$label, $routeName])
                            @php $href = $routeName && \Illuminate\Support\Facades\Route::has($routeName) ? route($routeName) : '#'; @endphp
                            <li><a href="{{ $href }}" class="text-sm text-gray-600 hover:text-brand-600 dark:text-gray-400 dark:hover:text-brand-400">{{ $label }}</a></li>
                        @endforeach
                    </ul>
                </div>
            @endforeach
        </div>

        <div class="mt-10 flex flex-col items-center justify-between gap-4 border-t border-gray-200 pt-6 dark:border-gray-800 sm:flex-row">
            <p class="text-sm text-gray-500 dark:text-gray-400">&copy; {{ date('Y') }} {{ config('app.name') }}. All rights reserved.</p>
            <p class="text-sm text-gray-500 dark:text-gray-400">Need help? <a href="mailto:{{ config('mail.support_email', env('SUPPORT_EMAIL', 'support@digistack.test')) }}" class="font-medium text-brand-600 hover:underline dark:text-brand-400">{{ env('SUPPORT_EMAIL', 'support@digistack.test') }}</a></p>
        </div>
    </div>
</footer>