.radio{
  display: flex;
  align-items: center;
  justify-content: center;
  width: 16px;
  height: 16px;
  border: 1px solid rgba(#000, .45);
  border-radius: 100%;
  transition: all .3s;
}
.inner{
  opacity: 1;
  width: 6px;
  height: 6px;
  border-radius: 100%;
  background: var(--color-bg-primary);
}
.innerDisabled{
  background: #EDEDED;
}
.radio.checked{
  border: 1px solid var(--color-primary);
  background-color: var(--color-primary);
  .inner{
    opacity: 1;
  }
}

.innerCheckbox{
  display: flex;
  align-items: center;
  justify-content: center;
  width: 16px;
  height: 16px;
}
.checkboxIcon{
  width: 10px;
  height: 7px;
}
.innerDisabledCheckBox{
 .innerCheckbox(); 
 background: #EDEDED;
}