"use client";

import {motion} from "framer-motion";

const fadeInUp = {
    hidden: {opacity: 0, y: 30},
    visible: (i: number) => ({
        opacity: 1,
        y: 0,
        transition: {
            duration: 0.6,
            delay: i * 0.2,
            ease: "easeOut",
        },
    }),
};

const PrivacyComp = () => {
    const sections = [
        {
            title: "1. Datenschutz auf einen Blick",
            content: (
                <>
                    <p>
                        Die folgenden Hinweise geben einen einfachen Überblick darüber, was mit Ihren personenbezogenen
                        Daten passiert, wenn Sie diese Website besuchen. Personenbezogene Daten sind alle Daten, mit
                        denen Sie persönlich identifiziert werden können.
                    </p>
                    <p>
                        Die Datenverarbeitung auf dieser Website erfolgt durch den Websitebetreiber. Dessen Kontaktdaten
                        finden Sie im Abschnitt „Hinweis zur Verantwortlichen Stelle“.
                    </p>
                </>
            ),
        },
        {
            title: "2. Allgemeine Hinweise und Pflichtinformationen",
            content: (
                <>
                    <p>
                        Wir behandeln Ihre personenbezogenen Daten vertraulich und entsprechend den gesetzlichen
                        Datenschutzvorschriften sowie dieser Datenschutzerklärung. Wir weisen darauf hin, dass die
                        Datenübertragung im Internet Sicherheitslücken aufweisen kann.
                    </p>
                    <p>
                        Verantwortlich für die Datenverarbeitung:
                        <br/>
                        Rhein-Software Development
                        <br/>
                        Mühlenstrasse 13
                        <br/>
                        79664 Wehr
                        <br/>
                        <br/>
                        Telefon: +49 (0) 151 24003632
                        <br/>
                        E-Mail: <a href="mailto:contact@rhein-software.dev"
                                   className="underline text-primary">contact@rhein-software.dev</a>
                    </p>
                </>
            ),
        },
        {
            title: "3. Ihre Rechte",
            content: (
                <p>
                    Sie haben das Recht auf Auskunft, Berichtigung, Löschung, Einschränkung der Verarbeitung,
                    Datenübertragbarkeit sowie auf Widerspruch gegen die Verarbeitung Ihrer Daten. Zudem haben Sie
                    ein Beschwerderecht bei der zuständigen Aufsichtsbehörde.
                </p>
            ),
        },
        {
            title: "4. Analyse-Tools und Cookies",
            content: (
                <p>
                    Beim Besuch dieser Website kann Ihr Surfverhalten statistisch ausgewertet werden. Das geschieht
                    vor allem mit sogenannten Analyseprogrammen und Cookies. Detaillierte Informationen hierzu
                    entnehmen Sie bitte unserer vollständigen Datenschutzerklärung.
                </p>
            ),
        },
        {
            title: "5. Sicherheit",
            content: (
                <p>
                    Diese Seite nutzt eine SSL- bzw. TLS-Verschlüsselung. Eine verschlüsselte Verbindung erkennen
                    Sie an der Adresszeile des Browsers („https://“) und dem Schloss-Symbol.
                </p>
            ),
        },
        {
            title: "Quelle",
            content: (
                <p className="text-sm text-muted-foreground">
                    Quelle: <a href="https://www.e-recht24.de" target="_blank" rel="noopener noreferrer"
                               className="underline">www.e-recht24.de</a>
                </p>
            ),
        },
    ];

    return (
        <div className="overflow-hidden bg-background text-foreground">
            <div className="mt-16 w-[90%] sm:w-[80%] mx-auto py-12 space-y-10 text-base leading-relaxed">
                {sections.map((section, i) => (
                    <motion.div
                        key={section.title}
                        custom={i}
                        initial="hidden"
                        whileInView="visible"
                        viewport={{once: true, amount: 0.2}}
                        variants={fadeInUp}
                    >
                        <h2 className="text-2xl font-bold mb-4">{section.title}</h2>
                        <div className="space-y-4">{section.content}</div>
                    </motion.div>
                ))}
            </div>
        </div>
    );
};

export default PrivacyComp;