import React from 'react';
import { Facebook, Instagram, Youtube } from 'lucide-react';

const Footer = () => {
  return (
    <footer className="bg-bulls-light-gray py-12">
      <div className="container mx-auto px-4">
        <div className="text-center mb-8">
          <p className="text-sm text-gray-600 mb-4">
            ONLY DEALERS, NEVER ONLINE STORES | FIND YOUR DEALER
          </p>
          <div className="flex justify-center space-x-6">
            <Facebook className="w-6 h-6 text-gray-600 hover:text-bulls-blue cursor-pointer" />
            <Instagram className="w-6 h-6 text-gray-600 hover:text-bulls-blue cursor-pointer" />
            <Youtube className="w-6 h-6 text-gray-600 hover:text-bulls-blue cursor-pointer" />
          </div>
        </div>
        
        <div className="border-t border-gray-300 pt-8">
          <div className="flex flex-col md:flex-row justify-between items-center space-y-4 md:space-y-0">
            <div className="flex flex-wrap justify-center md:justify-start space-x-6 text-sm">
              <a href="#" className="text-gray-600 hover:text-bulls-blue">IMPRINT</a>
              <a href="#" className="text-gray-600 hover:text-bulls-blue">DATA PRIVACY NOTICE</a>
              <a href="#" className="text-gray-600 hover:text-bulls-blue">COOKIES</a>
            </div>
            <div className="flex items-center space-x-4">
              <div className="w-8 h-6 bg-gray-300 rounded"></div>
              <span className="text-sm text-gray-600">Deutschland</span>
            </div>
          </div>
          
          <div className="mt-8 text-center text-xs text-gray-500">
            <p className="mb-2">
              * Prices are non-binding recommended retail prices including VAT.
            </p>
            <p>
              Actual prices may vary and are determined by the respective BULLS dealer. Subject to technical changes, errors and omissions.
            </p>
          </div>
        </div>
      </div>
    </footer>
  );
};

export default Footer;