/* global React */

window.PrivacyHero = function PrivacyHero({ lang }) {
  const t = lang === "it" ? {
    eyebrow: "Privacy & Data Protection",
    h1: "Come trattiamo i tuoi dati.",
    sub: "Informativa unica ai sensi degli artt. 13 e 14 del Reg. UE 2016/679 (GDPR), valida per i moduli di contatto, candidatura e richiesta del Free Blueprint.",
    updated: "Ultimo aggiornamento: gennaio 2026",
  } : {
    eyebrow: "Privacy & Data Protection",
    h1: "How we handle your data.",
    sub: "Single privacy notice pursuant to artt. 13 and 14 of EU Reg. 2016/679 (GDPR), valid for contact, application and Free Blueprint request forms.",
    updated: "Last updated: January 2026",
  };
  return (
    <div style={{ position: "relative", overflow: "hidden", color: "#fff", paddingTop: 160, paddingBottom: 80 }}>
      <div style={{ position: "absolute", inset: 0, background: "var(--tl-gradient-mesh)", zIndex: 0 }} />
      <window.Container style={{ position: "relative", zIndex: 2 }}>
        <window.Eyebrow light>{t.eyebrow}</window.Eyebrow>
        <h1 style={{ fontSize: "clamp(36px, 5vw, 60px)", fontWeight: 800, lineHeight: 1.05, letterSpacing: "-0.03em", margin: 0, color: "#fff", maxWidth: 880 }}>{t.h1}</h1>
        <p style={{ fontSize: "clamp(15px, 1.2vw, 18px)", lineHeight: 1.6, color: "rgba(255,255,255,0.78)", maxWidth: 720, marginTop: 22 }}>{t.sub}</p>
        <div style={{ marginTop: 22, fontFamily: "var(--font-mono)", fontSize: 12, color: "rgba(255,255,255,0.55)", letterSpacing: ".08em", textTransform: "uppercase" }}>{t.updated}</div>
      </window.Container>
    </div>
  );
};

window.PrivacyTOC = function PrivacyTOC({ lang, blocks }) {
  const label = lang === "it" ? "Indice" : "Table of contents";
  return (
    <div className="priv-toc-sticky" style={{ position: "sticky", top: 100, alignSelf: "start" }}>
      <div style={{ fontFamily: "var(--font-mono)", fontSize: 11, color: "var(--tl-blue-primary)", letterSpacing: ".12em", textTransform: "uppercase", fontWeight: 600, marginBottom: 14 }}>{label}</div>
      <ol style={{ listStyle: "none", padding: 0, margin: 0, display: "flex", flexDirection: "column", gap: 8, counterReset: "toc" }}>
        {blocks.map((b, i) => (
          <li key={b.h} style={{ counterIncrement: "toc" }}>
            <a href={`#sec-${i}`} style={{ display: "flex", gap: 10, fontSize: 13, color: "var(--fg-2)", lineHeight: 1.45, padding: "6px 0", borderLeft: "2px solid transparent", paddingLeft: 12, marginLeft: -14, transition: "all 140ms" }}
              onMouseEnter={(e) => { e.currentTarget.style.color = "var(--tl-blue-primary)"; e.currentTarget.style.borderLeftColor = "var(--tl-blue-primary)"; }}
              onMouseLeave={(e) => { e.currentTarget.style.color = "var(--fg-2)"; e.currentTarget.style.borderLeftColor = "transparent"; }}>
              <span style={{ fontFamily: "var(--font-mono)", fontSize: 11, color: "var(--tl-blue-primary)", flexShrink: 0, paddingTop: 1 }}>{String(i + 1).padStart(2, "0")}</span>
              <span>{b.h}</span>
            </a>
          </li>
        ))}
      </ol>
      <a href="mailto:privacy@tecnolife.com" style={{
        display: "inline-flex", alignItems: "center", gap: 8, marginTop: 26,
        fontSize: 13, fontWeight: 600, color: "var(--tl-blue-primary)",
      }}>
        <window.Icon name="mail" size={14} />
        privacy@tecnolife.com
      </a>
    </div>
  );
};

window.PrivacyBody = function PrivacyBody({ lang }) {
  const blocks = lang === "it" ? [
    { h: "Titolare del trattamento", p: "Il Titolare del trattamento è Tecnolife IT Consulting S.r.l., con sede in Via del Serafico 200, 00142 Roma (RM), Italia. P.IVA 11747341003. Per contatti: privacy@tecnolife.com." },
    { h: "Categorie di dati trattati", p: "Trattiamo i dati anagrafici e di contatto (nome, cognome, email, telefono), i dati professionali (CV, esperienze, formazione, certificazioni, ruolo aziendale), i dati relativi all'azienda di appartenenza (ragione sociale, settore, dimensione) e i dati che spontaneamente includi nei messaggi o nelle descrizioni dei progetti. Non sono richiesti né incoraggiati dati appartenenti a categorie particolari (art. 9 GDPR)." },
    { h: "Finalità e base giuridica", p: "I dati vengono trattati per: (a) gestire le tue richieste di contatto e fornire i servizi richiesti, incluso il Free Blueprint — base giuridica: misure precontrattuali (art. 6.1.b GDPR); (b) gestire le candidature per posizioni aperte o spontanee — base giuridica: misure precontrattuali (art. 6.1.b GDPR); (c) per future opportunità lavorative o commerciali, previo consenso (art. 6.1.a GDPR), per un massimo di 24 mesi; (d) adempiere a obblighi di legge (art. 6.1.c GDPR)." },
    { h: "Periodo di conservazione", p: "I dati relativi a candidature per posizioni specifiche sono conservati per 12 mesi dalla chiusura del processo di selezione. Con il consenso facoltativo, il CV può essere conservato fino a 24 mesi per future selezioni. I dati relativi a richieste di contatto e Blueprint sono conservati per 24 mesi dall'ultimo contatto utile, salvo diversa esigenza contrattuale o legale. Decorsi tali termini i dati sono cancellati o resi anonimi." },
    { h: "Destinatari dei dati", p: "I dati possono essere trattati da personale autorizzato di Tecnolife (commerciale, HR, Solution Architect, responsabili tecnici delle aree professionali) e da fornitori che agiscono come responsabili del trattamento (servizi cloud, posta elettronica, ATS, CRM). I dati non sono diffusi né trasferiti al di fuori dello Spazio Economico Europeo, salvo eventuali trasferimenti garantiti dalle Clausole Contrattuali Standard della Commissione Europea." },
    { h: "I tuoi diritti", p: "In qualunque momento puoi esercitare i diritti di accesso, rettifica, cancellazione, limitazione, portabilità e opposizione (artt. 15-22 GDPR), nonché revocare il consenso facoltativo prestato. Puoi farlo scrivendo a privacy@tecnolife.com. Hai inoltre diritto di proporre reclamo al Garante per la protezione dei dati personali (www.garanteprivacy.it)." },
    { h: "Conferimento dei dati", p: "Il conferimento dei dati richiesti come obbligatori è necessario per gestire la richiesta o valutare la candidatura: il rifiuto comporta l'impossibilità di darvi seguito. Il conferimento di dati ulteriori (LinkedIn, portfolio, messaggio, allegati) è facoltativo." },
    { h: "Modalità del trattamento", p: "Il trattamento avviene con strumenti elettronici e, eccezionalmente, cartacei, nel rispetto delle misure di sicurezza tecniche e organizzative previste dall'art. 32 GDPR. L'accesso ai dati è limitato al personale autorizzato e ai responsabili del trattamento appositamente nominati." },
    { h: "Modifiche all'informativa", p: "La presente informativa può essere aggiornata in qualunque momento per riflettere modifiche normative o organizzative. La versione vigente è sempre pubblicata in questa pagina, con indicazione della data di ultimo aggiornamento." },
  ] : [
    { h: "Data controller", p: "The data controller is Tecnolife IT Consulting S.r.l., headquartered at Via del Serafico 200, 00142 Rome (RM), Italy. VAT 11747341003. Contact: privacy@tecnolife.com." },
    { h: "Categories of data processed", p: "We process identity and contact data (first name, last name, email, phone), professional data (CV, experiences, education, certifications, role), company data (company name, industry, size) and any data you spontaneously include in messages or project descriptions. Special category data (art. 9 GDPR) is not requested or encouraged." },
    { h: "Purposes and legal basis", p: "Data is processed to: (a) manage your contact requests and deliver requested services, including the Free Blueprint — legal basis: pre-contractual measures (art. 6.1.b GDPR); (b) manage applications for open or spontaneous positions — legal basis: pre-contractual measures (art. 6.1.b GDPR); (c) for future job or business opportunities, subject to consent (art. 6.1.a GDPR), for a maximum of 24 months; (d) to comply with legal obligations (art. 6.1.c GDPR)." },
    { h: "Retention period", p: "Application data for specific positions is retained for 12 months from the end of the selection process. With optional consent, the CV may be retained for up to 24 months for future selections. Contact and Blueprint request data is retained for 24 months from the last useful contact, unless different contractual or legal needs apply. After these terms, data is deleted or anonymised." },
    { h: "Data recipients", p: "Data may be processed by authorised Tecnolife personnel (sales, HR, Solution Architects, technical leads) and by providers acting as data processors (cloud services, email, ATS, CRM). Data is not disclosed or transferred outside the European Economic Area, except where guaranteed by the European Commission's Standard Contractual Clauses." },
    { h: "Your rights", p: "You may exercise the rights of access, rectification, erasure, restriction, portability and objection (artt. 15-22 GDPR) at any time, as well as withdraw any optional consent. You can do so by writing to privacy@tecnolife.com. You also have the right to lodge a complaint with the Italian Data Protection Authority (www.garanteprivacy.it)." },
    { h: "Provision of data", p: "Providing the data marked as required is necessary to manage the request or assess the application: refusal makes it impossible to follow up. Providing additional data (LinkedIn, portfolio, message, attachments) is optional." },
    { h: "Processing methods", p: "Processing takes place with electronic tools and, exceptionally, paper, in compliance with the technical and organisational security measures provided by art. 32 GDPR. Access to data is limited to authorised personnel and specifically appointed data processors." },
    { h: "Changes to this notice", p: "This notice may be updated at any time to reflect regulatory or organisational changes. The current version is always published on this page, with the date of the last update." },
  ];
  return (
    <window.Section style={{ background: "var(--bg)" }}>
      <window.Container>
        <div style={{ display: "grid", gridTemplateColumns: "240px 1fr", gap: 60 }} className="priv-grid">
          <window.PrivacyTOC lang={lang} blocks={blocks} />
          <div style={{ display: "flex", flexDirection: "column", gap: 32, maxWidth: 760 }}>
            {blocks.map((b, i) => (
              <div key={b.h} id={`sec-${i}`} style={{ scrollMarginTop: 100, paddingBottom: 28, borderBottom: i < blocks.length - 1 ? "1px solid var(--border)" : "none" }}>
                <div style={{ display: "grid", gridTemplateColumns: "auto 1fr", gap: 18, alignItems: "baseline" }}>
                  <div style={{ fontFamily: "var(--font-mono)", fontSize: 12, fontWeight: 600, color: "var(--tl-blue-primary)", letterSpacing: ".05em" }}>{String(i + 1).padStart(2, "0")}</div>
                  <div>
                    <h2 style={{ fontSize: 20, fontWeight: 700, color: "var(--fg-1)", margin: "0 0 10px", letterSpacing: "-0.01em" }}>{b.h}</h2>
                    <div style={{ fontSize: 15, color: "var(--fg-2)", lineHeight: 1.7 }}>{b.p}</div>
                  </div>
                </div>
              </div>
            ))}
          </div>
        </div>
        <style>{`
          @media (max-width: 880px) { .priv-grid { grid-template-columns: 1fr !important; gap: 28px !important; } .priv-toc-sticky { position: static !important; top: auto !important; } }
        `}</style>
      </window.Container>
    </window.Section>
  );
};
