#banner-container {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  z-index: 9999;
  pointer-events: none;
}

.banner {
  margin: 10px auto;
  width: fit-content;
  min-width: 200px;
  max-width: 400px;

  padding: 12px 16px;
  border-radius: 10px;

  color: white;
  font-weight: 500;
  text-align: center;

  transform: translateY(-120%);
  opacity: 0;

  transition: transform 0.25s ease, opacity 0.25s ease;
}

.banner.show {
  transform: translateY(0);
  opacity: 1;
}

.banner.success {
  background: #4caf6d;
}

.banner.error {
  background: #f44336;
}