{{-- Footer específico para demo-creative-agency-2 - DINÁMICO CON ESTRUCTURA DEL DEMO --}}
<footer id="footer" class="p-relative bg-dark border-top-0">
    <div class="container pt-5 pb-3">
        <div class="row py-5">
            <div class="col-lg-6 mt-5 pt-3">
                <a href="{{ route('front.homepage') }}" class="text-decoration-none">
                    <img src="{{ asset(config('site.assets.footer_logo', config('site.assets.main_logo'))) }}" width="123" height="32" class="img-fluid mb-5" alt="{{ config('site.assets.main_logo_alt') }}" />
                </a>
                <ul class="list list-unstyled">
                    <li class="d-flex align-items-center mb-4">
                        <a href="mailto:{{ config('site.contact.email') }}" class="d-inline-flex align-items-center text-decoration-none text-color-light text-color-hover-primary font-weight-semibold text-4-5">{{ config('site.contact.email') }}</a>
                    </li>
                    <li class="d-flex align-items-center mb-4">
                        <a href="tel:{{ config('site.contact.phone') }}" class="d-inline-flex align-items-center text-decoration-none text-color-light text-color-hover-primary font-weight-semibold text-4-5">{{ config('site.contact.phone') }}</a>
                    </li>
                </ul>
                <ul class="social-icons social-icons-clean social-icons-medium mb-5">
                    @foreach(config('site.social_media') as $key => $social)
                        @if($social['active'])
                            <li class="social-icons-{{ $key }}">
                                <a href="{{ $social['url'] }}" target="_blank" title="{{ $social['title'] ?? ucfirst($key) }}">
                                    <i class="{{ $social['icon'] ?? 'fab fa-' . $key }} text-color-light"></i>
                                </a>
                            </li>
                        @endif
                    @endforeach
                </ul>
            </div>
            <div class="col-lg-6 mt-lg-5 pt-lg-3">
                <div class="row mb-5-5">
                    <div class="col-md-4 mb-4 mb-lg-0">
                        <h4 class="text-color-light font-weight-bold mb-3">{{ __('Company') }}</h4>
                        <ul class="list list-unstyled text-3-5">
                            @php
                                $footerNav = get_dynamic_navigation('footer');
                                $footerNavLimited = array_slice($footerNav, 0, 3, true);
                            @endphp
                            @foreach($footerNavLimited as $key => $item)
                                @if($item['active'])
                                    <li><a href="{{ $item['url'] }}" class="text-color-grey text-color-hover-primary">{{ __($item['title']) }}</a></li>
                                @endif
                            @endforeach
                        </ul>
                    </div>
                    <div class="col-md-4 mb-4 mb-lg-0">
                        <h4 class="text-color-light font-weight-bold mb-3">{{ __('Solutions') }}</h4>
                        <ul class="list list-unstyled text-3-5">
                            @if(is_module_active('services'))
                                @foreach(($serviceCategories ?? collect())->take(3) as $category)
                                    <li><a href="{{ route('frontend.services.index') }}?category={{ $category->slug }}" class="text-color-grey text-color-hover-primary">{{ $category->name }}</a></li>
                                @endforeach
                            @else
                                <li><a href="{{ route('front.about') }}" class="text-color-grey text-color-hover-primary">{{ __('Brand Development') }}</a></li>
                                <li><a href="{{ route('front.about') }}" class="text-color-grey text-color-hover-primary">{{ __('Graphic Design') }}</a></li>
                                <li><a href="{{ route('front.about') }}" class="text-color-grey text-color-hover-primary">{{ __('UX Design') }}</a></li>
                            @endif
                        </ul>
                    </div>
                    <div class="col-md-4 mb-4 mb-lg-0">
                        <h4 class="text-color-light font-weight-bold mb-3">{{ __('Resources') }}</h4>
                        <ul class="list list-unstyled text-3-5">
                            <li><a href="#" class="text-color-grey text-color-hover-primary">{{ __('Terms') }}</a></li>
                            @if(is_module_active('blog'))
                                <li><a href="{{ route('blog.index') }}" class="text-color-grey text-color-hover-primary">{{ __('Blog') }}</a></li>
                            @endif
                            <li><a href="{{ route('front.contact') }}" class="text-color-grey text-color-hover-primary">{{ __('Contact') }}</a></li>
                        </ul>
                    </div>
                </div>
                @if(is_module_active('blog'))
                <div class="row">
                    <div class="col">
                        <h4 class="text-color-light font-weight-bold mb-3">{{ __('Blog') }}</h4>
                        @foreach(($recentPosts ?? collect())->take(9) as $post)
                            <a href="{{ route('blog.post', $post->slug) }}">
                                <span class="badge bg-dark--100 font-weight-normal text-2 badge-md anim-hover-translate-top-5px transition-2ms me-2 mb-2">{{ $post->category->name ?? __('Blog') }}</span>
                            </a>
                        @endforeach
                    </div>
                </div>
                @endif
            </div>
        </div>
    </div>
    <div class="footer-copyright bg-transparent">
        <div class="container pb-5">
            <hr class="bg-color-light opacity-1">
            <div class="row">
                <div class="col text-center text-lg-start mb-4">
                    <p class="text-3 mb-0 text-light opacity-5">{{ config('site.name') }} | © {{ date('Y') }}. {{ __('All Rights Reserved.') }}</p>
                </div>
            </div>
        </div>
    </div>
</footer>