/* Toasty (django.contrib.messages) — kontener stały w web/base.html,
   dosypywane też przez htmx hx-swap-oob z fragmentów (np. web/_heart.html). */

.toast-container {
  /* bottom = wysokość dolnej nawigacji (web/_bottom_nav.html) + odstęp —
     na stronach bez niej (signin/signup) po prostu więcej luzu od dołu. */
  position: fixed;
  bottom: 5.5rem;
  left: 50%;
  transform: translateX(-50%);
  z-index: 60;
  display: flex;
  flex-direction: column;
  gap: 0.5rem;
  width: calc(100% - 2rem);
  max-width: 420px;
  pointer-events: none;
}

.toast-container .toast {
  pointer-events: auto;
  animation: toast-in 0.25s ease-out;
}

.toast-container .toast.toast-leaving {
  animation: toast-out 0.2s ease-in forwards;
}

.toast-close {
  margin-left: auto;
  background: transparent;
  border: none;
  padding: 0;
  cursor: pointer;
  line-height: 0;
  color: inherit;
  opacity: 0.7;
}

.toast-close:hover {
  opacity: 1;
}

@keyframes toast-in {
  from {
    opacity: 0;
    transform: translateY(16px);
  }
  to {
    opacity: 1;
    transform: translateY(0);
  }
}

@keyframes toast-out {
  from {
    opacity: 1;
    transform: translateY(0);
  }
  to {
    opacity: 0;
    transform: translateY(16px);
  }
}