import Link from 'next/link'

export function Footer() {
  return (
    <footer className="border-t border-studio-medium bg-studio-black">
      <div className="container py-12">
        <div className="grid grid-cols-1 gap-8 md:grid-cols-5">
          <div>
            <h3 className="mb-4 text-lg font-semibold">Sankofa Phoenix</h3>
            <p className="text-sm text-gray-400">
              The sovereign cloud born of fire and ancestral wisdom.
            </p>
            <p className="mt-2 text-xs text-gray-500">
              Part of the <strong>Sankofa</strong> ecosystem
            </p>
          </div>
          <div>
            <h4 className="mb-4 text-sm font-semibold">Product</h4>
            <ul className="space-y-2 text-sm text-gray-400">
              <li>
                <Link href="/products" className="hover:text-phoenix-fire">
                  Products
                </Link>
              </li>
              <li>
                <Link href="/solutions" className="hover:text-phoenix-fire">
                  Solutions
                </Link>
              </li>
              <li>
                <Link href="/developers" className="hover:text-phoenix-fire">
                  Developers
                </Link>
              </li>
            </ul>
          </div>
          <div>
            <h4 className="mb-4 text-sm font-semibold">Resources</h4>
            <ul className="space-y-2 text-sm text-gray-400">
              <li>
                <Link href="/docs" className="hover:text-phoenix-fire">
                  Documentation
                </Link>
              </li>
              <li>
                <Link href="/support" className="hover:text-phoenix-fire">
                  Support
                </Link>
              </li>
              <li>
                <Link href="/partners" className="hover:text-phoenix-fire">
                  Partners
                </Link>
              </li>
            </ul>
          </div>
          <div>
            <h4 className="mb-4 text-sm font-semibold">Company</h4>
            <ul className="space-y-2 text-sm text-gray-400">
              <li>
                <Link href="/about" className="hover:text-phoenix-fire">
                  About
                </Link>
              </li>
              <li>
                <Link href="/manifesto" className="hover:text-phoenix-fire">
                  Manifesto
                </Link>
              </li>
            </ul>
          </div>
          <div>
            <h4 className="mb-4 text-sm font-semibold">Trust & Compliance</h4>
            <ul className="space-y-2 text-sm text-gray-400">
              <li>
                <Link href="/company/security" className="hover:text-phoenix-fire">
                  Security
                </Link>
              </li>
              <li>
                <Link href="/company/privacy" className="hover:text-phoenix-fire">
                  Privacy
                </Link>
              </li>
              <li>
                <Link href="/company/compliance" className="hover:text-phoenix-fire">
                  Compliance
                </Link>
              </li>
              <li>
                <Link href="/company/accessibility" className="hover:text-phoenix-fire">
                  Accessibility
                </Link>
              </li>
            </ul>
          </div>
        </div>
        <div className="mt-8 border-t border-studio-medium pt-8">
          <div className="flex flex-col md:flex-row justify-between items-center gap-4 text-sm text-gray-400">
            <p>&copy; {new Date().getFullYear()} Sankofa. All rights reserved.</p>
            <div className="flex gap-6">
              <Link href="/company/security" className="hover:text-phoenix-fire">
                Security
              </Link>
              <Link href="/company/privacy" className="hover:text-phoenix-fire">
                Privacy
              </Link>
              <Link href="/company/compliance" className="hover:text-phoenix-fire">
                Compliance
              </Link>
              <Link href="/company/accessibility" className="hover:text-phoenix-fire">
                Accessibility
              </Link>
            </div>
          </div>
        </div>
      </div>
    </footer>
  )
}

