import type { Metadata } from "next";
import { SectionTitle } from "@/components/section-title";
import { CookieSettingsButton } from "@/components/cookie-settings-button";
import { getSiteSettings } from "@/lib/data";
import { siteConfig } from "@/lib/site-config";
import { buildMetadata } from "@/lib/seo";

export async function generateMetadata(): Promise<Metadata> {
  return buildMetadata("/cerez-politikasi", {
    title: "Çerez Politikası",
    description:
      "Kovak Yazılım çerez politikası — KVKK ve GDPR uyumlu çerez kullanımı.",
  });
}

const CATEGORIES = [
  {
    title: "Zorunlu çerezler",
    description:
      "Web sitesinin temel işlevleri için gereklidir. Oturum yönetimi, güvenlik, form gönderimi gibi temel işlemler bu çerezler olmadan çalışamaz. Devre dışı bırakılamaz.",
    examples: ["kovak_session", "kovak_consent_v1"],
  },
  {
    title: "Analitik çerezler",
    description:
      "Web sitesi ziyaretçilerinin sitenizi nasıl kullandığını anlamamıza yardımcı olur. Toplanan veriler anonimdir ve istatistiksel amaçlıdır.",
    examples: ["_ga", "_gid", "_gat"],
  },
  {
    title: "Reklam çerezleri",
    description:
      "Sizinle ilgili olabilecek reklamların gösterilmesi ve reklam kampanyalarının performansının ölçülmesi amacıyla kullanılır.",
    examples: ["_gcl_au", "_fbp", "IDE", "ads/ga-audiences"],
  },
  {
    title: "Tercih çerezleri",
    description:
      "Dil, bölge veya görünüm tercihlerinizi hatırlamak için kullanılır.",
    examples: ["NID", "lang", "theme"],
  },
];

export default async function CookiePolicyPage() {
  const s = await getSiteSettings();
  const email = s?.contact_email ?? siteConfig.contact.email;
  const phone = s?.contact_phone ?? siteConfig.contact.phone;

  return (
    <div className="mx-auto max-w-3xl px-6 py-20">
      <SectionTitle
        align="left"
        eyebrow="Yasal"
        title="Çerez Politikası"
        description={`Son güncelleme: ${new Date().toLocaleDateString("tr-TR")}`}
      />

      <div className="mt-8 flex flex-wrap items-center gap-3 rounded-2xl border border-[var(--sky)]/30 bg-[var(--sky-50)] p-4">
        <p className="flex-1 text-sm text-[var(--navy)]">
          Çerez tercihlerinizi istediğiniz zaman değiştirebilirsiniz.
        </p>
        <CookieSettingsButton />
      </div>

      <article className="prose prose-base mt-10 max-w-none text-[var(--foreground)]">
        <h2>Çerez Nedir?</h2>
        <p>
          Çerezler (cookies), ziyaret ettiğiniz web siteleri tarafından
          tarayıcınız aracılığıyla cihazınıza kaydedilen küçük metin
          dosyalarıdır. Bu dosyalar sayesinde site, sizi sonraki ziyaretlerde
          tanır ve deneyiminizi kişiselleştirir.
        </p>

        <h2>Hangi Çerezleri Kullanıyoruz?</h2>
        <p>
          Sitemizde 4 farklı kategoride çerez kullanılmaktadır. Zorunlu çerezler
          dışındakileri çerez ayarları üzerinden devre dışı bırakabilirsiniz.
        </p>

        {CATEGORIES.map((c) => (
          <section key={c.title} className="not-prose mt-6 rounded-xl border border-[var(--border)] bg-white p-5">
            <h3 className="text-base font-semibold text-[var(--navy)]">
              {c.title}
            </h3>
            <p className="mt-2 text-sm leading-relaxed text-[var(--muted)]">
              {c.description}
            </p>
            <p className="mt-3 text-xs text-[var(--muted)]">
              <strong>Örnek çerezler:</strong>{" "}
              {c.examples.map((e, i) => (
                <span key={e}>
                  <code className="rounded bg-[var(--navy-50)] px-1.5 py-0.5 text-[var(--navy)]">
                    {e}
                  </code>
                  {i < c.examples.length - 1 && ", "}
                </span>
              ))}
            </p>
          </section>
        ))}

        <h2 className="mt-10">Çerezleri Nasıl Devre Dışı Bırakabilirim?</h2>
        <p>
          Tarayıcı ayarlarınızdan tüm çerezleri silebilir veya engelleyebilirsiniz.
          Ancak zorunlu çerezler devre dışı bırakıldığında sitemizin bazı bölümleri
          çalışmayabilir. Tercihlerinizi yönetmek için sayfanın altındaki "Çerez
          ayarları" butonunu kullanabilirsiniz.
        </p>

        <h2>KVKK Kapsamında Haklarınız</h2>
        <p>
          6698 sayılı Kişisel Verilerin Korunması Kanunu (KVKK) kapsamında
          aşağıdaki haklara sahipsiniz:
        </p>
        <ul>
          <li>Kişisel verilerinizin işlenip işlenmediğini öğrenme</li>
          <li>İşlenmişse buna ilişkin bilgi talep etme</li>
          <li>İşlenme amacını ve amacına uygun kullanılıp kullanılmadığını öğrenme</li>
          <li>Eksik veya yanlış işlenmiş verilerin düzeltilmesini isteme</li>
          <li>Silinmesini veya yok edilmesini isteme</li>
          <li>Kanuna aykırı işleme sonucu zarara uğramışsanız tazminat talep etme</li>
        </ul>

        <h2>İletişim</h2>
        <p>
          Çerez politikamız veya kişisel verilerinizin işlenmesi hakkında soru
          veya talepleriniz için bizimle iletişime geçebilirsiniz:
        </p>
        <ul>
          <li>
            E-posta: <a href={`mailto:${email}`}>{email}</a>
          </li>
          <li>Telefon: {phone}</li>
          <li>Adres: {s?.contact_address ?? siteConfig.contact.address}</li>
        </ul>
      </article>
    </div>
  );
}