Emailsorter/client/src/pages/Privacy.tsx

import { Link } from 'react-router-dom'
import { ArrowLeft, Shield } from 'lucide-react'

export function Privacy() {
  return (
    <div className="min-h-screen bg-slate-50">
      {/* Header */}
      <header className="bg-white border-b border-slate-200">
        <div className="max-w-4xl mx-auto px-4 sm:px-6 lg:px-8 py-4">
          <Link 
            to="/" 
            className="inline-flex items-center gap-2 text-slate-600 hover:text-slate-900 transition-colors"
          >
            <ArrowLeft className="w-4 h-4" />
            <span className="text-sm font-medium">Back to Home</span>
          </Link>
        </div>
      </header>

      {/* Content */}
      <main className="max-w-4xl mx-auto px-4 sm:px-6 lg:px-8 py-12">
        <div className="bg-white rounded-xl shadow-sm border border-slate-200 p-8 md:p-12">
          {/* Title */}
          <div className="flex items-center gap-3 mb-8">
            <div className="w-12 h-12 rounded-lg bg-primary-100 flex items-center justify-center">
              <Shield className="w-6 h-6 text-primary-600" />
            </div>
            <div>
              <h1 className="text-3xl font-bold text-slate-900">Privacy Policy</h1>
              <p className="text-slate-500 mt-1">Last updated: {new Date().toLocaleDateString('en-US', { year: 'numeric', month: 'long', day: 'numeric' })}</p>
            </div>
          </div>

          {/* Content - Placeholder for webklar.com content */}
          <div className="prose prose-slate max-w-none">
            <p className="text-slate-600 mb-6">
              <strong>Note:</strong> This privacy policy is managed by webklar.com. Please refer to their privacy policy for detailed information.
            </p>

            <div className="bg-slate-50 border border-slate-200 rounded-lg p-6 mb-8">
              <h2 className="text-xl font-semibold text-slate-900 mb-4">Data Protection Information</h2>
              <p className="text-slate-700 mb-4">
                EmailSorter is operated by webklar.com. The following privacy policy applies to the use of this website and our services.
              </p>
              
              <h3 className="text-lg font-semibold text-slate-900 mt-6 mb-3">1. Responsible Party</h3>
              <p className="text-slate-700 mb-4">
                The responsible party for data processing on this website is:
              </p>
              <div className="bg-white border border-slate-200 rounded-lg p-4 mb-4">
                <p className="text-slate-700 mb-2">
                  <strong>webklar.com</strong><br />
                  Kenso Grimm, Justin Klein
                </p>
                <p className="text-slate-700 mb-2">
                  <strong>Contact:</strong><br />
                  Email: <a href="mailto:support@webklar.com" className="text-primary-600 hover:text-primary-700 underline">support@webklar.com</a><br />
                  Phone: <a href="tel:+4917623726355" className="text-primary-600 hover:text-primary-700 underline">+49 176 23726355</a>
                </p>
                <p className="text-sm text-slate-600 mt-3">
                  For complete contact details, please refer to the <Link to="/imprint" className="text-primary-600 hover:text-primary-700 underline">Impressum</Link>.
                </p>
              </div>

              <h3 className="text-lg font-semibold text-slate-900 mt-6 mb-3">2. Data Collection and Processing</h3>
              <p className="text-slate-700 mb-4">
                When you use EmailSorter, we collect and process the following data:
              </p>
              <ul className="list-disc list-inside text-slate-700 mb-4 space-y-2 ml-4">
                <li>Account information (email address, name)</li>
                <li>Email metadata (sender, subject, date) for sorting purposes</li>
                <li>Usage statistics and preferences</li>
                <li>Payment information (processed securely via Stripe)</li>
              </ul>

              <h3 className="text-lg font-semibold text-slate-900 mt-6 mb-3">3. Purpose of Data Processing</h3>
              <p className="text-slate-700 mb-4">
                We process your data exclusively for the following purposes:
              </p>
              <ul className="list-disc list-inside text-slate-700 mb-4 space-y-2 ml-4">
                <li>Providing and improving the EmailSorter service</li>
                <li>Automated email sorting and categorization</li>
                <li>Processing payments and subscriptions</li>
                <li>Customer support and communication</li>
              </ul>

              <h3 className="text-lg font-semibold text-slate-900 mt-6 mb-3">4. Data Security</h3>
              <p className="text-slate-700 mb-4">
                We implement appropriate technical and organizational measures to protect your data against unauthorized access, loss, or destruction.
              </p>

              <h3 className="text-lg font-semibold text-slate-900 mt-6 mb-3">5. Your Rights</h3>
              <p className="text-slate-700 mb-4">
                You have the right to:
              </p>
              <ul className="list-disc list-inside text-slate-700 mb-4 space-y-2 ml-4">
                <li>Access your personal data</li>
                <li>Correct inaccurate data</li>
                <li>Request deletion of your data</li>
                <li>Object to data processing</li>
                <li>Data portability</li>
              </ul>

              <h3 className="text-lg font-semibold text-slate-900 mt-6 mb-3">6. Hosting and Third-Party Services</h3>
              <p className="text-slate-700 mb-4">
                <strong>Hosting:</strong> Our website is hosted by Netlify, which acts as a data processor.
              </p>
              <p className="text-slate-700 mb-4">
                We use the following third-party services:
              </p>
              <ul className="list-disc list-inside text-slate-700 mb-4 space-y-2 ml-4">
                <li><strong>Appwrite:</strong> User authentication and database</li>
                <li><strong>Stripe:</strong> Payment processing</li>
                <li><strong>Mistral AI:</strong> Email categorization</li>
                <li><strong>Gmail/Outlook API:</strong> Email access (with your explicit consent)</li>
                <li><strong>Plausible (optional):</strong> Privacy-friendly analytics tool, if enabled</li>
              </ul>
              
              <h3 className="text-lg font-semibold text-slate-900 mt-6 mb-3">6.1. Cookies and Tracking</h3>
              <p className="text-slate-700 mb-4">
                We do not use external fonts or unnecessary cookies. If we use any tracking tools (such as Plausible), 
                they are privacy-friendly and do not store personal data. We only process personal data to the extent 
                that it is technically or organizationally necessary.
              </p>

              <h3 className="text-lg font-semibold text-slate-900 mt-6 mb-3">7. Contact Form Data</h3>
              <p className="text-slate-700 mb-4">
                Data that you send to us via contact forms will be stored and used for processing your inquiry. 
                This data will not be shared with third parties without your consent.
              </p>

              <h3 className="text-lg font-semibold text-slate-900 mt-6 mb-3">8. Contact</h3>
              <p className="text-slate-700 mb-4">
                For questions regarding data protection, please contact us:
              </p>
              <div className="bg-white border border-slate-200 rounded-lg p-4 mb-4">
                <p className="text-slate-700">
                  <strong>Email:</strong>{' '}
                  <a href="mailto:support@webklar.com" className="text-primary-600 hover:text-primary-700 underline">
                    support@webklar.com
                  </a>
                </p>
                <p className="text-slate-700 mt-2">
                  <strong>Phone:</strong>{' '}
                  <a href="tel:+4917623726355" className="text-primary-600 hover:text-primary-700 underline">
                    +49 176 23726355
                  </a>
                </p>
                <p className="text-sm text-slate-600 mt-3">
                  For complete contact details, please refer to the <Link to="/imprint" className="text-primary-600 hover:text-primary-700 underline">Impressum</Link>.
                </p>
              </div>

              <div className="mt-8 pt-6 border-t border-slate-200">
                <p className="text-sm text-slate-500">
                  <strong>Important:</strong> This is a simplified version. For the complete and legally binding privacy policy, please visit{' '}
                  <a href="https://webklar.com/datenschutz" target="_blank" rel="noopener noreferrer" className="text-primary-600 hover:text-primary-700 underline">
                    webklar.com/datenschutz
                  </a>
                </p>
              </div>
            </div>
          </div>
        </div>
      </main>
    </div>
  )
}