{% extends "base.html" %}
{% block title %}{{ _("privacy.page_title") }}{% endblock %}

{% block content %}
<div class="container mx-auto px-4 py-8 max-w-4xl">
  <h1 class="text-4xl font-bold mb-6">{{ _("privacy.heading") }}</h1>
  <p class="text-sm text-gray-500 mb-8">{{ _("privacy.last_updated") }} {{ build_date|default(current_date|default('April 7, 2024')) }}</p>

  <!-- Table of Contents -->
  <div class="bg-blue-50 border border-blue-200 rounded-lg p-4 mb-6">
    <h2 class="text-lg font-semibold mb-2 text-blue-800">{{ _("privacy.toc_heading") }}</h2>
    <ol class="list-decimal list-inside text-blue-700 space-y-1 text-sm">
      <li><a href="#controller" class="hover:underline">{{ _("privacy.toc_1") }}</a></li>
      <li><a href="#scope" class="hover:underline">{{ _("privacy.toc_2") }}</a></li>
      <li><a href="#data-collection" class="hover:underline">{{ _("privacy.toc_3") }}</a></li>
      <li><a href="#data-minimization" class="hover:underline">{{ _("privacy.toc_4") }}</a></li>
      <li><a href="#cookies" class="hover:underline">{{ _("privacy.toc_5") }}</a></li>
      <li><a href="#third-parties" class="hover:underline">{{ _("privacy.toc_6") }}</a></li>
      <li><a href="#international-transfers" class="hover:underline">{{ _("privacy.toc_7") }}</a></li>
      <li><a href="#retention" class="hover:underline">{{ _("privacy.toc_8") }}</a></li>
      <li><a href="#security" class="hover:underline">{{ _("privacy.toc_9") }}</a></li>
      <li><a href="#gdpr-rights" class="hover:underline">{{ _("privacy.toc_10") }}</a></li>
      <li><a href="#us-rights" class="hover:underline">{{ _("privacy.toc_11") }}</a></li>
      <li><a href="#canada-rights" class="hover:underline">{{ _("privacy.toc_12") }}</a></li>
      <li><a href="#latam-rights" class="hover:underline">{{ _("privacy.toc_13") }}</a></li>
      <li><a href="#apj-rights" class="hover:underline">{{ _("privacy.toc_14") }}</a></li>
      <li><a href="#ukraine-rights" class="hover:underline">{{ _("privacy.toc_15") }}</a></li>
      <li><a href="#updates" class="hover:underline">{{ _("privacy.toc_16") }}</a></li>
    </ol>
  </div>

  <div id="controller" class="bg-white shadow rounded-lg p-6 mb-6">
    <h2 class="text-2xl font-semibold mb-4">{{ _("privacy.s1_heading") }}</h2>
    <p class="text-gray-700 mb-3">
      {{ _("privacy.s1_p1") }}
    </p>
    <p class="text-gray-700 mb-3">
      <strong>{{ _("privacy.s1_company") }}</strong><br />
      {{ _("privacy.s1_address") }}
    </p>
    <p class="text-gray-700 mb-3">
      {{ _("privacy.s1_contact_label") }} <a href="mailto:docuelevate@christian-louis.de" class="text-blue-600 hover:underline">docuelevate@christian-louis.de</a>
    </p>
    <p class="text-gray-700">
      {{ _("privacy.s1_p3") }}
    </p>
  </div>

  <div id="scope" class="bg-white shadow rounded-lg p-6 mb-6">
    <h2 class="text-2xl font-semibold mb-4">{{ _("privacy.s2_heading") }}</h2>
    <p class="text-gray-700 mb-3">
      {{ _("privacy.s2_p1_pre") }}
      <a href="{{ request.url.scheme }}://{{ request.url.netloc }}/" class="text-blue-600 hover:underline" target="_blank">{{ request.url.scheme }}://{{ request.url.netloc }}/</a>.
    </p>
    <p class="text-gray-700">
      {{ _("privacy.s2_p2") }}
    </p>
  </div>

  <div id="data-collection" class="bg-white shadow rounded-lg p-6 mb-6">
    <h2 class="text-2xl font-semibold mb-4">{{ _("privacy.s3_heading") }}</h2>
    <p class="text-gray-700 mb-3">
      <strong>{{ _("privacy.s3_auth_label") }}</strong> {{ _("privacy.s3_auth_body") }}
    </p>
    <p class="text-gray-700 mb-3">
      <strong>{{ _("privacy.s3_doc_label") }}</strong> {{ _("privacy.s3_doc_body") }}
    </p>
    <p class="text-gray-700 mb-3">
      <strong>{{ _("privacy.s3_audit_label") }}</strong> {{ _("privacy.s3_audit_body") }}
    </p>
    <p class="text-gray-700 mb-3">
      <strong>{{ _("privacy.s3_legal_label") }}</strong> {{ _("privacy.s3_legal_body") }}
    </p>
    <ul class="list-disc list-inside text-gray-700 ml-4 mb-3">
      <li class="mb-1">{{ _("privacy.s3_li1") }}</li>
      <li class="mb-1">{{ _("privacy.s3_li2") }}</li>
      <li>{{ _("privacy.s3_li3") }}</li>
    </ul>
  </div>

  <div id="data-minimization" class="bg-white shadow rounded-lg p-6 mb-6">
    <h2 class="text-2xl font-semibold mb-4">{{ _("privacy.s4_heading") }}</h2>
    <p class="text-gray-700 mb-3">
      {{ _("privacy.s4_p1") }}
    </p>
    <ul class="list-disc list-inside text-gray-700 ml-4 mb-3">
      <li class="mb-1">{{ _("privacy.s4_li1") }}</li>
      <li class="mb-1">{{ _("privacy.s4_li2") }}</li>
      <li class="mb-1">{{ _("privacy.s4_li3") }}</li>
      <li class="mb-1">{{ _("privacy.s4_li4") }}</li>
      <li>{{ _("privacy.s4_li5") }}</li>
    </ul>
  </div>

  <div id="cookies" class="bg-white shadow rounded-lg p-6 mb-6">
    <h2 class="text-2xl font-semibold mb-4">{{ _("privacy.s5_heading") }}</h2>
    <p class="text-gray-700 mb-3">
      {{ _("privacy.s5_p1_pre") }} <strong>{{ _("privacy.s5_p1_strong") }}</strong> {{ _("privacy.s5_p1_post") }}
    </p>
    <p class="text-gray-700 mb-3">
      <strong>{{ _("privacy.s5_p2_label") }}</strong> {{ _("privacy.s5_p2_body") }}
    </p>
    <p class="text-gray-700">
      {{ _("privacy.s5_p3_pre") }}
      <a href="/cookies" class="text-blue-600 hover:underline">{{ _("privacy.s5_cookie_link") }}</a>.
    </p>
  </div>

  <div id="third-parties" class="bg-white shadow rounded-lg p-6 mb-6">
    <h2 class="text-2xl font-semibold mb-4">{{ _("privacy.s6_heading") }}</h2>
    <p class="text-gray-700 mb-3">
      <strong>{{ _("privacy.s6_oauth_label") }}</strong> {{ _("privacy.s6_oauth_body") }}
    </p>
    <p class="text-gray-700 mb-3">
      <strong>{{ _("privacy.s6_storage_label") }}</strong>
      {{ _("privacy.s6_storage_body") }}
    </p>
    <p class="text-gray-700 mb-3">
      <strong>{{ _("privacy.s6_ai_label") }}</strong> {{ _("privacy.s6_ai_body") }}
    </p>
    <p class="text-gray-700">
      <strong>{{ _("privacy.s6_no_sale_label") }}</strong> {{ _("privacy.s6_no_sale_body") }}
    </p>
  </div>

  <div id="international-transfers" class="bg-white shadow rounded-lg p-6 mb-6">
    <h2 class="text-2xl font-semibold mb-4">{{ _("privacy.s7_heading") }}</h2>
    <p class="text-gray-700 mb-3">
      {{ _("privacy.s7_p1") }}
    </p>
    <ul class="list-disc list-inside text-gray-700 ml-4 mb-3">
      <li class="mb-1">
        <strong>{{ _("privacy.s7_scc_label") }}</strong> {{ _("privacy.s7_scc_body") }}
      </li>
      <li class="mb-1">
        <strong>{{ _("privacy.s7_adequacy_label") }}</strong> {{ _("privacy.s7_adequacy_body") }}
      </li>
      <li>
        <strong>{{ _("privacy.s7_idta_label") }}</strong> {{ _("privacy.s7_idta_body") }}
      </li>
    </ul>
    <p class="text-gray-700">
      {{ _("privacy.s7_contact") }}
      <a href="mailto:docuelevate@christian-louis.de" class="text-blue-600 hover:underline">docuelevate@christian-louis.de</a>.
    </p>
  </div>

  <div id="retention" class="bg-white shadow rounded-lg p-6 mb-6">
    <h2 class="text-2xl font-semibold mb-4">{{ _("privacy.s8_heading") }}</h2>
    <p class="text-gray-700 mb-3">
      {{ _("privacy.s8_p1") }}
    </p>
    <ul class="list-disc list-inside text-gray-700 ml-4 mb-3">
      <li class="mb-1"><strong>{{ _("privacy.s8_session_label") }}</strong> {{ _("privacy.s8_session_body") }}</li>
      <li class="mb-1"><strong>{{ _("privacy.s8_files_label") }}</strong> {{ _("privacy.s8_files_body") }}</li>
      <li class="mb-1"><strong>{{ _("privacy.s8_audit_label") }}</strong> {{ _("privacy.s8_audit_body") }}</li>
      <li><strong>{{ _("privacy.s8_oauth_label") }}</strong> {{ _("privacy.s8_oauth_body") }}</li>
    </ul>
    <p class="text-gray-700">
      {{ _("privacy.s8_contact") }}
      <a href="mailto:docuelevate@christian-louis.de" class="text-blue-600 hover:underline">docuelevate@christian-louis.de</a>.
    </p>
  </div>

  <div id="security" class="bg-white shadow rounded-lg p-6 mb-6">
    <h2 class="text-2xl font-semibold mb-4">{{ _("privacy.s9_heading") }}</h2>
    <p class="text-gray-700 mb-3">
      {{ _("privacy.s9_p1") }}
    </p>
    <ul class="list-disc list-inside text-gray-700 ml-4">
      <li class="mb-1">{{ _("privacy.s9_li1") }}</li>
      <li class="mb-1">{{ _("privacy.s9_li2") }}</li>
      <li class="mb-1">{{ _("privacy.s9_li3") }}</li>
      <li class="mb-1">{{ _("privacy.s9_li4") }}</li>
      <li>{{ _("privacy.s9_li5") }}</li>
    </ul>
  </div>

  <div id="gdpr-rights" class="bg-white shadow rounded-lg p-6 mb-6">
    <h2 class="text-2xl font-semibold mb-4">{{ _("privacy.s10_heading") }}</h2>
    <p class="text-gray-700 mb-3">
      {{ _("privacy.s10_p1") }}
    </p>
    <ul class="list-disc list-inside text-gray-700 ml-4 mb-3">
      <li class="mb-2"><strong>{{ _("privacy.s10_access_label") }}</strong> {{ _("privacy.s10_access_body") }}</li>
      <li class="mb-2"><strong>{{ _("privacy.s10_rectification_label") }}</strong> {{ _("privacy.s10_rectification_body") }}</li>
      <li class="mb-2"><strong>{{ _("privacy.s10_erasure_label") }}</strong> {{ _("privacy.s10_erasure_body") }}</li>
      <li class="mb-2"><strong>{{ _("privacy.s10_restriction_label") }}</strong> {{ _("privacy.s10_restriction_body") }}</li>
      <li class="mb-2"><strong>{{ _("privacy.s10_portability_label") }}</strong> {{ _("privacy.s10_portability_body") }}</li>
      <li class="mb-2"><strong>{{ _("privacy.s10_object_label") }}</strong> {{ _("privacy.s10_object_body") }}</li>
      <li class="mb-2"><strong>{{ _("privacy.s10_withdraw_label") }}</strong> {{ _("privacy.s10_withdraw_body") }}</li>
      <li><strong>{{ _("privacy.s10_complaint_label") }}</strong> {{ _("privacy.s10_complaint_body") }}</li>
    </ul>
    <p class="text-gray-700">
      {{ _("privacy.s10_contact") }}
      <a href="mailto:docuelevate@christian-louis.de" class="text-blue-600 hover:underline">docuelevate@christian-louis.de</a>.
      {{ _("privacy.s10_response") }}
    </p>
  </div>

  <div id="us-rights" class="bg-white shadow rounded-lg p-6 mb-6">
    <h2 class="text-2xl font-semibold mb-4">{{ _("privacy.s11_heading") }}</h2>
    <p class="text-gray-700 mb-3">
      {{ _("privacy.s11_p1") }}
    </p>
    <ul class="list-disc list-inside text-gray-700 ml-4 mb-3">
      <li class="mb-2"><strong>{{ _("privacy.s11_categories_label") }}</strong> {{ _("privacy.s11_categories_body") }}</li>
      <li class="mb-2"><strong>{{ _("privacy.s11_purpose_label") }}</strong> {{ _("privacy.s11_purpose_body") }}</li>
      <li class="mb-2"><strong>{{ _("privacy.s11_know_label") }}</strong> {{ _("privacy.s11_know_body") }}</li>
      <li class="mb-2"><strong>{{ _("privacy.s11_delete_label") }}</strong> {{ _("privacy.s11_delete_body") }}</li>
      <li class="mb-2"><strong>{{ _("privacy.s11_correct_label") }}</strong> {{ _("privacy.s11_correct_body") }}</li>
      <li class="mb-2"><strong>{{ _("privacy.s11_optout_label") }}</strong> {{ _("privacy.s11_optout_body") }}</li>
      <li class="mb-2"><strong>{{ _("privacy.s11_limit_label") }}</strong> {{ _("privacy.s11_limit_body") }}</li>
      <li><strong>{{ _("privacy.s11_nondiscrim_label") }}</strong> {{ _("privacy.s11_nondiscrim_body") }}</li>
    </ul>
    <p class="text-gray-700">
      {{ _("privacy.s11_contact") }}
      <a href="mailto:docuelevate@christian-louis.de" class="text-blue-600 hover:underline">docuelevate@christian-louis.de</a>.
      {{ _("privacy.s11_response") }}
    </p>
  </div>

  <div id="canada-rights" class="bg-white shadow rounded-lg p-6 mb-6">
    <h2 class="text-2xl font-semibold mb-4">{{ _("privacy.s12_heading") }}</h2>
    <p class="text-gray-700 mb-3">
      {{ _("privacy.s12_p1") }}
    </p>
    <ul class="list-disc list-inside text-gray-700 ml-4 mb-3">
      <li class="mb-2">{{ _("privacy.s12_li1") }}</li>
      <li class="mb-2"><strong>{{ _("privacy.s12_access_label") }}</strong> {{ _("privacy.s12_access_body") }}</li>
      <li class="mb-2"><strong>{{ _("privacy.s12_correction_label") }}</strong> {{ _("privacy.s12_correction_body") }}</li>
      <li class="mb-2"><strong>{{ _("privacy.s12_withdraw_label") }}</strong> {{ _("privacy.s12_withdraw_body") }}</li>
      <li class="mb-2"><strong>{{ _("privacy.s12_quebec_label") }}</strong> {{ _("privacy.s12_quebec_body") }}</li>
    </ul>
    <p class="text-gray-700">
      {{ _("privacy.s12_contact") }}
      <a href="mailto:docuelevate@christian-louis.de" class="text-blue-600 hover:underline">docuelevate@christian-louis.de</a>{{ _("privacy.s12_contact_post") }}
    </p>
  </div>

  <div id="latam-rights" class="bg-white shadow rounded-lg p-6 mb-6">
    <h2 class="text-2xl font-semibold mb-4">{{ _("privacy.s13_heading") }}</h2>
    <p class="text-gray-700 mb-3">
      <strong>{{ _("privacy.s13_brazil_label") }}</strong>
      {{ _("privacy.s13_brazil_body") }}
    </p>
    <ul class="list-disc list-inside text-gray-700 ml-4 mb-3">
      <li class="mb-1">{{ _("privacy.s13_li1") }}</li>
      <li class="mb-1">{{ _("privacy.s13_li2") }}</li>
      <li class="mb-1">{{ _("privacy.s13_li3") }}</li>
      <li class="mb-1">{{ _("privacy.s13_li4") }}</li>
      <li class="mb-1">{{ _("privacy.s13_li5") }}</li>
      <li class="mb-1">{{ _("privacy.s13_li6") }}</li>
      <li class="mb-1">{{ _("privacy.s13_li7") }}</li>
      <li>{{ _("privacy.s13_li8") }}</li>
    </ul>
    <p class="text-gray-700 mb-3">
      <strong>{{ _("privacy.s13_other_label") }}</strong> {{ _("privacy.s13_other_body") }}
    </p>
    <p class="text-gray-700">
      {{ _("privacy.s13_contact") }}
      <a href="mailto:docuelevate@christian-louis.de" class="text-blue-600 hover:underline">docuelevate@christian-louis.de</a>
    </p>
  </div>

  <div id="apj-rights" class="bg-white shadow rounded-lg p-6 mb-6">
    <h2 class="text-2xl font-semibold mb-4">{{ _("privacy.s14_heading") }}</h2>
    <p class="text-gray-700 mb-3">
      <strong>{{ _("privacy.s14_japan_label") }}</strong>
      {{ _("privacy.s14_japan_body") }}
    </p>
    <p class="text-gray-700 mb-3">
      <strong>{{ _("privacy.s14_australia_label") }}</strong>
      {{ _("privacy.s14_australia_body") }}
    </p>
    <p class="text-gray-700 mb-3">
      <strong>{{ _("privacy.s14_korea_label") }}</strong>
      {{ _("privacy.s14_korea_body") }}
    </p>
    <p class="text-gray-700 mb-3">
      <strong>{{ _("privacy.s14_apj_label") }}</strong>
      {{ _("privacy.s14_apj_body") }}
    </p>
    <p class="text-gray-700">
      {{ _("privacy.s14_contact") }}
      <a href="mailto:docuelevate@christian-louis.de" class="text-blue-600 hover:underline">docuelevate@christian-louis.de</a>
    </p>
  </div>

  <div id="ukraine-rights" class="bg-white shadow rounded-lg p-6 mb-6">
    <h2 class="text-2xl font-semibold mb-4">{{ _("privacy.s15_heading") }}</h2>
    <p class="text-gray-700 mb-3">
      {{ _("privacy.s15_p1") }}
    </p>
    <p class="text-gray-700">
      {{ _("privacy.s15_contact") }}
      <a href="mailto:docuelevate@christian-louis.de" class="text-blue-600 hover:underline">docuelevate@christian-louis.de</a>
    </p>
  </div>

  <div id="updates" class="bg-white shadow rounded-lg p-6 mb-6">
    <h2 class="text-2xl font-semibold mb-4">{{ _("privacy.s16_heading") }}</h2>
    <p class="text-gray-700 mb-3">
      {{ _("privacy.s16_p1") }}
    </p>
    <p class="text-gray-700 mb-3">
      {{ _("privacy.s16_p2_pre") }}
      <a href="mailto:docuelevate@christian-louis.de" class="text-blue-600 hover:underline">docuelevate@christian-louis.de</a>.
    </p>
    <p class="text-gray-700">
      {{ _("privacy.s16_p3_pre") }} <a href="/terms" class="text-blue-600 hover:underline">{{ _("privacy.s16_terms_link") }}</a>,
      <a href="/cookies" class="text-blue-600 hover:underline">{{ _("privacy.s16_cookies_link") }}</a>,
      and <a href="/license" class="text-blue-600 hover:underline">{{ _("privacy.s16_license_link") }}</a>.
    </p>
  </div>
</div>
{% endblock %}