/* Loops — Privacy page. Footer-linked legal document.
   Mirrors the Terms page pattern: minimal nav, header with last-updated line,
   sticky table of contents + prose column, shared Footer.
   UK English, no em dashes. */

const PRIVACY_UPDATED = "28 May 2026";

/* Block types: p | ul | defs | callout | contact */

const PRIVACY_SECTIONS = [
  {
    id: "who-we-are",
    title: "Who we are",
    blocks: [
      { type: "p", text: "Loops Work Limited makes Loops. We're based at 21C Forde Park, Devon, TQ12 1DD. Our company number is 17243893." },
      { type: "p", text: "If you have questions about how we handle your information, email privacy@loops.work or write to us at the address above." },
    ],
  },
  {
    id: "how-we-think",
    title: "How we think about your information",
    blocks: [
      { type: "defs", items: [
        { term: "Your information is yours", desc: "We hold it to provide Loops to you, and for nothing else." },
        { term: "You can see your information", desc: "Loops shows you exactly what we know about you, including what the coach knows about you." },
        { term: "You can delete your information", desc: "Any time. Specific items, or everything. When you delete it, we delete it." },
        { term: "We don't sell your information", desc: "Ever." },
        { term: "We don't use your conversations to train AI", desc: "We use as little information as we can get away with while still providing Loops well, and we're honest with you about what we use and why." },
      ]},
    ],
  },
  {
    id: "what-we-collect",
    title: "What we collect",
    blocks: [
      { type: "defs", items: [
        { term: "When you sign up", desc: "Your email address, your name (if you give it), and your password (stored in an encrypted form, never as readable text)." },
        { term: "When you subscribe", desc: "Your subscription plan, what you've paid, and a reference from our payment provider. We don't store your full card details; the payment provider does that." },
        { term: "What you create in Loops", desc: "Your goals, your loops, your journal entries, your wins, your conversations with the coach." },
        { term: "Your working document", desc: "When you start with Loops, you do a discovery conversation that helps the coach understand you. The document this produces is part of your context." },
        { term: "How you use the app", desc: "Which features you use, when you open Loops, how long you spend, what you respond to. We use this to make Loops better." },
        { term: "Technical bits", desc: "Your device, your operating system, your app version, your IP address (for security only), and crash reports." },
        { term: "When you talk to us", desc: "We keep a record of our conversations with you." },
        { term: "Optional bits", desc: "Some things are optional, like whether you tell us you have ADHD. This helps the coach work better for you. You don't have to share it, and you can change it any time." },
      ]},
      { type: "p", text: "We don't collect sensitive information about you (health, ethnicity, religion, sexuality, politics) unless you choose to share it in your content or with the coach. If you do share it, we treat it with extra care." },
    ],
  },
  {
    id: "how-we-use",
    title: "How we use your information",
    blocks: [
      { type: "defs", items: [
        { term: "To provide Loops", desc: "Everything from logging you in to giving you a coach who knows your context. This is what you've paid for (or what we provide on the Free plan)." },
        { term: "To make Loops better", desc: "We look at how people use the app (in ways that don't identify individuals) so we can improve it. You can switch this off in your settings." },
        { term: "To talk to you about Loops", desc: "Things like password resets, billing, and important changes. If you opt in, we also send occasional updates about new features. You can unsubscribe from those at any time." },
        { term: "To keep Loops safe", desc: "We use patterns and content analysis to spot harmful use, including people who might be in crisis. This is so we can help where appropriate." },
        { term: "To follow the law", desc: "Things like responding to legitimate requests from authorities and keeping records for tax purposes." },
      ]},
      { type: "p", text: "That's it. No other uses without telling you first and asking your permission." },
    ],
  },
  {
    id: "the-coach",
    title: "The coach, specifically",
    blocks: [
      { type: "p", text: "The coach is central to Loops, so we want to be really clear about how this works." },
      { type: "defs", items: [
        { term: "What the coach sees", desc: "When you have a conversation, the coach has access to your working document, your goals, your recent loops, your recent journal entries, your wins log, your previous conversations with the coach, and the coaching skills relevant to your situation. This personal context is what makes the coach actually useful." },
        { term: "What you can see", desc: "There's a view in the app that shows you exactly what the coach has in its context: the working document, the data summary, recent conversations. Nothing about your coach context is hidden from you. You can look at any time." },
        { term: "What you can change or delete", desc: "You can edit your working document. You can delete specific journal entries, loops, or goals. You can clear conversation history with the coach. You can stop specific things being included in coach context. The controls are in your settings." },
        { term: "How the coach is powered", desc: "We use AI from trusted providers (right now, Anthropic). When you talk to the coach, your message and the relevant context go to the AI provider's servers to generate the reply." },
        { term: "What our providers do with your information", desc: "Our agreement with the AI provider says they can't use your conversations to train AI, and they have to delete the conversation data after a short period. We only use providers who agree to this. Details are in our help centre." },
        { term: "What we never do", desc: "We never use your conversations to train AI. We never share your conversations with anyone except the AI provider (and only to generate a reply). We never sell access to your data. Your conversations are private to you." },
      ]},
    ],
  },
  {
    id: "who-else-sees",
    title: "Who else sees your information",
    blocks: [
      { type: "p", text: "We share your information only when one of these is true:" },
      { type: "defs", items: [
        { term: "We need a service provider to help us run Loops", desc: "Hosting (Amazon Web Services), payments (Stripe), the AI (Anthropic), email, customer support, analytics. These companies handle your data on our behalf and have to protect it. The current list is in our help centre." },
        { term: "The law requires it", desc: "Court orders, legitimate requests from authorities, that kind of thing." },
        { term: "It's needed for safety", desc: "To prevent harm, fraud, or illegal activity, or to protect people." },
        { term: "Something happens to our business", desc: "If Loops gets bought or merges with another company, your information might go with the business. We'd tell you if this happened and your rights here would be protected." },
      ]},
      { type: "p", text: "We do not sell your information to advertisers, data brokers, or anyone else. Ever." },
    ],
  },
  {
    id: "where-it-goes",
    title: "Where your information goes",
    blocks: [
      { type: "p", text: "Loops is run from the UK. Some of our service providers operate elsewhere, including the US and Europe. When your information goes outside the UK, we use protections approved by UK regulators to keep it safe." },
    ],
  },
  {
    id: "how-long",
    title: "How long we keep your information",
    blocks: [
      { type: "defs", items: [
        { term: "While your account is active", desc: "Your information stays." },
        { term: "When you delete your account", desc: "We delete your information within 30 days." },
        { term: "Some things stick around longer", desc: "Financial records (six years, for tax). Legal records (as long as the law requires). Aggregate information that doesn't identify you (no longer counts as your personal data)." },
        { term: "When you delete specific items", desc: "Gone from the app right away, gone from our systems within 30 days." },
        { term: "Backups", desc: "Deleted information might stay in encrypted backups for up to 90 days. These backups are only used if something goes catastrophically wrong with our systems, and they're deleted on a rolling schedule." },
      ]},
    ],
  },
  {
    id: "your-rights",
    title: "Your rights",
    blocks: [
      { type: "p", text: "UK law gives you specific rights over your information. Here they are:" },
      { type: "defs", items: [
        { term: "Knowing what we have", desc: "This document explains it. The transparency view in the app shows you most of it directly." },
        { term: "Getting a copy", desc: "Ask us and we'll send you everything we have about you within 30 days. Email privacy@loops.work." },
        { term: "Fixing mistakes", desc: "If something we have about you is wrong, you can correct it in the app or ask us to." },
        { term: "Deleting your data", desc: "You can delete your account and everything in it. Some things we have to keep for legal reasons (like financial records), and we'll explain those." },
        { term: "Limiting what we do", desc: "In certain situations, you can tell us to stop using your data without deleting it." },
        { term: "Taking your data somewhere else", desc: "You can ask us for your data in a format you can transfer to another service." },
        { term: "Saying no", desc: "You can say no to specific uses of your data, including marketing and analytics." },
        { term: "Decisions about you", desc: "Loops doesn't make automatic decisions about you with legal effects. The coach gives you advice and support; you make your own decisions." },
      ]},
      { type: "p", text: "To use any of these rights, email privacy@loops.work. We'll respond within 30 days. There's no charge." },
      { type: "p", text: "If you're not happy with how we've handled your data, you can complain to the UK Information Commissioner's Office at ico.org.uk." },
    ],
  },
  {
    id: "children",
    title: "Children",
    blocks: [
      { type: "p", text: "Loops is not for under-18s. We don't knowingly collect data from children. If we find out we have, we'll delete it." },
      { type: "p", text: "If you're a parent or guardian and you think your child has used Loops, please email us at privacy@loops.work." },
    ],
  },
  {
    id: "security",
    title: "Security",
    blocks: [
      { type: "p", text: "We take security seriously. Specifically:" },
      { type: "ul", items: [
        "Your information is encrypted both when it's moving (HTTPS everywhere) and when it's stored",
        "Strong passwords and the option to add two-factor authentication",
        "Regular security testing",
        "Strict internal limits on who can access user data, with audit trails",
        "Procedures for catching and responding to security problems quickly",
      ]},
      { type: "p", text: "If something goes wrong with security and your data is affected, we'll tell you within 72 hours of finding out. That's the law." },
    ],
  },
  {
    id: "changes",
    title: "When we change this",
    blocks: [
      { type: "p", text: "We'll update this sometimes. When we make important changes, we'll:" },
      { type: "ul", items: [
        "Tell you in the app",
        "Email you (if we have your email)",
        "Update the date at the bottom",
      ]},
      { type: "p", text: "The latest version is always at loops.work/privacy." },
    ],
  },
  {
    id: "contact",
    title: "Contact",
    blocks: [
      { type: "contact" },
    ],
  },
];

/* ---------------- Nav ---------------- */

const PrivacyNav = () => {
  const [scrolled, setScrolled] = React.useState(false);
  React.useEffect(() => {
    const onScroll = () => setScrolled(window.scrollY > 8);
    onScroll();
    window.addEventListener("scroll", onScroll, { passive: true });
    return () => window.removeEventListener("scroll", onScroll);
  }, []);

  return (
    <header className="sticky top-0 z-50">
      <div className={`nav-blur transition-colors duration-300 ${scrolled ? "border-b border-line/80" : "border-b border-transparent"}`}>
        <Container className="flex h-[64px] items-center justify-between gap-6">
          <a href="/" aria-label="Loops home" className="focus-ring inline-flex items-center rounded-pill">
            <img src="/assets/loops-logo-beta.png" alt="Loops" className="h-7 w-auto" width="100" height="28" />
          </a>
          <div className="flex items-center gap-3">
            <a href="/adhd/knowledge-hub/" className="hidden sm:inline focus-ring rounded-pill px-3 py-2 text-[13.5px] font-medium text-ink-2 hover:text-ink transition-colors">Knowledge Hub</a>
            <Button variant="primary" size="md" href="/#download">Get Early Access</Button>
          </div>
        </Container>
      </div>
    </header>
  );
};

/* ---------------- Header ---------------- */

const PrivacyHeader = () => (
  <section id="top" aria-label="Header" className="relative overflow-hidden">
    <div aria-hidden="true" className="absolute inset-0 -z-10 hero-halo"></div>
    <Container className="pt-14 lg:pt-18 pb-10 lg:pb-12">
      <div className="max-w-prose">
        <Kicker>Legal</Kicker>
        <h1 className="mt-5 text-balance text-ink font-bold tracking-tight3 leading-[1.06] text-[32px] sm:text-[42px] lg:text-[48px]">
          Privacy: how we handle your information
        </h1>
        <p className="mt-6 text-[18px] sm:text-[19px] leading-[1.6] text-ink-2 text-pretty">
          Your information is yours. We hold it to provide Loops to you, and for nothing else. Here's exactly what we collect, how we use it, and the control you have over it.
        </p>
        <p className="mt-5 text-[13.5px] font-medium uppercase tracking-[0.1em] text-ink-3">
          Last updated {PRIVACY_UPDATED}
        </p>
      </div>
    </Container>
  </section>
);

/* ---------------- Block renderers ---------------- */

const PrivacyBlock = ({ block }) => {
  if (block.type === "p") {
    return <p className="text-[16.5px] leading-[1.72] text-ink-2 text-pretty">{block.text}</p>;
  }
  if (block.type === "ul") {
    return (
      <ul className="flex flex-col gap-2.5">
        {block.items.map((it, i) => (
          <li key={i} className="flex gap-3 text-[16.5px] leading-[1.65] text-ink-2 text-pretty">
            <span aria-hidden="true" className="mt-[10px] h-1.5 w-1.5 shrink-0 rounded-full bg-brand"></span>
            <span>{it}</span>
          </li>
        ))}
      </ul>
    );
  }
  if (block.type === "defs") {
    return (
      <dl className="flex flex-col gap-4">
        {block.items.map((it, i) => (
          <div key={i} className="rounded-tile border border-line bg-white p-4 sm:p-5 shadow-soft">
            <dt className="text-[15.5px] font-semibold tracking-tight2 text-ink">{it.term}</dt>
            <dd className="mt-1.5 text-[15.5px] leading-[1.65] text-ink-2 text-pretty">{it.desc}</dd>
          </div>
        ))}
      </dl>
    );
  }
  if (block.type === "contact") {
    return (
      <div className="rounded-card border border-line bg-white p-6 sm:p-7 shadow-soft">
        <p className="text-[16.5px] font-semibold tracking-tight2 text-ink">Loops Work Limited</p>
        <p className="mt-3 text-[15.5px] leading-[1.65] text-ink-2">
          Email: <a href="mailto:privacy@loops.work" className="font-semibold text-brand-deep hover:underline">privacy@loops.work</a>
        </p>
        <p className="mt-1 text-[15.5px] leading-[1.65] text-ink-2">Post: Loops Work Limited, 21C Forde Park, Devon, TQ12 1DD</p>
        <p className="mt-3 text-[15.5px] leading-[1.65] text-ink-2">We don't have a separate Data Protection Officer; the company directors handle data matters. For data questions, email privacy@loops.work.</p>
        <p className="mt-3 text-[15.5px] leading-[1.65] text-ink-2">You can also contact the UK Information Commissioner's Office at ico.org.uk.</p>
      </div>
    );
  }
  return null;
};

const PrivacySection = ({ section }) => (
  <section id={section.id} className="scroll-mt-24 border-t border-line pt-9 sm:pt-11 first:border-t-0 first:pt-0">
    <h2 className="text-[22px] sm:text-[26px] font-semibold tracking-tight2 text-ink leading-tight">{section.title}</h2>
    <div className="mt-5 flex flex-col gap-4">
      {section.blocks.map((b, i) => <PrivacyBlock key={i} block={b} />)}
    </div>
  </section>
);

/* ---------------- Table of contents ---------------- */

const PrivacyToc = () => (
  <nav aria-label="On this page" className="lg:sticky lg:top-24">
    <p className="text-[12px] font-semibold uppercase tracking-[0.12em] text-ink-3">On this page</p>
    <ul className="mt-4 flex flex-col gap-0.5">
      {PRIVACY_SECTIONS.map((s) => (
        <li key={s.id}>
          <a href={`#${s.id}`} className="focus-ring block rounded-tile px-3 py-2 -mx-3 text-[14px] leading-snug text-ink-2 hover:text-ink hover:bg-soft transition-colors">
            {s.title}
          </a>
        </li>
      ))}
    </ul>
  </nav>
);

/* ---------------- Body ---------------- */

const PrivacyBody = () => (
  <Section id="privacy" className="bg-base">
    <Container>
      <div className="grid gap-10 lg:gap-16 lg:grid-cols-12">
        <div className="lg:col-span-4 xl:col-span-3">
          <PrivacyToc />
        </div>
        <div className="lg:col-span-8 xl:col-span-8 xl:col-start-5">
          <div className="max-w-prose flex flex-col gap-10 sm:gap-12">
            {PRIVACY_SECTIONS.map((s) => <PrivacySection key={s.id} section={s} />)}
          </div>
        </div>
      </div>
    </Container>
  </Section>
);

/* ---------------- App ---------------- */

function PrivacyApp() {
  return (
    <main id="main">
      <PrivacyNav />
      <PrivacyHeader />
      <PrivacyBody />
      <Footer />
    </main>
  );
}

const privacyRoot = ReactDOM.createRoot(document.getElementById("root"));
privacyRoot.render(<PrivacyApp />);