import type { Metadata } from "next";
import Link from "next/link";
import StaticPageLayout from "@/components/layout/StaticPageLayout";
import FaqAccordion from "@/components/content/FaqAccordion";
import { faqItems, faqCategories } from "@/data/faq";

export const metadata: Metadata = {
  title: "Sıkça Sorulan Sorular (SSS) | yakınımda.tr",
  description:
    "yakınımda.tr hakkında sık sorulan sorular. Konum, nöbetçi eczane, gizlilik ve ücretsiz kullanım.",
};

export default function SssPage() {
  return (
    <StaticPageLayout
      badge="SSS"
      title="Sıkça Sorulan Sorular"
      subtitle="yakınımda.tr kullanımı, konum gizliliği ve arama sonuçları hakkında merak edilenler."
      breadcrumbs={[{ label: "SSS" }]}
    >
      <div className="mb-10 space-y-10">
        {faqCategories.map((cat) => {
          const items = faqItems.filter((i) => i.category === cat);
          return (
            <section key={cat}>
              <h2 className="mb-4 text-xl font-bold text-white">{cat}</h2>
              <FaqAccordion items={items} />
            </section>
          );
        })}
      </div>

      <div className="content-card text-center">
        <p className="text-slate-400">Sorunuz mu var?</p>
        <Link
          href="/iletisim"
          className="mt-3 inline-block font-semibold text-emerald-400 hover:text-emerald-300"
        >
          Bize ulaşın →
        </Link>
      </div>
    </StaticPageLayout>
  );
}