/* Radios natifs visibles : taille constante dans les flex/grid et couleur de palette.
   Les boutons de choix graphiques (étoiles, cartes de présentation et templates)
   cachent volontairement leur input et conservent leur fonctionnement propre. */
input[type="radio"]:not(.rating-input input):not(.studio-editor-choice input):not(.la2-template-card input):not([hidden]):not(.visually-hidden):not(.sr-only) {
  box-sizing: border-box;
  flex: 0 0 18px;
  width: 18px;
  min-width: 18px;
  max-width: 18px;
  height: 18px;
  min-height: 18px;
  max-height: 18px;
  padding: 0;
  border-radius: 50%;
  accent-color: var(--st-accent, #ff8b3d);
}

/* Bootstrap dessine ses radios avec appearance:none : la couleur native seule
   ne suffit donc pas lorsque .form-check-input est utilisé. */
input.form-check-input[type="radio"]:checked {
  background-color: var(--st-accent, #ff8b3d);
  border-color: var(--st-accent, #ff8b3d);
}
input.form-check-input[type="radio"]:focus-visible {
  border-color: var(--st-accent, #ff8b3d);
  box-shadow: 0 0 0 .2rem color-mix(in srgb, var(--st-accent, #ff8b3d) 22%, transparent);
}

/* Les labels des controles Bootstrap ne doivent pas heriter des marges
   des labels de champs texte (ex. .wf-form label, .pro18-form label). */
label.form-check-label {
  display: inline-block;
  width: auto;
  margin: 0;
  padding: 0;
  cursor: pointer;
}
.form-floating > :where(input.form-control) + label {
  display: block;
  width: auto;
  margin: 0;
  padding: 1rem .75rem;
  color: var(--st-muted, #c8ad99);
}