// Tempo — Mentions légales : CGU, politique de confidentialité, disclaimer trading.
// ─────────────────────────────────────────────────────────────────────────
// Rendu AVANT connexion (écran Login) comme après (Réglages) : aucune dépendance
// à la session. Composants :
//   LegalModal({ kind, onClose })  — modal plein écran ('cgu' | 'privacy')
//   LegalLinks({ compact })        — liens CGU · Confidentialité auto-gérés (modal interne)
//   TradingDisclaimer({ compact }) — avertissement risque trading (global)
//   LEGAL_VERSION                  — date de version des documents
//
// ⚠️ AVANT COMMERCIALISATION : compléter les champs marqués « À compléter »
// (raison sociale, adresse, SIRET) et faire relire par un professionnel du droit.

const LEGAL_VERSION = '5 juillet 2026';
const LEGAL_CONTACT = 'support@tempo.app';

// ─── Contenus (tableaux {t: titre, p: [paragraphes]}) ────────────────
const LEGAL_CGU = {
  title: 'Conditions générales d’utilisation',
  sections: [
    { t: '1. Éditeur', p: [
      'Tempo est édité par : À compléter — raison sociale / entrepreneur individuel, adresse, SIRET.',
      `Contact : ${LEGAL_CONTACT}.`,
      'Hébergement : Cloudflare Pages (Cloudflare, Inc.) ; données applicatives hébergées par Supabase.',
    ]},
    { t: '2. Objet du service', p: [
      'Tempo est un journal de trading personnel : saisie et import de trades, suivi d’habitudes et de routines, statistiques de performance, backtesting sur données historiques et analyse de contexte de marché.',
      'Tempo est un outil de journalisation, d’entraînement et d’analyse personnelle. Tempo ne fournit AUCUN conseil en investissement, aucune recommandation d’achat ou de vente, aucun signal de trading, et n’est pas un prestataire de services d’investissement.',
    ]},
    { t: '3. Compte utilisateur', p: [
      'La création d’un compte requiert une adresse email valide et un mot de passe. Tu es responsable de la confidentialité de tes identifiants et de toute activité réalisée depuis ton compte.',
      'Tu peux supprimer ton compte à tout moment depuis Réglages → Données : tes données personnelles sont alors définitivement effacées (voir Politique de confidentialité).',
    ]},
    { t: '4. Avertissement sur les risques (important)', p: [
      'Le trading d’instruments financiers (futures, devises, métaux, indices, CFD…) comporte un risque élevé de perte, pouvant excéder le capital investi. Les performances passées — y compris les résultats de backtests — ne préjugent pas des performances futures.',
      'Les statistiques, indicateurs, analyses de contexte et résultats de backtest affichés par Tempo sont fournis à titre strictement informatif et pédagogique, sans garantie d’exactitude ni d’exhaustivité. Toute décision d’investissement relève de ta seule responsabilité.',
      'Les résultats de backtest sont des SIMULATIONS : elles n’intègrent pas parfaitement les conditions réelles d’exécution (liquidité, slippage, coûts variables) et ne constituent pas une promesse de gains.',
    ]},
    { t: '5. Données de marché et sources externes', p: [
      'Les données de marché, calendriers économiques et actualités affichés proviennent de sources publiques tierces. Elles peuvent être différées, incomplètes ou temporairement indisponibles ; Tempo ne garantit ni leur exactitude ni leur continuité.',
    ]},
    { t: '6. Utilisation acceptable', p: [
      'Tu t’engages à ne pas perturber le service, ne pas tenter d’accéder aux données d’autres utilisateurs, ne pas revendre ou extraire massivement les données fournies, et à respecter les conditions des sources de données tierces.',
    ]},
    { t: '7. Propriété intellectuelle', p: [
      'L’interface, le code et la marque Tempo restent la propriété de l’éditeur. Tes données (trades, notes, captures) restent les tiennes : tu peux les exporter et les supprimer à tout moment.',
    ]},
    { t: '8. Responsabilité', p: [
      'Tempo est fourni « en l’état ». Dans les limites permises par la loi, l’éditeur ne saurait être tenu responsable des pertes financières liées à des décisions de trading, des interruptions de service, ou de l’inexactitude de données issues de sources tierces.',
    ]},
    { t: '9. Évolution du service et des conditions', p: [
      'Le service et les présentes conditions peuvent évoluer. En cas de modification substantielle, tu seras informé dans l’application. La poursuite de l’utilisation vaut acceptation des conditions mises à jour.',
    ]},
    { t: '10. Droit applicable', p: [
      'Les présentes conditions sont régies par le droit français. Tout litige relève des tribunaux compétents français, après tentative de résolution amiable.',
    ]},
  ],
};

const LEGAL_PRIVACY = {
  title: 'Politique de confidentialité',
  sections: [
    { t: '1. Responsable du traitement', p: [
      `Le responsable du traitement est l’éditeur de Tempo (À compléter — identité complète). Contact : ${LEGAL_CONTACT}.`,
    ]},
    { t: '2. Données collectées', p: [
      'Compte : adresse email, mot de passe (haché par Supabase Auth, jamais lisible), préférences de profil (pseudo, devise, fuseau horaire).',
      'Contenu que tu crées : trades (réels et de backtest), habitudes et routines, notes de journal, captures d’écran importées, stratégies, sessions de backtest.',
      'Connexion broker (optionnelle) : identifiant de compte, serveur et libellé. Le mot de passe investisseur (lecture seule) transite vers le service MetaApi pour établir la connexion ; Tempo ne le stocke pas dans sa base de données.',
      'Données techniques minimales de fonctionnement (journaux d’erreurs). Tempo n’utilise aucun traceur publicitaire.',
    ]},
    { t: '3. Finalités et bases légales', p: [
      'Fournir le service (exécution du contrat) : stocker et afficher ton journal, tes statistiques, tes backtests.',
      'Sécurité et prévention des abus (intérêt légitime).',
      'Aucune donnée n’est vendue ni utilisée à des fins publicitaires.',
    ]},
    { t: '4. Sous-traitants et hébergement', p: [
      'Supabase (base de données, authentification, stockage de fichiers) et Cloudflare (hébergement du site, workers de synchronisation et de calendrier économique).',
      'MetaApi (Agiliumtrade) uniquement si tu connectes un compte MT5 : la connexion au broker est établie via leur infrastructure.',
      'Ces prestataires agissent comme sous-traitants au sens du RGPD.',
    ]},
    { t: '5. Durée de conservation', p: [
      'Tes données sont conservées tant que ton compte est actif. La suppression du compte (Réglages → Données → Supprimer le compte) efface définitivement trades, habitudes, notes, captures, stratégies, sessions de backtest et connexions broker.',
      `L’enregistrement d’authentification résiduel (email) peut être purgé sur demande à ${LEGAL_CONTACT}.`,
    ]},
    { t: '6. Tes droits (RGPD)', p: [
      'Tu disposes des droits d’accès, de rectification, d’effacement, de portabilité et d’opposition sur tes données.',
      'La plupart s’exercent directement dans l’application (Réglages : profil éditable, réinitialisation du journal, suppression du compte).',
      `Pour toute autre demande : ${LEGAL_CONTACT}. Tu peux également saisir la CNIL (cnil.fr).`,
    ]},
    { t: '7. Stockage local (localStorage)', p: [
      'Tempo enregistre sur ton appareil des préférences d’affichage (thème, catégories sélectionnées, réglages de backtest) et des caches de données publiques (analyses, calendrier). Aucun cookie de suivi tiers n’est déposé.',
    ]},
    { t: '8. Sécurité', p: [
      'Chiffrement en transit (HTTPS), isolation des données par utilisateur au niveau de la base (Row Level Security Supabase), accès broker en lecture seule via mot de passe investisseur.',
    ]},
  ],
};

// ─── Modal légale ─────────────────────────────────────────────────────
function LegalModal({ kind, onClose }) {
  const doc = kind === 'privacy' ? LEGAL_PRIVACY : LEGAL_CGU;
  React.useEffect(() => {
    const onKey = (e) => { if (e.key === 'Escape') onClose && onClose(); };
    window.addEventListener('keydown', onKey);
    return () => window.removeEventListener('keydown', onKey);
  }, [onClose]);
  return (
    <div
      onClick={(e) => { if (e.target === e.currentTarget) onClose && onClose(); }}
      style={{ position: 'fixed', inset: 0, zIndex: 10000, background: 'rgba(15,23,42,.45)', display: 'flex', alignItems: 'center', justifyContent: 'center', padding: 18 }}
    >
      <div className="card" style={{ width: 640, maxWidth: '100%', maxHeight: '86vh', display: 'flex', flexDirection: 'column', padding: 0, overflow: 'hidden' }}>
        <div style={{ display: 'flex', alignItems: 'center', justifyContent: 'space-between', gap: 12, padding: '16px 20px', borderBottom: '1px solid var(--line)' }}>
          <div>
            <div style={{ fontSize: 15.5, fontWeight: 700, letterSpacing: '-.015em' }}>{doc.title}</div>
            <div style={{ fontSize: 11, color: 'var(--fg-3)', marginTop: 2 }}>Version du {LEGAL_VERSION}</div>
          </div>
          <button onClick={onClose} className="tap" aria-label="Fermer" style={{ background: 'var(--bg-elev)', border: '1px solid var(--line)', borderRadius: 8, width: 30, height: 30, display: 'flex', alignItems: 'center', justifyContent: 'center', cursor: 'pointer', color: 'var(--fg-2)', flexShrink: 0 }}>
            <svg width="14" height="14" viewBox="0 0 20 20" fill="none" stroke="currentColor" strokeWidth="2" strokeLinecap="round"><path d="M5 5l10 10M15 5L5 15"/></svg>
          </button>
        </div>
        <div className="scroll" style={{ overflow: 'auto', padding: '18px 20px 24px' }}>
          {doc.sections.map((s, i) => (
            <div key={i} style={{ marginBottom: 16 }}>
              <div style={{ fontSize: 13, fontWeight: 700, marginBottom: 6, letterSpacing: '-.01em' }}>{s.t}</div>
              {s.p.map((p, j) => (
                <p key={j} style={{ fontSize: 12.5, lineHeight: 1.6, color: 'var(--fg-2)', margin: '0 0 8px' }}>{p}</p>
              ))}
            </div>
          ))}
          <div style={{ fontSize: 11, color: 'var(--fg-4)', paddingTop: 8, borderTop: '1px solid var(--line)' }}>
            Document version du {LEGAL_VERSION} — contact : {LEGAL_CONTACT}
          </div>
        </div>
      </div>
    </div>
  );
}

// ─── Liens auto-gérés (Réglages, pieds de page) ──────────────────────
function LegalLinks({ compact }) {
  const [kind, setKind] = React.useState(null);
  const linkStyle = { background: 'transparent', border: 'none', padding: 0, cursor: 'pointer', color: 'var(--blue-600)', fontSize: compact ? 11 : 11.5, fontWeight: 500, fontFamily: 'inherit' };
  return (
    <React.Fragment>
      <span style={{ display: 'inline-flex', alignItems: 'center', gap: 6, flexWrap: 'wrap' }}>
        <button type="button" className="tap" style={linkStyle} onClick={() => setKind('cgu')}>Conditions d’utilisation</button>
        <span style={{ color: 'var(--fg-4)', fontSize: compact ? 11 : 11.5 }}>·</span>
        <button type="button" className="tap" style={linkStyle} onClick={() => setKind('privacy')}>Confidentialité</button>
      </span>
      {kind && <LegalModal kind={kind} onClose={() => setKind(null)}/>}
    </React.Fragment>
  );
}

// ─── Avertissement trading global ────────────────────────────────────
function TradingDisclaimer({ compact }) {
  return (
    <div style={{ fontSize: compact ? 10.5 : 11, color: 'var(--fg-4)', lineHeight: 1.5, textAlign: 'center' }}>
      Le trading comporte un risque élevé de perte en capital. Tempo est un outil de journalisation
      et d’analyse — il ne fournit aucun conseil en investissement.
    </div>
  );
}

Object.assign(window, { LegalModal, LegalLinks, TradingDisclaimer, LEGAL_VERSION });
