/* Keep the option geometry fixed in every state. */
.group\/item, .group\/item:hover, .group\/item.active,
button.pilates-option, button.pilates-option:hover, button.pilates-option:active {
  transform: none !important;
  scale: none !important;
  --scale-hover: 1 !important;
  --opt-scale-hover: 1 !important;
  --opt-scale-active: 1 !important;
}
button.pilates-option {
  background-color: #fff !important;
  color: #020617 !important;
  border-color: #dbdbdb !important;
  outline: none !important;
  transition: background-color .15s ease, border-color .15s ease !important;
}
button.pilates-option.pilates-chosen {
  background-color: #fff0f6 !important;
  color: #020617 !important;
  border-color: #dd578d !important;
  outline: 2px solid #dd578d !important;
  outline-offset: -2px !important;
}
button.pilates-option::after, button.pilates-option .pilates-tick { display: none !important; }
.pilates-choice-label { position: relative; padding-left: 36px !important; min-height: 26px; }
.pilates-choice-label::before {
  content: ''; position: absolute; left: 0; top: 50%; transform: translateY(-50%);
  width: 24px; height: 24px; box-sizing: border-box; border: 1px solid #dbdbdb;
  border-radius: 50%; background: #fff; pointer-events: none;
}
.pilates-chosen .pilates-choice-label::before {
  content: '✓'; display: grid; place-items: center; background: #dd578d;
  border-color: #dd578d; color: #fff; font-size: 16px; font-weight: 700;
}
button.pilates-option .pilates-indicator { border-radius: 50% !important; flex-shrink: 0; background: #fff !important; border-color: #dbdbdb !important; }
button.pilates-option .pilates-indicator svg { opacity: 0 !important; }
button.pilates-chosen .pilates-indicator { background: #dd578d !important; border-color: #dd578d !important; color: #fff !important; }
button.pilates-chosen .pilates-indicator svg { opacity: 1 !important; stroke: #fff !important; }
button.pilates-option:focus-visible { outline: 3px solid #a72d64 !important; outline-offset: 3px !important; }