@use 'vars' as *;
@use '../mixins' as *;

/**
  Анимация открытия попапов, для анимации открытия попапа обернуть попап в transition.
  Гейты `--no-enter-anim` / `--no-leave-anim` вешает useOverlayStack: появление
  анимируется только у первого оверлея в стеке, закрытие — только у последнего.
  Негации завёрнуты в `:where()`, чтобы не поднимать вес селектора — иначе они начинают
  спорить с правилами компонентов (`.ui-snackbar.v-enter-from` и Ко).
 */
.v-enter-active:where(:not(.--no-enter-anim)),
.v-leave-active:where(:not(.--no-leave-anim)) {
  transition: 200ms linear opacity, 200ms linear transform;

  @include from-br(sm) {
    transition: 300ms linear opacity, 200ms linear transform;
  }
}

.v-enter-from:where(:not(.--no-enter-anim)),
.v-leave-to:where(:not(.--no-leave-anim)) {
  opacity: 0;
  transform: scale(0.99) translateY(8px);
}