import React from 'react';
import { Send, MapPin, Mail, Phone } from 'lucide-react';
import { Link, useLocation } from 'react-router-dom';

const Footer: React.FC = () => {
  const currentYear = new Date().getFullYear();
  const location = useLocation();
  const isEnglish = location.pathname.startsWith('/en');
  const prefix = isEnglish ? '/en' : '';

  return (
    <footer className="bg-[#1a0f0f] text-white py-20 rounded-t-[3rem] mt-auto" id="contacts">
      <div className="container mx-auto px-6">
        <div className="flex flex-col lg:flex-row gap-20">
          
          {/* Contacts Section with Accent */}
          <div className="lg:w-1/2">
            <h2 className="text-4xl font-bold mb-8 text-brand-orange">
              {isEnglish ? 'Get in touch with us' : 'Свяжитесь с нами'}
            </h2>
            <p className="text-gray-300 text-lg mb-10 max-w-md">
              {isEnglish
                ? 'We are ready to answer your questions and offer the best solutions for your project.'
                : 'Готовы ответить на ваши вопросы и предложить лучшие решения для вашего проекта'}
            </p>

            <div className="space-y-6 max-w-md">
              <a 
                href="tel:83472927370" 
                className="flex items-start gap-4 p-6 bg-brand-orange/10 border border-brand-orange/30 rounded-2xl hover:bg-brand-orange hover:scale-105 transition-all duration-300 group"
              >
                <Phone size={28} className="text-brand-orange group-hover:text-white flex-shrink-0" />
                <div>
                  <p className="text-xs text-gray-400 mb-1 group-hover:text-white/80">
                    {isEnglish ? 'Phone' : 'Телефон'}
                  </p>
                  <p className="text-xl font-bold text-white">8 (347) 292 73 70</p>
                  <p className="text-sm text-gray-400 mt-1 group-hover:text-white/70">
                    {isEnglish ? 'Call us from 9:00 to 18:00' : 'Звоните с 9:00 до 18:00'}
                  </p>
                </div>
              </a>

              <a 
                href="mailto:gw@geowektor.ru" 
                className="flex items-start gap-4 p-6 bg-brand-orange/10 border border-brand-orange/30 rounded-2xl hover:bg-brand-orange hover:scale-105 transition-all duration-300 group"
              >
                <Mail size={28} className="text-brand-orange group-hover:text-white flex-shrink-0" />
                <div>
                  <p className="text-xs text-gray-400 mb-1 group-hover:text-white/80">Email</p>
                  <p className="text-xl font-bold text-white">gw@geowektor.ru</p>
                  <p className="text-sm text-gray-400 mt-1 group-hover:text-white/70">
                    {isEnglish ? 'We typically respond within one hour' : 'Ответим в течение часа'}
                  </p>
                </div>
              </a>

              <div className="flex items-start gap-4 p-6 bg-brand-orange/10 border border-brand-orange/30 rounded-2xl">
                <MapPin size={28} className="text-brand-orange flex-shrink-0" />
                <div>
                  <p className="text-xs text-gray-400 mb-1">
                    {isEnglish ? 'Address' : 'Адрес'}
                  </p>
                  <p className="text-lg font-bold text-white">
                    {isEnglish ? '450001, RB, Ufa' : '450001, РБ, г. Уфа'}
                  </p>
                  <p className="text-white/90">
                    {isEnglish ? '19/1 Komsomolskaya St.' : 'ул. Комсомольская 19/1'}
                  </p>
                </div>
              </div>
            </div>
          </div>

          {/* Links & Social Section */}
            <div className="lg:w-1/2 grid grid-cols-1 md:grid-cols-3 gap-8">
            {/* Основная навигация */}
            <div>
              <h4 className="font-bold mb-6 text-lg">
                {isEnglish ? 'Company' : 'Компания'}
              </h4>
              <ul className="space-y-3 text-sm text-gray-400">
                <li>
                  <Link to={isEnglish ? '/en' : '/'} className="hover:text-brand-orange transition-colors">
                    {isEnglish ? 'Home' : 'Главная'}
                  </Link>
                </li>
                <li>
                  <Link to={`${prefix}/about`} className="hover:text-brand-orange transition-colors">
                    {isEnglish ? 'About' : 'О компании'}
                  </Link>
                </li>
                <li>
                  <Link to={`${prefix}/projects`} className="hover:text-brand-orange transition-colors">
                    {isEnglish ? 'Projects' : 'Проекты'}
                  </Link>
                </li>
                <li>
                  <Link to={`${prefix}/fleet`} className="hover:text-brand-orange transition-colors">
                    {isEnglish ? 'Fleet' : 'Автопарк'}
                  </Link>
                </li>
                <li>
                  <Link to={`${prefix}/certificates`} className="hover:text-brand-orange transition-colors">
                    {isEnglish ? 'Certificates' : 'Сертификаты'}
                  </Link>
                </li>
                <li>
                  <Link to={`${prefix}/contacts`} className="hover:text-brand-orange transition-colors">
                    {isEnglish ? 'Contacts' : 'Контакты'}
                  </Link>
                </li>
              </ul>
            </div>

            {/* Услуги */}
            <div>
              <h4 className="font-bold mb-6 text-lg">
                {isEnglish ? 'Services' : 'Услуги'}
              </h4>
              <ul className="space-y-3 text-sm text-gray-400">
                <li>
                  <Link to={`${prefix}/services`} className="hover:text-brand-orange transition-colors">
                    {isEnglish ? 'All services' : 'Все услуги'}
                  </Link>
                </li>
                <li>
                  <Link to={`${prefix}/services/surveying`} className="hover:text-brand-orange transition-colors">
                    {isEnglish ? 'Engineering surveys' : 'Инженерные изыскания'}
                  </Link>
                </li>
                <li>
                  <Link to={`${prefix}/services/design`} className="hover:text-brand-orange transition-colors">
                    {isEnglish ? 'Design' : 'Проектирование'}
                  </Link>
                </li>
                <li>
                  <Link to={`${prefix}/services/construction`} className="hover:text-brand-orange transition-colors">
                    {isEnglish ? 'Construction' : 'Строительство'}
                  </Link>
                </li>
                <li>
                  <Link to={`${prefix}/services/soil-survey`} className="hover:text-brand-orange transition-colors">
                    {isEnglish ? 'Soil investigation' : 'Обследование грунтов'}
                  </Link>
                </li>
                <li>
                  <Link to={`${prefix}/services/building-survey`} className="hover:text-brand-orange transition-colors">
                    {isEnglish ? 'Building survey' : 'Обследование зданий'}
                  </Link>
                </li>
                <li>
                  <Link to={`${prefix}/services/land-survey`} className="hover:text-brand-orange transition-colors">
                    {isEnglish ? 'Cadastral works' : 'Кадастровые работы'}
                  </Link>
                </li>
              </ul>
            </div>

            {/* Лаборатории и соцсети */}
            <div>
              <h4 className="font-bold mb-6 text-lg">
                {isEnglish ? 'Laboratories' : 'Лаборатории'}
              </h4>
              <ul className="space-y-3 text-sm text-gray-400 mb-8">
                <li>
                  <Link to={`${prefix}/laboratories/soil`} className="hover:text-brand-orange transition-colors">
                    {isEnglish ? 'Soil testing laboratory' : 'Грунтовая лаборатория'}
                  </Link>
                </li>
                <li>
                  <Link to={`${prefix}/laboratories/radiation`} className="hover:text-brand-orange transition-colors">
                    {isEnglish ? 'Radiation laboratory' : 'Радиационная лаборатория'}
                  </Link>
                </li>
              </ul>

              <h4 className="font-bold mb-4 text-lg">
                {isEnglish ? 'Find us online' : 'Мы в интернете'}
              </h4>
              <div className="flex gap-4 mb-8">
                <a 
                  href="https://t.me/ooo_geo_wektor" 
                  target="_blank" 
                  rel="noopener noreferrer"
                  className="w-12 h-12 rounded-full bg-brand-orange flex items-center justify-center text-white cursor-pointer hover:bg-white hover:text-brand-orange transition-all transform hover:scale-110"
                  title="Telegram"
                >
                  <Send size={22} />
                </a>
                <a 
                  href="https://vk.com/geowektor_ru" 
                  target="_blank" 
                  rel="noopener noreferrer"
                  className="w-12 h-12 rounded-full bg-brand-orange flex items-center justify-center text-white cursor-pointer hover:bg-white hover:text-brand-orange transition-all transform hover:scale-110"
                  title="VK"
                >
                  <div className="font-bold text-sm">Vk</div>
                </a>
              </div>
              
              <div className="space-y-3 text-sm">
                <Link 
                  to={`${prefix}/privacy-policy`} 
                  className="text-gray-400 hover:text-brand-orange transition-colors block"
                >
                  {isEnglish ? 'Privacy policy' : 'Политика конфиденциальности'}
                </Link>
              </div>
              
              <div className="mt-8 text-xs text-gray-600">
                 ©{currentYear} ООО «ГеоВектор».<br />
                 {isEnglish ? 'All rights reserved.' : 'Все права защищены.'}
              </div>
            </div>
          </div>

        </div>
      </div>
    </footer>
  );
};

export default Footer;