.p-toast {
  @apply w-96 whitespace-pre-line break-words rounded-md;
}

.p-toast-message {
  @apply mb-4;
}

.p-toast-message-icon {
  @apply h-[1.125rem] w-[1.125rem] flex-shrink-0 text-lg;
}

.p-toast-message-content {
  @apply flex items-start gap-2 p-3;
}

.p-toast-message-text {
  @apply flex flex-auto flex-col gap-2;
}

.p-toast-summary {
  @apply text-base font-medium;
}

.p-toast-detail {
  @apply text-sm font-medium;
}

.p-toast-close-button {
  @apply relative -end-1/4 -mt-[25%] flex h-7 w-7 cursor-pointer select-none items-center justify-center overflow-hidden rounded-full border-none bg-transparent p-0 text-inherit transition-colors duration-200 focus-visible:outline focus-visible:outline-1 focus-visible:outline-offset-2;
}

.p-toast-close-button:dir(rtl) {
  @apply end-auto ms-auto;
}

.p-toast-message-info,
.p-toast-message-success,
.p-toast-message-warn,
.p-toast-message-error,
.p-toast-message-secondary,
.p-toast-message-contrast {
  @apply rounded-md border backdrop-blur-sm dark:backdrop-blur-md;
}

.p-toast-close-icon {
  @apply h-4 w-4 text-base;
}

.p-toast-message-info {
  @apply border-blue-200 bg-blue-50/95 text-blue-600 shadow-[0px_4px_8px_0px_theme(colors.blue.500/0.04)] dark:border-blue-700/35 dark:bg-blue-500/15 dark:text-blue-500;
}

.p-toast-message-info .p-toast-detail {
  @apply text-surface-700 dark:text-surface-0;
}

.p-toast-message-info .p-toast-close-button {
  @apply hover:bg-blue-100 focus-visible:outline-blue-600 dark:hover:bg-white/5 dark:focus-visible:outline-blue-500;
}

.p-toast-message-success {
  @apply border-green-200 bg-green-50/95 text-green-600 shadow-[0px_4px_8px_0px_theme(colors.green.500/0.04)] dark:border-green-700/35 dark:bg-green-500/15 dark:text-green-500;
}

.p-toast-message-success .p-toast-detail {
  @apply text-surface-700 dark:text-surface-0;
}

.p-toast-message-success .p-toast-close-button {
  @apply hover:bg-green-100 focus-visible:outline-green-600 dark:hover:bg-white/5 dark:focus-visible:outline-green-500;
}

.p-toast-message-warn {
  @apply border-yellow-200 bg-yellow-50/95 text-yellow-600 shadow-[0px_4px_8px_0px_theme(colors.yellow.500/0.04)] dark:border-yellow-700/35 dark:bg-yellow-500/15 dark:text-yellow-500;
}

.p-toast-message-warn .p-toast-detail {
  @apply text-surface-700 dark:text-surface-0;
}

.p-toast-message-warn .p-toast-close-button {
  @apply hover:bg-yellow-100 focus-visible:outline-yellow-600 dark:hover:bg-white/5 dark:focus-visible:outline-yellow-500;
}

.p-toast-message-error {
  @apply border-red-200 bg-red-50/95 text-red-600 shadow-[0px_4px_8px_0px_theme(colors.blue.500/0.04)] dark:border-red-700/35 dark:bg-red-500/15 dark:text-red-500;
}

.p-toast-message-error .p-toast-detail {
  @apply text-surface-700 dark:text-surface-0;
}

.p-toast-message-error .p-toast-close-button {
  @apply hover:bg-red-100 focus-visible:outline-red-600 dark:hover:bg-white/5 dark:focus-visible:outline-red-500;
}

.p-toast-message-secondary {
  @apply border-surface-200 bg-surface-100 text-surface-600 shadow-[0px_4px_8px_0px_rgba(0,0,0,0.04)] dark:border-surface-700 dark:bg-surface-800 dark:text-surface-300;
}

.p-toast-message-secondary .p-toast-detail {
  @apply text-surface-700 dark:text-surface-0;
}

.p-toast-message-secondary .p-toast-close-button {
  @apply hover:bg-surface-200 focus-visible:outline-surface-600 dark:hover:bg-surface-700 dark:focus-visible:outline-surface-300;
}

.p-toast-message-contrast {
  @apply border-surface-950 bg-surface-900 text-surface-50 shadow-[0px_4px_8px_0px_rgba(0,0,0,0.04)] dark:border-surface-100 dark:bg-surface-0 dark:text-surface-950;
}

.p-toast-message-contrast .p-toast-detail {
  @apply text-surface-0 dark:text-surface-950;
}

.p-toast-message-contrast .p-toast-close-button {
  @apply hover:bg-surface-800 focus-visible:outline-surface-50 dark:hover:bg-surface-100 dark:focus-visible:outline-surface-950;
}

.p-toast-top-center {
  @apply -translate-x-1/2;
}

.p-toast-bottom-center {
  @apply -translate-x-1/2;
}

.p-toast-center {
  @apply min-w-[20vw] -translate-x-1/2 -translate-y-1/2;
}

.p-toast-message-enter-from {
  @apply translate-y-1/2 opacity-0;
}

.p-toast-message-leave-from {
  @apply max-h-[1000px];
}

.p-toast .p-toast-message.p-toast-message-leave-to {
  @apply mb-0 max-h-0 overflow-hidden opacity-0;
}

.p-toast-message-enter-active {
  @apply [transition:transform_0.3s,opacity_0.3s];
}

.p-toast-message-leave-active {
  @apply [transition:max-height_0.45s_cubic-bezier(0,1,0,1),opacity_0.3s,margin-bottom_0.3s];
}
