/*!
 * Toastify js 1.11.0
 * https://github.com/apvarun/toastify-js
 * @license MIT licensed
 *
 * Copyright (C) 2018 Varun A P
 */

.toastify {
    position: fixed;
    left: 50%;
    top: 32px;
    transform: translateX(-50%);
    box-sizing: border-box;
    max-width: 50vw;
    width: auto;
    word-break: break-word;
    margin: 0;
    z-index: 2147483647;
    will-change: transform, opacity;
}

@keyframes toast-in {
    from {
        opacity: 0;
        transform: translateX(-50%) translateY(-44px);
    }

    to {
        opacity: 1;
        transform: translateX(-50%) translateY(0);
    }
}

@keyframes toast-out {
    from {
        opacity: 1;
        transform: translateX(-50%) translateY(0);
    }

    to {
        opacity: 0;
        transform: translateX(-50%) translateY(-44px);
    }
}

.toastify.on {
    animation: toast-in 0.29s cubic-bezier(.42,0,.58,1) forwards;
}

.toastify.hide, .toastify.out {
    animation: toast-out 0.22s cubic-bezier(.42,0,.58,1) forwards;
}
.toastify.on {
    opacity: 1;
}

.toast-close {
    opacity: 0.4;
    padding: 0 5px;
}

.toastify-right {
    right: 15px;
}

.toastify-left {
    left: 15px;
}

.toastify-top {
    top: -150px;
}

.toastify-bottom {
    bottom: -150px;
}

.toastify-rounded {
    border-radius: 25px;
}

.toastify-avatar {
    width: 1.5em;
    height: 1.5em;
    margin: -7px 5px;
    border-radius: 2px;
}

.toastify-center {
    margin-left: auto;
    margin-right: auto;
    left: 0;
    right: 0;
    max-width: fit-content;
    max-width: -moz-fit-content;
}

@media only screen and (max-width: 360px) {
    .toastify-right, .toastify-left {
        margin-left: auto;
        margin-right: auto;
        left: 0;
        right: 0;
        max-width: fit-content;
    }
}

/* === ESTILOS PASTEL PARA TOASTIFY SEGÚN CLASE === */

.toastify-success, .toastify.bg-success {
    background: linear-gradient(135deg, #e7f7ec 15%, #c9eed8 100%);
    color: #186142;
    border: 1px solid #a8e0be;
    box-shadow: 0 6px 24px -6px rgba(90,182,138,0.10), 0 1.5px 4.5px -2.5px #a8e0be;
    border-radius: 16px;
    padding: 10px 12px !important;
    font-weight: 500;
}

.toastify-danger, .toastify.bg-danger {
    background: linear-gradient(135deg, #fff0f3 12%, #ffe1e9 100%);
    color: #8a2f3e;
    border: 1px solid #ffb3c2;
    box-shadow: 0 6px 24px -6px rgba(212,95,110,0.12), 0 1.5px 4.5px -2.5px #ffb3c2;
    border-radius: 16px;
    padding: 10px 12px !important;
    font-weight: 500;
}

.toastify-warning, .toastify.bg-warning {
    background: linear-gradient(135deg, #fffbe3 10%, #ffe9a3 98%);
    color: #7c6a15;
    border: 1px solid #ffe082;
    box-shadow: 0 6px 24px -6px rgba(232,194,48,0.12), 0 1.5px 4.5px -2.5px #ffe082;
    border-radius: 16px;
    padding: 10px 12px !important;
    font-weight: 500;
}

.toastify-info, .toastify.bg-info {
    background: linear-gradient(135deg, #e0f2fa 18%, #c2e1f0 95%);
    color: #225280;
    border: 1px solid #88c9ed;
    box-shadow: 0 6px 24px -6px rgba(65,170,220,0.09), 0 1.5px 4.5px -2.5px #88c9ed;
    border-radius: 16px;
    padding: 10px 12px !important;
    font-weight: 500;
}

.toastify-secondary, .toastify.bg-secondary {
    background: linear-gradient(135deg, #ececf7 14%, #dadbee 98%);
    color: #453e5f;
    border: 1px solid #bebee2;
    box-shadow: 0 6px 24px -6px rgba(120,120,200,0.07), 0 1.5px 4.5px -2.5px #bebee2;
    border-radius: 16px;
    padding: 10px 12px !important;
    font-weight: 500;
}

.toastify-light, .toastify.bg-light {
    background: linear-gradient(135deg, #f7f8fb 12%, #e9ebf2 88%);
    color: #4f5665;
    border: 1px solid #dadde7;
    box-shadow: 0 6px 24px -6px rgba(139,139,151,0.05), 0 1.5px 4.5px -2.5px #dadde7;
    border-radius: 16px;
    padding: 10px 12px !important;
    font-weight: 500;
}

.toastify-dark, .toastify.bg-dark {
    background: linear-gradient(135deg, #37374e 20%, #181829 100%);
    color: #ecf4f8;
    border: 1px solid #32324a;
    box-shadow: 0 6px 24px -6px rgba(39,39,73,0.13), 0 1.5px 4.5px -2.5px #232339;
    border-radius: 16px;
    padding: 10px 12px !important;
    font-weight: 500;
}

    /* Efecto en hover moderno */
    .toastify-success:hover, .toastify-danger:hover, .toastify-warning:hover,
    .toastify-info:hover, .toastify-secondary:hover, .toastify-light:hover, .toastify-dark:hover {
        box-shadow: 0 10px 36px -6px rgba(0,0,0,0.16), 0 1.5px 4.5px -2.5px rgba(0,0,0,0.03);
        filter: brightness(1.04) contrast(1.05) drop-shadow(0 2px 8px #ccc6);
        transition: box-shadow 0.17s, filter 0.19s;
    }