@php
$practiceName = \App\Models\SiteSetting::get('practice_name', 'Shavhani Attorneys');
$tagline = \App\Models\SiteSetting::get('tagline', 'Think Is Practical');
$email = \App\Models\SiteSetting::get('email', '');
$phonePrimary = \App\Models\SiteSetting::get('phone_primary', '');
$phoneSecondary = \App\Models\SiteSetting::get('phone_secondary', '');
$fullAddress = trim(implode(', ', array_filter([
    \App\Models\SiteSetting::get('address_street', ''),
    \App\Models\SiteSetting::get('address_city', ''),
    \App\Models\SiteSetting::get('address_province', ''),
    \App\Models\SiteSetting::get('address_postal_code', ''),
])));
$fax = \App\Models\SiteSetting::get('fax', '086 414 2006');
@endphp

<footer class="bg-firm-ink text-white border-t-4 border-firm-red-500" role="contentinfo">
    <div class="firm-container py-8 md:py-14">
        {{-- Mobile: compact stacked layout --}}
        <div class="md:hidden space-y-6">
            <div class="flex items-center gap-3">
                <x-logo hide-text="true" size="sm" />
                <div>
                    <p class="font-serif font-bold text-white leading-tight">{{ $practiceName }}</p>
                    <p class="text-xs text-white/60 uppercase tracking-wider">{{ $tagline }}</p>
                </div>
            </div>

            <div class="text-sm text-white/80 space-y-1">
                @if($phonePrimary)
                <p><a href="tel:{{ str_replace(' ', '', $phonePrimary) }}" class="hover:text-white">{{ $phonePrimary }}</a>@if($phoneSecondary) · <a href="tel:{{ str_replace(' ', '', $phoneSecondary) }}" class="hover:text-white">{{ $phoneSecondary }}</a>@endif</p>
                @endif
                @if($email)
                <p><a href="mailto:{{ $email }}" class="hover:text-white break-all">{{ $email }}</a></p>
                @endif
            </div>

            <nav class="grid grid-cols-2 gap-x-4 gap-y-2 text-sm" aria-label="Footer">
                <a href="{{ route('services.index') }}" class="text-white/80 hover:text-white">Practice Areas</a>
                <a href="{{ route('book.index') }}" class="text-white font-semibold hover:text-firm-red-400">Consultation</a>
                <a href="{{ route('contact') }}" class="text-white/80 hover:text-white">Contact</a>
                <a href="{{ route('faq') }}" class="text-white/80 hover:text-white">FAQ</a>
            </nav>
        </div>

        {{-- Desktop: full 3-column layout --}}
        <div class="hidden md:grid md:grid-cols-3 gap-10 mb-10">
            <div>
                <x-logo size="sm" />
                <p class="mt-4 text-white/80 text-sm leading-relaxed max-w-xs">
                    {{ $tagline }}. Practical legal representation across civil litigation, personal injury, labour, family, and commercial law.
                </p>
            </div>

            <div>
                <h3 class="text-sm font-semibold uppercase tracking-wider text-firm-red-400 mb-4">Contact</h3>
                <ul class="space-y-2 text-sm text-white/80">
                    @if($phonePrimary)
                    <li><a href="tel:{{ str_replace(' ', '', $phonePrimary) }}" class="hover:text-white">{{ $phonePrimary }}</a></li>
                    @endif
                    @if($phoneSecondary)
                    <li><a href="tel:{{ str_replace(' ', '', $phoneSecondary) }}" class="hover:text-white">{{ $phoneSecondary }}</a></li>
                    @endif
                    @if($email)
                    <li><a href="mailto:{{ $email }}" class="hover:text-white break-all">{{ $email }}</a></li>
                    @endif
                    @if($fullAddress)
                    <li>{{ $fullAddress }}</li>
                    @endif
                    <li>Fax: {{ $fax }}</li>
                </ul>
            </div>

            <div>
                <h3 class="text-sm font-semibold uppercase tracking-wider text-firm-red-400 mb-4">Quick Links</h3>
                <ul class="space-y-2 text-sm text-white/80">
                    <li><a href="{{ route('home') }}" class="hover:text-white">Home</a></li>
                    <li><a href="{{ route('about') }}" class="hover:text-white">About</a></li>
                    <li><a href="{{ route('services.index') }}" class="hover:text-white">Practice Areas</a></li>
                    <li><a href="{{ route('blog.index') }}" class="hover:text-white">Blog</a></li>
                    <li><a href="{{ route('faq') }}" class="hover:text-white">FAQs</a></li>
                    <li><a href="{{ route('contact') }}" class="hover:text-white">Contact</a></li>
                    <li><a href="{{ route('book.index') }}" class="text-white font-semibold hover:text-firm-red-400">Request Consultation</a></li>
                </ul>
            </div>
        </div>

        <div class="border-t border-white/20 pt-6 md:pt-8 flex flex-col sm:flex-row sm:items-center sm:justify-between gap-3 text-xs sm:text-sm text-white/60">
            <p>&copy; {{ date('Y') }} {{ $practiceName }}. All rights reserved.</p>
            <div class="flex flex-wrap gap-x-6 gap-y-1">
                <a href="{{ route('legal.privacy') }}" class="hover:text-white">Privacy</a>
                <a href="{{ route('legal.disclaimer') }}" class="hover:text-white">Disclaimer</a>
                <a href="{{ route('legal.terms') }}" class="hover:text-white">Terms</a>
            </div>
        </div>
        <p class="hidden md:block mt-4 text-xs text-white/50">Information on this website is for general purposes only and does not constitute legal advice.</p>
    </div>
</footer>