input[type='radio'] {
  //opacity: 0 !important; // hide it
  margin-right: 10px !important;
  margin-left: 2px;
  margin-bottom: 4px;
  filter: none !important;
  position: relative;

  &:before {
    position: relative !important;
    cursor: pointer !important;
    padding: 0 !important;
  }

  // Box.
  &:before {
    position: relative;
    content: '' !important;
    display: inline-block !important;
    vertical-align: text-top !important;
    width: 18px !important;
    height: 18px !important;
    background: $bg !important;
    border: 2px solid $accent !important;
    border-radius: 50% !important;
    left: -2px;
    top: 0px;
  }

  // Box hover
  &:hover:before {
    background: $contrast !important;
  }

  // Disabled state label.
  &:disabled:before {
    color: $disabled !important;
    cursor: auto !important;
  }

  // Disabled box.
  &:disabled:before {
    box-shadow: none !important;
    background: $disabled !important;
  }

  // Checkmark. Could be replaced with an image
  &:checked:before {
    content: '' !important;
    position: absolute !important;
    left: -2px !important;
    top: 0px !important;
    background: $bg !important;
    width: 18px !important;
    height: 18px !important;
    border: 2px solid $accent !important;
  }

  &:checked:after {
    content: '' !important;
    position: absolute !important;
    left: 0px !important;
    top: 2px !important;
    background: $accent !important;
    width: 14px !important;
    height: 14px !important;
    transform: scale(0.6) !important;
    border-radius: 50% !important;
  }
}

.c-legend--disabled {
  color: $disabled;
}

.p-radio_option_panel_box {
  color: $fg;
  border: 1px solid $border;
}

.p-radio_option_panel_box--disabled {
  color: $text;
  border: 1px solid $border;
}

.p-radio_option_panel_content__text--secondary {
  color: $text;
}

.p-radio_option_panel_icon--selected {
  color: $accent;
}

.p-radio_option_panel_icon--disabled {
  color: $disabled;
}

.p-radio_option_panel_box--unselected {
  &:focus,
  &:hover {
    background-color: $bg;
  }
}

.p-radio_option_panel_box--selected {
  &:focus,
  &:hover {
    background-color: $excluded;
  }
}
