import { Mail, Linkedin, Github } from 'lucide-react';
import { useTheme } from '../contexts/ThemeContext';

interface Props {
    isOutOfCollege?: boolean;
}

const Footer: React.FC<Props> = ({ isOutOfCollege }) => {
    const { theme } = useTheme();
    
    return (
        <section className="mb-16">
          <div className={`rounded-2xl shadow-xl text-white p-12 text-center transition-all duration-300 ${
            theme === 'dark' 
              ? 'bg-gradient-to-r from-indigo-700 to-purple-700' 
              : 'bg-gradient-to-r from-indigo-600 to-purple-600'
          }`}>
            <h2 className="mb-6 text-4xl font-bold">Let's Connect</h2>
            <p className="mb-8 text-xl opacity-90">
              Ready to collaborate on something amazing? I'm always excited to
              discuss new opportunities and innovative projects.
            </p>
            <div className="flex flex-wrap justify-center gap-6">
              <a
                href="khokharmaaz@gmail.com"
                className="flex items-center gap-2 px-6 py-3 transition-colors rounded-lg bg-white/20 backdrop-blur-sm hover:bg-white/30"
              >
                <Mail className="w-5 h-5" />
                Email Me
              </a>
              {isOutOfCollege && (
                <a
                  href="https://linkedin.com/MyLinkedinProfile"
                  className="flex items-center gap-2 px-6 py-3 transition-colors rounded-lg bg-white/20 backdrop-blur-sm hover:bg-white/30"
                >
                  <Linkedin className="w-5 h-5" />
                  LinkedIn
                </a>
              )}
              <a
                href="https://github.com/coolestcoder655"
                className="flex items-center gap-2 px-6 py-3 transition-colors rounded-lg bg-white/20 backdrop-blur-sm hover:bg-white/30"
              >
                <Github className="w-5 h-5" />
                GitHub
              </a>
            </div>
          </div>
        </section>
    );
};

export default Footer;