.c__radio {
  input {
    appearance: none;
    margin: 0;
    width: var(--c--components--forms-checkbox--size);
    height: var(--c--components--forms-checkbox--size);
    border: var(--c--components--forms-checkbox--border-width) solid var(--c--components--forms-checkbox--border-color);
    background-color: var(--c--components--forms-checkbox--background-color);
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    transition:
      border var(--c--globals--transitions--duration)
        var(--c--globals--transitions--ease-out),
      box-shadow var(--c--globals--transitions--duration)
        var(--c--globals--transitions--ease-out);

    &:hover {
      box-shadow: 0 0 0 var(--c--components--forms-checkbox--border-width--hover) var(--c--components--forms-checkbox--border-color);
    }

    &:focus {
      outline: none;
      box-shadow: 0 0 0 var(--c--components--forms-checkbox--border-width--hover) var(--c--components--forms-checkbox--border-color);
    }

    &:checked {
      border-color: var(--c--components--forms-checkbox--accent-color);

      &:hover {
        box-shadow: 0 0 0 var(--c--components--forms-checkbox--border-width--hover) var(--c--components--forms-checkbox--accent-color);
      }

      &:focus {
        box-shadow: 0 0 0 var(--c--components--forms-checkbox--border-width--hover) var(--c--components--forms-checkbox--accent-color);
      }
    }

    &::before {
      content: "";
      width: 1rem;
      height: 1rem;
      border-radius: 50%;
      transform: scale(0);
      transition: all var(--c--globals--transitions--duration)
        var(--c--globals--transitions--ease-out);
      box-shadow: inset 1em 1em var(--c--components--forms-checkbox--accent-color);
    }

    &:checked::before {
      transform: scale(1);
    }
  }

  &.c__checkbox--disabled {
    pointer-events: none;
    input {
      border-color: var(--c--components--forms-checkbox--accent-color--disabled);
      &::before {
        box-shadow: inset 1em 1em
          var(--c--components--forms-checkbox--accent-color--disabled);
      }
    }
  }
}
