.radio-container--width-xs {
  min-width: var(--container-min-width-xs);
}

.radio-container--width-sm {
  min-width: var(--container-min-width-sm);
}

.radio-container--width-md {
  min-width: var(--container-min-width-md);
}

.radio-container--width-lg {
  min-width: var(--container-min-width-lg);
}

.radio-container--width-xl {
  min-width: var(--container-min-width-xl);
}

.radio-container--height-xs {
  min-height: var(--container-min-height-xs);
}

.radio-container--height-sm {
  min-height: var(--container-min-height-sm);
}

.radio-container--height-md {
  min-height: var(--container-min-height-md);
}

.radio-container--height-lg {
  min-height: var(--container-min-height-lg);
}

.radio-container--height-xl {
  min-height: var(--container-min-height-xl);
}

.radio {
  display: flex;
  /* width: var(--width);  */
  /* height: var(--height); */
  justify-content: center;
  align-items: center;
  flex-shrink: 0;
}

.radio__layer-radio {
  transition: none;
  box-sizing: border-box;
  display: flex;
  width: var(--layer-radio-width);
  height: var(--layer-radio-height);
  flex-direction: column;
  justify-content: center;
  align-items: center;
  flex-shrink: 0;
  outline: none;
  box-shadow: inset 0 0 0 var(--layer-radio-border-width-enabled)
    var(--v0-rt-surface-color);
  border-radius: var(--layer-radio-border-radius-top-left-secondary)
    var(--layer-radio-border-radius-top-right-secondary)
    var(--layer-radio-border-radius-bottom-right-secondary)
    var(--layer-radio-border-radius-bottom-left-secondary);
  position: relative;
}

.radio__layer-radio:not(
    .radio__layer-radio--checked,
    .radio__layer-radio--disabled,
    .radio__layer-radio--loading
  ) {
  background-color: var(--misc-pseudo-transparent, rgba(128, 128, 128, 0));
}

.radio__layer-radio.radio__layer-radio--transition {
  transition-property: border-color, background-color;
}

.radio__layer-radio:not(.radio__layer-radio--disabled):hover {
  box-shadow: inset 0 0 0 var(--layer-radio-border-width-hovered)
    var(--v0-rt-surface-color);
}

.radio__layer-radio:not(.radio__layer-radio--disabled):focus {
  box-shadow: inset 0 0 0 var(--layer-radio-border-width-focused)
    var(--v0-rt-surface-color);
}

.radio__layer-radio:not(.radio__layer-radio--disabled):active {
  box-shadow: inset 0 0 0 var(--layer-radio-border-width-pressed)
    var(--v0-rt-surface-color);
}

.radio__layer-radio:not(.radio__layer-radio--disabled):hover {
  cursor: pointer;
}

.radio__layer-radio--checked,
.radio__layer-radio:not(.radio__layer-radio--disabled):active {
  background-color: var(--v0-rt-surface-color);
}

.radio__native {
  position: absolute;
  opacity: 0;
  z-index: -10;
  width: 0;
  height: 0;
  margin: 0;
}

@keyframes scaleIn {
  from {
    transform: scale(0);
  }
  to {
    transform: scale(0.5);
  }
}

.radio__icon-checked {
  animation: scaleIn 0.2s ease-out forwards;
  /* TODO: переписать автоген */
  width: var(--layer-radio-radio-icon-width);
  height: var(--layer-radio-radio-icon-height);
  transform: scale(0.5);
  width: 100%;
  height: 100%;
  border-radius: 50%;
  background-color: var(--v0-oncontrol-main-enabled);
}

.radio__icon-checked:hover {
  background-color: var(--v0-oncontrol-main-hovered);
}

.radio__icon-checked:focus {
  background-color: var(--v0-oncontrol-main-focused);
}

.radio__icon-checked:active {
  background-color: var(--v0-oncontrol-main-pressed);
}
