import type { Metadata } from "next";
import PageHero from "@/components/PageHero";
import { site } from "@/lib/site";

export const metadata: Metadata = { title: "Privacy Policy" };

const sections = [
  {
    title: "Information we collect",
    body: "When you place an order or create an account we collect your name, email address, and WhatsApp number. We use this information only to deliver your access, provide support, and manage your subscription.",
  },
  {
    title: "How we use your data",
    body: "Your data is used to process orders, deliver tool access, respond to support requests, and send essential service notifications. We never sell your personal information to third parties.",
  },
  {
    title: "Cookies",
    body: "We use essential cookies to keep you logged in and remember preferences such as your selected currency. No third-party advertising cookies are used.",
  },
  {
    title: "Data security",
    body: "Passwords are stored hashed, and order data is kept in a secured database. Access to customer data is limited to the support team members who need it.",
  },
  {
    title: "Contact",
    body: `For any privacy-related questions or data deletion requests, contact us at ${site.email} or via WhatsApp at ${site.whatsappDisplay}.`,
  },
];

export default function PrivacyPolicyPage() {
  return (
    <>
      <PageHero title="Privacy Policy" />
      <section className="bg-white py-14">
        <div className="mx-auto max-w-3xl space-y-8 px-4 sm:px-6 lg:px-8">
          {sections.map((s) => (
            <div key={s.title}>
              <h2 className="font-bold text-slate-900">{s.title}</h2>
              <p className="mt-2 text-sm leading-relaxed text-slate-600">{s.body}</p>
            </div>
          ))}
        </div>
      </section>
    </>
  );
}