CSS only radio button switch

css-only-radio-switch.scss

.switch-field {
  overflow: hidden;

  input[type="radio"] {
    display: none;

    &:checked + label {
      background-color: $color-light-orange;
      border-color: $color-primary-orange;
      z-index: 2;
      cursor: auto;
    }
  }

  label {
    float: left;
    display: inline-block;
    background-color: $color-white;
    text-align: center;
    padding: 12px 50px;
    border: 1px solid $color-medium-gray;
    transition: all 0.25s ease-in-out;
    margin-left: -1px;
    z-index: 1;
    cursor: pointer;

    &:first-of-type {
      margin-left: 0;
      border-radius: $radius 0 0 $radius;
    }

    &:last-of-type {
      border-radius: 0 $radius $radius 0;
    }
  }
}