'use client'

import Link from 'next/link'
import { useLang } from '@/context/LangContext'
import { siteConfig } from '@/lib/site'

const LINK_HREFS = [
  ['#features', '#intelligence', '#cta', '/support'],
  ['/#how', '/#faq', '/support'],
  ['/imprint', '/privacy'],
]

export default function Footer() {
  const { t } = useLang()

  return (
    <footer className="footer" id="footer">
      <div className="container">
        <div className="footer-inner">
          <div>
            <Link href="/" className="nav-logo" style={{ fontSize: '1.5rem' }}>
              GREENLENS
            </Link>
            <p className="footer-brand-desc">{t.footer.brand}</p>
          </div>

          {t.footer.cols.map((col, ci) => (
            <div className="footer-col" key={col.title}>
              <div className="footer-col-title">{col.title}</div>
              {col.links.map((label, li) => (
                <Link key={label} href={LINK_HREFS[ci]?.[li] ?? '/support'}>
                  {label}
                </Link>
              ))}
            </div>
          ))}
        </div>

        <div className="footer-brand-xl" aria-hidden="true">GREENLENS</div>

        <div className="footer-bottom">
          <p>{t.footer.copy}</p>
          <a href={`mailto:${siteConfig.supportEmail}`} className="footer-contact">
            {siteConfig.supportEmail}
          </a>
        </div>
      </div>
    </footer>
  )
}