.radio {
  position: relative;
  cursor: initial;
  display: flex;
  flex-direction: row;

  &--align-items-center {
    align-items: center;
  }

  &--align-items-top > &__dot-container {
    top: 4px;
  }

  &--disabled {
    cursor: default;
    pointer-events: none;
  }

  &--checked > &__label,
  &--checked > &__dot-container {
    cursor: default;
  }

  &__input {
    position: absolute;
    overflow: hidden;
    opacity: 0;
    padding: 0;
    border: 0;
    height: 0;
    width: 0;
  }

  & > &__dot-container {
    box-sizing: border-box;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    position: relative;
    min-width: var(--wds-radio-size, 16px);
    height: var(--wds-radio-size, 16px);
    border: 1px solid var(--wds-radio-border, #116dff);
    background-color: var(--wds-radio-fill, #ffffff);
    border-radius: var(--wds-radio-border-radius, 50%);
    cursor: pointer;
  }

  @media (hover: hover) {
    &:not(&--checked):hover > &__dot-container {
      border-color: var(--wds-radio-border-hover, #116dff);
      background-color: var(--wds-radio-fill-hover, #ffffff);
    }
  }

  &:not(&--checked)#{&}--disabled > &__dot-container {
    border-color: var(--wds-radio-border-disabled, rgba(0, 6, 36, 0.3));
    background-color: var(--wds-radio-fill-disabled, rgba(0, 6, 36, 0.05));
  }

  &--checked > &__dot-container {
    border-color: var(--wds-radio-border-active, #116dff);
    background-color: var(--wds-radio-fill-active-hover, #ffffff);
  }

  &--checked#{&}--disabled > &__dot-container {
    border-color: var(--wds-radio-border-active-disabled, rgba(0, 6, 36, 0.3));
    background-color: var(--wds-radio-fill-active-disabled, rgba(0, 6, 36, 0.05));
  }

  &__input:focus-visible ~ &__dot-container {
    border-color: var(--wds-radio-border, #116dff);
    box-shadow: var(--wds-shadow-focus-standard, 0 0 0 3px #a6d0ff);
  }

  @media (hover: hover) {
    &:not(&--checked) > &__dot-container:hover:not(:active) {
      border-color: var(--wds-radio-border-hover, #116dff);
      background-color: var(--wds-radio-fill-hover, #d6e6fe);
    }
  }

  & > &__dot-container > &__dot {
    display: block;
    border-radius: var(--wds-radio-border-radius, 50%);
    width: var(--wds-radio-dot-size, 10px);
    height: var(--wds-radio-dot-size, 10px);
    background-color: var(--wds-radio-dot-fill-active, #116dff);
    transform: scale(0);
    opacity: 0;
  }

  &:active > &__dot-container > &__dot {
    background-color: var(--wds-radio-dot-fill-active, #5999ff);
    transform: scale(1);
    opacity: 1;
  }

  &--checked > &__dot-container > &__dot {
    transform: scale(1);
    opacity: 1;
  }

  &--checked#{&}--disabled > &__dot-container > &__dot {
    background-color: var(--wds-radio-dot-fill-disabled, rgba(0, 6, 36, 0.3));
  }

  & > &__label {
    cursor: pointer;
    padding-inline-start: var(--wds-space-200, 12px);
    width: 100%;
  }

  &#{&}--size-small &__label &__label-text {
    font-size: var(--wds-radio-label-font-size-small, 14px);
    line-height: var(--wds-radio-label-font-line-height-small, 18px);
  }

  &#{&}--size-medium &__label &__label-text {
    font-size: var(--wds-radio-label-font-size-medium, 16px);
    line-height: var(--wds-radio-label-font-line-height-medium, 24px);
  }
}