/* Flash Messages - Toast notifications (bottom-right, auto-dismiss) */

#flash {
  position: fixed;
  right: 16px;
  bottom: 16px;
  z-index: 1000;
}

#flash .notice,
#flash .alert {
  padding: 25px;
  margin-bottom: 20px;
  border-radius: 0.25rem;
  width: 400px;
  animation: alertMessage 6s forwards;
}

@keyframes alertMessage {
  0% {
    opacity: 0;
    transform: translateY(-100%);
  }
  8% {
    opacity: 1;
    transform: translateY(0);
  }
  92% {
    opacity: 1;
    transform: translateY(0);
  }
  100% {
    opacity: 0;
    transform: translateY(-100%);
  }
}