'use client'

import Link from 'next/link'
import { useLanguage } from '@/lib/LanguageContext'
import { useTheme } from '@/lib/ThemeContext'

interface FooterProps {
  className?: string
  onOpenCookieSettings?: () => void
}

export function Footer({ className = '', onOpenCookieSettings }: FooterProps) {
  const { t } = useLanguage()
  const { isDark } = useTheme()

  const handleCookieClick = (e: React.MouseEvent) => {
    e.preventDefault()
    if (onOpenCookieSettings) {
      onOpenCookieSettings()
    } else {
      // Fallback: Alert wenn kein Handler definiert
      alert('Cookie-Banner wird hier geoeffnet (noch nicht implementiert)')
    }
  }

  return (
    <footer className={`mt-auto ${className}`}>
      <div className={`
        ${isDark
          ? 'bg-white/5 border-white/10'
          : 'bg-black/5 border-black/10'
        }
        backdrop-blur-xl border-t py-6 px-8
      `}>
        <div className="max-w-7xl mx-auto">
          <div className="flex flex-col md:flex-row items-center justify-between gap-4">
            {/* Links - Rechtlich notwendig */}
            <nav className="flex flex-wrap items-center justify-center gap-6">
              <Link
                href="/impressum"
                className={`text-sm hover:underline transition-colors ${
                  isDark ? 'text-white/60 hover:text-white' : 'text-black/60 hover:text-black'
                }`}
              >
                {t('imprint')}
              </Link>
              <Link
                href="/datenschutz"
                className={`text-sm hover:underline transition-colors ${
                  isDark ? 'text-white/60 hover:text-white' : 'text-black/60 hover:text-black'
                }`}
              >
                {t('privacy')}
              </Link>
              <Link
                href="/agb"
                className={`text-sm hover:underline transition-colors ${
                  isDark ? 'text-white/60 hover:text-white' : 'text-black/60 hover:text-black'
                }`}
              >
                {t('legal')}
              </Link>
              <Link
                href="/kontakt"
                className={`text-sm hover:underline transition-colors ${
                  isDark ? 'text-white/60 hover:text-white' : 'text-black/60 hover:text-black'
                }`}
              >
                {t('contact')}
              </Link>
              <button
                onClick={handleCookieClick}
                className={`text-sm hover:underline transition-colors ${
                  isDark ? 'text-white/60 hover:text-white' : 'text-black/60 hover:text-black'
                }`}
              >
                {t('cookie_settings')}
              </button>
            </nav>

            {/* Copyright */}
            <p className={`text-sm ${isDark ? 'text-white/40' : 'text-black/40'}`}>
              {t('copyright')}
            </p>
          </div>
        </div>
      </div>
    </footer>
  )
}