'use client';

import { motion } from 'framer-motion';
import { GitFork, Heart } from 'lucide-react';

export default function Footer() {
  const currentYear = new Date().getFullYear();

  return (
    <footer className="relative py-12 px-4">
      <div className="max-w-6xl mx-auto border-t border-border pt-12">
        <motion.div
          className="flex flex-col md:flex-row items-center justify-between gap-6"
          initial={{ opacity: 0 }}
          whileInView={{ opacity: 1 }}
          viewport={{ once: true }}
          transition={{ duration: 0.6 }}
        >
          {/* Copyright */}
          <p className="text-sm text-muted-foreground flex items-center gap-1">
            © {currentYear} Kit.
            <Heart className="h-4 w-4 text-primary shrink-0" fill="currentColor" />
                <a
                  href="https://pivoine.art"
                  target="_blank"
                  rel="noopener noreferrer"
                  title="Pivoine.Art"
                  className="font-medium underline underline-offset-4 decoration-primary/0 hover:decoration-primary transition-all duration-300"
                >
                  Valknar
                </a>
          </p>

          {/* Source link */}
          <a
            href="https://dev.pivoine.art/valknar/kit-ui"
            target="_blank"
            rel="noopener noreferrer"
            title="View source"
            className="text-muted-foreground hover:text-primary transition-colors duration-300"
          >
            <GitFork className="h-5 w-5" />
          </a>
        </motion.div>
      </div>
    </footer>
  );
}
