/* === Base Toastify styling override === */
.toastify {
  display: flex;
  justify-content: space-between;
  border-radius: 0.5rem !important;
  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.05) !important;
  font-family: ui-sans-serif, system-ui, sans-serif !important;
  font-size: 0.875rem !important;
  line-height: 1.5;
  padding: 0.75rem 1rem !important;
  border: 1px solid hsl(240 5% 94%) !important;
  background: hsl(0 0% 100%) !important;
  color: hsl(240 10% 20%) !important;
  max-width: 22rem !important;
}

/* === Close icon override === */
.toastify .toast-close {
  color: hsl(240 5% 50%) !important; /* gray-500 */
  opacity: 0.7;
  font-size: 1rem;
}
.toastify .toast-close:hover {
  opacity: 1;
}

/* === Success variant === */
.toast-success {
  border-left: 4px solid hsl(142 71% 45%) !important;
  background-color: hsl(142 80% 96%) !important;
  color: hsl(142 71% 25%) !important;
}

/* === Error variant === */
.toast-error {
  border-left: 4px solid hsl(0 84% 60%) !important;
  background-color: hsl(0 86% 97%) !important;
  color: hsl(0 60% 40%) !important;
}

/* === Info variant (optional) === */
.toast-info {
  border-left: 4px solid hsl(210 90% 60%) !important;   /* blue-500 */
  background-color: hsl(210 100% 97%) !important;       /* blue-50 */
  color: hsl(210 90% 25%) !important;                   /* blue-800 */
}

/* === Hover effect (optional) === */
.toastify:hover {
  box-shadow: 0 4px 12px rgba(0, 0, 0, 0.07) !important;
}