"use client";
import { Container } from "@/components/container";
import Link from "next/link";
import { MessageCircle } from "lucide-react";

export function Footer() {
  return (
    <footer className="border-t border-neutral-200 py-12 bg-neutral-50">
      <Container>
        <div className="grid grid-cols-1 md:grid-cols-4 gap-8 mb-8">
          <div className="col-span-1 md:col-span-2">
            <h3 className="font-bold text-lg text-neutral-900 mb-2">Badnaam Safar</h3>
            <p className="text-sm text-neutral-600 mb-4">
              Independent Travel Consultant
            </p>
            <p className="text-xs text-neutral-500">
              Payments & trip services are handled by partner agencies.
            </p>
          </div>
          
          <div>
            <h4 className="font-semibold text-neutral-900 mb-3">Quick Links</h4>
            <nav className="flex flex-col gap-2">
              <Link href="/about" className="text-sm text-neutral-600 hover:text-neutral-900">
                About Us
              </Link>
              <Link href="/services" className="text-sm text-neutral-600 hover:text-neutral-900">
                Services
              </Link>
              <Link href="/how-it-works" className="text-sm text-neutral-600 hover:text-neutral-900">
                How It Works
              </Link>
              <Link href="/contact" className="text-sm text-neutral-600 hover:text-neutral-900">
                Contact
              </Link>
            </nav>
          </div>
          
          <div>
            <h4 className="font-semibold text-neutral-900 mb-3">Legal</h4>
            <nav className="flex flex-col gap-2">
              <Link href="/disclaimer" className="text-sm text-neutral-600 hover:text-neutral-900">
                Disclaimer
              </Link>
              <Link href="/privacy" className="text-sm text-neutral-600 hover:text-neutral-900">
                Privacy Policy
              </Link>
              <Link href="/terms" className="text-sm text-neutral-600 hover:text-neutral-900">
                Terms of Service
              </Link>
            </nav>
          </div>
        </div>
        
        <div className="border-t border-neutral-200 pt-8 flex flex-col md:flex-row justify-between items-center gap-4">
          <p className="text-sm text-neutral-600">
            © {new Date().getFullYear()} Badnaam Safar. All rights reserved.
          </p>
          <a 
            href="https://wa.me/919999999999" 
            target="_blank" 
            rel="noopener noreferrer"
            className="flex items-center gap-2 text-sm text-green-700 hover:text-green-800 font-medium"
          >
            <MessageCircle className="h-4 w-4" />
            WhatsApp Us
          </a>
        </div>
      </Container>
    </footer>
  );
}