{{-- Footer específico para demo-architecture-2 - OPTIMIZADO CON MEJORES PRÁCTICAS --}}
<footer id="footer" class="bg-primary border-0 my-0">
    <div class="container container-xl-custom custom-container-style">
        <div class="row py-5 pt-5 pb-4">
            {{-- Columna 1: Información de Contacto --}}
            <div class="col-md-6 col-lg-3 mb-4 mb-lg-0">
                <h4 class="font-weight-extra-bold text-4 ls-0 mb-3 mb-md-4">{{ __('Información de Contacto') }}</h4>
                <ul class="list list-unstyled mb-0">
                    {{-- <li class="mb-2 mb-md-3">
                        <span class="d-block text-color-light opacity-8 mb-1">{{ __('Dirección') }}</span>
                        <address class="text-color-light opacity-7 mb-0" style="font-style: normal; line-height: 1.8;">
                            @if(config('site.contact.address.line1'))
                                <span class="d-block">{{ config('site.contact.address.line1') }}</span>
                            @endif
                            @if(config('site.contact.address.line2'))
                                <span class="d-block">{{ config('site.contact.address.line2') }}</span>
                            @endif
                            @if(config('site.contact.address.city'))
                                <span class="d-block">{{ config('site.contact.address.city') }}</span>
                            @endif
                        </address>
                    </li> --}}
                    @if(config('site.contact.phone'))
                    <li class="mb-2 mb-md-3">
                        <span class="d-block text-color-light opacity-8 mb-1">{{ __('Teléfono') }}</span>
                        <a href="tel:{{ config('site.contact.phone') }}" class="text-color-light text-color-hover-primary text-decoration-none d-block" style="line-height: 1.8;">
                            {{ config('site.contact.phone') }}
                        </a>
                    </li>
                    @endif
                    @if(config('site.contact.email'))
                    <li>
                        <span class="d-block text-color-light opacity-8 mb-1">{{ __('Email') }}</span>
                        <a href="mailto:{{ config('site.contact.email') }}" class="text-color-light text-color-hover-primary text-decoration-none d-block" style="line-height: 1.8;">
                            {{ config('site.contact.email') }}
                        </a>
                    </li>
                    @endif
                </ul>
            </div>

            {{-- Columna 2: Navegación Principal --}}
            <div class="col-md-6 col-lg-2 mb-4 mb-lg-0">
                <h4 class="font-weight-extra-bold text-4 ls-0 mb-3 mb-md-4">{{ __('Navegación') }}</h4>
                <ul class="list-unstyled mb-0">
                    @php
                        $footerNav = get_dynamic_navigation('footer');
                        // Excluir elementos que se muestran en otras secciones (products, gallery, services)
                        $excludedKeys = ['products', 'gallery', 'services'];
                        $filteredNav = array_filter($footerNav, function($key) use ($excludedKeys) {
                            return !in_array($key, $excludedKeys);
                        }, ARRAY_FILTER_USE_KEY);
                        $footerNavLimited = array_slice($filteredNav, 0, 6, true);
                    @endphp
                    @foreach($footerNavLimited as $key => $item)
                        @if($item['active'])
                            <li class="mb-2">
                                <a href="{{ $item['url'] }}" class="text-color-light text-color-hover-primary text-decoration-none d-inline-block" style="line-height: 1.8;">
                                    {{ __($item['title']) }}
                                </a>
                            </li>
                        @endif
                    @endforeach
                    @php
                        // Verificar si "About Us" y "Contact" ya están en la navegación
                        $hasAbout = false;
                        $hasContact = false;
                        foreach($footerNav as $key => $item) {
                            if (stripos($item['url'], 'about') !== false || $key === 'about') {
                                $hasAbout = true;
                            }
                            if (stripos($item['url'], 'contact') !== false || $key === 'contact') {
                                $hasContact = true;
                            }
                        }
                    @endphp
                    @if(!$hasAbout)
                        <li class="mb-2">
                            <a href="{{ route('front.about') }}" class="text-color-light text-color-hover-primary text-decoration-none d-inline-block" style="line-height: 1.8;">
                                {{ __('Nosotros') }}
                            </a>
                        </li>
                    @endif
                    @if(!$hasContact)
                        <li>
                            <a href="{{ route('front.contact') }}" class="text-color-light text-color-hover-primary text-decoration-none d-inline-block" style="line-height: 1.8;">
                                {{ __('Contacto') }}
                            </a>
                        </li>
                    @endif
                </ul>
            </div>

            {{-- Columna 3: Servicios y Productos --}}
            <div class="col-md-6 col-lg-3 mb-4 mb-lg-0">
                <h4 class="font-weight-extra-bold text-4 ls-0 mb-3 mb-md-4">{{ __('Nuestros Servicios') }}</h4>
                <ul class="list-unstyled mb-0">
                    @if(is_module_active('services'))
                        <li class="mb-2">
                            <a href="{{ route('frontend.services.index') }}" class="text-color-light text-color-hover-primary text-decoration-none d-inline-block" style="line-height: 1.8;">
                                {{ __('Todos los Servicios') }}
                            </a>
                        </li>
                        @if(isset($serviceCategories) && $serviceCategories->count() > 0)
                            @foreach($serviceCategories->take(4) as $category)
                                <li class="mb-2">
                                    <a href="{{ route('frontend.services.detail', $category->slug) }}" class="text-color-light text-color-hover-primary text-decoration-none d-inline-block" style="line-height: 1.8;">
                                        {{ $category->name }}
                                    </a>
                                </li>
                            @endforeach
                        @endif
                    @endif
                    @if(is_module_active('products'))
                        <li class="mb-2 {{ is_module_active('services') && isset($serviceCategories) && $serviceCategories->count() > 0 ? 'mt-3' : '' }}">
                            <a href="{{ route('front.products.index') }}" class="text-color-light text-color-hover-primary text-decoration-none d-inline-block font-weight-semibold" style="line-height: 1.8;">
                                {{ __('Catálogo de Productos') }}
                            </a>
                        </li>
                        @if(isset($productCategories) && $productCategories->count() > 0)
                            @foreach($productCategories->take(3) as $category)
                                <li class="mb-2">
                                    <a href="{{ route('front.products.category', $category->slug) }}" class="text-color-light text-color-hover-primary text-decoration-none d-inline-block" style="line-height: 1.8;">
                                        {{ $category->name }}
                                    </a>
                                </li>
                            @endforeach
                        @endif
                    @endif
                    @if(is_module_active('gallery'))
                        <li class="mb-2 {{ (is_module_active('services') || is_module_active('products')) ? 'mt-3' : '' }}">
                            <a href="{{ route('gallery') }}" class="text-color-light text-color-hover-primary text-decoration-none d-inline-block" style="line-height: 1.8;">
                                {{ __('Galería') }}
                            </a>
                        </li>
                    @endif
                </ul>
            </div>

            {{-- Columna 4: Redes Sociales y Newsletter (opcional) --}}
            <div class="col-md-6 col-lg-4">
                <h4 class="font-weight-extra-bold text-4 ls-0 mb-3 mb-md-4">{{ __('Síguenos') }}</h4>
                <p class="text-color-light opacity-7 mb-3 mb-md-4" style="line-height: 1.7; font-size: 0.9rem;">
                    {{ __('Seguinos en nuestras redes para enterarte de novedades, tips y ver cómo sumamos momentos únicos en cada evento.') }}
                </p>
                <ul class="social-icons social-icons-clean social-icons-icon-light mb-0">
                    @foreach(config('site.social_media') as $key => $social)
                        @if($social['active'])
                            <li>
                                <a href="{{ $social['url'] }}" target="_blank" rel="noopener noreferrer" class="text-decoration-none" aria-label="{{ ucfirst($key) }}">
                                    <i class="fab fa-{{ $key === 'x' ? 'x-twitter' : ($key === 'facebook' ? 'facebook-f' : ($key === 'instagram' ? 'instagram' : ($key === 'whatsapp' ? 'whatsapp' : $key))) }}"></i>
                                </a>
                            </li>
                        @endif
                    @endforeach
                </ul>
            </div>
        </div>
    </div>

    {{-- Sección de Copyright --}}
    <div class="footer-copyright bg-primary border-top border-color-light" style="border-top-width: 1px !important;">
        <div class="container container-xl-custom custom-container-style">
            <div class="row py-4">
                <div class="col text-center">
                    <a href="{{ route('front.homepage') }}" class="d-inline-block mb-3 mb-md-4" aria-label="{{ config('site.name') }}">
                        <img alt="{{ config('site.name') }}" src="{{ asset(config('site.assets.footer_logo')) }}" style="max-width: 150px; height: auto; max-height: 44px;">
                    </a>
                    <p class="text-3 mb-0 text-color-light opacity-7" style="line-height: 1.6;">
                        {{ config('site.name') }} © {{ date('Y') }}. {{ __('Todos los Derechos Reservados') }}
                    </p>
                </div>
            </div>
        </div>
    </div>
</footer>