.host {
  --vkui_internal--snackbars_container_animation_duration: 340ms;
  --vkui_internal--SnackbarAnimatedWrapper_height: 0;
  --vkui_internal--SnackbarAnimatedWrapper_margin_top: 0;

  margin-block-start: var(--vkui_internal--SnackbarAnimatedWrapper_margin_top);
  animation-duration: var(--vkui_internal--snackbars_container_animation_duration);
  animation-timing-function: var(--vkui--animation_easing_platform);
  animation-fill-mode: both;
}

.placementTop:not(:last-child),
.placementBottom:not(:first-child) {
  --vkui_internal--SnackbarAnimatedWrapper_margin_top: var(--vkui--spacing_size_2xl);
}

.ios {
  --vkui_internal--snackbars_container_animation_duration: 400ms;
}

.stateEnter {
  animation-name: animationSnackbarGrowIn;
}

.stateExit {
  animation-name: animationSnackbarGrowOut;
}

@keyframes animationSnackbarGrowIn {
  from {
    max-block-size: 0;
    margin-block-start: 0;
  }

  to {
    max-block-size: 100vh;
    margin-block-start: var(--vkui_internal--SnackbarAnimatedWrapper_margin_top);
  }
}

@keyframes animationSnackbarGrowOut {
  from {
    block-size: var(--vkui_internal--SnackbarAnimatedWrapper_height);
    margin-block-start: var(--vkui_internal--SnackbarAnimatedWrapper_margin_top);
  }

  to {
    block-size: 0;
    margin-block-start: 0;
  }
}
