:root {
  --hf-radio-size: 1.25rem;     /* 20 px */
  --hf-gray-border: #6c6c6c;
  --hf-blue-brand: #1971c2;
}

/* Radio reset + skin */
.page-node-type--campaign .radios--wrapper input.form-radio {
  position: static !important;
  float: none !important;
  width: var(--hf-radio-size) !important;
  height: var(--hf-radio-size) !important;
  min-width: var(--hf-radio-size) !important;
  min-height: var(--hf-radio-size) !important;
  margin: 0 !important;
  padding: 0 !important;
  border: 2px solid var(--hf-gray-border) !important;
  border-radius: 50% !important;
  background: #fff !important;
  -webkit-appearance: none !important;
  -moz-appearance: none !important;
  appearance: none !important;
  display: inline-grid !important;
  place-content: center !important;
  cursor: pointer !important;
  transition: border-color .15s, background-color .15s !important;
}

/* Indicator dot */
.page-node-type--campaign .radios--wrapper input.form-radio::before {
  content: "" !important;
  width: calc(var(--hf-radio-size) * 0.44) !important;
  height: calc(var(--hf-radio-size) * 0.44) !important;
  border-radius: 50% !important;
  background: var(--hf-blue-brand) !important;
  transform: scale(0) !important;
  transition: transform .15s ease !important;
}

/* Checked state */
.page-node-type--campaign .radios--wrapper input.form-radio:checked {
  border-color: var(--hf-blue-brand) !important;
}
.page-node-type--campaign .radios--wrapper input.form-radio:checked::before {
  transform: scale(1) !important;
}

/* Keyboard focus */
.page-node-type--campaign .radios--wrapper input.form-radio:focus-visible {
  outline: 2px solid var(--hf-blue-brand) !important;
  outline-offset: 2px !important;
}

/* Disabled */
.page-node-type--campaign .radios--wrapper input.form-radio:disabled {
  cursor: not-allowed !important;
  opacity: .55 !important;
}

/* Layout & label */
.page-node-type--campaign .radios--wrapper .js-form-item {
  display: flex !important;
  align-items: center !important;
  gap: 0.5rem !important;
  margin: 0.25rem 0 !important;
}

.page-node-type--campaign .radios--wrapper label.option {
  margin: 0 !important;
  padding: 0 !important;
  float: none !important;
  width: auto !important;
  color: #000 !important;        /* keep labels black */
  font-size: 1rem !important;
  font-weight: 400 !important;
  line-height: var(--hf-radio-size) !important;
  white-space: normal !important;
  cursor: pointer !important;
  user-select: none !important;
}