/* ── Fix radio CF7 — structure simplifiée sans position absolute ─────────── */

.demo-form__cf7-wrapper .wpcf7-form .wpcf7-radio {
  display: flex;
  gap: 20px;
  flex-wrap: wrap;
}

.demo-form__cf7-wrapper .wpcf7-form .wpcf7-radio .wpcf7-list-item {
  margin: 0;
  display: inline-block;
}

/* Masquer l'input radio natif proprement */
.demo-form__cf7-wrapper .wpcf7-form .wpcf7-radio .wpcf7-list-item input[type="radio"] {
  position: absolute;
  opacity: 0;
  width: 1px;
  height: 1px;
  pointer-events: none; /* Ne pas capturer les clics — c'est le label qui gère */
}

/* Label cliquable */
.demo-form__cf7-wrapper .wpcf7-form .wpcf7-radio .wpcf7-list-item-label {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  height: 80px;
  padding: 0 30px;
  min-width: 100px;
  border-radius: 15px;
  border: 2px solid #d3d5e4;
  background-color: #fbfdfe;
  font-family: var(--font-primary);
  font-size: 20px;
  font-weight: 600;
  color: #011679;
  cursor: pointer;
  transition: border-color 150ms ease, background-color 150ms ease, color 150ms ease;
  user-select: none;
}

/* Hover */
.demo-form__cf7-wrapper .wpcf7-form .wpcf7-radio .wpcf7-list-item-label:hover {
  border-color: var(--color-navy);
}

/* État sélectionné via data-attribute géré par JS */
.demo-form__cf7-wrapper .wpcf7-form .wpcf7-radio .wpcf7-list-item-label[data-checked="true"] {
  border-color: var(--color-navy);
  background-color: var(--color-navy);
  color: #ffffff;
}

/* Focus visible accessibilité */
.demo-form__cf7-wrapper .wpcf7-form .wpcf7-radio .wpcf7-list-item input[type="radio"]:focus-visible
+ .wpcf7-list-item-label {
  outline: 3px solid var(--color-blue);
  outline-offset: 2px;
}

/* Mobile */
@media (max-width: 768px) {
  .demo-form__cf7-wrapper .wpcf7-form .wpcf7-radio {
    gap: 12px;
  }
  .demo-form__cf7-wrapper .wpcf7-form .wpcf7-radio .wpcf7-list-item-label {
    height: 64px;
    font-size: 17px;
    padding: 0 20px;
  }
}

.demo-form__cf7-wrapper .wpcf7 form .wpcf7-response-output {
  margin: 0em 0.5em 1em;
  padding: 0.2em 1em;
  border: 2px solid #00a0d2;
  background: #B4E080;
  text-align: center;
}
