import React from 'react';
import { Link } from 'react-router-dom';

const Footer: React.FC = () => {
  return (
    <footer className="bg-dark text-white">
      <div className="container py-4">
        <div className="text-center">
          {/* Social Media Icons */}
          <div className="mb-3">
            <a href="#" className="text-white-50 me-3">
              <i className="bi bi-facebook"></i>
            </a>
            <a href="#" className="text-white-50 me-3">
              <i className="bi bi-twitter"></i>
            </a>
            <a href="#" className="text-white-50 me-3">
              <i className="bi bi-instagram"></i>
            </a>
            <a href="#" className="text-white-50">
              <i className="bi bi-linkedin"></i>
            </a>
          </div>

          {/* Essential Links */}
          <div className="mb-3 small">
            <Link to="/about" className="text-decoration-none text-white-50 me-2">
              About
            </Link>
            <span className="text-white-50">•</span>
            <Link to="/faq" className="text-decoration-none text-white-50 mx-2">
              FAQ
            </Link>
            <span className="text-white-50">•</span>
            <Link to="/contact" className="text-decoration-none text-white-50 mx-2">
              Contact
            </Link>
            <span className="text-white-50">•</span>
            <Link to="/privacy" className="text-decoration-none text-white-50 mx-2">
              Privacy Policy
            </Link>
            <span className="text-white-50">•</span>
            <Link to="/terms" className="text-decoration-none text-white-50 ms-2">
              Terms of Service
            </Link>
          </div>

          {/* Copyright */}
          <p className="small text-white-50 mb-0">
            © 2025 Village Share. All rights reserved.
          </p>
        </div>
      </div>
    </footer>
  );
};

export default Footer;
