.vtmn-radio-button[type='radio']{
  position:absolute;
  opacity:0;
}

.vtmn-radio-button[type='radio'] + label{
  position:relative;
  display:inline-flex;
  align-items:flex-start;
  font-family:'Roboto', 'system-ui', '-apple-system', sans-serif;
  font-size:1rem;
  line-height:1.5;
  cursor:pointer;
  -webkit-user-select:none;
     -moz-user-select:none;
          user-select:none;
  color:hsl(200, 100%, 4.7%);
}

.vtmn-radio-button[type='radio'] + label::before{
  content:'';
  border:0.125rem solid;
  border-radius:100%;
  -webkit-margin-before:0.0625rem;
          margin-block-start:0.0625rem;
  -webkit-margin-end:0.6875rem;
          margin-inline-end:0.6875rem;
  padding:0.5rem;
  transition:box-shadow 200ms ease-out;
}

.vtmn-radio-button[type='radio']:not(:checked) + label::before{
  border-color:hsl(213, 10.6%, 59.2%);
}

.vtmn-radio-button[type='radio']:not(:focus-visible,
:checked,
:disabled):hover
  + label::before{
  box-shadow:0 0 0 0.4375rem hsla(200, 100%, 4.7%, 0.05);
}

.vtmn-radio-button[type='radio']:not(:checked,
:disabled):active
  + label::before{
  box-shadow:0 0 0 0.4375rem hsla(200, 100%, 4.7%, 0.15);
}

.vtmn-radio-button[type='radio']:focus-visible:not(:disabled) + label::before{
  box-shadow:0 0 0 0.25rem hsl(210, 14.3%, 94.5%), 0 0 0 0.375rem hsl(200, 100%, 4.7%);
}

.vtmn-radio-button[type='radio']:checked + label::before{
  border-color:hsl(200, 100%, 4.7%);
}

.vtmn-radio-button[type='radio']:not(:focus-visible):checked:not(
    :disabled
  ):hover
  + label::before{
  box-shadow:0 0 0 0.4375rem hsla(200, 100%, 36.9%, 0.05);
}

.vtmn-radio-button[type='radio']:checked:not(:disabled):active + label::before{
  box-shadow:0 0 0 0.4375rem hsla(200, 100%, 36.9%, 0.15);
}

.vtmn-radio-button[type='radio'] + label::after{
  content:'';
  -webkit-mask:url("data:image/svg+xml,%3Csvg width='20' height='20' viewBox='0 0 20 20' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M10 20C4.477 20 0 15.523 0 10C0 4.477 4.477 0 10 0C15.523 0 20 4.477 20 10C20 15.523 15.523 20 10 20ZM10 18C14.4183 18 18 14.4183 18 10C18 5.58172 14.4183 2 10 2C5.58172 2 2 5.58172 2 10C2 14.4183 5.58172 18 10 18ZM5 10C5 12.7614 7.23858 15 10 15C12.7614 15 15 12.7614 15 10C15 7.23858 12.7614 5 10 5C7.23858 5 5 7.23858 5 10Z' /%3E%3C/svg%3E");
          mask:url("data:image/svg+xml,%3Csvg width='20' height='20' viewBox='0 0 20 20' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M10 20C4.477 20 0 15.523 0 10C0 4.477 4.477 0 10 0C15.523 0 20 4.477 20 10C20 15.523 15.523 20 10 20ZM10 18C14.4183 18 18 14.4183 18 10C18 5.58172 14.4183 2 10 2C5.58172 2 2 5.58172 2 10C2 14.4183 5.58172 18 10 18ZM5 10C5 12.7614 7.23858 15 10 15C12.7614 15 15 12.7614 15 10C15 7.23858 12.7614 5 10 5C7.23858 5 5 7.23858 5 10Z' /%3E%3C/svg%3E");
  -webkit-mask-size:cover;
          mask-size:cover;
  background-color:hsl(200, 100%, 36.9%);
  position:absolute;
  block-size:1.25rem;
  inline-size:1.25rem;
  inset-block-start:0.0625rem;
  inset-inline-start:0;
  transition:all 0.2s;
}

.vtmn-radio-button[type='radio']:not(:checked) + label::after{
  opacity:0;
  transform:scale(0) rotate(45deg);
}

.vtmn-radio-button[type='radio']:checked + label::after{
  opacity:1;
  transform:scale(1) rotate(0);
}

.vtmn-radio-button[type='radio']:disabled + label{
  opacity:0.38;
  cursor:not-allowed;
}

.vtmn-radio-button[type='radio']:focus-visible + label::before{
  outline:none;
  box-shadow:0 0 0 0.25rem hsl(210, 14.3%, 94.5%), 0 0 0 0.375rem hsl(200, 100%, 4.7%);
}
