///////////////////////////////////////////////////
// THEME / COMPONENTS / FORMS - CHECKBOXES & RADIOS
///////////////////////////////////////////////////


// Custom styled checkboxes https://scottaohara.github.io/a11y_styled_form_controls/src/checkbox/
// and radio buttons https://scottaohara.github.io/a11y_styled_form_controls/src/radio-button/


// Style checkbox and radio input
.unl .dcf-input-checkbox label::before,
.unl .dcf-input-radio label::before {
  transition: border-color $hover-off, box-shadow $hover-off;
}


// Hover, focus states
.unl .dcf-input-checkbox label:hover::before,
.unl .dcf-input-radio label:hover::before,
.unl .dcf-input-checkbox input[type="checkbox"]:hover + label::before,
.unl .dcf-input-radio input[type="radio"]:hover + label::before,
.unl .dcf-input-checkbox input[type="checkbox"]:focus + label::before,
.unl .dcf-input-radio input[type="radio"]:focus + label::before {
  box-shadow: 0 0 $length-em-3 fade-out($border-color-input-hover-light-mode,.25);
}