/* Toast Notification */
.toast-notification {
  position: fixed;
  top: 20px;
  right: 20px;
  background-color: rgba(251, 244, 245, 0.95);
  border: 2px solid #B8203A;
  color: #121222;
  padding: 5px 15px;
  border-radius: 8px;
  box-shadow: 0 4px 10px rgba(0, 0, 0, 0.1);
  text-align: left;
  font-size: 16px;
  font-family: inherit;
  z-index: 99999;
  display: flex; 
  align-items: center;
  justify-content: flex-start;
  gap: 6px;
  width: auto;
  min-width: unset;
  max-width: none;
  height: auto;
  min-height: 32px;
  white-space: nowrap;
  opacity: 0;
  transform: translateY(100%);
  display: none;
  backdrop-filter: blur(8px);
  -webkit-backdrop-filter: blur(8px);
}

.toast-notification-visible {
  display: flex;
  animation: toast-fadeIn 0.5s ease forwards;
}

.toast-notification-hiding {
  animation: toast-fadeOut 0.5s ease forwards;
}

/* More vivid colors with opacity */
.toast-notification-success {
  background-color: rgba(244, 251, 245, 0.95) !important;
  border-color: #20b834 !important;
  background-image: linear-gradient(135deg, rgba(32, 184, 52, 0.1), rgba(32, 184, 52, 0.05));
}

.toast-notification-warning {
  background-color: rgba(251, 249, 244, 0.95) !important;
  border-color: #e6a700 !important;
  background-image: linear-gradient(135deg, rgba(230, 167, 0, 0.1), rgba(230, 167, 0, 0.05));
}

.toast-notification-error {
  background-color: rgba(251, 244, 245, 0.95) !important;
  border-color: #d9203a !important;
  background-image: linear-gradient(135deg, rgba(217, 32, 58, 0.1), rgba(217, 32, 58, 0.05));
}

.toast-notification-info {
  background-color: rgba(244, 247, 251, 0.95) !important;
  border-color: #2084d9 !important;
  background-image: linear-gradient(135deg, rgba(32, 132, 217, 0.1), rgba(32, 132, 217, 0.05));
}

/* Alternative more vibrant solid colors with slight transparency */
/*
.toast-notification-success {
  background-color: rgba(232, 255, 235, 0.95) !important;
  border-color: #20b834 !important;
}

.toast-notification-warning {
  background-color: rgba(255, 248, 225, 0.95) !important;
  border-color: #e6a700 !important;
}

.toast-notification-error {
  background-color: rgba(255, 235, 238, 0.95) !important;
  border-color: #d9203a !important;
}

.toast-notification-info {
  background-color: rgba(225, 240, 255, 0.95) !important;
  border-color: #2084d9 !important;
}
*/

/* Fade in animation */
@keyframes toast-fadeIn {
  from {
    opacity: 0;
    transform: translateY(100%);
  }
  to {
    opacity: 1;
    transform: translateY(0);
  }
}

/* Fade out animation */
@keyframes toast-fadeOut {
  from {
    opacity: 1;
    transform: translateY(0);
  }
  to {
    opacity: 0;
    transform: translateY(100%);
  }
}

.toast-notification svg {
  flex-shrink: 0;
}

.toast-notification-success svg {
  fill: #20b834 !important;
}

.toast-notification-warning svg {
  fill: #e6a700 !important;
}

.toast-notification-error svg {
  fill: #d9203a !important;
}

.toast-notification-info svg {
  fill: #2084d9 !important;
}