.radio-group {
  $o: '#{&}__option-container';

  &--orientation-vertical#{&}--size-small
    :not(:first-child)#{$o}--selection-area-none {
    margin-block-start: var(--wds-radio-group-gap-vertical-small, var(--wds-space-150));
  }

  &--orientation-vertical#{&}--size-medium
    :not(:first-child)#{$o}--selection-area-none {
    margin-block-start: var(--wds-radio-group-gap-vertical-medium, var(--wds-space-300));
  }

  &--orientation-vertical#{&}--size-small
    :not(:first-child)#{$o}--selection-area-always,
  &--orientation-vertical#{&}--size-small
    :not(:first-child)#{$o}--selection-area-hover {
    margin-block-start: var(--wds-radio-group-gap-vertical-small, var(--wds-space-150));
  }

  &--orientation-vertical#{&}--size-medium
    :not(:first-child)#{$o}--selection-area-always,
  &--orientation-vertical#{&}--size-medium
    :not(:first-child)#{$o}--selection-area-hover {
    margin-block-start: var(--wds-radio-group-gap-vertical-medium, var(--wds-space-300));
  }

  #{$o}--selection-area-always &__radio,
  #{$o}--selection-area-hover &__radio {
    padding-block-start: var(--wds-select-area-padding-vertical, var(--wds-space-300));
    padding-inline-end: var(--wds-select-area-padding-horizontal, var(--wds-space-400));
    padding-block-end: var(--wds-select-area-padding-vertical, var(--wds-space-300));
    padding-inline-start: var(--wds-select-area-padding-horizontal, var(--wds-space-400));
  }

  #{$o}--selection-area-always &__radio-container,
  #{$o}--selection-area-hover &__radio-container {
    border-radius: var(--wds-select-area-border-radius, var(--wds-border-radius-200));
  }

  #{$o}--selection-area-always#{$o}--selection-area-skin-filled:not(#{$o}--disabled)
    &__radio-container {
    background-color: var(--wds-select-area-fill, var(--wds-color-black-750));
  }

  @media (hover: hover) {
    #{$o}--selection-area-always#{$o}--selection-area-skin-filled:not(#{$o}--checked):not(#{$o}--disabled):hover
      &__radio-container,
    #{$o}--selection-area-hover#{$o}--selection-area-skin-filled:not(#{$o}--checked):not(#{$o}--disabled):hover
      &__radio-container {
      background-color: var(--wds-select-area-fill-hover, var(--wds-color-black-700));
    }
  }
}