@php
    $lang = $lang ?? request('lang', 'bn');
    $label = fn ($bn, $en) => $lang === 'en' ? $en : $bn;
@endphp
<footer class="bg-[var(--primary-green)] text-white relative overflow-hidden">
    <div class="absolute inset-0 grain-texture opacity-50"></div>
    <div class="relative z-10 max-w-7xl mx-auto px-4 sm:px-6 lg:px-8 py-16">
        <div class="grid grid-cols-1 md:grid-cols-2 lg:grid-cols-4 gap-12 mb-12">
            <div>
                <div class="flex items-center gap-3 mb-6">
                    <div class="footer-logo-shell">
                        <img src="{{ asset('assets/nowjoan-logo.png') }}" alt="{{ $label('নওজোয়ান', 'NowJoan') }}" class="site-logo site-logo-footer">
                    </div>
                </div>
                <p class="text-white/80 leading-relaxed">{{ $label('মুক্তিযুদ্ধের চেতনায় উদ্বুদ্ধ, তারুণ্যের শক্তি, জনগণের অধিকার ও কল্যাণে নিবেদিত একটি নাগরিক-রাজনৈতিক প্ল্যাটফর্ম।', 'A youth-led civic and political platform dedicated to rights, welfare, and accountable leadership.') }}</p>
            </div>
            <div>
                <h4 class="text-white mb-6">{{ $label('দ্রুত লিংক', 'Quick Links') }}</h4>
                <ul class="space-y-3 text-white/80">
                    <li><a href="{{ route('team', request('lang') ? ['lang' => request('lang')] : []) }}" class="hover:text-white smooth-transition">{{ $label('আমাদের সম্পর্কে', 'About Us') }}</a></li>
                    <li><a href="{{ route('programs', request('lang') ? ['lang' => request('lang')] : []) }}" class="hover:text-white smooth-transition">{{ $label('ম্যানিফেস্টো', 'Manifesto') }}</a></li>
                    <li><a href="{{ route('join', request('lang') ? ['lang' => request('lang')] : []) }}" class="hover:text-white smooth-transition">{{ $label('সদস্যপদ', 'Membership') }}</a></li>
                    <li><a href="{{ route('blog', request('lang') ? ['lang' => request('lang')] : []) }}" class="hover:text-white smooth-transition">{{ $label('সংবাদ', 'News') }}</a></li>
                </ul>
            </div>
            <div>
                <h4 class="text-white mb-6">{{ $label('যোগাযোগ', 'Contact') }}</h4>
                <ul class="space-y-4 text-white/80">
                    <li class="flex items-start gap-3">
                        @include('partials.icon', ['name' => 'map-pin', 'class' => 'w-5 h-5 text-[var(--gold)] flex-shrink-0 mt-1'])
                        <span>{{ $label('কেন্দ্রীয় কার্যালয়', 'Central Office') }}<br>{{ $label('ঢাকা, বাংলাদেশ', 'Dhaka, Bangladesh') }}</span>
                    </li>
                    <li class="flex items-center gap-3">@include('partials.icon', ['name' => 'phone', 'class' => 'w-5 h-5 text-[var(--gold)]'])<span>+৮৮০ ১২৩৪-৫৬৭৮৯০</span></li>
                    <li class="flex items-center gap-3">@include('partials.icon', ['name' => 'mail', 'class' => 'w-5 h-5 text-[var(--gold)]'])<span>info@nowjoan.org</span></li>
                </ul>
            </div>
            <div>
                <h4 class="text-white mb-6">{{ $label('আমাদের অনুসরণ করুন', 'Follow Us') }}</h4>
                <div class="flex gap-4 mb-6">
                    <a href="#" class="w-10 h-10 bg-white/10 hover:bg-white/20 rounded-full flex items-center justify-center smooth-transition">@include('partials.icon', ['name' => 'facebook', 'class' => 'w-5 h-5'])</a>
                    <a href="#" class="w-10 h-10 bg-white/10 hover:bg-white/20 rounded-full flex items-center justify-center smooth-transition">@include('partials.icon', ['name' => 'twitter', 'class' => 'w-5 h-5'])</a>
                    <a href="#" class="w-10 h-10 bg-white/10 hover:bg-white/20 rounded-full flex items-center justify-center smooth-transition">@include('partials.icon', ['name' => 'youtube', 'class' => 'w-5 h-5'])</a>
                </div>
                <p class="text-white/80 mb-3">{{ $label('নিউজলেটার সাবস্ক্রাইব করুন', 'Subscribe to Newsletter') }}</p>
                <form class="flex gap-2">
                    <input type="email" placeholder="{{ $label('ইমেইল', 'Email') }}" class="flex-1 px-4 py-2 rounded-lg bg-white/10 border border-white/20 text-white placeholder:text-white/50 focus:outline-none focus:border-[var(--gold)]">
                    <button class="px-4 py-2 bg-[var(--primary-red)] hover:bg-[var(--primary-red)]/90 rounded-lg smooth-transition">{{ $label('সাবস্ক্রাইব', 'Subscribe') }}</button>
                </form>
            </div>
        </div>
        <div class="pt-8 border-t border-white/20 flex flex-col md:flex-row justify-between items-center gap-4">
            <p class="text-white/70 text-sm">{{ $label('© ২০২৫ নওজোয়ান। সর্বস্বত্ব সংরক্ষিত।', '© 2025 NowJoan. All rights reserved.') }}</p>
            <div class="flex gap-6 text-sm text-white/70">
                <a href="#" class="hover:text-white smooth-transition">{{ $label('গোপনীয়তা নীতি', 'Privacy Policy') }}</a>
                <a href="#" class="hover:text-white smooth-transition">{{ $label('শর্তাবলী', 'Terms') }}</a>
                <a href="#" class="hover:text-white smooth-transition">{{ $label('কুকি নীতি', 'Cookie Policy') }}</a>
            </div>
        </div>
    </div>
    <div class="relative z-10 border-t border-white/10 py-3 text-center">
        <span class="text-white/50 text-xs">Powered by <a href="https://www.12oclock.org" target="_blank" rel="noopener noreferrer" class="text-white/70 hover:text-white smooth-transition underline">12oclock</a></span>
    </div>
</footer>