.p-toast {
  @apply whitespace-pre-line break-words opacity-90 min-w-96;

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

  &.p-toast-center {
    @apply min-w-5 -translate-x-1/2 -translate-y-1/2;
  }

  .p-toast-message {
    @apply m-0 mb-4 drop-shadow-lg rounded-lg;

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

    &.p-toast-message-leave-from {
      @apply max-h-96;
    }

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

    &-enter-active {
      transition: transform 0.3s, opacity 0.3s;
    }

    &-leave-active {
      transition: max-height 0.45s cubic-bezier(0, 1, 0, 1), opacity 0.3s, margin-bottom 0.3s;
    }

    &-info {
      @apply bg-primary text-white border-0;

      .p-toast-message-icon, .p-toast-icon-close {
        @apply text-white;
      }
    }

    &-success {
      @apply bg-success text-white border-0;

      .p-toast-message-icon, .p-toast-icon-close {
        @apply text-white;
      }
    }

    &-warn {
      @apply bg-warning text-gray-90 border-0;

      .p-toast-message-icon, .p-toast-icon-close {
        @apply text-gray-90;
      }
    }

    &-error {
      @apply bg-error text-white border-0;

      .p-toast-message-icon, .p-toast-icon-close {
        @apply text-white;
      }
    }

    .p-toast-message-content {
      @apply flex items-start p-4 border-0;

      .p-toast-message-text {
        @apply flex-auto m-0 ml-4 self-center;
      }

      .p-toast-message-icon {
        @apply shrink-0 text-2xl;

        &.p-icon {
          @apply w-8 h-8;
        }
      }

      .p-toast-summary {
        @apply font-semibold;
      }

      .p-toast-summary + .p-toast-detail {
        @apply m-0 mt-2;
      }
    }

    .p-toast-icon-close {
      @apply flex items-center justify-center overflow-hidden relative w-8 h-8 rounded-lg bg-transparent transition-none outline-none
        hover:bg-white/50
        focus-visible:outline-none drop-shadow-none;

      &.p-link {
        @apply cursor-pointer;
      }
    }
  }
}
