/**
 * @file
 * Additional class for dialog.
 */

@keyframes show-mobile-dialog {
  0% {
    inset-block-end: -100%;
  }
  100% {
    inset-block-end: 0;
  }
}

@keyframes hide-mobile-dialog {
  0% {
    inset-block-end: 0;
  }
  100% {
    inset-block-end: -100%;
  }
}

dialog[data-component-id="enea:dialog"][open] {
  animation: show-mobile-dialog 250ms ease-in;
}

dialog[data-component-id="enea:dialog"].hide {
  animation: hide-mobile-dialog 250ms ease-out;
}