import {FontAwesomeIcon} from '@fortawesome/react-fontawesome';
import {faExternalLinkAlt, faFileContract} from '@fortawesome/free-solid-svg-icons';
// Removed Next.js router and Link imports for Electron

interface TermsOfUseProps {
    onAccept: () => void;
}

export default function TermsOfUse({onAccept}: TermsOfUseProps) {
    function handleAcceptTerm(): void {
        onAccept();
    }
    
    return (
        <div
            className="fixed inset-0 z-50 bg-black/90 backdrop-blur-sm flex items-center justify-center p-6 font-['Lora']">
            <div
                className="bg-tertiary border border-primary/40 rounded-2xl shadow-2xl max-w-2xl w-full max-h-[90vh] overflow-hidden">
                <div className="px-8 py-6 border-b border-secondary/40 bg-gradient-to-r from-primary/10 to-primary/5">
                    <div className="flex items-center space-x-4">
                        <div className="bg-primary/20 p-3 rounded-xl">
                            <FontAwesomeIcon icon={faFileContract} className="text-primary text-2xl"/>
                        </div>
                        <div>
                            <h2 className="text-text-primary font-bold text-2xl">Termes d'utilisation</h2>
                            <p className="text-text-secondary text-sm mt-1">Acceptation requise pour accéder à ERitors
                                Scribe</p>
                        </div>
                    </div>
                </div>
                <div className="px-8 py-8 overflow-y-auto max-h-[60vh]">
                    <div className="space-y-6">
                        <div className="bg-primary/5 border border-primary/20 rounded-xl p-6">
                            <h3 className="text-text-primary font-semibold text-lg mb-4">
                                Acceptation obligatoire
                            </h3>
                            <div className="text-text-secondary text-base leading-relaxed space-y-4">
                                <p>
                                    Pour pouvoir utiliser nos services, tel qu'<strong className="text-primary">ERitors
                                    Scribe</strong>,
                                    vous devez accepter les termes d'utilisation en cliquant
                                    sur <strong>J'accepte</strong>.
                                </p>
                                <p>
                                    Veuillez lire attentivement la page détaillée des termes et conditions d'utilisation
                                    avant de procéder à l'acceptation.
                                </p>
                                <p>
                                    Si vous n'acceptez pas ces conditions, vous ne pourrez pas accéder à nos services
                                    et serez redirigé vers la page d'accueil.
                                </p>
                            </div>
                        </div>
                        
                        <div className="bg-secondary/20 border border-secondary/30 rounded-xl p-6">
                            <h3 className="text-text-primary font-semibold text-lg mb-4">
                                Documentation complète
                            </h3>
                            <p className="text-text-secondary text-base leading-relaxed mb-4">
                                Pour consulter l'intégralité de nos termes et conditions d'utilisation,
                                veuillez visiter notre page dédiée :
                            </p>
                            <a
                                href="/terms"
                                target="_blank"
                                rel="noopener noreferrer"
                                className="inline-flex items-center space-x-2 text-primary hover:text-primary-light transition-colors duration-200 font-medium"
                            >
                                <span>Consulter les termes complets</span>
                                <FontAwesomeIcon icon={faExternalLinkAlt} className="text-sm"/>
                            </a>
                        </div>
                        
                        <div className="bg-warning/10 border border-warning/30 rounded-xl p-6">
                            <div className="flex items-start space-x-3">
                                <div className="bg-warning/20 p-2 rounded-lg mt-1">
                                    <FontAwesomeIcon icon={faFileContract} className="text-warning text-lg"/>
                                </div>
                                <div>
                                    <h4 className="text-text-primary font-semibold text-base mb-2">
                                        Importance capitale
                                    </h4>
                                    <p className="text-text-secondary text-sm leading-relaxed">
                                        Cette acceptation est obligatoire et constitue un prérequis légal
                                        pour l'utilisation de nos services d'édition assistée par intelligence
                                        artificielle.
                                    </p>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
                <div className="px-8 py-6 bg-secondary/10 border-t border-secondary/30 rounded-b-2xl">
                    <div className="flex items-center justify-between">
                        <div className="flex items-center space-x-2 text-text-secondary text-sm">
                            <FontAwesomeIcon icon={faFileContract} className="text-primary"/>
                            <span>Décision requise pour continuer</span>
                        </div>
                        <div className="flex items-center space-x-4">
                            <a
                                href="https://eritors.com"
                                target="_blank"
                                rel="noopener noreferrer"
                                className="text-muted hover:text-text-primary px-6 py-3 rounded-xl hover:bg-secondary/30 transition-all duration-200 text-sm font-medium hover:scale-105"
                            >
                                Refuser et quitter
                            </a>
                            <button
                                onClick={handleAcceptTerm}
                                className="bg-primary hover:bg-primary-dark text-text-primary px-8 py-3 rounded-xl transition-all duration-200 text-sm font-bold shadow-lg hover:shadow-xl transform hover:scale-105"
                                type="button"
                            >
                                J'accepte les termes
                            </button>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    );
}