// Base for label styling
[type="radio"]:not(:checked),
[type="radio"]:checked {
  left: -9999px;
  position: absolute;
}

[type="radio"]:not(:checked) + label,
[type="radio"]:checked + label,
[type="radio"]:not(:checked) + input[type=hidden] + label,
[type="radio"]:checked + input[type=hidden] + label  {
  cursor: pointer;
  font-weight: normal;
  padding-left: 1.95em;
  position: relative;
}

// radio aspect
[type="radio"]:not(:checked) + label::before,
[type="radio"]:checked + label::before,
[type="radio"]:not(:checked) + input[type=hidden] + label::before,
[type="radio"]:checked + input[type=hidden] + label::before {
  background: transparent;
  border: 1px solid $radiobutton-border-color;
  border-radius: 50%;
  content: '';
  height: 18px;
  left: 0;
  position: absolute;
  top: 1px;
  transition: all .1s;
  width: 18px;
}

[type="radio"]:checked + label::before,
[type="radio"]:checked + input[type=hidden] + label::before {
  border-color: $color-primary;
  border-width: 6px;
  height: 20px;
  left: -1px;
  top: 0;
  width: 20px;
}

// disabled radio
[type="radio"]:disabled:not(:checked) + label::before,
[type="radio"]:disabled:checked + label::before,
[type="radio"]:disabled:not(:checked) + input[type=hidden] + label::before,
[type="radio"]:disabled:checked + input[type=hidden] + label::before {
  border-color: $radiobutton-disabled-border-color;
  box-shadow: none;
}

[type="radio"]:disabled + label,
[type="radio"]:disabled + input[type=hidden] + label {
  color: $radiobutton-disabled-text-color;
  cursor: not-allowed;
}
