/* ════════════════════════════════════════════════════════════════════
 *  SOLO SECURE — LEGAL PAGES
 * ════════════════════════════════════════════════════════════════════
 *
 *  Five pages, one file:
 *    • PrivacyPage         → /?page=privacy
 *    • TermsPage           → /?page=terms
 *    • WarrantyPage        → /?page=warranty
 *    • ModernSlaveryPage   → /?page=modern-slavery
 *    • CookiePolicyPage    → /?page=cookie-policy
 *
 *  All five share a common <LegalShell> layout — masthead + last-updated
 *  stamp + numbered sections + back-link. Copy is deliberately plain,
 *  factual and readable — this is a UK B2B site, not marketing copy.
 *
 *  ⚠️  These pages are drafted from standard UK B2B templates covering
 *  UK GDPR, DPA 2018, Consumer Rights Act 2015 and Modern Slavery Act
 *  2015. They MUST be reviewed by a qualified solicitor before you rely
 *  on them for legal compliance. Placeholder values (registered office
 *  address, company number, ICO reference) are marked TODO — fill them
 *  in when you have them.
 * ──────────────────────────────────────────────────────────────────── */

const LEGAL_LAST_UPDATED = "29 July 2026";

// ══════════════════════════════════════════════════════════════════
//  SOLO SECURE — GROUP LEGAL IDENTITY
// ══════════════════════════════════════════════════════════════════
//
//  The Solo Secure group is a family of companies operating under one
//  brand. The website (www.solosecure.tech) is operated by, and the
//  data controller is, SOLO SECURE GROUP LIMITED. Hardware supply and
//  warranty obligations sit with SITE SECURE SERVICES LIMITED, the
//  original operating company. The North America subsidiary handles
//  North American territory and Florida-manufactured hardware.
//
//  Any values still marked "TODO" cause the red DRAFT banner to render
//  at the top of each legal page — the banner auto-hides once every
//  TODO here is replaced with a real value.
// ──────────────────────────────────────────────────────────────────

const LEGAL_COMPANY = {
  // Primary entity — data controller for solosecure.tech and its forms
  legalName:        "Solo Secure Group Limited",
  tradingAs:        "Solo Secure",
  companyNumber:    "16206860",
  registeredOffice: "Unit 3 Eldon Way Industrial Estate, Biggleswade, Bedfordshire, England, SG18 8NH",

  // Contact
  // The only email address the site shows/sends to, per direct
  // instruction.
  email:                 "contactus@solosecure.group",
  dataProtectionContact: "contactus@solosecure.group",

  // Director who signs the Modern Slavery statement (s.54(6) MSA 2015).
  slaveryDirector: "Aaron Eastwood",

  // VAT number is not publicly disclosed. Under UK law businesses aren't
  // required to publish VAT numbers on their website — only the
  // Companies Act 2006 disclosures (company name, number, registered
  // office) are mandatory. We keep this field null so no legal-page
  // section renders a "VAT no.: ___" line.
  vatNumber: null,

  // ICO registration reference. Set this to the actual ZA/Z-number
  // once the ICO registration certificate arrives. Until then the
  // Privacy page falls back to "pending" copy and the DRAFT banner
  // will keep this on the list of missing items.
  icoNumber: "TODO — paste ICO registration number when it arrives",
};

// Subsidiary entities — referenced in the Warranty and Modern Slavery
// pages. All hardware sales/warranty flow through Site Secure Services
// Limited; the North America arm handles Wellington-manufactured units
// for the Americas.
const LEGAL_SUBSIDIARIES = {
  ukTrading: {
    legalName:        "Site Secure Services Limited",
    role:             "UK hardware supply and warranty",
    companyNumber:    "11519748",
    registeredOffice: "Unit 3 Eldon Way Industrial Estate, Biggleswade, Bedfordshire, England, SG18 8NH",
  },
  us: {
    legalName:        "Solo Secure Technologies USA, Inc.",
    role:             "North America territory, Wellington manufacturing",
    companyNumber:    "P26000029423",
    jurisdiction:     "State of Florida, United States",
    city:             "Port St. Lucie, Florida, USA",
    registeredOffice: "12070 SW Tom Mackie Blvd., Suite 105, Port St. Lucie, FL 34953, United States of America",
  },
};

/* ─────────────── Shared layout shell ─────────────── */
function LegalShell({ title, kicker, children, onNavigate }) {
  // Enumerate exactly which fields are still missing so the DRAFT
  // banner can list them precisely. Each entry: [field label, value].
  //
  // Notes on scope:
  //   • VAT is NOT on the list — we deliberately do not publish VAT
  //     numbers, and no UK law requires it.
  //   • ICO number stays here — every UK controller processing personal
  //     data via forms should register with the ICO under the DPA 2018
  //     unless exempt, and the reference must appear in the Privacy
  //     Notice.
  //   • Modern Slavery signatory: required under s.54(6) MSA 2015 for
  //     businesses over £36m turnover (best practice below that).
  //
  // If ANY value still starts with "TODO", the banner renders.
  const missingFields = [
    ["ICO registration",         LEGAL_COMPANY.icoNumber],
    ["Modern Slavery signatory", LEGAL_COMPANY.slaveryDirector],
  ].filter(([, v]) => typeof v === "string" && v.startsWith("TODO"))
   .map(([label]) => label);

  const isDraft = missingFields.length > 0;

  return (
    <>
      {/* Draft banner — auto-hides once every LEGAL_COMPANY field is filled. */}
      {isDraft && <LegalDraftBanner missingFields={missingFields} />}

      {/* MASTHEAD */}
      <section style={{
        padding: "80px 36px 60px",
        borderBottom: "1px solid var(--line)",
      }}>
        <div style={{ maxWidth: 980, margin: "0 auto" }}>
          <Breadcrumb
            crumbs={["Home", "Legal", title]}
            onNavigate={onNavigate}
            targets={["home"]}
          />
          <Eyebrow style={{ marginTop: 28, marginBottom: 32 }}>{kicker}</Eyebrow>
          <h1 style={{
            fontFamily: "var(--font-display)", fontWeight: 700,
            fontSize: "clamp(40px, 6vw, 88px)", lineHeight: 0.96,
            letterSpacing: "-0.005em", textTransform: "uppercase",
            margin: "0 0 32px", color: "var(--fg)",
          }}>{title}.</h1>
          <div style={{
            fontFamily: "var(--font-body)", fontSize: 13,
            letterSpacing: "0.14em", textTransform: "uppercase",
            color: "var(--fg-dim)", fontWeight: 500,
          }}>
            Last updated · {LEGAL_LAST_UPDATED}
          </div>
        </div>
      </section>

      {/* BODY */}
      <section style={{ padding: "80px 36px 120px" }}>
        <div style={{ maxWidth: 780, margin: "0 auto" }}>
          {children}

          {/* Footer contact block — shared across every legal page */}
          <div style={{
            marginTop: 72, paddingTop: 40,
            borderTop: "1px solid var(--line)",
          }}>
            <Eyebrow style={{ marginBottom: 16 }}>Questions</Eyebrow>
            <p style={legalBodyStyle}>
              For any questions about this document, contact us at{" "}
              <a href={`mailto:${LEGAL_COMPANY.email}`} style={{
                color: "var(--fg)", textDecoration: "underline",
              }}>{LEGAL_COMPANY.email}</a>.
            </p>
          </div>
        </div>
      </section>
    </>
  );
}

/* Shared type styles */
const legalH2Style = {
  fontFamily: "var(--font-display)",
  fontWeight: 700,
  fontSize: "clamp(20px, 2vw, 26px)",
  lineHeight: 1.15,
  letterSpacing: "-0.005em",
  textTransform: "uppercase",
  color: "var(--fg)",
  margin: "56px 0 20px",
};
const legalBodyStyle = {
  fontFamily: "var(--font-body)",
  fontSize: 16,
  lineHeight: 1.65,
  color: "var(--fg-soft)",
  margin: "0 0 16px",
};
const legalListStyle = {
  ...legalBodyStyle,
  paddingLeft: 22,
  margin: "0 0 20px",
};
const legalNumberStyle = {
  fontFamily: "var(--font-body)",
  fontSize: 11,
  letterSpacing: "0.22em",
  color: "var(--fg-dim)",
  fontWeight: 500,
  textTransform: "uppercase",
  display: "block",
  marginBottom: 6,
};

/* Small helper: numbered section heading */
function LegalSection({ num, title, children }) {
  return (
    <div>
      <div style={legalNumberStyle}>Section {num}</div>
      <h2 style={{ ...legalH2Style, margin: "8px 0 20px" }}>{title}</h2>
      {children}
    </div>
  );
}

/* ═══════════════════════════════════════════════════════════
 *  1. PRIVACY NOTICE
 * ═══════════════════════════════════════════════════════════ */
function PrivacyPage({ onNavigate }) {
  return (
    <LegalShell title="Privacy notice" kicker="Legal · Privacy" onNavigate={onNavigate}>
      <p style={{ ...legalBodyStyle, fontSize: 18 }}>
        This notice explains what personal information Solo Secure Technologies collects,
        why we collect it, how we use it, and the rights you have over your data. It
        applies to visitors to <b>www.solosecure.tech</b>, to anyone who fills in a form
        on the site, and to our customers and partners.
      </p>

      <LegalSection num="01" title="Who we are">
        <p style={legalBodyStyle}>
          The <b>{LEGAL_COMPANY.legalName}</b> group of companies operates the Solo
          Secure brand and this website. The data controller for personal data collected
          through <b>www.solosecure.tech</b> is:
        </p>
        <p style={legalBodyStyle}>
          <b>{LEGAL_COMPANY.legalName}</b><br/>
          A company registered in England and Wales, company number{" "}
          <b>{LEGAL_COMPANY.companyNumber}</b>.<br/>
          Registered office: {LEGAL_COMPANY.registeredOffice}.<br/>
          {LEGAL_COMPANY.icoNumber.startsWith("TODO")
            ? <span style={{ color: "#B71C1C" }}>Registered with the UK Information Commissioner's Office — reference <b>to be published on this page shortly</b>.</span>
            : <>Registered with the UK Information Commissioner's Office under reference <b>{LEGAL_COMPANY.icoNumber}</b>.</>
          }
        </p>
        <p style={legalBodyStyle}>
          Our UK trading entity, <b>{LEGAL_SUBSIDIARIES.ukTrading.legalName}</b> (company
          no. {LEGAL_SUBSIDIARIES.ukTrading.companyNumber}), supplies hardware and
          services. Where data is shared between entities within the group for order
          fulfilment, warranty and support, this transfer relies on group-wide binding
          data-sharing arrangements.
        </p>
        <p style={legalBodyStyle}>
          For any privacy question, contact our data protection lead at{" "}
          <a href={`mailto:${LEGAL_COMPANY.dataProtectionContact}`} style={{
            color: "var(--fg)", textDecoration: "underline",
          }}>{LEGAL_COMPANY.dataProtectionContact}</a>.
        </p>
      </LegalSection>

      <LegalSection num="02" title="What we collect">
        <p style={legalBodyStyle}>We collect only what we need to respond to you and run the business:</p>
        <ul style={legalListStyle}>
          <li><b>Contact form data</b> — name, work email, phone, company, job title, country, and the message you send us. Support and spec-builder forms also collect deployment details relevant to the enquiry.</li>
          <li><b>Careers form data</b> — where you apply for a role, additionally: LinkedIn or portfolio URL, and any information you choose to include.</li>
          <li><b>Reseller / partner data</b> — company name, region and estimated volume where you apply to the partner programme.</li>
          <li><b>Analytics data</b> (only if you consent) — pages visited, referral source, approximate location, device type, session duration. Aggregated and anonymised.</li>
          <li><b>Technical logs</b> — the web server keeps short-term IP logs for security and abuse prevention.</li>
        </ul>
        <p style={legalBodyStyle}>We do <b>not</b> collect payment card data on this website.</p>
      </LegalSection>

      <LegalSection num="03" title="Why we collect it — lawful basis">
        <p style={legalBodyStyle}>Under UK GDPR (Article 6), we process your data on these bases:</p>
        <ul style={legalListStyle}>
          <li><b>Legitimate interests</b> — to respond to sales, support, press, investor and partner enquiries that you have submitted.</li>
          <li><b>Contract</b> — where you become a customer, to fulfil our contract with you.</li>
          <li><b>Consent</b> — for analytics cookies and any marketing communications. You can withdraw consent at any time.</li>
          <li><b>Legal obligation</b> — for record-keeping, tax and compliance purposes.</li>
        </ul>
      </LegalSection>

      <LegalSection num="04" title="How long we keep it">
        <ul style={legalListStyle}>
          <li>Contact-form submissions: <b>up to 3 years</b> from your last interaction, then deleted.</li>
          <li>Customer records: for the duration of our commercial relationship plus <b>7 years</b> for HMRC / audit purposes.</li>
          <li>Careers applications: <b>12 months</b> from application date, unless you ask us to keep them on file.</li>
          <li>Analytics data: aggregated and retained per Google Analytics' default 14-month window.</li>
          <li>Server logs: <b>90 days</b>.</li>
        </ul>
      </LegalSection>

      <LegalSection num="05" title="Who we share it with">
        <p style={legalBodyStyle}>We share data only with processors who help us run the business:</p>
        <ul style={legalListStyle}>
          <li><b>Netlify</b> — our website host, which also processes form submissions. Data may be transferred to the United States under Standard Contractual Clauses.</li>
          <li><b>Microsoft (Office 365 / Teams)</b> — email, calendar and internal notifications. Hosted in the UK / EU.</li>
          <li><b>Google (Analytics)</b> — website analytics, only if you consent. Data may be transferred to the United States under Standard Contractual Clauses.</li>
          <li>Professional advisers (accountants, auditors, solicitors) where legally required.</li>
        </ul>
        <p style={legalBodyStyle}>
          We do <b>not</b> sell your data to anyone. We do not use your enquiry data for
          advertising or profiling.
        </p>
      </LegalSection>

      <LegalSection num="06" title="Your rights">
        <p style={legalBodyStyle}>Under UK GDPR you have the right to:</p>
        <ul style={legalListStyle}>
          <li><b>Access</b> — request a copy of the personal data we hold about you.</li>
          <li><b>Rectification</b> — ask us to correct anything that's wrong.</li>
          <li><b>Erasure</b> — ask us to delete your data (subject to legal retention obligations).</li>
          <li><b>Restriction</b> — ask us to pause processing while a query is resolved.</li>
          <li><b>Objection</b> — object to processing based on legitimate interests.</li>
          <li><b>Portability</b> — receive your data in a structured, machine-readable format.</li>
          <li><b>Withdraw consent</b> — at any time, for anything you consented to.</li>
        </ul>
        <p style={legalBodyStyle}>
          To exercise any of these rights, email{" "}
          <a href={`mailto:${LEGAL_COMPANY.dataProtectionContact}`} style={{
            color: "var(--fg)", textDecoration: "underline",
          }}>{LEGAL_COMPANY.dataProtectionContact}</a>. We respond within 30 days.
        </p>
        <p style={legalBodyStyle}>
          You also have the right to complain to the Information Commissioner's Office —{" "}
          <a href="https://ico.org.uk/make-a-complaint/" target="_blank" rel="noopener noreferrer" style={{
            color: "var(--fg)", textDecoration: "underline",
          }}>ico.org.uk</a> — though we hope you'll raise it with us first.
        </p>
      </LegalSection>

      <LegalSection num="07" title="Cookies">
        <p style={legalBodyStyle}>
          We use a small number of cookies on this site. Some are strictly necessary
          (session security, form CSRF); others are optional (analytics, chat widget,
          image-slot persistence). See our{" "}
          <span onClick={() => onNavigate("cookie-policy")} style={{
            color: "var(--fg)", textDecoration: "underline", cursor: "pointer",
          }}>Cookie Policy</span>{" "}
          for the full list and how to change your preferences.
        </p>
      </LegalSection>

      <LegalSection num="08" title="Changes to this notice">
        <p style={legalBodyStyle}>
          If we materially change how we handle personal data, we'll update this page
          and bump the "Last updated" date at the top. For significant changes we'll
          notify affected users directly by email where we have their address.
        </p>
      </LegalSection>
    </LegalShell>
  );
}

/* ═══════════════════════════════════════════════════════════
 *  2. TERMS OF USE
 * ═══════════════════════════════════════════════════════════ */
function TermsPage({ onNavigate }) {
  return (
    <LegalShell title="Terms of use" kicker="Legal · Website terms" onNavigate={onNavigate}>
      <p style={{ ...legalBodyStyle, fontSize: 18 }}>
        These terms cover your use of the <b>www.solosecure.tech</b> website. They are
        separate from the commercial terms that govern the supply of products and
        services — those are set out in the individual purchase, lease or managed-service
        agreements you sign with us.
      </p>

      <LegalSection num="01" title="About these terms">
        <p style={legalBodyStyle}>
          By using this website you agree to these terms. If you don't agree, please
          don't use the site. We may update the terms from time to time — the version in
          force is the one published on this page, with the "Last updated" date at the top.
        </p>
      </LegalSection>

      <LegalSection num="02" title="Who we are">
        <p style={legalBodyStyle}>
          The site is operated by <b>{LEGAL_COMPANY.legalName}</b>, a company registered
          in England and Wales (company number <b>{LEGAL_COMPANY.companyNumber}</b>).
          Registered office: {LEGAL_COMPANY.registeredOffice}.
        </p>
        <p style={legalBodyStyle}>
          Hardware supply and warranty obligations are provided by our UK trading
          company <b>{LEGAL_SUBSIDIARIES.ukTrading.legalName}</b> (company no.{" "}
          {LEGAL_SUBSIDIARIES.ukTrading.companyNumber}), and — in North America — by{" "}
          <b>{LEGAL_SUBSIDIARIES.us.legalName}</b> (company no.{" "}
          {LEGAL_SUBSIDIARIES.us.companyNumber}), registered at{" "}
          {LEGAL_SUBSIDIARIES.us.registeredOffice}. The specific contracting entity is
          set out in your purchase order or service agreement.
        </p>
      </LegalSection>

      <LegalSection num="03" title="Content and accuracy">
        <p style={legalBodyStyle}>
          We take reasonable care to make sure the information on this site is accurate
          and up to date, but product specifications, deployment figures, case studies
          and pricing are provided for information only. Nothing on the site constitutes
          a binding offer to supply. All commercial commitments are made through a
          signed contract.
        </p>
        <p style={legalBodyStyle}>
          Illustrations, renders and photographs are indicative. Actual products may vary.
        </p>
      </LegalSection>

      <LegalSection num="04" title="Intellectual property">
        <p style={legalBodyStyle}>
          All content on this site — text, logos, product photography, illustrations,
          videos, code — is owned by or licensed to Solo Secure. You may view the site
          and share links to public pages. You may not reproduce, republish, sell or
          otherwise commercially exploit the content without our prior written consent.
        </p>
        <p style={legalBodyStyle}>
          The names "Solo Secure", "Pro Tower", "Ultra Tower", "SoloPost", "Volt Box"
          and associated marks are trade marks of {LEGAL_COMPANY.legalName}.
        </p>
      </LegalSection>

      <LegalSection num="05" title="Acceptable use">
        <p style={legalBodyStyle}>You agree not to:</p>
        <ul style={legalListStyle}>
          <li>Use the site for any unlawful purpose or in breach of these terms.</li>
          <li>Attempt to gain unauthorised access to any part of the site, the server, or any connected system.</li>
          <li>Submit false, misleading or malicious information through our forms.</li>
          <li>Introduce viruses, trojans, worms or other malicious material.</li>
          <li>Scrape, harvest or automate access to the site without our prior written permission.</li>
        </ul>
      </LegalSection>

      <LegalSection num="06" title="Third-party links">
        <p style={legalBodyStyle}>
          The site may link to third-party websites (Ajax, Victron, our partners' pages,
          government resources such as the ICO). We're not responsible for the content
          or practices of those sites — please review their own terms and privacy notices.
        </p>
      </LegalSection>

      <LegalSection num="07" title="Availability">
        <p style={legalBodyStyle}>
          We aim to keep the site available at all times but can't guarantee uninterrupted
          access. We may suspend, withdraw or restrict any part of the site for operational
          reasons without notice.
        </p>
      </LegalSection>

      <LegalSection num="08" title="Liability">
        <p style={legalBodyStyle}>
          Nothing in these terms limits liability for death or personal injury caused by
          our negligence, for fraud, or for anything else that cannot lawfully be limited
          under English law. Subject to that, and to the fullest extent permitted by law,
          we exclude all liability for any loss or damage arising from your use of, or
          inability to use, this website.
        </p>
        <p style={legalBodyStyle}>
          For business users: we exclude all implied conditions, warranties and terms
          in relation to the website, and we will not be liable for loss of profits, loss
          of business, business interruption, or loss of business opportunity.
        </p>
      </LegalSection>

      <LegalSection num="09" title="Governing law">
        <p style={legalBodyStyle}>
          These terms are governed by the laws of England and Wales. Any dispute is
          subject to the exclusive jurisdiction of the courts of England and Wales.
        </p>
      </LegalSection>
    </LegalShell>
  );
}

/* ═══════════════════════════════════════════════════════════
 *  3. WARRANTY
 * ═══════════════════════════════════════════════════════════ */
function WarrantyPage({ onNavigate }) {
  return (
    <LegalShell title="Warranty" kicker="Legal · Product warranty" onNavigate={onNavigate}>
      <p style={{ ...legalBodyStyle, fontSize: 18 }}>
        Every Solo Secure product ships with a manufacturer warranty. This page sets out
        the standard terms — the exact warranty period, exclusions and RMA process for
        your unit are also stated on your purchase order and delivery documentation. In
        case of conflict, the wording on your signed contract prevails.
      </p>

      <div style={{
        marginTop: 24, marginBottom: 12,
        padding: "18px 22px",
        border: "1px solid var(--line-strong)",
        background: "var(--surface)",
      }}>
        <div style={{
          fontFamily: "var(--font-body)", fontSize: 10, fontWeight: 600,
          letterSpacing: "0.22em", textTransform: "uppercase",
          color: "var(--fg-dim)", marginBottom: 8,
        }}>The seller and warrantor</div>
        <p style={{ ...legalBodyStyle, margin: 0 }}>
          <b>United Kingdom, European Union and GCC sales:</b> the seller and warrantor
          is either <b>{LEGAL_COMPANY.legalName}</b> (company no. {LEGAL_COMPANY.companyNumber})
          or <b>{LEGAL_SUBSIDIARIES.ukTrading.legalName}</b> (company no.{" "}
          {LEGAL_SUBSIDIARIES.ukTrading.companyNumber}), both registered at{" "}
          {LEGAL_COMPANY.registeredOffice}.<br/>
          <b>North America sales:</b> the seller and warrantor is{" "}
          <b>{LEGAL_SUBSIDIARIES.us.legalName}</b> (company no.{" "}
          {LEGAL_SUBSIDIARIES.us.companyNumber}), registered at{" "}
          {LEGAL_SUBSIDIARIES.us.registeredOffice}.<br/>
          The specific selling entity for your order is named on your purchase order
          and delivery documentation.
        </p>
      </div>

      <LegalSection num="01" title="Standard warranty periods">
        <ul style={legalListStyle}>
          <li><b>Solo Pro Tower, Ultra Tower, RT Tower, SSU</b> — 24 months from date of despatch, extended manufacturer support to 7 years from date of first deployment.</li>
          <li><b>RS1, RS2 solar add-ons</b> — 24 months from date of despatch; solar cells: 10-year performance warranty per cell manufacturer.</li>
          <li><b>Volt Box (100 / 314)</b> — 24 months on chassis and electronics; lithium cell warranty per cell manufacturer terms.</li>
          <li><b>SoloPost</b> — 24 months from date of despatch (product currently paused; see product page).</li>
          <li><b>Accessories</b> (cameras, comms modules, brackets) — 12 months from date of despatch.</li>
        </ul>
        <p style={legalBodyStyle}>
          Extended and managed warranties are available on lease and managed-service
          contracts. Speak to your account manager or contact us at{" "}
          <a href={`mailto:${LEGAL_COMPANY.email}`} style={{
            color: "var(--fg)", textDecoration: "underline",
          }}>{LEGAL_COMPANY.email}</a>.
        </p>
      </LegalSection>

      <LegalSection num="02" title="What is covered">
        <p style={legalBodyStyle}>
          The warranty covers defects in materials or workmanship under normal
          operational conditions, including:
        </p>
        <ul style={legalListStyle}>
          <li>Chassis structural integrity (aluminium frame, mast, mounting points).</li>
          <li>Factory-fitted electrical and electronic components.</li>
          <li>Firmware defects on Solo-supplied hardware.</li>
          <li>Coating and finish failure not caused by mechanical damage.</li>
        </ul>
      </LegalSection>

      <LegalSection num="03" title="What is not covered">
        <p style={legalBodyStyle}>The warranty does not cover:</p>
        <ul style={legalListStyle}>
          <li>Damage caused by misuse, accident, vandalism, unauthorised modification, or use outside the operating limits set out in the product manual.</li>
          <li>Fair wear and tear, cosmetic wear, or gradual solar-cell efficiency decline within manufacturer tolerance.</li>
          <li>Damage from acts of God (flood, fire, lightning, storm, earthquake).</li>
          <li>Damage caused by installation or transport not carried out by Solo Secure or an approved partner.</li>
          <li>Third-party parts fitted without our prior written consent.</li>
          <li>Consumables (fuses, cable ties, SIM cards, wear pads).</li>
        </ul>
      </LegalSection>

      <LegalSection num="04" title="RMA process">
        <p style={legalBodyStyle}>To make a warranty claim:</p>
        <ol style={legalListStyle}>
          <li>Contact your reseller partner, who will raise this with our support team on your behalf, or email{" "}
            <a href={`mailto:${LEGAL_COMPANY.email}`} style={{
              color: "var(--fg)", textDecoration: "underline",
            }}>{LEGAL_COMPANY.email}</a>. You'll receive a ticket reference.</li>
          <li>Our field-support team will diagnose the issue — often remotely — and issue an RMA (Return Materials Authorisation) if the fault is warrantable.</li>
          <li>We arrange collection, repair or replacement, and return.</li>
          <li>For sites that cannot afford downtime we can, subject to availability, dispatch a swap unit against a returnable deposit.</li>
        </ol>
      </LegalSection>

      <LegalSection num="05" title="Statutory rights">
        <p style={legalBodyStyle}>
          This warranty is in addition to, and does not affect, your statutory rights
          under the Consumer Rights Act 2015 (where applicable) or your contractual
          rights under the Sale of Goods provisions of the Business-to-Business supply
          contracts you enter into with us.
        </p>
      </LegalSection>
    </LegalShell>
  );
}

/* ═══════════════════════════════════════════════════════════
 *  4. MODERN SLAVERY STATEMENT
 * ═══════════════════════════════════════════════════════════ */
function ModernSlaveryPage({ onNavigate }) {
  return (
    <LegalShell title="Modern slavery statement" kicker="Legal · Section 54 statement" onNavigate={onNavigate}>
      <p style={{ ...legalBodyStyle, fontSize: 18 }}>
        This statement is made in line with section 54 of the Modern Slavery Act 2015
        and sets out the steps {LEGAL_COMPANY.legalName} has taken to ensure that modern
        slavery and human trafficking are not taking place within our own business or
        our supply chain. It covers the financial year to date.
      </p>

      <LegalSection num="01" title="About Solo Secure">
        <p style={legalBodyStyle}>
          The Solo Secure group is a family of companies operating under a single brand:
        </p>
        <ul style={legalListStyle}>
          <li>
            <b>{LEGAL_COMPANY.legalName}</b> (company no. {LEGAL_COMPANY.companyNumber}) —
            the parent company, registered at {LEGAL_COMPANY.registeredOffice}.
          </li>
          <li>
            <b>{LEGAL_SUBSIDIARIES.ukTrading.legalName}</b> (company no.{" "}
            {LEGAL_SUBSIDIARIES.ukTrading.companyNumber}) — {LEGAL_SUBSIDIARIES.ukTrading.role.toLowerCase()},
            registered at {LEGAL_SUBSIDIARIES.ukTrading.registeredOffice}.
          </li>
          <li>
            <b>{LEGAL_SUBSIDIARIES.us.legalName}</b> (company no.{" "}
            {LEGAL_SUBSIDIARIES.us.companyNumber}) — {LEGAL_SUBSIDIARIES.us.role.toLowerCase()},
            registered at {LEGAL_SUBSIDIARIES.us.registeredOffice}.
          </li>
        </ul>
        <p style={legalBodyStyle}>
          Together we design, manufacture and support rapidly-deployable mobile CCTV
          towers and associated security products. We operate manufacturing across the
          United Kingdom, Poland and North America, and sell through direct and
          reseller channels across the UK, EU, North America and GCC. This statement is made on
          behalf of every entity in the group.
        </p>
      </LegalSection>

      <LegalSection num="02" title="Our commitment">
        <p style={legalBodyStyle}>
          We have a zero-tolerance approach to modern slavery in all forms — forced
          labour, servitude, human trafficking and child labour — whether in our own
          operations or those of our suppliers. We expect the same standards from every
          organisation we do business with.
        </p>
      </LegalSection>

      <LegalSection num="03" title="Our supply chain">
        <p style={legalBodyStyle}>
          Our supply chain includes electronic component manufacturers, aluminium
          extrusion suppliers, camera and lighting OEMs, solar-panel and lithium-battery
          suppliers, and third-party logistics providers. We source primarily from the
          UK, EU and established Tier-1 electronics suppliers with mature due-diligence
          programmes of their own.
        </p>
      </LegalSection>

      <LegalSection num="04" title="Steps we take">
        <ul style={legalListStyle}>
          <li><b>Supplier due diligence</b> — we require key suppliers to confirm compliance with the Modern Slavery Act 2015 and comparable legislation in their jurisdiction.</li>
          <li><b>Contract terms</b> — our purchase orders and supplier agreements include clauses requiring compliance with anti-slavery, anti-trafficking and labour-rights laws.</li>
          <li><b>Employment practices</b> — every employee is paid at or above the national living wage, works to a written contract, and has the right to raise concerns without retaliation.</li>
          <li><b>Recruitment</b> — right-to-work checks are performed for every employee; we do not use unregulated labour brokers.</li>
          <li><b>Training</b> — line managers are briefed on the signs of modern slavery and how to raise concerns.</li>
          <li><b>Whistleblowing</b> — any employee, contractor or member of the public can raise a concern in confidence to{" "}
            <a href={`mailto:${LEGAL_COMPANY.email}`} style={{
              color: "var(--fg)", textDecoration: "underline",
            }}>{LEGAL_COMPANY.email}</a>.
          </li>
        </ul>
      </LegalSection>

      <LegalSection num="05" title="Assessment and next steps">
        <p style={legalBodyStyle}>
          We have not identified any incidents of modern slavery within our operations
          or our known supply chain to date. We will continue to review our supplier
          base, refresh due-diligence questionnaires annually, and update this statement
          each financial year.
        </p>
      </LegalSection>

      <LegalSection num="06" title="Approval">
        <p style={legalBodyStyle}>
          This statement is approved by the Board of {LEGAL_COMPANY.legalName} on behalf
          of every entity in the group. It will be reviewed and re-approved annually.
          Signed on behalf of the Board:
        </p>
        <p style={{ ...legalBodyStyle, marginTop: 20 }}>
          <b>{LEGAL_COMPANY.slaveryDirector}</b><br/>
          Director, {LEGAL_COMPANY.legalName}<br/>
          {LEGAL_LAST_UPDATED}
        </p>
      </LegalSection>
    </LegalShell>
  );
}

/* ═══════════════════════════════════════════════════════════
 *  5. COOKIE POLICY
 * ═══════════════════════════════════════════════════════════ */
function CookiePolicyPage({ onNavigate }) {
  return (
    <LegalShell title="Cookie policy" kicker="Legal · Cookies" onNavigate={onNavigate}>
      <p style={{ ...legalBodyStyle, fontSize: 18 }}>
        This policy explains what cookies are, which ones we use on <b>www.solosecure.tech</b>,
        and how you can control them. For the wider picture of what we do with personal
        data, see the{" "}
        <span onClick={() => onNavigate("privacy")} style={{
          color: "var(--fg)", textDecoration: "underline", cursor: "pointer",
        }}>Privacy Notice</span>.
      </p>

      <LegalSection num="01" title="What cookies are">
        <p style={legalBodyStyle}>
          Cookies are small text files a website stores on your device so that it can
          recognise you on return visits, remember your preferences, or measure how the
          site is used. Some cookies are essential for the site to function; others are
          optional and only load if you consent.
        </p>
      </LegalSection>

      <LegalSection num="02" title="Our cookie categories">
        <p style={legalBodyStyle}>
          When you first visit the site, our consent banner asks you to choose which
          categories you're happy with. You can change your choice at any time from
          the <b>Cookie preferences</b> link in the footer of every page. There are
          four categories:
        </p>

        <div style={{ marginTop: 12, borderTop: "1px solid var(--line)" }}>
          <CookieRow
            name="Strictly necessary"
            always
            body="Required for the site to function — form submission tokens, session security, load-balancer routing. Cannot be disabled."
          />
          <CookieRow
            name="Analytics"
            body="Google Analytics 4 — measures how the site is used so we can improve it. Data is aggregated and anonymised. Enabled only if you consent."
          />
          <CookieRow
            name="Functional"
            body="Optional features: live-chat widget state, remembering photos you've dropped into placeholder slots (design-preview only), region preferences."
          />
          <CookieRow
            name="Marketing"
            body="Reserved for future advertising and remarketing tags. Not currently used on this site."
          />
        </div>
      </LegalSection>

      <LegalSection num="03" title="Third-party cookies">
        <p style={legalBodyStyle}>
          Some of the cookies we may set are provided by third parties whose services
          we use:
        </p>
        <ul style={legalListStyle}>
          <li><b>Google Analytics</b> (analytics) — see{" "}
            <a href="https://policies.google.com/technologies/cookies" target="_blank" rel="noopener noreferrer" style={{ color: "var(--fg)", textDecoration: "underline" }}>Google's cookie policy</a>.</li>
          <li><b>Netlify</b> (necessary) — our hosting platform sets a small number of technical cookies for load balancing and form submission integrity.</li>
          <li><b>Live chat provider</b> (functional, when enabled) — session-scoped cookies used to keep chat context.</li>
        </ul>
      </LegalSection>

      <LegalSection num="04" title="Managing cookies">
        <p style={legalBodyStyle}>You can manage cookies in two ways:</p>
        <ul style={legalListStyle}>
          <li>
            <b>Via our banner</b> — click "Cookie preferences" in the footer to open the
            preference centre. Changes take effect immediately.
          </li>
          <li>
            <b>Via your browser</b> — every modern browser lets you view, block or
            delete cookies. Blocking necessary cookies may stop parts of the site
            working properly.
          </li>
        </ul>
        <p style={legalBodyStyle}>
          <span
            onClick={() => window.SOLO_COOKIES?.open?.()}
            style={{
              display: "inline-block", cursor: "pointer",
              fontFamily: "var(--font-body)", fontSize: 12,
              letterSpacing: "0.22em", textTransform: "uppercase",
              padding: "12px 18px", border: "1px solid var(--fg)",
              color: "var(--fg)", background: "transparent",
              marginTop: 12, fontWeight: 500,
            }}
          >Open cookie preferences</span>
        </p>
      </LegalSection>

      <LegalSection num="05" title="Changes to this policy">
        <p style={legalBodyStyle}>
          If we start using new categories of cookies, we'll update this page and
          re-prompt you through the consent banner so you can review your choices.
        </p>
      </LegalSection>
    </LegalShell>
  );
}

/* ─────────────── Draft banner ───────────────
 * Rendered at the top of every legal page while LEGAL_COMPANY still
 * holds TODO placeholders (company number, registered office, director
 * name, ICO number etc.). Remove is automatic — once the placeholders
 * are filled with real values, isDraft in LegalShell evaluates false
 * and this banner disappears. */
function LegalDraftBanner({ missingFields = [] }) {
  const listing = missingFields.length
    ? missingFields.join(" · ")
    : "one or more required values";
  return (
    <div style={{
      background: "#B71C1C",
      color: "#fff",
      padding: "14px 36px",
      textAlign: "center",
      fontFamily: "var(--font-body)", fontSize: 13,
      lineHeight: 1.5, fontWeight: 500,
      letterSpacing: "0.02em",
    }}>
      <b style={{
        display: "inline-block", marginRight: 10, padding: "2px 8px",
        border: "1px solid rgba(255,255,255,0.6)",
        fontSize: 10, letterSpacing: "0.24em", textTransform: "uppercase",
        verticalAlign: "middle",
      }}>Draft</b>
      <span>
        This document is still awaiting: <b>{listing}</b>. It has not yet
        been reviewed by a solicitor and is not legally effective until
        these are provided.
      </span>
    </div>
  );
}

/* Cookie table row — used inside the Cookie Policy page */
function CookieRow({ name, body, always }) {
  return (
    <div style={{
      display: "grid", gridTemplateColumns: "220px 1fr auto",
      gap: 24, padding: "20px 0",
      borderBottom: "1px solid var(--line)",
      alignItems: "start",
    }}>
      <div style={{
        fontFamily: "var(--font-body)", fontSize: 13, fontWeight: 600,
        letterSpacing: "0.08em", textTransform: "uppercase",
        color: "var(--fg)",
      }}>{name}</div>
      <div style={{
        fontFamily: "var(--font-body)", fontSize: 14,
        lineHeight: 1.6, color: "var(--fg-soft)",
      }}>{body}</div>
      <div style={{
        fontFamily: "var(--font-body)", fontSize: 10,
        letterSpacing: "0.22em", textTransform: "uppercase",
        color: always ? "var(--fg)" : "var(--fg-dim)",
        padding: "3px 8px",
        border: `1px solid ${always ? "var(--fg)" : "var(--line-strong)"}`,
        fontWeight: 500,
        whiteSpace: "nowrap",
      }}>{always ? "Always on" : "Opt-in"}</div>
    </div>
  );
}

Object.assign(window, {
  PrivacyPage,
  TermsPage,
  WarrantyPage,
  ModernSlaveryPage,
  CookiePolicyPage,
});