{{-- Footer --}}
<footer class="bg-brand-dark text-gray-400 pt-16 pb-8">
    <div class="container mx-auto px-4">
        <div class="grid grid-cols-1 md:grid-cols-2 lg:grid-cols-4 gap-12 mb-12">
            {{-- About --}}
            <div>
                <div class="flex items-center space-x-2 mb-6">
                    <div class="w-10 h-10 bg-brand-red rounded-lg flex items-center justify-center">
                        <i data-lucide="settings" class="w-6 h-6 text-white"></i>
                    </div>
                    <span class="text-xl font-extrabold text-white tracking-tight">DIKE <span class="text-brand-red">AUTO PARTS</span></span>
                </div>
                <p class="text-sm leading-relaxed mb-6">
                    Looking for quality car headlights, bumpers, grills or side mirrors? Visit DIKE AUTO PARTS VENTURES today.
                </p>
                <div class="flex space-x-3">
                    <a href="#" class="w-9 h-9 border border-gray-600 rounded-full flex items-center justify-center hover:bg-brand-red hover:border-brand-red hover:text-white transition-all">
                        <i data-lucide="facebook" class="w-4 h-4"></i>
                    </a>
                    <a href="#" class="w-9 h-9 border border-gray-600 rounded-full flex items-center justify-center hover:bg-brand-red hover:border-brand-red hover:text-white transition-all">
                        <i data-lucide="twitter" class="w-4 h-4"></i>
                    </a>
                    <a href="#" class="w-9 h-9 border border-gray-600 rounded-full flex items-center justify-center hover:bg-brand-red hover:border-brand-red hover:text-white transition-all">
                        <i data-lucide="instagram" class="w-4 h-4"></i>
                    </a>
                </div>
            </div>

            {{-- Quick Links --}}
            <div>
                <h4 class="text-white font-extrabold uppercase tracking-widest text-sm mb-6 relative pb-3 border-b border-gray-700">
                    Quick Links
                    <span class="absolute bottom-0 left-0 w-10 h-0.5 bg-brand-red"></span>
                </h4>
                <ul class="space-y-3 text-sm">
                    <li><a href="{{ url('/shop') }}" class="hover:text-brand-red hover:translate-x-1 transition-all inline-block">Shop All Parts</a></li>
                    <li><a href="{{ url('/specials') }}" class="hover:text-brand-red hover:translate-x-1 transition-all inline-block">Special Offers</a></li>
                    <li><a href="{{ url('/brands') }}" class="hover:text-brand-red hover:translate-x-1 transition-all inline-block">Our Brands</a></li>
                    <li><a href="{{ url('/about') }}" class="hover:text-brand-red hover:translate-x-1 transition-all inline-block">About Us</a></li>
                    <li><a href="{{ url('/contact') }}" class="hover:text-brand-red hover:translate-x-1 transition-all inline-block">Contact Us</a></li>
                    <li><a href="{{ url('/site-map') }}" class="hover:text-brand-red hover:translate-x-1 transition-all inline-block">Sitemap</a></li>
                </ul>
            </div>

            {{-- Customer Service --}}
            <div>
                <h4 class="text-white font-extrabold uppercase tracking-widest text-sm mb-6 relative pb-3 border-b border-gray-700">
                    Customer Service
                    <span class="absolute bottom-0 left-0 w-10 h-0.5 bg-brand-red"></span>
                </h4>
                <ul class="space-y-3 text-sm">
                    <li><a href="{{ url('/dashboard') }}" class="hover:text-brand-red hover:translate-x-1 transition-all inline-block">My Account</a></li>
                    <li><a href="{{ url('/cart') }}" class="hover:text-brand-red hover:translate-x-1 transition-all inline-block">View Cart</a></li>
                    <li><a href="#" class="hover:text-brand-red hover:translate-x-1 transition-all inline-block">Track Order</a></li>
                    <li><a href="#" class="hover:text-brand-red hover:translate-x-1 transition-all inline-block">Returns & Warranty</a></li>
                    <li><a href="#" class="hover:text-brand-red hover:translate-x-1 transition-all inline-block">Shipping Info</a></li>
                    <li><a href="#" class="hover:text-brand-red hover:translate-x-1 transition-all inline-block">FAQ</a></li>
                </ul>
            </div>

            {{-- Contact Info --}}
            <div>
                <h4 class="text-white font-extrabold uppercase tracking-widest text-sm mb-6 relative pb-3 border-b border-gray-700">
                    DIKE AUTO PARTS VENTURES
                    <span class="absolute bottom-0 left-0 w-10 h-0.5 bg-brand-red"></span>
                </h4>
                <ul class="space-y-4 text-sm">
                    <li class="flex items-start space-x-3">
                        <i data-lucide="map-pin" class="w-5 h-5 text-brand-red shrink-0 mt-0.5"></i>
                        <span>Shop 6 Ozone Plaza, Site/Machine Parts Junction, Abakaliki, Ebonyi state.</span>
                    </li>
                    <li class="flex items-center space-x-3">
                        <i data-lucide="phone" class="w-5 h-5 text-brand-red shrink-0"></i>
                        <span>+234 902 002 5723</span>
                    </li>
                    <li class="flex items-center space-x-3">
                        <i data-lucide="message-circle" class="w-5 h-5 text-green-500 shrink-0"></i>
                        <span>WhatsApp: +234 907 947 2808</span>
                    </li>
                    <li class="flex items-center space-x-3">
                        <i data-lucide="clock" class="w-5 h-5 text-brand-red shrink-0"></i>
                        <span>Mon – Sat: 8:00 AM – 6:00 PM</span>
                    </li>
                </ul>
            </div>
        </div>

        {{-- Bottom Bar --}}
        <div class="border-t border-gray-700 pt-8 flex flex-col md:flex-row justify-between items-center space-y-4 md:space-y-0 text-sm">
            <p>&copy; {{ date('Y') }} AutoPart Online Store. All rights reserved.</p>
            <div class="flex items-center space-x-4 text-xs">
                <a href="#" class="hover:text-brand-red transition-colors">Privacy Policy</a>
                <span class="text-gray-600">|</span>
                <a href="#" class="hover:text-brand-red transition-colors">Terms of Service</a>
                <span class="text-gray-600">|</span>
                <a href="#" class="hover:text-brand-red transition-colors">Cookie Policy</a>
            </div>
        </div>
    </div>
</footer>
