// privacy.jsx — MilletsFit Privacy Policy page
// Uses window globals from brand.jsx + chrome.jsx: BRAND, serif, sans, mono,
// Eyebrow, WRAP, Reveal, SiteNav, SiteFooter
// Structure deliberately mirrors terms.jsx so the two legal pages read as a pair.

const PRIVACY_SECTIONS = [
  {
    title: "Who We Are",
    items: [
      "MilletsFit (“we”, “us”, “our”) operates milletsfit.com and provides millet-based meal plans and food delivery within the United Arab Emirates.",
      "We are based at Nooraniyah Building, Office 2F, Dubai, UAE.",
      "This policy explains what personal information we collect, why we collect it, who we share it with, and the choices you have.",
      "It applies to our website, our ordering and checkout process, and any communication you have with us by email or WhatsApp.",
    ],
  },
  {
    title: "Information You Give Us",
    items: [
      "Contact details: your name, email address and phone number.",
      "Delivery details: your delivery address, emirate, preferred delivery time window and preferred start date.",
      "Dietary information: any allergies or intolerances you tell us about, and your spice preference. We ask for these so our kitchen can prepare your meals safely and to your taste.",
      "Order details: the plans you choose, durations, quantities, and any promo, referral or affiliate code you apply.",
      "Anything else you choose to send us, such as a message over WhatsApp, an email to our support team, or a review you submit about a plan.",
    ],
  },
  {
    title: "Payment Information",
    items: [
      "Payments are processed by Stripe, a third-party payment provider.",
      "Your card details are entered on Stripe’s secure payment page — they are never entered on, sent to, or stored on our website or servers.",
      "We receive only a confirmation that payment succeeded, the amount paid, and a reference identifying the transaction.",
      "Stripe processes your payment data under its own privacy policy, available at stripe.com/privacy.",
    ],
  },
  {
    title: "Information Collected Automatically",
    items: [
      "Basic technical information such as your IP address, browser type, device type and the pages you visit on our site.",
      "Information collected through cookies and similar technologies, including the Meta (Facebook) Pixel and website analytics tools.",
      "This information helps us understand how our website is used, fix problems, and measure whether our advertising is working.",
    ],
  },
  {
    title: "Cookies & Tracking Technologies",
    items: [
      "Cookies are small files stored on your device that let a website remember your activity — for example, keeping items in your cart as you browse.",
      "We use essential cookies to make the site work, including remembering the contents of your shopping cart.",
      "We use the Meta (Facebook) Pixel, which tells Meta that you visited our website and which pages you viewed. This allows us to measure the performance of our advertising and show relevant ads to people who have shown interest in our meal plans.",
      "We may also use website analytics tools to understand visitor numbers and how people move through the site.",
      "You can block or delete cookies through your browser settings, and you can control how Meta uses your data for advertising through your Facebook or Instagram ad preferences. Blocking essential cookies may stop parts of the site, such as the cart, from working properly.",
    ],
  },
  {
    title: "How We Use Your Information",
    items: [
      "To prepare, process and deliver your meal plan orders.",
      "To pass allergy and spice preferences to our kitchen team so your meals are prepared safely and correctly.",
      "To send you order confirmations, delivery updates and other messages necessary to provide the service you have paid for.",
      "To respond to your questions and provide customer support.",
      "To validate promo codes, referrals and affiliate commissions.",
      "To measure and improve our website, our meal plans, and the effectiveness of our advertising.",
      "To meet our legal, accounting and tax obligations.",
    ],
  },
  {
    title: "Who We Share Your Information With",
    items: [
      "Stripe — to process your payment securely.",
      "Supabase — the database service where your order and account information is stored.",
      "Resend — the service we use to send order confirmation and delivery emails.",
      "Vercel — the platform that hosts our website.",
      "Meta Platforms — through the Meta Pixel, for advertising measurement and audience targeting, as described above.",
      "Our kitchen and delivery partners — who receive the details needed to prepare and deliver your order, including your name, address, contact number and any allergy or spice notes.",
      "Authorities or professional advisers where we are required to do so by law.",
      "We do not sell your personal information, and we do not share it with anyone for their own independent marketing purposes.",
    ],
  },
  {
    title: "How We Protect Your Information",
    items: [
      "Our website is served over an encrypted HTTPS connection.",
      "Access to our order database and admin dashboard is restricted to authorised team members and protected by login credentials.",
      "Card details never touch our systems — they are handled entirely by Stripe.",
      "No method of transmission or storage is completely secure, so while we take reasonable steps to protect your information, we cannot guarantee absolute security.",
    ],
  },
  {
    title: "How Long We Keep Your Information",
    items: [
      "We keep order and customer records for as long as needed to provide the service, handle any follow-up questions or disputes, and meet our legal and accounting obligations.",
      "Records no longer required for these purposes are deleted or anonymised.",
      "You can ask us to delete your information at any time — see “Your Rights” below.",
    ],
  },
  {
    title: "Your Rights",
    items: [
      "You can ask us for a copy of the personal information we hold about you.",
      "You can ask us to correct information that is wrong or out of date.",
      "You can ask us to delete your information, where we are not required to keep it by law.",
      "You can object to or ask us to restrict how we use your information.",
      "You can withdraw your consent to marketing communications at any time.",
      "To make any of these requests, email us at support@milletsfit.com. We will respond within a reasonable period.",
    ],
  },
  {
    title: "Marketing Communications",
    items: [
      "We may send you messages about your orders — these are necessary to deliver the service and are not marketing.",
      "If we send promotional messages about offers or new plans, you can opt out at any time by replying to the message or emailing support@milletsfit.com.",
      "Opting out of marketing does not stop order and delivery notifications.",
    ],
  },
  {
    title: "Children’s Privacy",
    items: [
      "Our services are intended for customers aged 18 and over.",
      "We do not knowingly collect personal information from children.",
      "If you believe a child has provided us with personal information, please contact us and we will delete it.",
    ],
  },
  {
    title: "Third-Party Links",
    items: [
      "Our website may link to other websites, such as our social media pages or WhatsApp.",
      "We are not responsible for the privacy practices or content of those websites.",
      "We recommend reading the privacy policy of any third-party website you visit.",
    ],
  },
  {
    title: "Changes to This Policy",
    items: [
      "We may update this Privacy Policy from time to time to reflect changes in our services or legal obligations.",
      "The date at the top of this page shows when it was last updated.",
      "Significant changes will be communicated on this page, and where appropriate, by email.",
    ],
  },
];

/* ── Intro ── */
function PrivacyIntro() {
  return (
    <section style={{ background: BRAND.cream, borderBottom: `1px solid ${BRAND.creamD}` }}>
      <div style={{ ...WRAP, paddingTop: 88, paddingBottom: 60 }}>
        <Reveal><Eyebrow style={{ color: BRAND.goldD }}>Legal · Last updated September 2026</Eyebrow></Reveal>
        <div className="mf-terms-head" style={{ display: "grid", gridTemplateColumns: "1.25fr 0.75fr", gap: 64, alignItems: "end", marginTop: 22 }}>
          <Reveal delay={60}>
            <h1 style={{ fontFamily: serif, fontWeight: 700, fontSize: 60, lineHeight: 1.04, color: BRAND.forest, margin: 0, letterSpacing: "-.015em", textWrap: "balance" }}>
              Privacy<br /><span style={{ fontStyle: "italic", fontWeight: 600, color: BRAND.greenMed }}>Policy.</span>
            </h1>
          </Reveal>
          <Reveal delay={140}>
            <p style={{ fontSize: 16, lineHeight: 1.75, color: BRAND.body, margin: 0, paddingBottom: 6 }}>
              This policy explains what information MilletsFit collects when you use milletsfit.com, why we collect it, and the choices you have over it.
            </p>
          </Reveal>
        </div>
      </div>
    </section>
  );
}

/* ── Preamble paragraphs ── */
function PrivacyPreamble() {
  return (
    <section style={{ ...WRAP, paddingTop: 64, paddingBottom: 32 }}>
      <div className="mf-terms-preamble" style={{ display: "grid", gridTemplateColumns: "0.32fr 0.68fr", gap: 56 }}>
        <Reveal>
          <div style={{ fontFamily: mono, fontSize: 12, letterSpacing: ".08em", color: BRAND.goldD, textTransform: "uppercase" }}>Preamble</div>
        </Reveal>
        <Reveal delay={80}>
          <div style={{ display: "flex", flexDirection: "column", gap: 18 }}>
            <p style={{ fontSize: 16, lineHeight: 1.78, color: BRAND.body, margin: 0 }}>
              MilletsFit (“Company”, “we”, “us”, or “our”) provides millet meal plans and food delivery services within the United Arab Emirates. We take the privacy of our customers seriously, and we only collect the information we genuinely need to cook and deliver your meals.
            </p>
            <p style={{ fontSize: 16, lineHeight: 1.78, color: BRAND.body, margin: 0 }}>
              This Privacy Policy applies to <a href="https://www.milletsfit.com" style={{ color: BRAND.forest, fontWeight: 600, textDecoration: "none", borderBottom: `1.5px solid ${BRAND.gold}` }}>www.milletsfit.com</a> and to any orders placed through it. It should be read alongside our <a href="/terms" style={{ color: BRAND.forest, fontWeight: 600, textDecoration: "none", borderBottom: `1.5px solid ${BRAND.gold}` }}>Terms &amp; Conditions</a>.
            </p>
            <p style={{ fontSize: 16, lineHeight: 1.78, color: BRAND.body, margin: 0 }}>
              By using our website or placing an order, you agree to the collection and use of information as described in this policy. If you do not agree, please do not use our Services.
            </p>
          </div>
        </Reveal>
      </div>
    </section>
  );
}

/* ── Numbered sections ── */
function PrivacySection({ n, title, items, delay }) {
  return (
    <Reveal delay={delay}>
      <article className="mf-terms-section" style={{ display: "grid", gridTemplateColumns: "0.32fr 0.68fr", gap: 56, padding: "44px 0", borderTop: `1px solid ${BRAND.creamD}` }}>
        <div>
          <div style={{ fontFamily: mono, fontSize: 12, letterSpacing: ".08em", color: BRAND.goldD, textTransform: "uppercase" }}>{n}</div>
          <h2 style={{ fontFamily: serif, fontWeight: 700, fontSize: 28, color: BRAND.forest, margin: "10px 0 0", letterSpacing: "-.01em", textWrap: "balance" }}>{title}</h2>
        </div>
        <ul style={{ listStyle: "none", margin: 0, padding: 0, display: "flex", flexDirection: "column", gap: 12 }}>
          {items.map((t, i) => (
            <li key={i} style={{ display: "grid", gridTemplateColumns: "auto 1fr", gap: 14, fontSize: 15.5, lineHeight: 1.72, color: BRAND.body }}>
              <span aria-hidden="true" style={{ marginTop: 11, width: 6, height: 6, borderRadius: 999, background: BRAND.gold, flexShrink: 0 }} />
              <span>{t}</span>
            </li>
          ))}
        </ul>
      </article>
    </Reveal>
  );
}

function PrivacyBody() {
  return (
    <section style={{ ...WRAP, paddingTop: 16, paddingBottom: 56 }}>
      {PRIVACY_SECTIONS.map((s, i) => (
        <PrivacySection key={s.title} n={String(i + 1).padStart(2, "0")} title={s.title} items={s.items} delay={i * 20} />
      ))}
    </section>
  );
}

/* ── Contact card ── */
function PrivacyContact() {
  return (
    <section style={{ ...WRAP, paddingBottom: 96 }}>
      <Reveal>
        <div className="mf-terms-section" style={{ display: "grid", gridTemplateColumns: "0.32fr 0.68fr", gap: 56, padding: "44px 0", borderTop: `1px solid ${BRAND.creamD}` }}>
          <div>
            <div style={{ fontFamily: mono, fontSize: 12, letterSpacing: ".08em", color: BRAND.goldD, textTransform: "uppercase" }}>{String(PRIVACY_SECTIONS.length + 1).padStart(2, "0")}</div>
            <h2 style={{ fontFamily: serif, fontWeight: 700, fontSize: 28, color: BRAND.forest, margin: "10px 0 0", letterSpacing: "-.01em" }}>Contact Us</h2>
          </div>
          <div>
            <p style={{ fontSize: 15.5, lineHeight: 1.72, color: BRAND.body, margin: "0 0 22px", maxWidth: 480 }}>
              Questions about this policy, or want to access, correct or delete your information? Get in touch — we read every message.
            </p>
            <dl className="mf-terms-contact" style={{ display: "grid", gridTemplateColumns: "auto 1fr", columnGap: 24, rowGap: 14, margin: 0, fontSize: 15.5 }}>
              <dt style={{ fontFamily: mono, fontSize: 11.5, letterSpacing: ".1em", textTransform: "uppercase", color: BRAND.goldD, alignSelf: "center" }}>Email</dt>
              <dd style={{ margin: 0 }}><a href="mailto:support@milletsfit.com" style={{ color: BRAND.forest, fontWeight: 600, textDecoration: "none", borderBottom: `1.5px solid ${BRAND.gold}` }}>support@milletsfit.com</a></dd>

              <dt style={{ fontFamily: mono, fontSize: 11.5, letterSpacing: ".1em", textTransform: "uppercase", color: BRAND.goldD, alignSelf: "center" }}>WhatsApp</dt>
              <dd style={{ margin: 0 }}><a href="tel:+971554177677" style={{ color: BRAND.forest, fontWeight: 600, textDecoration: "none", borderBottom: `1.5px solid ${BRAND.gold}` }}>+971 55 417 7677</a></dd>

              <dt style={{ fontFamily: mono, fontSize: 11.5, letterSpacing: ".1em", textTransform: "uppercase", color: BRAND.goldD, alignSelf: "center" }}>Address</dt>
              <dd style={{ margin: 0, color: BRAND.body }}>Nooraniyah Bldg, Office 2F, Dubai, UAE</dd>
            </dl>
          </div>
        </div>
      </Reveal>
    </section>
  );
}

function PrivacyPage() {
  return (
    <div data-screen-label="Privacy" style={{ background: BRAND.cream, fontFamily: sans, color: BRAND.ink, minHeight: "100vh" }}>
      <SiteNav active="" />
      <PrivacyIntro />
      <PrivacyPreamble />
      <PrivacyBody />
      <PrivacyContact />
      <SiteFooter />
    </div>
  );
}

Object.assign(window, { PrivacyPage });