import type { Metadata } from "next";

export const metadata: Metadata = {
  title: "Politique de confidentialité - Thé Tip Top",
  description: "Politique de confidentialité et protection des données personnelles de Thé Tip Top",
};

export default function PrivacyPage() {
  return (
    <div className="min-h-screen bg-gradient-to-b from-primary-50 to-white py-12 px-4">
      <div className="max-w-4xl mx-auto bg-white rounded-lg shadow-lg p-8">
        <h1 className="text-3xl font-bold text-gray-900 mb-6">
          Politique de confidentialité
        </h1>

        <p className="text-sm text-gray-600 mb-8">
          Dernière mise à jour : 17 janvier 2025
        </p>

        <div className="space-y-6 text-gray-700">
          <section>
            <h2 className="text-2xl font-semibold text-gray-900 mb-3">
              1. Introduction
            </h2>
            <p>
              Bienvenue sur Thé Tip Top. Nous nous engageons à protéger et à respecter
              votre vie privée. Cette politique explique comment nous collectons, utilisons
              et protégeons vos données personnelles.
            </p>
          </section>

          <section>
            <h2 className="text-2xl font-semibold text-gray-900 mb-3">
              2. Données collectées
            </h2>
            <p className="mb-2">Nous collectons les informations suivantes :</p>
            <ul className="list-disc pl-6 space-y-2">
              <li>Informations d identification : nom, prénom, adresse e-mail</li>
              <li>Informations de profil : photo de profil (si fournie via OAuth)</li>
              <li>Informations de connexion : via Google ou Facebook OAuth</li>
              <li>Données de participation : codes de tickets, gains remportés</li>
              <li>Données de navigation : cookies, adresse IP</li>
            </ul>
          </section>

          <section>
            <h2 className="text-2xl font-semibold text-gray-900 mb-3">
              3. Utilisation des données
            </h2>
            <p className="mb-2">Vos données sont utilisées pour :</p>
            <ul className="list-disc pl-6 space-y-2">
              <li>Gérer votre compte et votre participation au jeu-concours</li>
              <li>Vous permettre de récupérer vos gains</li>
              <li>Améliorer nos services et votre expérience utilisateur</li>
              <li>Vous envoyer des communications relatives au concours</li>
              <li>Respecter nos obligations légales</li>
            </ul>
          </section>

          <section>
            <h2 className="text-2xl font-semibold text-gray-900 mb-3">
              4. Vos droits (RGPD)
            </h2>
            <p className="mb-2">Conformément au RGPD, vous disposez des droits suivants :</p>
            <ul className="list-disc pl-6 space-y-2">
              <li><strong>Droit d accès :</strong> obtenir une copie de vos données</li>
              <li><strong>Droit de rectification :</strong> corriger vos données inexactes</li>
              <li><strong>Droit à l effacement :</strong> demander la suppression de vos données</li>
              <li><strong>Droit d opposition :</strong> vous opposer au traitement de vos données</li>
            </ul>
            <p className="mt-3">
              Pour exercer ces droits, contactez-nous à : <a href="mailto:privacy@thetiptop.fr" className="text-primary-600 hover:underline">privacy@thetiptop.fr</a>
            </p>
          </section>

          <section>
            <h2 className="text-2xl font-semibold text-gray-900 mb-3">
              5. Contact
            </h2>
            <p>
              Pour toute question concernant cette politique de confidentialité,
              vous pouvez nous contacter :
            </p>
            <ul className="list-none space-y-2 mt-3">
              <li><strong>Email :</strong> <a href="mailto:privacy@thetiptop.fr" className="text-primary-600 hover:underline">privacy@thetiptop.fr</a></li>
              <li><strong>Adresse :</strong> 18 Avenue Thiers, 06000 Nice, France</li>
            </ul>
          </section>
        </div>

        <div className="mt-8 pt-6 border-t border-gray-200">
          <a
            href="/"
            className="text-primary-600 hover:text-primary-700 font-medium"
          >
            ← Retour à l accueil
          </a>
        </div>
      </div>
    </div>
  );
}