import Link from 'next/link';
import { useTranslations } from 'next-intl';

export default function Footer() {
  const t = useTranslations('Footer');
  const currentYear = new Date().getFullYear();

  return (
    <footer className="bg-neutral text-text-secondary py-12 border-t border-neutral-dark">
      <div className="container mx-auto px-4">
        <div className="grid grid-cols-1 md:grid-cols-4 gap-8 mb-8">
          <div>
            <h4 className="text-lg font-bold text-text-primary mb-4">KLZ Cables</h4>
            <p className="mb-4">
              Raiffeisenstraße 22<br />
              73630 Remshalden<br />
              Germany
            </p>
            <p>
              <a href="tel:+4988192537298" className="hover:text-primary">+49 881 92537298</a><br />
              <a href="mailto:info@klz-vertriebs-gmbh.com" className="hover:text-primary">info@klz-vertriebs-gmbh.com</a>
            </p>
          </div>
          
          <div>
            <h4 className="text-lg font-bold text-text-primary mb-4">{t('legal')}</h4>
            <ul className="space-y-2">
              <li><Link href="/legal-notice" className="hover:text-primary">{t('legalNotice')}</Link></li>
              <li><Link href="/privacy-policy" className="hover:text-primary">{t('privacyPolicy')}</Link></li>
              <li><Link href="/terms" className="hover:text-primary">{t('terms')}</Link></li>
            </ul>
          </div>

          <div>
            <h4 className="text-lg font-bold text-text-primary mb-4">{t('products')}</h4>
            <ul className="space-y-2">
              <li><Link href="/products/low-voltage" className="hover:text-primary">{t('lowVoltage')}</Link></li>
              <li><Link href="/products/medium-voltage" className="hover:text-primary">{t('mediumVoltage')}</Link></li>
              <li><Link href="/products/high-voltage" className="hover:text-primary">{t('highVoltage')}</Link></li>
              <li><Link href="/products/solar" className="hover:text-primary">{t('solar')}</Link></li>
            </ul>
          </div>

          <div>
            <h4 className="text-lg font-bold text-text-primary mb-4">{t('followUs')}</h4>
            <div className="flex space-x-4">
              {/* Social Icons */}
              <a href="#" className="hover:text-primary">LinkedIn</a>
              <a href="#" className="hover:text-primary">Instagram</a>
            </div>
          </div>
        </div>
        
        <div className="border-t border-neutral-dark pt-8 text-center text-sm">
          <p>&copy; {currentYear} KLZ Cables. All rights reserved.</p>
        </div>
      </div>
    </footer>
  );
}
