/* Thème visuel du Pass de saison : nuit de fête foraine, violet profond et or.
   Appliqué à l'encart de l'accueil (.accueil-pass) et à la page pass.html (body.page-pass).
   Couleurs fixes : lisibles quel que soit le thème choisi dans la boutique. */
.accueil-pass, body.page-pass {
  --pass-nuit: #1a1238; --pass-nuit-2: #2a1d5e; --pass-or: #ffc83d; --pass-or-fonce: #b8901f;
  --pass-texte: #fff4dc; --pass-doux: #d8d2ec; --pass-rose: #ff7ab8;
}
/* Encart de l'accueil */
.accueil-pass { position: relative; overflow: hidden; color: var(--pass-texte);
  background: radial-gradient(circle at 92% 8%, rgba(255, 200, 61, 0.28) 0, transparent 38%),
    linear-gradient(135deg, var(--pass-nuit) 0%, var(--pass-nuit-2) 100%);
  border: 1px solid var(--pass-or-fonce); box-shadow: 0 0 0 1px rgba(255, 200, 61, 0.15) inset; }
.accueil-pass::before { content: "★ ✦ ★"; position: absolute; right: 1rem; top: 0.4rem; font-size: 0.8rem;
  letter-spacing: 0.4em; color: var(--pass-or); opacity: 0.55; pointer-events: none; }
.accueil-pass h2 { color: var(--pass-or); }
.accueil-pass .note { color: var(--pass-doux); }
.accueil-pass .bouton, body.page-pass .carte-premium .bouton { background: var(--pass-or); color: var(--pass-nuit);
  box-shadow: 0 2px 0 var(--pass-or-fonce); border-color: transparent; }
/* Page du Pass */
body.page-pass .pass-entete { position: relative; overflow: hidden; color: var(--pass-texte);
  background: radial-gradient(circle at 85% 20%, rgba(255, 200, 61, 0.3) 0, transparent 40%),
    radial-gradient(circle at 10% 90%, rgba(255, 122, 184, 0.18) 0, transparent 45%),
    linear-gradient(135deg, var(--pass-nuit) 0%, var(--pass-nuit-2) 100%);
  border: 1px solid var(--pass-or-fonce); }
body.page-pass .pass-entete h1 { color: var(--pass-texte); }
body.page-pass .pass-entete p { color: var(--pass-doux); }
body.page-pass .pass-entete .pass-surtitre, body.page-pass .carte-premium .pass-surtitre { color: var(--pass-or); }
body.page-pass .progression-pass { border-color: var(--pass-or-fonce);
  background: linear-gradient(180deg, color-mix(in srgb, var(--pass-nuit-2) 14%, var(--surface)), var(--surface)); }
body.page-pass #niveau-pass { padding: 0.15rem 0.7rem; border-radius: 999px; background: var(--pass-nuit);
  color: var(--pass-or); border: 1px solid var(--pass-or-fonce); }
body.page-pass .barre-xp { height: 0.9rem; border-color: var(--pass-or-fonce); background: var(--pass-nuit); }
body.page-pass .barre-xp span { background: linear-gradient(90deg, var(--pass-rose), var(--pass-or)); }
body.page-pass .carte-premium { color: var(--pass-texte); border-color: var(--pass-or);
  background: linear-gradient(135deg, var(--pass-nuit), #3a2580); }
body.page-pass .carte-premium .note, body.page-pass .carte-premium p { color: var(--pass-doux); }
body.page-pass .carte-premium h2 { color: var(--pass-or); }
body.page-pass .palier { border-left: 4px solid var(--pass-nuit-2); }
body.page-pass .palier.est-atteint { border-left-color: var(--pass-or); border-color: var(--pass-or-fonce); }
body.page-pass .entete-palier h3 { color: var(--pass-or-fonce); }
body.page-pass .voie-palier.premium { border-color: var(--pass-or-fonce);
  background: linear-gradient(135deg, color-mix(in srgb, var(--pass-or) 12%, var(--surface)), var(--surface)); }
body.page-pass .voie-palier.premium .nom-voie { color: var(--pass-or-fonce); }
body.page-pass .carte-quete { border-left: 4px solid var(--pass-rose); }
body.page-pass .carte-quete.est-equipe { border-left-color: var(--succes); }
body.page-pass .details-quete progress { accent-color: var(--pass-or-fonce); }