/* Cible le wrapper de l'image dans une carte désactivée */
.anfield-radio.pf-disabled .an-pf-field-image-wrap {
  position: relative;          /* nécessaire pour placer les pseudo-éléments */
  display: block;              /* s'étend sur la largeur de l'image */
  overflow: hidden;            /* pour bien clipper les coins arrondis si besoin */
}

/* (optionnel) si tu veux des coins arrondis harmonisés */
.anfield-radio .an-pf-field-image {
  display: block;
  width: 100%;
  height: auto;
  border-radius: 10px;         /* ajuste la valeur si besoin */
}

/* Voile gris sur TOUTE la photo */
.anfield-radio.pf-disabled .an-pf-field-image-wrap::before {
  content: "";
  position: absolute;
  inset: 0;                    /* couvre 100% de la photo */
  background: rgba(0, 0, 0, 0.18);  /* gris léger */
  border-radius: 10px;         /* même rayon que l’image si tu l’as mis */
  z-index: 1;
  pointer-events: none;
}

/* Gros X rouge, centré sur TOUTE la photo */
.anfield-radio.pf-disabled .an-pf-field-image-wrap::after {
  content: "X";
  position: absolute;
  inset: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  font-weight: 900;
  font-size: clamp(28px, 4vw, 48px);
  color: rgba(255, 0, 0, 0.95);
  text-shadow: 0 1px 2px rgba(0,0,0,.35);
  z-index: 2;
  pointer-events: none;
}
/* ===========================
   Réglages globaux (tunable)
   =========================== */
.js-an-pf-fields-wrap {
  --pf-gap: 16px;                 /* espace entre groupes */
  --pf-radius: 12px;              /* arrondi des coins des groupes */
  --pf-bg: #fff;                  /* fond par défaut */
  --pf-border: 1px solid #e9ecef; /* bordure */
  --pf-shadow-light: 0 4px 12px rgba(0,0,0,.06);
  --pf-shadow-strong: 0 12px 28px rgba(0,0,0,.16);
  --pf-pad: 14px;                 /* padding interne de chaque field */
  --pf-anim-duration: .35s;
  --pf-anim-ease: cubic-bezier(.25,.1,.25,1);
}

/* Style de base appliqué aux fields de nos groupes */
#field_23, #field_24, #field_25,
#field_2,  #field_3,  #field_1,  #field_4,  #field_5,  #field_6,  #field_7,
#field_9,  #field_8,
#field_10, #field_15,
#field_11, #field_16, #field_17,
#field_12, #field_19,
#field_13, #field_18,
#field_14, #field_21 {
  background: var(--pf-bg);
  border: var(--pf-border);
  padding: var(--pf-pad);
  margin: 0;
  box-shadow: none;
}

/* ========== Groupe 1 : 23 / 24 / 25 (toujours #fff, hors logique actif/inactif) ========== */
#field_23 { margin-top: var(--pf-gap); border-radius: var(--pf-radius) var(--pf-radius) 0 0; }
#field_24 { border-top: 0; }
#field_25 { border-top: 0; border-radius: 0 0 var(--pf-radius) var(--pf-radius); margin-bottom: var(--pf-gap); }

/* ========== Groupe 2 : 2 / 3 / 1 / 4 / 5 / 6 / 7 ========== */
#field_2  { margin-top: var(--pf-gap); border-radius: var(--pf-radius) var(--pf-radius) 0 0; }
#field_3, #field_1, #field_4, #field_5, #field_6 { border-top: 0; }
#field_7  { border-top: 0; border-radius: 0 0 var(--pf-radius) var(--pf-radius); margin-bottom: var(--pf-gap); }

/* ========== Groupe 3 : 9 / 8 ========== */
#field_9  { margin-top: var(--pf-gap); border-radius: var(--pf-radius) var(--pf-radius) 0 0; }
#field_8  { border-top: 0; border-radius: 0 0 var(--pf-radius) var(--pf-radius); margin-bottom: var(--pf-gap); }

/* ========== Groupe 4 : 10 / 15 ========== */
#field_10 { margin-top: var(--pf-gap); border-radius: var(--pf-radius) var(--pf-radius) 0 0; }
#field_15 { border-top: 0; border-radius: 0 0 var(--pf-radius) var(--pf-radius); margin-bottom: var(--pf-gap); }

/* ========== Groupe 5 : 11 / 16 / 17 ========== */
#field_11 { margin-top: var(--pf-gap); border-radius: var(--pf-radius) var(--pf-radius) 0 0; }
#field_16 { border-top: 0; }
#field_17 { border-top: 0; border-radius: 0 0 var(--pf-radius) var(--pf-radius); margin-bottom: var(--pf-gap); }

/* ========== Groupe 6 : 12 / 19 ========== */
#field_12 { margin-top: var(--pf-gap); border-radius: var(--pf-radius) var(--pf-radius) 0 0; }
#field_19 { border-top: 0; border-radius: 0 0 var(--pf-radius) var(--pf-radius); margin-bottom: var(--pf-gap); }

/* ========== Groupe 7 : 13 / 18 ========== */
#field_13 { margin-top: var(--pf-gap); border-radius: var(--pf-radius) var(--pf-radius) 0 0; }
#field_18 { border-top: 0; border-radius: 0 0 var(--pf-radius) var(--pf-radius); margin-bottom: var(--pf-gap); }

/* ========== Groupe 8 : 14 / 21 ========== */
#field_14 { margin-top: var(--pf-gap); border-radius: var(--pf-radius) var(--pf-radius) 0 0; }
#field_21 { border-top: 0; border-radius: 0 0 var(--pf-radius) var(--pf-radius); margin-bottom: var(--pf-gap); }

/* ----- Anti "double-bordure" si un field intermédiaire d’un groupe est masqué ----- */
#field_23.an-pf-hide + #field_24,
#field_24.an-pf-hide + #field_25,
#field_2.an-pf-hide  + #field_3,
#field_3.an-pf-hide  + #field_1,
#field_1.an-pf-hide  + #field_4,
#field_4.an-pf-hide  + #field_5,
#field_5.an-pf-hide  + #field_6,
#field_6.an-pf-hide  + #field_7,
#field_9.an-pf-hide  + #field_8,
#field_10.an-pf-hide + #field_15,
#field_11.an-pf-hide + #field_16,
#field_16.an-pf-hide + #field_17,
#field_12.an-pf-hide + #field_19,
#field_13.an-pf-hide + #field_18,
#field_14.an-pf-hide + #field_21 {
  border-top: 0;
}

/* ----- Ombre (par défaut : légère) appliquée sur le "début" visible du groupe ----- */
#field_23,
#field_2,
#field_9,
#field_10,
#field_11,
#field_12,
#field_13,
#field_14 { box-shadow: var(--pf-shadow-light); }

/* Si le premier est masqué, on transfère l’ombre au suivant visible */
#field_23.an-pf-hide + #field_24,
#field_24.an-pf-hide + #field_25,
#field_2.an-pf-hide  + #field_3,
#field_3.an-pf-hide  + #field_1,
#field_1.an-pf-hide  + #field_4,
#field_4.an-pf-hide  + #field_5,
#field_5.an-pf-hide  + #field_6,
#field_6.an-pf-hide  + #field_7,
#field_9.an-pf-hide  + #field_8,
#field_10.an-pf-hide + #field_15,
#field_11.an-pf-hide + #field_16,
#field_16.an-pf-hide + #field_17,
#field_12.an-pf-hide + #field_19,
#field_13.an-pf-hide + #field_18,
#field_14.an-pf-hide + #field_21 {
  box-shadow: var(--pf-shadow-light);
}

/* ----- États visuels Oui/Non (?? EXCLURE 23/24/25 de la bascule) ----- */
/* Inactif = "Non": fond gris clair */
.pf-group-inactive:not(#field_23):not(#field_24):not(#field_25) {
  background: #f7f7f7 !important;
}
/* Actif = "Oui": fond blanc (déjà blanc) + OMBRE FORTE sur début de groupe */
.pf-group-active#field_2,
.pf-group-active#field_9,
.pf-group-active#field_10,
.pf-group-active#field_11,
.pf-group-active#field_12,
.pf-group-active#field_13,
.pf-group-active#field_14,
.pf-group-active#field_2.an-pf-hide  + #field_3,
.pf-group-active#field_3.an-pf-hide  + #field_1,
.pf-group-active#field_1.an-pf-hide  + #field_4,
.pf-group-active#field_4.an-pf-hide  + #field_5,
.pf-group-active#field_5.an-pf-hide  + #field_6,
.pf-group-active#field_6.an-pf-hide  + #field_7,
.pf-group-active#field_9.an-pf-hide  + #field_8,
.pf-group-active#field_10.an-pf-hide + #field_15,
.pf-group-active#field_11.an-pf-hide + #field_16,
.pf-group-active#field_16.an-pf-hide + #field_17,
.pf-group-active#field_12.an-pf-hide + #field_19,
.pf-group-active#field_13.an-pf-hide + #field_18,
.pf-group-active#field_14.an-pf-hide + #field_21 {
  box-shadow: var(--pf-shadow-strong) !important;
}

/* ---------- Animation ouverture/fermeture douce ---------- */
.js-an-pf-fields-wrap .an-pf-field {
  overflow: hidden;
  transition:
    max-height var(--pf-anim-duration) var(--pf-anim-ease),
    opacity    calc(var(--pf-anim-duration) - .1s) ease,
    margin     var(--pf-anim-duration) var(--pf-anim-ease),
    padding    var(--pf-anim-duration) var(--pf-anim-ease),
    border     var(--pf-anim-duration) var(--pf-anim-ease);
  will-change: max-height, opacity;
}
.js-an-pf-fields-wrap .an-pf-field.an-pf-hide {
  display: block !important;
  max-height: 0 !important;
  opacity: 0;
  margin-top: 0 !important;
  margin-bottom: 0 !important;
  padding-top: 0 !important;
  padding-bottom: 0 !important;
  border-top-width: 0 !important;
  border-bottom-width: 0 !important;
  transform: translateY(-4px);
}
.js-an-pf-fields-wrap .an-pf-field:not(.an-pf-hide) {
  max-height: 2000px;
  opacity: 1;
  transform: translateY(0);
}
#pf-style-151,#pf-style-152,#pf-style-152,#pf-style-153,
#pf-style-154,#pf-style-155,#pf-style-156,#pf-style-157,#pf-style-158,
#pf-style-159,#pf-style-160,#pf-style-161,#pf-style-162,#pf-style-163 {display:none;}