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-br from-beige-100 via-beige-50 to-beige-100 py-12 px-4">
      <div className="max-w-4xl mx-auto bg-white rounded-xl shadow-lg border border-beige-300 p-8">
        <h1 className="text-3xl font-bold text-gray-800 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-800 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-800 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-800 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-800 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-500 hover:text-primary-600 transition-colors">privacy@thetiptop.fr</a>
            </p>
          </section>

          <section>
            <h2 className="text-2xl font-semibold text-gray-800 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-500 hover:text-primary-600 transition-colors">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-beige-300">
          <a
            href="/"
            className="inline-flex items-center gap-2 text-primary-500 hover:text-primary-600 font-medium transition-colors group"
          >
            <svg className="w-5 h-5 group-hover:-translate-x-1 transition-transform" fill="none" stroke="currentColor" viewBox="0 0 24 24">
              <path strokeLinecap="round" strokeLinejoin="round" strokeWidth={2} d="M10 19l-7-7m0 0l7-7m-7 7h18" />
            </svg>
            Retour à l'accueil
          </a>
        </div>
      </div>
    </div>
  );
}
