@use '~@moda/om';

.Overlay {
  @include om.stack(2);

  position: absolute;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  background-color: om.color('snow', 0.9);
  justify-content: center;
  align-items: center;
  color: om.color('ink');
  animation: slow-in 0.5s;

  @keyframes slow-in {
    0% {
      opacity: 0;
    }
    100% {
      opacity: 1;
    }
  }

  &--closing {
    animation: slow-out 0.5s forwards;

    @keyframes slow-out {
      0% {
        opacity: 1;
      }
      100% {
        opacity: 0;
      }
    }
  }
}
