import React from 'react';
import { Youtube, Instagram, Facebook, Linkedin, Twitter, MapPin, Phone, Mail, ExternalLink } from 'lucide-react';

const Footer: React.FC = () => {
  const currentYear = new Date().getFullYear();

  const footerLinks = {
    col1: [
      { name: 'About The College', href: 'https://ritchennai.org' },
      { name: 'News Room', href: 'https://ritchennai.org' },
      { name: 'Governing Council', href: 'https://ritchennai.org/about-governing-council.php' },
      { name: 'Career @ RIT', href: 'https://ritchennai.org' },
      { name: 'Blog', href: 'https://ritchennai.org' },
      { name: 'In alliance with Rajalakshmi Eduverse (www.myeduverse.net) - Cancellation & Refund Policy', href: 'https://ritchennai.org' },
    ],
    col2: [
      { name: 'Courses', href: 'https://www.ritchennai.org/admission-courses-offered.php' },
      { name: 'Admissions', href: 'https://www.ritchennai.org/admission-eligibility.php' },
      { name: 'Eligibility', href: 'https://www.ritchennai.org/admission-eligibility.php' },
      { name: 'Code of Conduct - Students', href: 'https://ritchennai.org' },
      { name: 'Online Fees Payment', href: 'https://ritchennai.org' },
      { name: 'Terms & Conditions', href: 'https://ritchennai.org' },
    ],
    col3: [
      { name: 'Library', href: 'https://ritchennai.org' },
      { name: 'Hostel', href: 'https://ritchennai.org' },
      { name: 'Sports', href: 'https://ritchennai.org' },
      { name: 'Transport', href: 'https://ritchennai.org' },
      { name: 'HR Manual', href: 'https://ritchennai.org' },
      { name: 'Patent', href: 'https://ritchennai.org' },
      { name: 'Audited Statements', href: 'https://ritchennai.org' },
      { name: 'Shopping and Delivery Conditions', href: 'https://ritchennai.org' },
    ],
  };

  const socialLinks = [
    { icon: Facebook, href: 'https://www.facebook.com/ritchennai/', color: 'hover:text-blue-600' },
    { icon: Twitter, href: 'https://x.com/rit_chennai', color: 'hover:text-sky-500' },
    { icon: Instagram, href: 'https://www.instagram.com/ritchennai/', color: 'hover:text-pink-600' },
    { icon: Linkedin, href: 'https://www.linkedin.com/school/rajalakshmi-institute-of-technology/', color: 'hover:text-blue-700' },
    { icon: Youtube, href: 'https://youtube.com/@rajalakshmiinstituteoftech4448?si=jRmCDzp9dbwBLVQI', color: 'hover:text-red-600' },
  ];

  return (
    <footer className="bg-white pt-20 pb-10 border-t border-gray-100 font-sans text-gray-600">
      <div className="max-w-7xl mx-auto px-6 md:px-12 lg:px-24">
        <div className="grid grid-cols-1 md:grid-cols-2 lg:grid-cols-12 gap-12 lg:gap-8 mb-16">
          
          {/* Brand and Social */}
          <div className="lg:col-span-4 space-y-8">
            <div className="space-y-4">
              <p className="text-sm leading-relaxed max-w-xs">
                We are a leading Engineering college in India, Rajalakshmi Institutions. Imparting the Spirit of Excellence and Quality Technical Education that fosters Learning.
              </p>
            </div>
            
            <div className="flex gap-4">
              {socialLinks.map((social, index) => (
                <a 
                  key={index}
                  href={social.href} 
                  target="_blank" 
                  rel="noopener noreferrer"
                  className={`w-10 h-10 rounded-full border border-gray-200 flex items-center justify-center transition-all duration-300 hover:border-transparent hover:shadow-lg ${social.color} group`}
                >
                  <social.icon size={18} className="group-hover:scale-110 transition-transform" />
                </a>
              ))}
            </div>

            <div className="pt-8">
              <img 
                src="https://www.facultyplus.com/wp-content/uploads/2020/11/Rit-logo.png" 
                alt="RIT Logo" 
                className="h-16 w-auto object-contain"
                referrerPolicy="no-referrer"
              />
            </div>
          </div>

          {/* Links Columns */}
          <div className="lg:col-span-2 space-y-6 pt-2">
            <ul className="space-y-4">
              {footerLinks.col1.map((link) => (
                <li key={link.name}>
                  <a href={link.href} className="text-sm font-medium hover:text-[#f97316] transition-colors leading-relaxed">{link.name}</a>
                </li>
              ))}
            </ul>
          </div>

          <div className="lg:col-span-2 space-y-6 pt-2">
            <ul className="space-y-4">
              {footerLinks.col2.map((link) => (
                <li key={link.name}>
                  <a href={link.href} className="text-sm font-medium hover:text-[#f97316] transition-colors leading-relaxed">{link.name}</a>
                </li>
              ))}
            </ul>
          </div>

          <div className="lg:col-span-2 space-y-6 pt-2">
            <div className="grid grid-cols-1 gap-4">
              {footerLinks.col3.map((link) => (
                <a key={link.name} href={link.href} className="text-sm font-medium hover:text-[#f97316] transition-colors leading-relaxed">{link.name}</a>
              ))}
            </div>
          </div>

          {/* Contact Info */}
          <div className="lg:col-span-2 space-y-8">
            <div className="space-y-4">
              <h3 className="text-xs font-black text-[#1e3a8a] uppercase tracking-widest border-b-2 border-[#f97316] pb-2 w-fit">
                ADDRESS
              </h3>
              <div className="space-y-4 text-[13px]">
                <div>
                  <p className="font-bold text-gray-800 mb-1">Rajalakshmi Institutions Head Office</p>
                  <p># 69 New Avadi Road</p>
                  <p>Kilpauk</p>
                  <p>Chennai - 600 010.</p>
                </div>
                <div>
                  <p className="font-bold text-gray-800 mb-1">College Campus</p>
                  <p>Rajalakshmi Nagar</p>
                  <p>Thandalam</p>
                  <p>Tamil Nadu 602105</p>
                </div>
              </div>
            </div>

            <div className="space-y-4">
              <h3 className="text-xs font-black text-[#1e3a8a] uppercase tracking-widest border-b-2 border-[#f97316] pb-2 w-fit">
                PHONE
              </h3>
              <p className="text-[13px]">44-26442472 / 44-26461316 / 44-26460124</p>
            </div>

            <div className="space-y-4">
              <h3 className="text-xs font-black text-[#1e3a8a] uppercase tracking-widest border-b-2 border-[#f97316] pb-2 w-fit">
                EMAIL
              </h3>
              <a href="mailto:mail@ritchennai.edu.in" className="text-[13px] hover:text-[#f97316] transition-colors">
                mail@ritchennai.edu.in
              </a>
            </div>
          </div>

        </div>

        {/* Bottom Bar */}
        <div className="pt-10 border-t border-gray-100 flex flex-col md:flex-row justify-between items-center gap-6">
          <div className="flex items-center gap-2">
            <span className="text-[11px] font-bold text-gray-400 ml-2">© {currentYear} Rajalakshmi Institute Of Technology</span>
          </div>
          
          <div className="flex gap-8 text-[11px] font-bold uppercase tracking-widest">
            {/* Links removed as per request */}
          </div>
        </div>
      </div>
    </footer>
  );
};

export default Footer;