// FOOTPASS Messenger v2 · Écran À PROPOS (version, confiance, légal, licences, crédits, support)
//   Câblé dans le menu (home.jsx → sub 'about'). Sobre, premium, clair + sombre.
const { useState: useStateAb } = React;

const AB_VERSION = '2.1.0';
const AB_BUILD = '2026.06.18';

// Contenu légal · repris de footpass.app (mentions v1.3, CGU v3.7, confidentialité v1.3 · avril 2026).
// Les textes légaux restent en français : la version française fait foi (CGU §12).
// '#…' = tête de section.
const AB_LEGAL = {
  mentions: {
    title: 'Mentions légales',
    body: [
      '#Éditeur',
      'Le site footpass.app et l’application footpass.app sont édités par <b>FOOTPASS SA</b> (en formation), société anonyme de droit suisse en cours d’inscription au registre du commerce du canton de Zurich. Siège : Zurich, Suisse. Directeur de la publication : le représentant légal de FOOTPASS SA. Contact : contact@footpass.app.',
      '#Hébergement',
      'Les données des membres sont hébergées sur des centres de données situés en <b>Suisse (Zurich)</b>. Le site vitrine footpass.app est servi par Cloudflare, Inc. La liste complète des sous-traitants techniques figure dans la Politique de confidentialité.',
      '#Protection des données',
      'FOOTPASS SA désigne un délégué à la protection des données (DPO) : dpo@footpass.app. Vous disposez des droits d’accès, de rectification, d’effacement, de limitation, de portabilité et d’opposition. Recours : Préposé fédéral à la protection des données (PFPDT), edoeb.admin.ch · et, pour les résidents de l’UE, l’autorité de leur État membre.',
      '#Propriété intellectuelle',
      '<b>FOOTPASS®</b> est une marque déposée de FOOTPASS SA. Le système d’autorisations et les autorisations numériques constituent des innovations propriétaires protégées. L’ensemble des contenus est protégé par le droit d’auteur · © 2025–2026 FOOTPASS SA.',
      '#Responsabilité',
      'FOOTPASS SA agit en hébergeur des contenus publiés par les membres et n’exerce aucun contrôle éditorial préalable. Signalement d’un contenu illicite : abuse@footpass.app. La responsabilité de FOOTPASS SA n’est pas engagée pour les dommages indirects, hors faute grave ou dol.',
      '#Surveillance légale (LSCPT)',
      'FOOTPASS SA est soumise aux obligations légales suisses de surveillance des communications. Sur ordre d’une autorité compétente, certaines informations peuvent être transmises, strictement dans le cadre légal applicable.',
      '#Mineurs',
      'Les services sont accessibles dès 13 ans. Tout membre de 13 à 17 ans doit disposer d’une <b>autorisation représentant légal</b> active (consentement exprès d’un parent ou tuteur). Aucune donnée de mineur n’est traitée à des fins publicitaires.',
      '#Droit applicable',
      'Droit suisse. Handelsgericht du canton de Zurich pour les litiges entre professionnels ; tribunaux ordinaires de Zurich pour les autres. Les consommateurs résidant dans l’UE conservent leurs protections impératives nationales (plateforme RLL : ec.europa.eu/consumers/odr).',
    ],
    upd: 'Version 1.3 · avril 2026 · footpass.app/mentions-legales',
  },
  cgu: {
    title: 'Conditions générales',
    body: [
      '#Objet',
      'FOOTPASS® est une plateforme SaaS d’identité numérique vérifiée et de communication structurée, développée exclusivement pour le football et ses acteurs. L’accès à la plateforme vaut acceptation pleine et entière des CGU.',
      '#Définitions clés',
      '<b>Pass ID</b> : identifiant unique, permanent et incessible · votre identité numérique. <b>Autorisation</b> : relation formalisée entre membres ou structures. <b>Autorisation numérique</b> : acte par lequel un émetteur confère à un bénéficiaire le droit d’agir dans un périmètre défini. <b>Sous-autorisation</b> : autorisation dérivée, strictement dans les limites de l’autorisation principale. <b>Journal</b> : registre technique immuable des événements significatifs.',
      '#Nature de la plateforme',
      'FOOTPASS est un <b>prestataire technique</b>. Il n’est ni mandataire, ni représentant, ni courtier, ni agent de ses membres, et n’est pas partie aux relations juridiques qu’ils établissent entre eux. Les outils et documents générés n’ont pas d’effet juridique externe, sauf accord exprès des tiers ou disposition légale : FOOTPASS structure la communication, il ne remplace pas le droit.',
      '#Vos engagements',
      'Fournir des informations exactes et à jour ; n’utiliser la plateforme qu’à des fins licites ; ne créer une autorisation que pour des relations dont vous êtes partie ; révoquer sans délai toute autorisation qui ne reflète plus la réalité ; protéger vos accès (double authentification). L’émetteur est seul responsable du contenu et des limites des autorisations qu’il émet.',
      '#Responsabilité',
      'Obligation de moyens · disponibilité visée de 99,5 % par mois civil hors maintenance annoncée. Hors faute grave ou dol (art. 100 CO), la responsabilité totale de FOOTPASS est plafonnée aux redevances versées au cours des douze derniers mois.',
      '#Tarifs',
      '<b>PassSTAFF</b> 1,99 CHF/mois ou 19,99 CHF/an · <b>PassSTART</b> 9,99 CHF/mois ou 99,99 CHF/an · <b>PassPRO</b> 29,99 CHF/mois ou 239,99 CHF/an (−33 %) · PassPRO lié à une structure : 19,99 CHF/mois, annuel 239,99 CHF. Paliers structurels selon le staff permanent : Small 499,99 CHF/an · Medium 1 199,99 · Confirmed 3 990 · Established, Large et Very Large sur demande. Essai 10 jours sans engagement. Paiement via Stripe · aucune donnée bancaire conservée par FOOTPASS.',
      '#Résiliation',
      'Vous pouvez résilier à tout moment depuis les réglages, avec effet à la fin de la période en cours. À la clôture du compte, les autorisations actives sont automatiquement révoquées et les données traitées selon la Politique de confidentialité.',
      '#Mineurs (13–17 ans)',
      'Usage subordonné à une autorisation représentant légal bilatérale et active : le représentant garde une visibilité complète et le droit de révoquer toute autorisation du mineur. Sa révocation suspend immédiatement l’accès.',
      '#Droit applicable',
      'Droit suisse · Handelsgericht de Zurich (professionnels), tribunaux ordinaires de Zurich (consommateurs, sans préjudice du droit des résidents UE). La version française des CGU prévaut.',
    ],
    upd: 'Version 3.7 · avril 2026 · footpass.app/cgu',
  },
  privacy: {
    title: 'Confidentialité',
    body: [
      '#Responsable du traitement',
      '<b>FOOTPASS SA</b>, Zurich (Suisse). Toutes les données personnelles des membres sont hébergées en Suisse. DPO : dpo@footpass.app.',
      '#Données collectées',
      'Identité (nom, nationalité, naissance, rôle, structure) · documents officiels de vérification · données sensibles au sens de la nLPD et du RGPD · contenus et communications (chiffrés de bout en bout) · données techniques (journaux, appareil) · paiement (<b>aucune donnée bancaire conservée</b>) · autorisations et autorisations · journal inviolable (pseudonymisé en cas d’effacement).',
      '#Finalités',
      'Création du compte et émission du Pass ID (contrat) · vérification d’identité et prévention de la fraude (intérêt légitime, obligation légale) · fourniture du service (contrat) · facturation (obligation légale) · sécurité de la plateforme (intérêt légitime) · amélioration sur données agrégées anonymisées · communications produit (consentement).',
      '#Destinataires',
      'Équipes FOOTPASS habilitées · sous-traitants techniques sous contrat conforme · membres et structures que <b>vous</b> avez autorisés via vos autorisations, dans les limites que vous définissez · autorités sur requête légale. Vos données ne sont <b>jamais vendues</b> ni transmises à des fins commerciales.',
      '#Durées de conservation',
      'Compte et Pass ID : durée d’usage + 3 ans · autorisations et autorisations : activité + 1 an · documents légaux et contractuels : 10 ans · journaux techniques : 12 mois. Au-delà : suppression définitive ou anonymisation irréversible.',
      '#Vos droits',
      'Conformément à la nLPD (RS 235.1) et, pour les résidents de l’EEE, au RGPD : accès, rectification, effacement, limitation, portabilité, opposition, retrait du consentement, refus d’une décision entièrement automatisée. Écrire à dpo@footpass.app · réponse sous un mois. Recours : PFPDT (edoeb.admin.ch) ou votre autorité nationale (UE).',
      '#Sécurité',
      'Chiffrement de bout en bout de la messagerie et du coffre-fort · chiffrement en transit et au repos (AES-256) · accès internes au moindre privilège · sauvegardes chiffrées · audits périodiques. Toute violation susceptible de créer un risque est notifiée aux autorités et aux personnes concernées dans les délais légaux.',
      '#Appels audio et vidéo',
      'Les flux ne sont ni enregistrés ni conservés en usage normal, sous réserve des obligations légales de surveillance (LSCPT).',
      '#Mineurs',
      'Plateforme accessible dès 13 ans avec autorisation représentant légal active. Le représentant exerce un droit de contrôle et de révocation. Jamais de publicité ciblée sur les données de mineurs.',
    ],
    upd: 'Version 1.3 · avril 2026 · footpass.app/confidentialite',
  },
  cookies: {
    title: 'Politique cookies',
    body: [
      '#Dans l’application',
      'L’application n’utilise que le <b>stockage local strictement nécessaire</b> à son fonctionnement : session, préférences d’affichage (thème, langue). Aucun traceur publicitaire, aucune donnée partagée à des fins marketing.',
      '#Sur footpass.app',
      'Le site utilise des cookies strictement nécessaires et, avec votre consentement préalable, une mesure d’audience anonyme. Le consentement se retire à tout moment depuis footpass.app/cookies.',
    ],
    upd: 'Version 1.3 · avril 2026 · footpass.app/cookies',
  },
};

const AB_LICENSES = [
  { name: 'React', v: '18.3.1', lic: 'MIT' },
  { name: 'React DOM', v: '18.3.1', lic: 'MIT' },
  { name: 'Babel Standalone', v: '7.29.0', lic: 'MIT' },
  { name: 'Inter', v: '4.1', lic: 'SIL OFL 1.1' },
  { name: 'Orbitron', v: '2.0', lic: 'SIL OFL 1.1' },
];

function AbRow({ Icon, label, sub, onClick, tint }) {
  return (
    <button className="hm-row" onClick={onClick}>
      <span className={`hm-row-ic ${tint || ''}`}><Icon s={17} /></span>
      <span className="hm-row-txt"><b>{TX(label)}</b>{sub ? <em>{TX(sub)}</em> : null}</span>
      <HMI.Chevron c="#A1A1AA" />
    </button>
  );
}

function AboutPage({ onBack, showToast, dark, onOpenStates }) {
  const [sheet, setSheet] = useStateAb(null); // 'mentions'|'cgu'|'privacy'|'cookies'|'licenses'|'credits'
  const logo = dark ? 'assets/logotype_white.png' : 'assets/logotype_black.png';
  const copy = (txt, msg) => { try { navigator.clipboard && navigator.clipboard.writeText(txt); } catch (e) { /* ignore */ } showToast(msg); };

  const legal = AB_LEGAL[sheet];
  return (
    <PgPage title="À propos" onBack={onBack}>
      {/* Hero de marque · discret */}
      <div className="ab-hero">
        <img className="ab-logo" src={logo} alt="FOOTPASS®" />
        <div className="ab-app">{TX('Messenger')}</div>
        <div className="ab-verchip">
          <span>{TX('Version')} <b>{AB_VERSION}</b></span>
          <span className="ab-dot"></span>
          <span>{TX('Build')} <b>{AB_BUILD}</b></span>
        </div>
      </div>

      {/* Bloc confiance */}
      <div className="ab-trust">
        <div className="ab-trust-cell">
          <span className="ab-trust-ic"><StI.Swiss s={18} /></span>
          <b>{TX('Hébergé en Suisse')}</b><em>Zurich</em>
        </div>
        <div className="ab-trust-cell">
          <span className="ab-trust-ic"><StI.Lock s={18} /></span>
          <b>{TX('Chiffrement')}</b><em>AES-256 · E2EE</em>
        </div>
        <div className="ab-trust-cell">
          <span className="ab-trust-ic"><StI.Ledger s={18} /></span>
          <b>{TX('Journal')}</b><em>{TX('inviolable')}</em>
        </div>
      </div>

      {/* Légal */}
      <div className="hm-sechead"><span>{TX('Légal')}</span></div>
      <div className="hm-cardlist">
        <AbRow Icon={HMI.Mandate} label="Mentions légales" onClick={() => setSheet('mentions')} />
        <AbRow Icon={HMI.Mandate} label="Conditions générales" onClick={() => setSheet('cgu')} />
        <AbRow Icon={FPIcon.Shield} label="Confidentialité" onClick={() => setSheet('privacy')} />
        <AbRow Icon={StI.Info} label="Politique cookies" onClick={() => setSheet('cookies')} />
      </div>

      {/* Ressources */}
      <div className="hm-sechead"><span>{TX('Ressources')}</span></div>
      <div className="hm-cardlist">
        <AbRow Icon={HMI.Vault} label="Licences open-source" sub="Bibliothèques et polices" onClick={() => setSheet('licenses')} />
        <AbRow Icon={HMI.Card} label="Crédits" onClick={() => setSheet('credits')} />
        {onOpenStates ? <AbRow Icon={StI.Info} label="Bibliothèque d’états système" sub="Référence design" onClick={onOpenStates} /> : null}
      </div>

      {/* Assistance */}
      <div className="hm-sechead"><span>{TX('Assistance')}</span></div>
      <div className="hm-cardlist">
        <AbRow Icon={HMI.Help} label="Contacter le support" tint="green" onClick={() => showToast(TX('Message envoyé · réponse sous 24 h'))} />
        <AbRow Icon={HMI.Bell} label="support@footpass.app" sub="Copier l’adresse" onClick={() => copy('support@footpass.app', TX('Adresse copiée'))} />
      </div>

      <div className="ab-foot">
        <div className="ab-foot-line">© 2026 FOOTPASS SA · Zurich, {TX('Suisse')}</div>
        <div className="ab-foot-line">footpass.app</div>
      </div>

      {/* Feuille légale */}
      {legal ? (
        <PgSheet onClose={() => setSheet(null)} title={legal.title}>
          <div className="ab-legal">
            {legal.body.map((p, i) => (p.charAt(0) === '#'
              ? <div key={i} className="ab-legal-h">{TX(p.slice(1))}</div>
              : <p key={i} dangerouslySetInnerHTML={{ __html: TX(p) }}></p>))}
            <p className="ab-legal-upd">{TX(legal.upd)}</p>
          </div>
        </PgSheet>
      ) : null}

      {/* Licences open-source */}
      {sheet === 'licenses' ? (
        <PgSheet onClose={() => setSheet(null)} title="Licences open-source">
          <div className="ab-lic">
            {AB_LICENSES.map((l) => (
              <div className="ab-lic-row" key={l.name}>
                <b>{l.name} <span style={{ fontWeight: 400, opacity: 0.6 }}>{l.v}</span></b>
                <em>{l.lic}</em>
              </div>
            ))}
          </div>
          <div className="hm-listfoot" style={{ marginTop: 12 }}>{TX('Merci aux mainteneurs de ces projets.')}</div>
        </PgSheet>
      ) : null}

      {/* Crédits */}
      {sheet === 'credits' ? (
        <PgSheet onClose={() => setSheet(null)} title="Crédits">
          <div className="ab-legal">
            <p>{TX('Conçu et développé par l’équipe produit FOOTPASS.')}</p>
            <p>{TX('Design system FOOTPASS v2 · « Modern Black ». Type Inter & Orbitron.')}</p>
            <p>{TX('Merci aux membres vérifiés qui font vivre le réseau du football.')}</p>
          </div>
        </PgSheet>
      ) : null}
    </PgPage>
  );
}

Object.assign(window, { AboutPage });