:root {
  --pdv-transition-fast: 160ms;
  --pdv-transition-room: 200ms;
  --pdv-transition-ease: cubic-bezier(0.22, 0.68, 0.26, 1);
}

@keyframes pdv-room-enter {
  from { opacity: 0; }
  to { opacity: 1; }
}

@keyframes pdv-room-leave {
  from { opacity: 1; }
  to { opacity: 0; }
}

html.pdv-transition-ready body {
  animation: pdv-room-enter var(--pdv-transition-room) var(--pdv-transition-ease) both;
}

html.pdv-transition-ready body.pdv-room-leaving {
  animation: pdv-room-leave var(--pdv-transition-fast) ease-in both;
  pointer-events: none;
}

[data-pdv-transition] {
  transition: opacity var(--pdv-transition-fast) var(--pdv-transition-ease);
}

[data-pdv-transition="out"] {
  opacity: 0 !important;
  pointer-events: none !important;
}

@media (prefers-reduced-motion: reduce) {
  html.pdv-transition-ready body,
  html.pdv-transition-ready body.pdv-room-leaving {
    animation: none;
  }

  [data-pdv-transition] {
    transition: none;
  }
}