/* PRIME — l'habillage : noir, bleu roi et or (décision du fondateur, 13 octobre 2026).
   Chargé après les styles du prototype, qu'il ne modifie pas : il remplace ses couleurs et ses polices de titre.
   Les couleurs des types de séance reprennent celles des piliers du PRIME Score. */
@import url('https://fonts.googleapis.com/css2?family=Orbitron:wght@700;900&family=Barlow:wght@400;500;600&family=Barlow+Condensed:wght@600;700&display=swap');

:root:root:root {
  --bg: #0A0A0E;
  --surface: #12131B;
  --surface2: #1A1C28;
  --border: #2A2D3D;
  --text: #F4F1EA;
  --muted: #A3A6B5;
  --force: #EF4444;
  --cardio: #6F8DF0;      /* le bleu du pilier cardio, éclairci pour se lire sur le noir */
  --metcon: #22C55E;
  --recup: #A78BFA;
  --off: #7C8194;
  --compet: #C9A227;
  --tab-bg: #1A1C28;
  --tab-active: #C9A227;
  --tab-active-text: #0A0A0E;
  --alert-bg: #2A2209;
  --alert-border: #C9A227;
  --alert-text: #F1D98A;
  --royal: #1E3A8A;
  --or: #C9A227;
  color-scheme: dark;
}

html { background: #0A0A0E; }
body { font-family: 'Barlow', 'Inter', system-ui, sans-serif; font-size: 15px; max-width: 760px; margin-inline: auto; padding-bottom: 48px; }

.header h1 { font-family: 'Orbitron', sans-serif; font-weight: 900; letter-spacing: 0.06em; text-transform: uppercase; color: var(--or); font-size: 24px; }
.target-pill { color: #0A0A0E; }
.wbar-fill { background: linear-gradient(90deg, #1E3A8A, #C9A227) !important; }

/* La barre du compte, posée par pont.js */
.pr-compte { display: flex; align-items: center; gap: 12px; padding: 12px 0 10px; border-bottom: 1px solid var(--border); flex-wrap: wrap; }
.pr-logo { font-family: 'Orbitron', sans-serif; font-weight: 900; font-size: 13px; letter-spacing: 0.14em; color: var(--or); }
.pr-chez { flex: 1; min-width: 0; font-size: 13px; color: var(--muted); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.pr-chez b { color: var(--text); font-weight: 600; }
.pr-lien { font: inherit; font-size: 13px; color: var(--text); background: none; border: 1px solid var(--border); border-radius: 6px; padding: 6px 10px; cursor: pointer; text-decoration: none; }
.pr-lien:hover { background: var(--surface2); border-color: var(--or); }
.pr-alerte { margin-top: 8px; padding: 8px 12px; border: 1px solid var(--force); border-radius: 6px; color: #FCA5A5; font-size: 13px; }

/* Pages de connexion et du coach */
.pr-page { max-width: 440px; margin: 0 auto; padding: 56px 0 40px; }
.pr-page.large { max-width: 760px; padding-top: 8px; }
.pr-titre { font-family: 'Orbitron', sans-serif; font-weight: 900; font-size: 34px; letter-spacing: 0.08em; color: var(--or); }
.pr-devise { font-family: 'Barlow Condensed', sans-serif; font-weight: 600; letter-spacing: 0.14em; text-transform: uppercase; color: var(--muted); font-size: 13px; margin-bottom: 28px; }
.pr-arc { height: 3px; border-radius: 99px; margin: 10px 0 24px; background: linear-gradient(90deg, #3B5FCC, #C9A227, #22C55E, #EF4444, #A78BFA); }
.pr-h2 { font-family: 'Barlow Condensed', sans-serif; font-weight: 700; font-size: 22px; letter-spacing: 0.02em; margin: 24px 0 10px; }
.pr-carte { background: var(--surface); border: 1px solid var(--border); border-radius: 10px; padding: 16px; margin-bottom: 12px; }
.pr-champ { display: block; margin-bottom: 14px; font-size: 13px; color: var(--muted); }
.pr-champ input { display: block; width: 100%; margin-top: 6px; padding: 12px; font: inherit; font-size: 16px; color: var(--text); background: var(--surface2); border: 1px solid var(--border); border-radius: 8px; }
.pr-champ input:focus { outline: 2px solid var(--or); outline-offset: 1px; }
.pr-aide { font-size: 12px; color: var(--muted); margin-top: 6px; }
.pr-bouton { width: 100%; padding: 13px 16px; font-family: 'Barlow Condensed', sans-serif; font-weight: 700; font-size: 17px; letter-spacing: 0.08em; text-transform: uppercase; color: #F4F1EA; background: var(--royal); border: 1px solid #2D4FB5; border-radius: 8px; cursor: pointer; }
.pr-bouton:hover { background: #2646A6; }
.pr-bouton.or { background: var(--or); border-color: var(--or); color: #0A0A0E; }
.pr-bouton.petit { width: auto; padding: 9px 14px; font-size: 14px; }
.pr-bouton:disabled { opacity: 0.6; cursor: default; }
.pr-erreur { color: #FCA5A5; font-size: 14px; margin: 0 0 12px; min-height: 1.2em; }
.pr-ligne { display: flex; align-items: center; gap: 12px; flex-wrap: wrap; }
.pr-ligne .pr-nom { font-family: 'Barlow Condensed', sans-serif; font-weight: 700; font-size: 20px; flex: 1; min-width: 140px; }
.pr-detail { font-size: 13px; color: var(--muted); margin-top: 6px; line-height: 1.6; }
.pr-detail b { color: var(--text); font-weight: 500; }
.pr-code { display: block; margin-top: 10px; padding: 10px; background: var(--surface2); border: 1px dashed var(--or); border-radius: 8px; font-size: 13px; word-break: break-all; color: var(--text); }
.pr-vide { color: var(--muted); font-size: 14px; padding: 8px 0; }

[hidden] { display: none !important; }

/* Sur un téléphone, le nom passe sous la barre : il ne se coupe pas. */
@media (max-width: 520px) {
  .pr-compte .pr-logo { flex: 1; }
  .pr-compte .pr-chez { order: 5; flex: 0 0 100%; white-space: normal; }
}

/* Un athlète : rien d'emprunté à la prépa du fondateur */
body.pr-athlete .target-pill { display: none; }
body.pr-sans-programme #view-prog > :not(.pr-attente),
body.pr-sans-programme #view-today > .day-card,
body.pr-sans-programme #view-today > .td-sub,
body.pr-sans-programme #view-today > .pl-intro { display: none !important; }
.pr-attente { margin: 14px 0; padding: 16px; border: 1px dashed var(--or); border-radius: 10px; background: var(--surface); color: var(--text); font-size: 15px; }

/* Le parcours guidé de l'arrivée */
body.pr-guide-ouvert > :not(#pr-guide) { display: none !important; }
.pr-g-page { max-width: 480px; margin: 0 auto; padding: 20px 0 40px; }
.pr-g-tete { display: flex; align-items: center; justify-content: space-between; margin-bottom: 14px; }
.pr-g-compte { font-family: 'Barlow Condensed', sans-serif; font-weight: 600; letter-spacing: 0.1em; text-transform: uppercase; font-size: 13px; color: var(--muted); }
.pr-g-barre { height: 4px; border-radius: 99px; background: var(--surface2); overflow: hidden; margin-bottom: 26px; }
.pr-g-barre i { display: block; height: 100%; background: linear-gradient(90deg, #1E3A8A, #C9A227); border-radius: 99px; transition: width .3s; }
.pr-g-titre { font-family: 'Barlow Condensed', sans-serif; font-weight: 700; font-size: 32px; line-height: 1.1; margin-bottom: 10px; }
.pr-g-intro { color: var(--muted); font-size: 16px; margin-bottom: 18px; }
.pr-g-champ { display: block; margin-bottom: 18px; }
.pr-g-lib { display: block; font-weight: 600; font-size: 16px; margin-bottom: 6px; }
.pr-g-saisie { display: flex; align-items: center; gap: 10px; }
.pr-g-saisie input { width: 130px; padding: 12px; font: inherit; font-size: 18px; font-weight: 600; color: var(--text); background: var(--surface2); border: 1px solid var(--border); border-radius: 8px; }
.pr-g-saisie input:focus { outline: 2px solid var(--or); outline-offset: 1px; }
.pr-g-saisie input.faux { border-color: var(--force); }
.pr-g-saisie em { font-style: normal; color: var(--muted); }
.pr-g-choix { display: flex; gap: 10px; flex-wrap: wrap; }
.pr-g-choix label { flex: 1; min-width: 130px; cursor: pointer; }
.pr-g-choix input { position: absolute; opacity: 0; }
.pr-g-choix span { display: block; text-align: center; padding: 14px 10px; border: 1px solid var(--border); border-radius: 8px; background: var(--surface2); font-weight: 600; }
.pr-g-choix input:checked + span { border-color: var(--or); background: #2A2209; color: var(--or); }
.pr-g-choix input:focus-visible + span { outline: 2px solid var(--or); outline-offset: 1px; }
.pr-g-pied { display: flex; gap: 12px; align-items: center; margin-top: 8px; }
.pr-g-pied .pr-bouton { flex: 1; }
.pr-g-pied .pr-lien { padding: 13px 16px; }

/* La progression de poids du prototype suit le plan de sept semaines du fondateur : un athlète ne voit que ses deux poids. */
body.pr-athlete #weight-progress, body.pr-athlete .wbar-track { display: none; }

.save-btn { background: var(--or) !important; color: #0A0A0E !important; }

/* Installée sur l'écran d'accueil, l'application passe sous l'encoche et la barre du bas du téléphone. */
body { padding-top: env(safe-area-inset-top); padding-bottom: calc(48px + env(safe-area-inset-bottom)); }

/* Le logo, d'après l'image fournie par le fondateur le 13 octobre 2026 (PRIME/logo-prime.png) : capitales grasses et
   espacées, blanches, le « I » en or, un halo clair ; fond en dégradé bleu nuit, bleu roi, noir. */
.pr-logo, .pr-titre, .header h1 { font-family: 'Helvetica Neue', Helvetica, Arial, sans-serif; font-weight: 700; color: #FFFFFF; text-transform: uppercase; text-shadow: 0 0 18px rgba(255, 255, 255, 0.28); }
.pr-logo { letter-spacing: 0.2em; font-size: 14px; }
.pr-titre { letter-spacing: 0.16em; font-size: 38px; }
.header h1 { letter-spacing: 0.16em; font-size: 26px; }
.pr-i { color: #C9A227; }

/* Le bleu et l'or du logo partout (fondateur, 13 octobre 2026 : « je veux ce bleu, ce or »). Valeurs lues dans son
   image : or #C9A227, fond en dégradé à 135° de #0D1B3E à #1E3A8A puis #0A0A14. Le fond est une couche fixe derrière
   la page : un fond « fixed » ne tient pas sur iPhone. */
html { background: #0D1B3E; }
html::before { content: ""; position: fixed; inset: 0; z-index: -1; background: linear-gradient(135deg, #0D1B3E 0%, #1E3A8A 60%, #0A0A14 100%); }
body { background: transparent !important; min-height: 100vh; }
:root:root:root {
  --bg: #12224F;
  --surface: rgba(8, 12, 30, 0.72);
  --surface2: rgba(8, 12, 30, 0.55);
  --border: rgba(255, 255, 255, 0.16);
  --muted: #C3C9DC;
  --tab-bg: rgba(8, 12, 30, 0.55);
}
.save-bar { background: linear-gradient(180deg, rgba(13, 27, 62, 0), #0D1B3E 35%) !important; }