// legal-pages.jsx — Privacy Policy & Impressum, bilingual (EN/HR).
// Renders a standalone page (Nav + LegalPage + Footer) on /privacy and
// /impressum. Reuses the site design system (T tokens, Container, Reveal,
// Eyebrow, Nav, Footer). Exports LegalApp + LEGAL content.

const LEGAL = {
  en: {
    privacy: {
      badge: 'Legal',
      title: 'Privacy Policy',
      updatedLabel: 'Last updated',
      updated: 'June 4, 2026',
      blocks: [
        { h: 'Who we are' },
        { p: 'MLOps d.o.o. ("MLOPS", "we", "us") operates the website mlops.hr and is the data controller responsible for your personal data. Our full company and contact details are set out in the Impressum and at the end of this page.' },

        { h: 'What data we collect' },
        { p: 'Contact form. When you send us an enquiry, we collect the name, e-mail address, company name and message you provide, together with the date, time and IP address of the submission.' },
        { p: 'Server logs. Like most websites, our hosting server records standard technical data — IP address, browser type, requested pages and timestamps — to keep the site running and secure.' },
        { p: 'Preferences. Your language choice (English or Croatian) is stored locally in your browser. It never leaves your device and is not transmitted to us.' },

        { h: 'Why we use it, and our legal basis' },
        { ul: [
          'To respond to your enquiry and communicate with you — based on your consent and our legitimate interest in answering prospective and existing clients (Art. 6(1)(a) and (f) GDPR).',
          'To keep the website secure and prevent abuse — based on our legitimate interest (Art. 6(1)(f) GDPR).',
          'To remember your language preference — strictly necessary for a function you actively requested.',
        ] },

        { h: 'Who has access to your data' },
        { p: 'We do not sell your data, and we do not use advertising or analytics trackers. Your enquiry is delivered to us by e-mail and processed by our hosting and e-mail provider, acting as our processor under appropriate data-processing terms.' },
        { p: 'This website loads no third-party resources: fonts and scripts are served from our own server, so your visit shares no data with external content-delivery networks.' },

        { h: 'Advertising and analytics' },
        { p: 'We use no advertising, marketing or analytics trackers of any kind — no Google Analytics, no advertising pixels, and no behavioural profiling or retargeting. We do not transfer your personal data outside the European Union.' },

        { h: 'How long we keep it' },
        { p: 'We retain contact enquiries for up to 24 months after our last correspondence with you, after which they are deleted — unless we are required to keep them longer to comply with a legal obligation or to establish, exercise or defend legal claims.' },

        { h: 'Your rights' },
        { p: 'Under the GDPR you have the right to access, rectify, erase, restrict or object to the processing of your personal data, and the right to data portability. Where processing is based on consent, you may withdraw that consent at any time. To exercise any of these rights, contact us using the details below.' },
        { p: 'You also have the right to lodge a complaint with the competent supervisory authority in Croatia:' },
        { link: { label: 'AZOP — Agencija za zaštitu osobnih podataka (azop.hr)', href: 'https://azop.hr' } },

        { h: 'Cookies and local storage' },
        { p: 'This site uses no tracking, advertising or analytics cookies. The only data stored in your browser is your language preference, held in local storage and strictly necessary for the language switch you control. Because we set no non-essential cookies, no cookie-consent banner is required.' },

        { h: 'How we store your data' },
        { p: 'This website and your enquiries are hosted on cPanel shared hosting provided by MojSite (Plus d.o.o.), Nobileova 20, Pula, Croatia, on servers located in Croatia within the European Union. The same provider handles our e-mail, so your data remains within the EU.' },

        { h: 'Security' },
        { p: 'We apply appropriate technical and organisational measures to protect your data. The contact form is transmitted over an encrypted connection, and access credentials are stored outside the publicly reachable web space.' },

        { h: 'Changes to this policy' },
        { p: 'We may update this policy from time to time. The current version, with its effective date, is always published on this page.' },

        { h: 'Contact' },
        { p: 'For any privacy question, or to exercise your rights, contact us:' },
        { kv: [
          ['MLOps d.o.o.', 'Osječka 174, 31431 Čepin, Croatia'],
          ['E-mail', 'contact@mlops.hr'],
        ] },
      ],
    },
    impressum: {
      badge: 'Legal',
      title: 'Impressum',
      updatedLabel: 'Last updated',
      updated: 'June 4, 2026',
      blocks: [
        { p: 'Information provided pursuant to the Croatian Companies Act (Zakon o trgovačkim društvima) and the Electronic Commerce Act (Zakon o elektroničkoj trgovini).' },
        { kv: [
          ['Company', 'MLOps društvo s ograničenom odgovornošću za istraživanje, razvoj i usluge'],
          ['Short name', 'MLOps d.o.o.'],
          ['Legal form', 'Limited liability company (društvo s ograničenom odgovornošću)'],
          ['Registered office', 'Osječka 174, 31431 Čepin, Croatia'],
          ['E-mail', 'contact@mlops.hr'],
          ['Registration court', 'Commercial Court in Osijek (Trgovački sud u Osijeku)'],
          ['Court register no. (MBS)', '030299454'],
          ['EUID', 'HRSR.030299454'],
          ['Personal ID no. (OIB)', '37277941452'],
          ['VAT ID', 'HR37277941452'],
          ['Share capital', 'EUR 2,500.00 (paid in full)'],
          ['Management', 'Hrvoje Leventić, director — represents the company independently and individually'],
          ['Bank', 'Erste&Steiermärkische Bank d.d., Jadranski trg 3A, Rijeka'],
          ['IBAN', 'HR48 2402 0061 1012 6431 7'],
        ] },

        { h: 'Company announcements' },
        { p: 'In accordance with the company’s founding act, official company announcements are published on this website.' },

        { h: 'Responsibility for content' },
        { note: 'We compile the content of this site with care, but accept no liability for its accuracy, completeness or timeliness. This site may contain links to external websites over whose content we have no control and for which we accept no responsibility; responsibility for linked content rests with its respective operator.' },

        { h: 'Copyright' },
        { note: 'All content on this website — text, graphics, logos and the aperture mark — is the property of MLOps d.o.o. or used with permission, and may not be reproduced or reused without prior written consent.' },
      ],
    },
  },

  hr: {
    privacy: {
      badge: 'Pravne informacije',
      title: 'Pravila privatnosti',
      updatedLabel: 'Zadnja izmjena',
      updated: '4. lipnja 2026.',
      blocks: [
        { h: 'Tko smo mi' },
        { p: 'MLOps d.o.o. („MLOPS”, „mi”) upravlja internetskom stranicom mlops.hr i voditelj je obrade vaših osobnih podataka. Potpuni podaci o društvu i kontakt navedeni su u Impressumu i na dnu ove stranice.' },

        { h: 'Koje podatke prikupljamo' },
        { p: 'Obrazac za kontakt. Kada nam pošaljete upit, prikupljamo ime, e-mail adresu, naziv tvrtke i poruku koju unesete, zajedno s datumom, vremenom i IP adresom slanja.' },
        { p: 'Zapisi poslužitelja. Kao i većina stranica, naš poslužitelj bilježi standardne tehničke podatke — IP adresu, vrstu preglednika, zatražene stranice i vremenske oznake — radi rada i sigurnosti stranice.' },
        { p: 'Postavke. Vaš odabir jezika (engleski ili hrvatski) pohranjuje se lokalno u vašem pregledniku. Nikada ne napušta vaš uređaj i ne prenosi nam se.' },

        { h: 'Zašto ih koristimo i pravna osnova' },
        { ul: [
          'Za odgovor na vaš upit i komunikaciju s vama — na temelju vaše privole i našeg legitimnog interesa za odgovaranje postojećim i potencijalnim klijentima (čl. 6. st. 1. t. (a) i (f) GDPR-a).',
          'Za sigurnost stranice i sprječavanje zlouporabe — na temelju legitimnog interesa (čl. 6. st. 1. t. (f) GDPR-a).',
          'Za pamćenje odabira jezika — nužno za funkciju koju ste sami zatražili.',
        ] },

        { h: 'Tko ima pristup vašim podacima' },
        { p: 'Ne prodajemo vaše podatke i ne koristimo oglašivačke ni analitičke alate za praćenje. Vaš upit dostavlja nam se e-poštom, a obrađuje ga naš pružatelj usluge hostinga i e-pošte kao izvršitelj obrade, uz odgovarajuće ugovorne uvjete.' },
        { p: 'Ova stranica ne učitava sadržaje trećih strana: fontovi i skripte poslužuju se s našeg poslužitelja, pa se vašim posjetom ne dijele podaci s vanjskim mrežama za isporuku sadržaja.' },

        { h: 'Oglašavanje i analitika' },
        { p: 'Ne koristimo nikakve alate za oglašavanje, marketing ni analitiku — nema Google Analyticsa, oglasnih piksela ni profiliranja ili remarketinga. Vaše osobne podatke ne prenosimo izvan Europske unije.' },

        { h: 'Koliko ih čuvamo' },
        { p: 'Upite putem obrasca čuvamo do 24 mjeseca od posljednje komunikacije s vama, nakon čega se brišu — osim ako smo ih dužni čuvati dulje radi ispunjenja zakonske obveze ili radi postavljanja, ostvarivanja ili obrane pravnih zahtjeva.' },

        { h: 'Vaša prava' },
        { p: 'Prema GDPR-u imate pravo na pristup, ispravak, brisanje, ograničenje ili prigovor na obradu svojih osobnih podataka, kao i pravo na prenosivost podataka. Kada se obrada temelji na privoli, privolu možete povući u bilo kojem trenutku. Za ostvarivanje tih prava obratite nam se putem podataka navedenih u nastavku.' },
        { p: 'Također imate pravo podnijeti pritužbu nadležnom nadzornom tijelu u Republici Hrvatskoj:' },
        { link: { label: 'AZOP — Agencija za zaštitu osobnih podataka (azop.hr)', href: 'https://azop.hr' } },

        { h: 'Kolačići i lokalna pohrana' },
        { p: 'Ova stranica ne koristi kolačiće za praćenje, oglašavanje ni analitiku. Jedini podatak pohranjen u vašem pregledniku jest vaš odabir jezika, u lokalnoj pohrani, nužan za prebacivanje jezika kojim vi upravljate. Budući da ne postavljamo kolačiće koji nisu nužni, nije potrebna traka za privolu za kolačiće.' },

        { h: 'Gdje pohranjujemo podatke' },
        { p: 'Ova stranica i vaši upiti smješteni su na cPanel dijeljenom hostingu pružatelja MojSite (Plus d.o.o.), Nobileova 20, Pula, Hrvatska, na poslužiteljima u Hrvatskoj unutar Europske unije. Isti pružatelj upravlja i našom e-poštom, pa vaši podaci ostaju unutar EU-a.' },

        { h: 'Sigurnost' },
        { p: 'Primjenjujemo odgovarajuće tehničke i organizacijske mjere zaštite vaših podataka. Obrazac za kontakt prenosi se preko šifrirane veze, a pristupni podaci pohranjeni su izvan javno dostupnog web prostora.' },

        { h: 'Izmjene pravila' },
        { p: 'Ova pravila možemo povremeno ažurirati. Važeća verzija, s datumom primjene, uvijek je objavljena na ovoj stranici.' },

        { h: 'Kontakt' },
        { p: 'Za sva pitanja o privatnosti ili ostvarivanje prava obratite nam se:' },
        { kv: [
          ['MLOps d.o.o.', 'Osječka 174, 31431 Čepin, Hrvatska'],
          ['E-mail', 'contact@mlops.hr'],
        ] },
      ],
    },
    impressum: {
      badge: 'Pravne informacije',
      title: 'Impressum',
      updatedLabel: 'Zadnja izmjena',
      updated: '4. lipnja 2026.',
      blocks: [
        { p: 'Podaci u skladu sa Zakonom o trgovačkim društvima i Zakonom o elektroničkoj trgovini.' },
        { kv: [
          ['Tvrtka', 'MLOps društvo s ograničenom odgovornošću za istraživanje, razvoj i usluge'],
          ['Skraćena tvrtka', 'MLOps d.o.o.'],
          ['Pravni oblik', 'društvo s ograničenom odgovornošću'],
          ['Sjedište', 'Osječka 174, 31431 Čepin, Hrvatska'],
          ['E-mail', 'contact@mlops.hr'],
          ['Registarski sud', 'Trgovački sud u Osijeku'],
          ['MBS', '030299454'],
          ['EUID', 'HRSR.030299454'],
          ['OIB', '37277941452'],
          ['PDV ID', 'HR37277941452'],
          ['Temeljni kapital', '2.500,00 EUR (uplaćen u cijelosti)'],
          ['Uprava', 'Hrvoje Leventić, direktor — zastupa društvo samostalno i pojedinačno'],
          ['Banka', 'Erste&Steiermärkische Bank d.d., Jadranski trg 3A, Rijeka'],
          ['IBAN', 'HR48 2402 0061 1012 6431 7'],
        ] },

        { h: 'Objava priopćenja' },
        { p: 'U skladu s osnivačkim aktom društva, službena priopćenja objavljuju se na ovoj internetskoj stranici.' },

        { h: 'Odgovornost za sadržaj' },
        { note: 'Sadržaj ove stranice izrađujemo s pažnjom, no ne preuzimamo odgovornost za njegovu točnost, potpunost ni ažurnost. Stranica može sadržavati poveznice na vanjske stranice nad čijim sadržajem nemamo nadzor i za koji ne odgovaramo; odgovornost za povezani sadržaj snosi njegov pružatelj.' },

        { h: 'Autorska prava' },
        { note: 'Sav sadržaj ove stranice — tekst, grafika, logotipi i znak aperture — vlasništvo je društva MLOps d.o.o. ili se koristi uz dopuštenje te se ne smije umnožavati ni koristiti bez prethodne pisane suglasnosti.' },
      ],
    },
  },
};

// ── block renderers ───────────────────────────────────────────
function LegalLink({ href, label, accent }) {
  const [hov, setHov] = React.useState(false);
  const external = /^https?:/.test(href);
  return (
    <a href={href} {...(external ? { target: '_blank', rel: 'noopener noreferrer' } : {})}
      onMouseEnter={() => setHov(true)} onMouseLeave={() => setHov(false)}
      style={{ fontFamily: T.sans, fontSize: 16, fontWeight: 600, color: T.navy,
        textDecoration: 'none', borderBottom: `2px solid ${hov ? accent : 'transparent'}`,
        transition: 'border-color .2s', wordBreak: 'break-word' }}>
      {label}
    </a>
  );
}

function KeyValue({ rows, accent, narrow }) {
  return (
    <div style={{ border: `1px solid ${T.line}`, borderRadius: 14, overflow: 'hidden', marginBottom: 26 }}>
      {rows.map(([k, val], i) => (
        <div key={i} style={{ display: narrow ? 'block' : 'grid', gridTemplateColumns: '230px 1fr',
          padding: narrow ? '13px 18px' : '13px 22px', gap: narrow ? 2 : 18,
          background: i % 2 ? T.panel : T.white, borderTop: i ? `1px solid ${T.line}` : 'none' }}>
          <div style={{ fontFamily: T.sans, fontSize: 12.5, fontWeight: 700, letterSpacing: .4,
            textTransform: 'uppercase', color: T.faint, paddingTop: narrow ? 0 : 2 }}>{k}</div>
          <div style={{ fontFamily: T.sans, fontSize: 15.5, color: T.ink, lineHeight: 1.5 }}>{val}</div>
        </div>
      ))}
    </div>
  );
}

function LegalBlocks({ blocks, accent, narrow }) {
  return blocks.map((b, i) => {
    if (b.h) return <h2 key={i} style={{ fontFamily: T.serif, fontSize: 25, fontWeight: 600, color: T.navy, letterSpacing: -0.4, margin: '36px 0 12px' }}>{b.h}</h2>;
    if (b.p) return <p key={i} style={{ fontFamily: T.sans, fontSize: 16, lineHeight: 1.72, color: T.muted, margin: '0 0 14px' }}>{b.p}</p>;
    if (b.note) return <p key={i} style={{ fontFamily: T.sans, fontSize: 14, lineHeight: 1.65, color: T.faint, margin: '0 0 14px' }}>{b.note}</p>;
    if (b.ul) return (
      <ul key={i} style={{ listStyle: 'none', margin: '0 0 18px', padding: 0, display: 'flex', flexDirection: 'column', gap: 11 }}>
        {b.ul.map((it, j) => (
          <li key={j} style={{ display: 'flex', gap: 12, alignItems: 'flex-start' }}>
            <svg width="16" height="16" viewBox="0 0 16 16" fill="none" style={{ flexShrink: 0, marginTop: 5 }}><path d="M3 8.5l3 3 7-8" stroke={accent} strokeWidth="2" strokeLinecap="round" strokeLinejoin="round" /></svg>
            <span style={{ fontFamily: T.sans, fontSize: 16, lineHeight: 1.65, color: T.muted }}>{it}</span>
          </li>
        ))}
      </ul>
    );
    if (b.kv) return <div key={i} style={{ marginTop: 10 }}><KeyValue rows={b.kv} accent={accent} narrow={narrow} /></div>;
    if (b.link) return <p key={i} style={{ margin: '0 0 14px' }}><LegalLink href={b.link.href} label={b.link.label} accent={accent} /></p>;
    return null;
  });
}

// ── page ──────────────────────────────────────────────────────
function LegalPage({ data, accent }) {
  const narrow = useNarrow();
  return (
    <section style={{ background: T.white, padding: narrow ? '120px 0 64px' : '150px 0 90px' }}>
      <Container>
        <div style={{ maxWidth: 760 }}>
          <Reveal style={{ display: 'inline-block' }}><Eyebrow accent={accent}>{data.badge}</Eyebrow></Reveal>
          <Reveal delay={60}>
            <h1 style={{ fontFamily: T.serif, fontSize: 'clamp(34px,4.4vw,52px)', lineHeight: 1.08, fontWeight: 500, letterSpacing: -1, color: T.navy, margin: '20px 0 14px' }}>{data.title}</h1>
          </Reveal>
          <Reveal delay={110}>
            <p style={{ fontFamily: T.sans, fontSize: 13.5, fontWeight: 600, letterSpacing: .3, color: T.faint, margin: 0 }}>
              {data.updatedLabel}: {data.updated}
            </p>
          </Reveal>
          <Reveal delay={150}>
            <div style={{ height: 1, background: T.line, margin: '32px 0 30px' }} />
          </Reveal>
          <Reveal delay={180}>
            <div>
              <LegalBlocks blocks={data.blocks} accent={accent} narrow={narrow} />
            </div>
          </Reveal>
        </div>
      </Container>
    </section>
  );
}

// ── standalone app (Nav + page + Footer), used by privacy.php / impressum.php
function LegalApp({ doc }) {
  const [lang, setLangState] = React.useState(() => {
    try { return localStorage.getItem('mlops-lang') || 'en'; } catch { return 'en'; }
  });
  const setLang = (l) => { setLangState(l); try { localStorage.setItem('mlops-lang', l); } catch {} };
  React.useEffect(() => { document.documentElement.lang = lang; }, [lang]);

  const accent = '#f2b705';
  const logoText = 'MLOPS';
  const logoMark = 'Aperture';
  const c = CONTENT[lang];
  const data = (LEGAL[lang] || LEGAL.en)[doc];

  return (
    <React.Fragment>
      <Nav c={c} lang={lang} setLang={setLang} logoText={logoText} accent={accent} logoMark={logoMark} offsite />
      <main>
        <LegalPage data={data} accent={accent} />
      </main>
      <Footer c={c} lang={lang} setLang={setLang} logoText={logoText} accent={accent} logoMark={logoMark} offsite />
    </React.Fragment>
  );
}

Object.assign(window, { LEGAL, LegalPage, LegalApp });
