import Link from "next/link"
import { Instagram, Music } from "lucide-react"

export function Footer() {
  return (
    <footer className="bg-muted/50 border-t border-border organic-texture">
      <div className="container mx-auto px-4 sm:px-6 lg:px-8 py-12">
        <div className="grid grid-cols-1 md:grid-cols-3 gap-8">
          <div>
            <h3 className="text-lg font-bold text-foreground mb-4">Soul Speaks Soil</h3>
            <p className="text-muted-foreground leading-relaxed">
              Exploring the connection between soul and soil through meaningful conversations.
            </p>
          </div>

          <div>
            <h4 className="text-sm font-semibold text-foreground mb-4">Quick Links</h4>
            <div className="space-y-2">
              <Link href="/about" className="block text-muted-foreground hover:text-primary transition-colors">
                About
              </Link>
              <Link href="/episodes" className="block text-muted-foreground hover:text-primary transition-colors">
                Episodes
              </Link>
              <Link href="/contact" className="block text-muted-foreground hover:text-primary transition-colors">
                Contact
              </Link>
            </div>
          </div>

          <div>
            <h4 className="text-sm font-semibold text-foreground mb-4">Connect</h4>
            <div className="flex gap-4">
              <a
                href="https://open.spotify.com/show/soul-speaks-soil"
                target="_blank"
                rel="noopener noreferrer"
                className="text-muted-foreground hover:text-primary transition-colors"
                aria-label="Listen on Spotify"
              >
                <Music className="h-6 w-6" />
              </a>
              <a
                href="https://instagram.com/soulspeakssoil"
                target="_blank"
                rel="noopener noreferrer"
                className="text-muted-foreground hover:text-primary transition-colors"
                aria-label="Follow on Instagram"
              >
                <Instagram className="h-6 w-6" />
              </a>
            </div>
          </div>
        </div>

        <div className="mt-8 pt-8 border-t border-border text-center text-sm text-muted-foreground">
          <p>© {new Date().getFullYear()} Soul Speaks Soil. All rights reserved.</p>
        </div>
      </div>
    </footer>
  )
}