import React from 'react';
import {
  FaFacebookF,
  FaInstagram,
  FaTwitter,
  FaLinkedinIn,
  FaMapMarkerAlt,
  FaPhoneAlt,
  FaEnvelope,
  FaClock,
  FaBuilding,
} from 'react-icons/fa';
import { Link } from 'react-router-dom';
export default function Footer({ className = '' }) {
  return (
    <footer className={`footer bg-gray-600 text-white py-10 ${className}`}>
      <div className="footer-container max-w-7xl mx-auto px-6 grid grid-cols-1 sm:grid-cols-2 md:grid-cols-3 lg:grid-cols-6 gap-8">
        {/* Brand & Socials */}
        <div>
          <strong className="footer-brand text-xl block mt-5">
            Sanjaya Exports
          </strong>
          <p className="mt-2 text-sm" style={{ color: 'white' }}>
            © {new Date().getFullYear()} All rights reserved.
          </p>
          <div className="footer-socials flex gap-2  text-lg">
            <a href="#" aria-label="Facebook" className="hover:text-blue-500">
              <FaFacebookF />
            </a>
            <a href="#" aria-label="Instagram" className="hover:text-pink-500">
              <FaInstagram />
            </a>
            <a href="#" aria-label="Twitter" className="hover:text-sky-400">
              <FaTwitter />
            </a>
            <a href="#" aria-label="LinkedIn" className="hover:text-blue-400">
              <FaLinkedinIn />
            </a>
          </div>
        </div>

        {/* Links */}
        <div>
          <h4 className="font-semibold mb-3 dis ">Links</h4>
          <ul className="space-y-2 text-sm">
            <li>
              <Link to="/certificate" className="hover:text-gray-300">
                Certificates
              </Link>
            </li>
            <li>
              <Link to="/test-reports" className="hover:text-gray-300">
                Test Reports
              </Link>
            </li>
            <li>
              <Link to="/privacy-policy" className="hover:text-gray-300">
                Privacy Policy
              </Link>
            </li>
            <li>
              <Link to="/intended-use" className="hover:text-gray-300">
                Intended Use Disclaimer
              </Link>
            </li>
            <li>
              <Link to="/website-terms" className="hover:text-gray-300">
                Website Terms and Conditions
              </Link>
            </li>
            <li>
              <Link to="/terms-of-sale" className="hover:text-gray-300">
                Terms & Conditions Of Sale
              </Link>
            </li>
          </ul>
        </div>

        {/* Our Products */}
        <div>
          <h4 className="font-semibold mb-3 dis">Our Products</h4>
          <ul className="space-y-2 text-sm">
            <li>
              <Link to="/liner-bags/sanjaya-fresh-keeper">
                Sanjaya Agri Fresh Keeper
              </Link>
            </li>
            <li>
              <Link to="/liner-bags/sanjaya-fresh-keeper-bio">
                Sanjaya Agri Fresh Keeper Bio
              </Link>
            </li>
          </ul>
        </div>

        {/* Blogs */}
        <div className="margin-left:5px">
          <h4 className="font-semibold mb-3 dis">Blogs</h4>
          <ul className="space-y-2 text-sm">
            <li>
              <Link
                to="/sustainable-farming"
                className="hover:text-gray-300 block mb-2"
              >
                Sustainable Farming
              </Link>
            </li>
            <li>
              <Link
                to="/agritech-innovations"
                className="hover:text-gray-300 block"
              >
                AgriTech Innovations
              </Link>
            </li>
            <li>
              <Link
                to="/export-market-trends"
                className="hover:text-gray-300 block"
              >
                Export Market Trends
              </Link>
            </li>
          </ul>
        </div>

        {/* Leadership */}
        <div>
          <h4 className="font-semibold mb-3 dis">Leadership</h4>
          <ul className="space-y-2 text-sm list">
            <li>
              <Link to="/management-team" className="hover:text-gray-300">
                Management Team
              </Link>
            </li>
            <li>
              <Link to="/careers" className="hover:text-gray-300">
                Careers
              </Link>
            </li>
          </ul>
        </div>

        {/* Contact Info */}
        <div className="bg-gray-50 p-6 rounded-lg shadow-md max-w-md">
          <h4 className="text-xl font-semibold  border-b pb-2 dis">
            Contact Us
          </h4>
          <ul
            className="space-y-3 text-sm text-gray-700 "
            style={{ listStyle: 'none' }}
          >
            <li className="flex items-start">
              <FaMapMarkerAlt className="mr-2 mt-2 text-red-600" />
              <span> Nashik</span>
            </li>
            <li className="flex items-center">
              <FaPhoneAlt className="mr-2 text-blue-600" />
              <a
                href="tel:+91 87885 07929"
                className="text-blue-600 hover:underline"
              >
                +91 87885 07929
              </a>
            </li>
            <li className="flex items-center space-x-3">
              <div className="flex flex-col items-center">
                <FaEnvelope className="text-purple-600 text-xl" />
                <a
                  href="mailto:sales@sanjayafresh.com"
                  className="text-blue-600 hover:underline text-sm"
                >
                  &nbsp;sales@sanjayafresh.com
                </a>
              </div>
            </li>
          </ul>
        </div>
      </div>
    </footer>
  );
}
