import type { Metadata } from "next";
import { events } from "@/lib/data";

export const metadata: Metadata = {
  title: "События",
  description: "Афиша и специальные события КИЛН."
};

export default function EventsPage() {
  return (
    <section className="section">
      <div className="site-container">
        <p className="eyebrow">События</p>
        <h1 className="display-title mt-2 text-5xl md:text-7xl">Афиша КИЛН</h1>
        <div className="mt-8 grid gap-4">
          {events.length ? events.map((event) => (
            <article key={event.id} className="card p-5">
              <p className="text-sm text-kiln-flame">{event.date}</p>
              <h2 className="mt-2 text-2xl">{event.title}</h2>
              <p className="mt-2 muted">{event.description}</p>
            </article>
          )) : <p className="muted">Сейчас событий нет. Раздел можно скрыть из навигации до появления афиши.</p>}
        </div>
      </div>
    </section>
  );
}