import type { Metadata } from 'next'
import ContactForm from '@/components/ContactForm'
import PageCover from '@/components/PageCover'
import { site } from '@/lib/site'

export const metadata: Metadata = {
  title: 'Kapcsolat',
  description: `Böszörményi Kovács Zsolt esküvői ceremóniamester elérhetőségei — ${site.city}, ${site.phone}`,
  alternates: { canonical: '/kapcsolat' },
}

export default function KapcsolatPage() {
  return (
    <>
      <PageCover image="/images/zsoltiacm_kapcolat_banner.png" title="Kapcsolat" />

      <section className="site-section">
        <div className="container">
          <div
            style={{
              display: 'grid',
              gridTemplateColumns: 'minmax(0, 7fr) minmax(0, 4fr)',
              gap: '2rem',
            }}
            className="contact-grid"
          >
            <ContactForm />

            <aside>
              <div style={{ padding: '1.5rem', background: '#fff' }}>
                <p style={{ margin: 0, fontWeight: 700, color: '#000' }}>Cím: {site.city}</p>
                <p style={{ margin: 0, fontWeight: 700, color: '#000' }}>
                  Telefonszám: <a href={site.phoneHref} style={{ color: '#000' }}>{site.phone}</a>
                </p>
                <p style={{ margin: 0, fontWeight: 700, color: '#000' }}>
                  Email cím:{' '}
                  <a href={`mailto:${site.email}`} style={{ color: '#000' }}>
                    {site.email}
                  </a>
                </p>
              </div>
            </aside>
          </div>
        </div>
      </section>
    </>
  )
}