@mixin custom-radio-checkboxes($type: radio) {
  input {
    @include sr-only-styles;

    &:checked:focus + label::before,
    &:focus + label::before {
      border-color: $black;
    }

    &:checked + label::before {
      border-color: $color-primary;
    }
  }

  label {
    display: inline-block;
    position: relative;
    padding-left: 1.5em;
    font-weight: $font-weight-normal;
    cursor: pointer;

    &::before {
      content: '';
      display: block;
      position: absolute;
      left: 0;
      top: 0.25em;
      background: $white;
      height: 1em;
      width: 1em;
      border: 2px solid $gray-light;
      transition: all 0.1s ease-out;
    }
  }
}