/* ==================================
   TOAST CONTAINER
================================== */

.toast-container {

  position: fixed;

  bottom: 24px;

  right: 24px;

  z-index: 9999;

  display: flex;

  flex-direction: column;

  gap: 12px;

  pointer-events: none;

}

/* ==================================
   TOAST
================================== */

.toast {

  min-width: 260px;

  max-width: 360px;

  padding: 14px 18px;

  border-radius: 18px;

  background: rgba(20,20,30,.95);

  border: 1px solid rgba(255,255,255,.08);

  color: white;

  backdrop-filter: blur(20px);

  box-shadow:
    0 10px 30px rgba(0,0,0,.25);

  transform: translateX(120%);

  opacity: 0;

  transition:
    transform .3s ease,
    opacity .3s ease;

}

.toast.show {

  transform: translateX(0);

  opacity: 1;

}

.toast-success {

  border-left: 4px solid #22c55e;

}

.toast-error {

  border-left: 4px solid #ef4444;

}

.toast-info {

  border-left: 4px solid var(--primary);

}

/* ==================================
   MOBILE
================================== */

@media (max-width: 768px) {

  .toast-container {

    left: 16px;

    right: 16px;

    bottom: 16px;

  }

  .toast {

    max-width: 100%;

  }

}