/* =========================================================================
   PRC XV — Thème « Écusson » (heritage rugby club)  ·  pages d'authentification
   -------------------------------------------------------------------------
   PALETTE ACTIVE : « Vert & Or ».
   Pour basculer de jeu de couleurs, remplace le bloc :root ci-dessous par
   l'une des 4 variantes listées juste après (Marine & Or, Grenat & Crème,
   Noir & Or, Parchemin). Les tokens --* sont réutilisables ailleurs dans l'app.
   ========================================================================= */

/* ===== PALETTE ACTIVE : vert-or ===== */
:root{
  --page-1:#164736; --page-2:#0d2c22; --stripe:rgba(255,255,255,.025);
  --crest:#123b2e; --crest-word:#f2ecdc;
  --metal:#c8a24b; --metal-2:#e3c675;
  --cream:#f2ecdc; --cream-2:#faf6ec; --card-border:rgba(0,0,0,.06); --keyline-in:rgba(200,162,75,.16);
  --ink:#20261f; --ink-soft:#4a5548; --placeholder:#9a9078;
  --accent:#8a2f2a;
  --field-border:#d8d0bd; --focus:rgba(200,162,75,.24); --rule:rgba(18,59,46,.16);
  --btn-1:#1a4f3d; --btn-2:#123b2e; --btn-ink:#faf6ec; --btn-shadow:rgba(13,44,34,.4);
  --card-shadow:0 26px 60px rgba(0,0,0,.4);
}

/* ===== Autres palettes (dé-commenter pour basculer) =====
   [marine-or]
   --page-1:#1a3160; --page-2:#0d1c39; --stripe:rgba(255,255,255,.028);
   --crest:#152a4d; --crest-word:#f1ece0; --metal:#d3a23c; --metal-2:#eecb79;
   --cream:#f1ece0; --cream-2:#faf6ec; --card-border:rgba(0,0,0,.06); --keyline-in:rgba(211,162,60,.16);
   --ink:#20242c; --ink-soft:#46505f; --placeholder:#98917d; --accent:#9c3b2e;
   --field-border:#d7d0bd; --focus:rgba(211,162,60,.24); --rule:rgba(21,42,77,.16);
   --btn-1:#21386a; --btn-2:#152a4d; --btn-ink:#f6f2e6; --btn-shadow:rgba(13,28,57,.42);
   --card-shadow:0 26px 60px rgba(4,10,24,.45);

   [grenat-creme]
   --page-1:#6f2733; --page-2:#481722; --stripe:rgba(255,255,255,.03);
   --crest:#5a1f2b; --crest-word:#f4ece0; --metal:#c9a45c; --metal-2:#e6c883;
   --cream:#f4ece0; --cream-2:#fbf5ea; --card-border:rgba(0,0,0,.06); --keyline-in:rgba(201,164,92,.18);
   --ink:#2a2020; --ink-soft:#544442; --placeholder:#a2947f; --accent:#1f4d3a;
   --field-border:#ddd2c2; --focus:rgba(201,164,92,.26); --rule:rgba(90,31,43,.16);
   --btn-1:#7c2b38; --btn-2:#5a1f2b; --btn-ink:#f9f1e6; --btn-shadow:rgba(64,18,26,.42);
   --card-shadow:0 26px 60px rgba(40,10,16,.45);

   [noir-or]
   --page-1:#282a2f; --page-2:#131418; --stripe:rgba(255,255,255,.022);
   --crest:#1c1e22; --crest-word:#f0d777; --metal:#d9b24e; --metal-2:#f0d777;
   --cream:#efeae0; --cream-2:#f7f3ea; --card-border:rgba(0,0,0,.07); --keyline-in:rgba(217,178,78,.2);
   --ink:#22242a; --ink-soft:#484c55; --placeholder:#9b9481; --accent:#a87d2e;
   --field-border:#ddd4c2; --focus:rgba(217,178,78,.28); --rule:rgba(28,30,34,.16);
   --btn-1:#e9c24a; --btn-2:#d4af37; --btn-ink:#1c1e22; --btn-shadow:rgba(212,175,55,.4);
   --card-shadow:0 26px 60px rgba(0,0,0,.5);

   [parchemin]
   --page-1:#ece2cc; --page-2:#e0d3b6; --stripe:rgba(31,69,53,.035);
   --crest:#1f4535; --crest-word:#f8f2e6; --metal:#b3852f; --metal-2:#d6ab52;
   --cream:#f9f3e7; --cream-2:#fffdf7; --card-border:rgba(31,69,53,.14); --keyline-in:rgba(179,133,47,.18);
   --ink:#28261f; --ink-soft:#5a5445; --placeholder:#a89a7e; --accent:#8a2f2a;
   --field-border:#ddd1bb; --focus:rgba(179,133,47,.26); --rule:rgba(31,69,53,.16);
   --btn-1:#235444; --btn-2:#1f4535; --btn-ink:#f8f2e6; --btn-shadow:rgba(31,69,53,.28);
   --card-shadow:0 20px 46px rgba(70,52,20,.2);
   ===== */

*{box-sizing:border-box; min-width:0}
html,body{margin:0; min-height:100%; overflow-x:hidden}

body.prc-auth{
  font-family:"Work Sans",system-ui,-apple-system,sans-serif; color:var(--ink);
  min-height:100dvh; display:flex; align-items:center; justify-content:center;
  padding:32px 16px 40px; -webkit-font-smoothing:antialiased;
  background:radial-gradient(125% 85% at 50% -10%, var(--page-1), var(--page-2) 62%);
  position:relative; overflow-x:hidden;
}
body.prc-auth::before{ content:""; position:fixed; inset:0; pointer-events:none; z-index:0;
  background:repeating-linear-gradient(180deg, transparent 0 56px, var(--stripe) 56px 112px); }

.prc-shell{position:relative; z-index:1; width:100%; max-width:396px}

/* Blason */
.prc-crest{display:flex; justify-content:center; margin-bottom:-34px; position:relative; z-index:2}
.prc-crest svg{width:100px; height:112px; filter:drop-shadow(0 10px 18px rgba(0,0,0,.32))}
.prc-crest .shield{fill:var(--crest); stroke:var(--metal); stroke-width:3}
.prc-crest .keyline{fill:none; stroke:var(--metal-2); stroke-width:1; opacity:.55}
.prc-crest .ball{fill:none; stroke:var(--metal-2); stroke-width:3.4}
.prc-crest .lace{stroke:var(--metal-2); stroke-width:2; stroke-linecap:round; fill:none}
.prc-crest .crestword{fill:var(--crest-word); font-family:"Zilla Slab",serif; font-weight:700}
.prc-crest .crestxv{fill:var(--metal-2); font-family:"Zilla Slab",serif; font-weight:700}

/* Carte */
.prc-card{ background:var(--cream); border-radius:18px; padding:54px 26px 26px;
  border:1px solid var(--card-border);
  box-shadow:var(--card-shadow), inset 0 0 0 1px var(--keyline-in);
  position:relative; overflow:hidden; }
.prc-card::before{ content:""; position:absolute; left:0; right:0; top:0; height:4px;
  background:linear-gradient(90deg, var(--metal), var(--metal-2), var(--metal)); }

.prc-head{text-align:center; margin-bottom:22px}
.prc-wordmark{ font-family:"Zilla Slab",serif; font-weight:700; font-size:32px; letter-spacing:.02em;
  color:var(--crest); margin:0; line-height:1; }
.prc-wordmark span{color:var(--accent)}
.prc-xvmark{ display:flex; align-items:center; justify-content:center; gap:11px; margin:12px 0 8px;
  font-family:"Zilla Slab",serif; font-weight:700; font-size:16px; letter-spacing:.14em;
  color:var(--metal); text-indent:.14em; }
.prc-xvmark::before,.prc-xvmark::after{content:""; width:26px; height:1px; background:var(--metal)}
.prc-estband{ display:inline-flex; align-items:center; gap:8px; margin-top:0;
  font-size:10.5px; font-weight:600; text-transform:uppercase; letter-spacing:.26em; color:var(--ink-soft); }
.prc-tagline{margin:13px 0 0; color:var(--ink-soft); font-size:14.5px; line-height:1.5}

/* Formulaire */
.prc-form{display:grid; gap:15px; margin-top:22px}
.prc-field{display:grid; gap:6px}
.prc-field label{font-size:12px; font-weight:700; letter-spacing:.06em; text-transform:uppercase;
  color:var(--crest); margin:0 0 0 2px}
.prc-field input{ width:100%; border:1px solid var(--field-border); background:var(--cream-2); color:var(--ink);
  border-radius:11px; padding:13px 14px; font-size:15px; font-family:inherit;
  transition:border-color .18s, box-shadow .18s; }
.prc-field input::placeholder{color:var(--placeholder)}
.prc-field input:focus{outline:none; border-color:var(--metal); box-shadow:0 0 0 3px var(--focus)}

.prc-helper{display:flex; justify-content:flex-end; margin-top:-5px}
.prc-helper a{color:var(--ink-soft); font-size:13px; text-decoration:none; font-weight:600}
.prc-helper a:hover{color:var(--accent); text-decoration:underline}

.prc-btn{ margin-top:3px; width:100%; border:0; cursor:pointer;
  font-family:"Zilla Slab",serif; font-weight:700; font-size:17px; letter-spacing:.03em;
  color:var(--btn-ink); background:linear-gradient(180deg, var(--btn-1), var(--btn-2));
  border-radius:11px; padding:14px; box-shadow:0 10px 22px var(--btn-shadow);
  transition:transform .12s, box-shadow .2s, filter .2s; position:relative; }
.prc-btn:hover{transform:translateY(-1px); filter:brightness(1.08); box-shadow:0 14px 28px var(--btn-shadow)}
.prc-btn:active{transform:translateY(0)}
.prc-btn:focus-visible{outline:3px solid var(--metal); outline-offset:2px}
.prc-btn.is-loading{pointer-events:none; color:transparent}
.prc-btn.is-loading::after{ content:""; position:absolute; width:18px; height:18px; border-radius:50%;
  border:2px solid rgba(255,255,255,.35); border-top-color:var(--btn-ink);
  left:50%; top:50%; margin:-9px 0 0 -9px; animation:prcSpin .7s linear infinite; }
@keyframes prcSpin{to{transform:rotate(360deg)}}

.prc-divider{display:flex; align-items:center; gap:12px; color:var(--placeholder); font-size:12px;
  text-transform:uppercase; letter-spacing:.22em; margin:20px 0 15px}
.prc-divider::before,.prc-divider::after{content:""; height:1px; flex:1; background:var(--rule)}

.prc-foot{text-align:center; color:var(--ink-soft); font-size:14px; margin:0}
.prc-foot a{color:var(--accent); font-weight:700; text-decoration:none}
.prc-foot a:hover{text-decoration:underline}

/* Alerte (erreur) — rouge fixe, indépendant du thème */
.prc-alert{ display:flex; align-items:flex-start; gap:.55rem;
  background:rgba(179,38,30,.1); border:1px solid rgba(179,38,30,.28); color:#8a2018;
  border-radius:11px; padding:.72rem .82rem; font-size:.9rem; margin-bottom:1rem; line-height:1.4; }
.prc-alert svg{flex:none; margin-top:1px}
/* Alerte succès (vert, indépendant du thème) */
.prc-alert-ok{ background:rgba(31,122,77,.1); border-color:rgba(31,122,77,.3); color:#1f6b46; }

/* Titre de sous-page (mot de passe oublié, inscription…) */
.prc-pagetitle{ font-family:"Zilla Slab",serif; font-weight:700; font-size:19px; color:var(--crest); margin:14px 0 0; }

/* Bouton utilisable aussi comme lien <a> */
.prc-btn{ display:block; text-align:center; text-decoration:none; }

/* Ligne à 2 colonnes (prénom / nom) */
.prc-row{ display:grid; grid-template-columns:1fr 1fr; gap:14px; }

/* Aide sous un champ */
.prc-hint{ font-size:.78rem; color:var(--ink-soft); margin:2px 0 0 2px; }

/* Shell élargi (inscription) */
.prc-shell.is-wide{ max-width:440px; }

/* Force du mot de passe + critères (hooks JS conservés : .password-strength(-bar), .password-criteria(#id), .valid) */
.password-strength{ height:4px; border-radius:6px; overflow:hidden; background:rgba(0,0,0,.09); }
.password-strength-bar{ height:100%; width:0; background:var(--field-border); transition:width .2s, background-color .2s; }
.password-criteria-container{ border-radius:11px; border:1px solid var(--card-border); background:var(--cream-2); padding:.7rem; display:grid; gap:.3rem; }
.password-criteria{ display:flex; align-items:center; gap:.45rem; font-size:.8rem; color:var(--ink-soft); transition:color .2s; }
.password-criteria i{ width:14px; text-align:center; font-size:.74rem; }
.password-criteria.valid{ color:#1f7a4d; }

/* Captcha */
.captcha-box{ border:1px dashed var(--field-border); border-radius:11px; background:var(--cream-2); text-align:center;
  font-family:"Zilla Slab",serif; letter-spacing:.35em; font-weight:700; color:var(--crest); padding:.7rem .6rem; font-size:1.4rem; }

@media (max-width:520px){ .prc-row{grid-template-columns:1fr} }
@media (max-width:420px){
  .prc-card{padding:50px 20px 22px}
  .prc-wordmark{font-size:29px}
}
@media (prefers-reduced-motion:reduce){*{transition:none!important; animation:none!important}}