/* =====================================================================
   Carte de membre virtuelle du Family Fan’s Club
   Chargée par le site public et par l'administration (aperçu de la carte).
   Variables posées sur la carte : --niveau (couleur de la formule) et
   --niveau-texte (encre ou blanc, selon le contraste).
   ===================================================================== */

.carte-membre{
  --rouge-carte:#E30613;
  position:relative;overflow:hidden;isolation:isolate;
  width:100%;max-width:440px;
  padding:22px 22px 18px;border-radius:18px;
  color:#fff;font-family:'Neutraface Text',-apple-system,BlinkMacSystemFont,'Segoe UI',Helvetica,Arial,sans-serif;
  background:
    radial-gradient(120% 90% at 100% 0%, rgba(255,255,255,.16) 0%, rgba(255,255,255,0) 55%),
    linear-gradient(145deg, #E30613 0%, #C3050F 55%, #8F030C 100%);
  box-shadow:0 18px 40px rgba(22,17,15,.28), 0 2px 6px rgba(22,17,15,.18);
  text-align:left;
}
/* L'écusson du club en grand filigrane */
.carte-membre__filigrane{
  position:absolute;z-index:-1;right:-14%;bottom:-26%;
  width:62%;height:auto;fill:#fff;opacity:.08;pointer-events:none;
}
/* Reflet qui glisse lentement : une capture d'écran reste figée */
.carte-membre[data-carte-live]::after{
  content:'';position:absolute;z-index:-1;inset:-40% -60%;
  background:linear-gradient(105deg, rgba(255,255,255,0) 42%, rgba(255,255,255,.13) 50%, rgba(255,255,255,0) 58%);
  animation:carte-reflet 5.5s ease-in-out infinite;pointer-events:none;
}
@keyframes carte-reflet{
  0%{transform:translateX(-35%)}
  60%,100%{transform:translateX(35%)}
}
@media (prefers-reduced-motion:reduce){
  .carte-membre[data-carte-live]::after{animation:none;display:none}
}

.carte-membre__tete{display:flex;align-items:flex-start;justify-content:space-between;gap:12px;margin-bottom:18px}
.carte-membre__logo{width:58%;max-width:210px;height:auto;display:block}
.carte-membre__club{font-size:.68rem;line-height:1.25;font-weight:600;letter-spacing:.06em;text-transform:uppercase;text-align:right;opacity:.85}

.carte-membre__corps{display:flex;align-items:flex-end;justify-content:space-between;gap:16px}
.carte-membre__identite{min-width:0;flex:1}
.carte-membre__nom{margin:0;font-size:1.32rem;font-weight:700;line-height:1.15;letter-spacing:-.01em;overflow-wrap:anywhere}
.carte-membre__niveau{
  display:inline-block;margin:9px 0 0;padding:4px 11px;border-radius:999px;
  background:var(--niveau,#E2D193);color:var(--niveau-texte,#16110F);
  font-size:.78rem;font-weight:700;letter-spacing:.03em;text-transform:uppercase;
  box-shadow:0 0 0 2px rgba(255,255,255,.55);
}
.carte-membre__infos{margin:14px 0 0;display:flex;flex-wrap:wrap;gap:6px 22px}
.carte-membre__infos div{min-width:0}
.carte-membre__infos dt{font-size:.66rem;font-weight:600;letter-spacing:.06em;text-transform:uppercase;opacity:.75}
.carte-membre__infos dd{margin:1px 0 0;font-size:1rem;font-weight:700;font-variant-numeric:tabular-nums}

.carte-membre__qr{
  flex:0 0 auto;width:132px;padding:6px;background:#fff;border-radius:10px;
  box-shadow:0 6px 16px rgba(0,0,0,.18);
}
.carte-membre__qr svg{display:block;width:100%;height:auto}

.carte-membre__pied{
  display:flex;align-items:center;gap:12px;margin-top:16px;padding-top:14px;
  border-top:1px solid rgba(255,255,255,.28);
}
.carte-membre__motif{flex:0 0 auto;width:40px;height:40px;border-radius:7px;overflow:hidden;background:#fff;box-shadow:0 0 0 2px rgba(255,255,255,.6)}
.carte-membre__motif svg{display:block;width:100%;height:100%}
.carte-membre__etat{font-size:.86rem;font-weight:600;display:flex;align-items:center;gap:7px;flex-wrap:wrap}
.carte-membre__etat time{font-variant-numeric:tabular-nums}
.carte-membre__pastille{
  width:10px;height:10px;border-radius:50%;background:#3BD16F;
  box-shadow:0 0 0 0 rgba(59,209,111,.7);animation:carte-pouls 1.6s ease-out infinite;
}
@keyframes carte-pouls{
  0%{box-shadow:0 0 0 0 rgba(59,209,111,.7)}
  100%{box-shadow:0 0 0 10px rgba(59,209,111,0)}
}
@media (prefers-reduced-motion:reduce){.carte-membre__pastille{animation:none}}

/* Carte expirée ou inactive : grisée, sans pastille verte */
.carte-membre.est-invalide{background:linear-gradient(145deg,#6f6963 0%,#4b4643 100%)}
.carte-membre.est-invalide .carte-membre__qr{opacity:.35}

/* Aperçu compact dans l'espace membre */
.carte-membre--compact{max-width:420px}
.carte-membre--compact .carte-membre__tete{margin-bottom:22px}

/* Grand format, à présenter au partenaire */
.carte-membre--complet{max-width:460px;margin-inline:auto}
@media (max-width:560px){
  .carte-membre--complet{padding:20px 18px 16px}
  .carte-membre--complet .carte-membre__corps{flex-direction:column;align-items:stretch}
  .carte-membre--complet .carte-membre__qr{width:min(78vw,280px);align-self:center;padding:8px;margin-top:6px}
  .carte-membre--complet .carte-membre__nom{font-size:1.5rem}
}
