radio/checkbox with custom styles

Checkbox custom

<div class="checkbox-btn">
  <input class="checkbox-btn__control" type="radio" name="package" id="package-1">
  <label class="checkbox-btn__box" for="package-1">btn 1</label>
</div>

css

.checkbox-btn__control {
  display: none
}

.checkbox-btn__control:checked+.checkbox-btn__box {
  background: linear-gradient(to bottom, #ffb619 0%, #efa209 100%)
}

pug

.checkbox-btn
  input#package-1.checkbox-btn__control(type='radio', name='package')
  label.checkbox-btn__box(for='package-1') btn 1

sass

.checkbox-btn
  &__control
    display: none
    &:checked 
      &+ .checkbox-btn__box
        background: linear-gradient(to bottom, #ffb619 0%, #efa209 100%)