// core
.p-toast {
    width: 25rem;
    white-space: pre-line;
    word-break: break-word;
}

.p-toast-message-icon {
    flex-shrink: 0;
}

.p-toast-message-content {
    display: flex;
    align-items: flex-start;
}

.p-toast-message-text {
    flex: 1 1 auto;
}

.p-toast-top-center {
    transform: translateX(-50%);
}

.p-toast-bottom-center {
    transform: translateX(-50%);
}

.p-toast-center {
    min-width: 20vw;
    transform: translate(-50%, -50%);
}

.p-toast-icon-close {
    display: flex;
    align-items: center;
    justify-content: center;
    overflow: hidden;
    position: relative;
}

.p-toast-icon-close.p-link {
    cursor: pointer;
}

/* Animations */
.p-toast-message-enter-from {
    opacity: 0;
    -webkit-transform: translateY(50%);
    -ms-transform: translateY(50%);
    transform: translateY(50%);
}

.p-toast-message-leave-from {
    max-height: 1000px;
}

.p-toast .p-toast-message.p-toast-message-leave-to {
    max-height: 0;
    opacity: 0;
    margin-bottom: 0;
    overflow: hidden;
}

.p-toast-message-enter-active {
    -webkit-transition: transform 0.3s, opacity 0.3s;
    transition: transform 0.3s, opacity 0.3s;
}

.p-toast-message-leave-active {
    -webkit-transition: max-height 0.45s cubic-bezier(0, 1, 0, 1), opacity 0.3s, margin-bottom 0.3s;
    transition: max-height 0.45s cubic-bezier(0, 1, 0, 1), opacity 0.3s, margin-bottom 0.3s;
}

// theme
.p-toast {
    opacity: $toastOpacity;

    .p-toast-message {
        margin: $toastMargin;
        box-shadow: $toastShadow;
        border-radius: $borderRadius;

        .p-toast-message-content {
            padding: $toastPadding;
            border-width: $toastBorderWidth;

            .p-toast-message-text {
                margin: $toastMessageTextMargin;
            }

            .p-toast-message-icon {
                font-size: $toastIconFontSize;

                &.p-icon {
                    width: $toastIconFontSize;
                    height: $toastIconFontSize;
                }
            }

            .p-toast-summary {
                font-weight: $toastTitleFontWeight;
            }

            .p-toast-detail {
                margin: $toastDetailMargin;
            }
        }

        .p-toast-icon-close {
            width: $toastIconFontSize;
            height: $toastIconFontSize;
            border-radius: $actionIconBorderRadius;
            background: transparent;
            transition: $actionIconTransition;
            outline-color: transparent;

            &:hover {
                background: rgba(255, 255, 255, 0.5);
            }

            &:focus-visible {
                @include focused();
            }
        }

        &.p-toast-message-info {
            background: $infoMessageBg;
            border: $infoMessageBorder;
            border-width: $messageBorderWidth;
            color: $infoMessageTextColor;

            .p-toast-message-icon,
            .p-toast-icon-close {
                color: $infoMessageIconColor;
            }
        }

        &.p-toast-message-success {
            background: $successMessageBg;
            border: $successMessageBorder;
            border-width: $messageBorderWidth;
            color: $successMessageTextColor;

            .p-toast-message-icon,
            .p-toast-icon-close {
                color: $successMessageIconColor;
            }
        }

        &.p-toast-message-warn {
            background: $warningMessageBg;
            border: $warningMessageBorder;
            border-width: $messageBorderWidth;
            color: $warningMessageTextColor;

            .p-toast-message-icon,
            .p-toast-icon-close {
                color: $warningMessageIconColor;
            }
        }

        &.p-toast-message-error {
            background: $errorMessageBg;
            border: $errorMessageBorder;
            border-width: $messageBorderWidth;
            color: $errorMessageTextColor;

            .p-toast-message-icon,
            .p-toast-icon-close {
                color: $errorMessageIconColor;
            }
        }

        @if variable-exists(secondaryMessageBg) {
            &.p-toast-message-secondary {
                background: $secondaryMessageBg;
                border: $secondaryMessageBorder;
                border-width: $messageBorderWidth;
                color: $secondaryMessageTextColor;

                .p-toast-message-icon,
                .p-toast-icon-close {
                    color: $secondaryMessageIconColor;
                }
            }
        }

        @if variable-exists(contrastMessageBg) {
            &.p-toast-message-contrast {
                background: $contrastMessageBg;
                border: $contrastMessageBorder;
                border-width: $messageBorderWidth;
                color: $contrastMessageTextColor;

                .p-toast-message-icon,
                .p-toast-icon-close {
                    color: $contrastMessageIconColor;
                }
            }
        }
    }
}
