<template>
  <div class="min-h-full py-16 px-4 sm:px-6 lg:px-8 bg-gray-50">
    <div class="max-w-4xl mx-auto">
      <h1 class="text-4xl sm:text-5xl font-display font-bold text-gray-900 mb-6">
        Konto loeschen
      </h1>
      <div class="w-24 h-1 bg-primary-600 mb-8" />

      <div class="bg-white p-8 rounded-xl shadow-lg space-y-6 text-gray-700">
        <section>
          <h2 class="text-xl font-display font-bold text-gray-900 mb-2">
            Kontoloeschung fuer App- und Webkonto
          </h2>
          <p>
            Sie koennen die Loeschung Ihres Harheimer-TC-Kontos jederzeit beantragen.
            Nach erfolgreicher Pruefung wird Ihr Zugang deaktiviert und Ihre personenbezogenen Daten
            gemaess den gesetzlichen Aufbewahrungspflichten geloescht oder anonymisiert.
          </p>
        </section>

        <section>
          <h2 class="text-xl font-display font-bold text-gray-900 mb-2">
            So stellen Sie den Antrag
          </h2>
          <ol class="list-decimal pl-6 space-y-2">
            <li>Melden Sie sich mit Ihrem Konto im Mitgliederbereich an.</li>
            <li>Nutzen Sie das Kontaktformular oder schreiben Sie eine E-Mail mit dem Betreff "Konto loeschen".</li>
            <li>Nennen Sie dabei die E-Mail-Adresse Ihres Kontos zur Zuordnung.</li>
          </ol>
          <div class="mt-4 flex flex-wrap gap-3">
            <NuxtLink
              to="/kontakt"
              class="inline-flex items-center px-4 py-2 bg-primary-600 hover:bg-primary-700 text-white font-medium rounded-lg transition-colors"
            >
              Kontaktformular
            </NuxtLink>
            <NuxtLink
              to="/impressum"
              class="inline-flex items-center px-4 py-2 bg-gray-100 hover:bg-gray-200 text-gray-900 font-medium rounded-lg transition-colors"
            >
              Kontakt per E-Mail im Impressum
            </NuxtLink>
          </div>
        </section>

        <section>
          <h2 class="text-xl font-display font-bold text-gray-900 mb-2">
            Welche Daten sind betroffen?
          </h2>
          <ul class="list-disc pl-6 space-y-1">
            <li>Login-Daten und Zugangsdaten werden entfernt oder ungueltig gemacht.</li>
            <li>Persoenliche Profildaten im Mitgliederbereich werden geloescht oder anonymisiert.</li>
            <li>Rechtlich erforderliche Restdaten (z. B. vereins- oder steuerrechtlich) koennen befristet gespeichert bleiben.</li>
          </ul>
        </section>

        <section>
          <h2 class="text-xl font-display font-bold text-gray-900 mb-2">
            Bearbeitungszeit
          </h2>
          <p>
            Wir bearbeiten Loeschanfragen in der Regel innerhalb von 30 Tagen.
            Bei Rueckfragen kontaktieren wir Sie ueber die hinterlegte E-Mail-Adresse.
          </p>
        </section>
      </div>
    </div>
  </div>
</template>

<script setup>
useHead({
  title: 'Konto loeschen - Harheimer TC',
})
</script>
