function CookiePolicyPage() {
  const section = (title, children) => (
    <div style={{ marginBottom: 'var(--space-7)' }}>
      <h2 style={{ fontFamily: 'var(--font-serif-display)', fontSize: '1.25rem', color: 'var(--text-primary)', marginBottom: 'var(--space-3)' }}>
        {title}
      </h2>
      <div style={{ font: 'var(--text-body)', color: 'var(--text-secondary)', lineHeight: 1.7 }}>
        {children}
      </div>
    </div>
  );

  const tableRow = (name, purpose, duration) => (
    <tr>
      <td style={{ padding: '10px 14px', borderBottom: '1px solid var(--border-subtle)' }}>{name}</td>
      <td style={{ padding: '10px 14px', borderBottom: '1px solid var(--border-subtle)' }}>{purpose}</td>
      <td style={{ padding: '10px 14px', borderBottom: '1px solid var(--border-subtle)', whiteSpace: 'nowrap' }}>{duration}</td>
    </tr>
  );

  return (
    <section style={{ maxWidth: 720, margin: '0 auto', padding: 'var(--space-9) var(--space-6)' }}>
      <div className="eyebrow" style={{ marginBottom: 'var(--space-3)' }}>Rechtliches</div>
      <h1 className="headline" style={{ fontSize: '1.8rem', marginBottom: 'var(--space-7)' }}>Cookie-Richtlinien</h1>

      {section('Allgemeines', (
        <p style={{ margin: 0 }}>
          Diese Website verwendet Cookies und vergleichbare Technologien, um die Nutzung unserer Seite zu
          ermöglichen, den Terminkalender einzubinden und das Angebot fortlaufend zu verbessern. Nachfolgend
          erläutern wir, welche Kategorien von Cookies zum Einsatz kommen und wie Sie Ihre Einwilligung
          verwalten können.
        </p>
      ))}

      {section('Technisch notwendige Cookies', (
        <>
          <p>
            Diese Cookies sind für den Betrieb der Website erforderlich und können nicht deaktiviert werden.
            Sie speichern keine personenbezogenen Daten, die Rückschlüsse auf Ihre Identität zulassen.
          </p>
          <table style={{ width: '100%', borderCollapse: 'collapse', font: 'var(--text-body-sm)', marginTop: 'var(--space-3)' }}>
            <thead>
              <tr style={{ textAlign: 'left', color: 'var(--text-primary)' }}>
                <th style={{ padding: '10px 14px', borderBottom: '1px solid var(--border-subtle)' }}>Cookie</th>
                <th style={{ padding: '10px 14px', borderBottom: '1px solid var(--border-subtle)' }}>Zweck</th>
                <th style={{ padding: '10px 14px', borderBottom: '1px solid var(--border-subtle)' }}>Speicherdauer</th>
              </tr>
            </thead>
            <tbody>
              {tableRow('cookie_consent', 'Speichert Ihre Cookie-Einstellungen', '12 Monate')}
              {tableRow('session_id', 'Hält die Sitzung beim Durchsuchen der Seite aufrecht', 'Sitzungsende')}
            </tbody>
          </table>
        </>
      ))}

      {section('Terminkalender-Integration', (
        <>
          <p>
            Zur Online-Terminbuchung binden wir den Kalender von [Name des Buchungsanbieters, z. B. Calendly /
            Fresha / eigenes System] ein. Beim Aufruf der Buchungsseite kann der Anbieter eigene Cookies setzen,
            um die Terminauswahl zu ermöglichen, doppelte Buchungen zu vermeiden und die Verfügbarkeit korrekt
            anzuzeigen. Dabei werden ggf. IP-Adresse, Browserinformationen sowie die von Ihnen eingegebenen
            Buchungsdaten (Name, E-Mail, Telefonnummer, gewünschte Behandlung, Terminzeitpunkt) an den Anbieter
            übermittelt.
          </p>
          <table style={{ width: '100%', borderCollapse: 'collapse', font: 'var(--text-body-sm)', marginTop: 'var(--space-3)' }}>
            <thead>
              <tr style={{ textAlign: 'left', color: 'var(--text-primary)' }}>
                <th style={{ padding: '10px 14px', borderBottom: '1px solid var(--border-subtle)' }}>Cookie</th>
                <th style={{ padding: '10px 14px', borderBottom: '1px solid var(--border-subtle)' }}>Zweck</th>
                <th style={{ padding: '10px 14px', borderBottom: '1px solid var(--border-subtle)' }}>Speicherdauer</th>
              </tr>
            </thead>
            <tbody>
              {tableRow('[Anbieter]_booking', 'Ermöglicht die Terminauswahl und -bestätigung', '[Dauer laut Anbieter]')}
            </tbody>
          </table>
          <p style={{ marginTop: 'var(--space-3)' }}>
            Diese Cookies sind für die Terminbuchung funktional erforderlich und werden nur gesetzt, wenn Sie die
            Buchungsseite aufrufen bzw. Ihre Einwilligung erteilt haben. Details zum jeweiligen Anbieter entnehmen
            Sie dessen eigener Datenschutzerklärung, die beim Buchungsvorgang verlinkt ist.
          </p>
        </>
      ))}

      {section('Kundendatei zu Behandlungen', (
        <p style={{ margin: 0 }}>
          Unabhängig von Cookies führen wir für gebuchte Behandlungen eine Kundendatei, in der wir Kontaktdaten
          sowie behandlungsbezogene Informationen (z. B. gebuchte Anwendungen, Termine, Verlauf) speichern, um
          eine sichere und individuell abgestimmte Betreuung zu gewährleisten. Diese Datenverarbeitung erfolgt
          nicht über Cookies, sondern direkt in unseren internen Systemen und ist in unserer
          Datenschutzerklärung gesondert beschrieben. [Verweis auf Datenschutzerklärung ergänzen, sobald verfügbar.]
        </p>
      ))}

      {section('Verwaltung Ihrer Einwilligung', (
        <p style={{ margin: 0 }}>
          Sie können Ihre Cookie-Einstellungen jederzeit über den Cookie-Banner bzw. [Link/Button „Cookie-Einstellungen“
          ergänzen] anpassen oder widerrufen. Zusätzlich können Sie Cookies in den Einstellungen Ihres Browsers
          verwalten oder löschen. Das Deaktivieren einzelner Cookies kann dazu führen, dass Funktionen wie die
          Terminbuchung eingeschränkt zur Verfügung stehen.
        </p>
      ))}

      {section('Kontakt', (
        <p style={{ margin: 0 }}>
          Bei Fragen zu dieser Cookie-Richtlinie erreichen Sie uns unter [E-Mail-Adresse] oder postalisch unter
          der im Impressum genannten Anschrift.
        </p>
      ))}
    </section>
  );
}

window.CookiePolicyPage = CookiePolicyPage;