.radio {
  display: inline-flex;
}

.radio input {
  display: none;
}

.radio-mark {
  background-color: var(--white);
  border-radius: 50%;
  border: 1px solid var(--gray-700);
  cursor: pointer;
  height: 19px;
  margin-right: 6px;
  position: relative;
  top: 3px;
  transition: background-color 0.2s;
  width: 19px;
}

.radio input:checked ~ span::before {
  content: "";
}

.radio input:checked ~ .radio-mark {
  border-color: var(--blue);
  border-width: 6px;
}