/* ============================================
   TOASTS FUSION911 - DISEÑO PROFESIONAL
   ============================================ */

/* Contenedor principal centrado - MÁXIMA ESPECIFICIDAD */
.blazored-toast-container.top-center,
.blazored-toast-container.top-right,
.blazored-toast-container.top-left,
.blazored-toast-container.bottom-center,
.blazored-toast-container.bottom-right,
.blazored-toast-container.bottom-left,
.blazored-toast-container {
    position: fixed !important;
    z-index: 999998 !important;
    pointer-events: none !important;
    top: 2rem !important;
    left: 50% !important;
    right: auto !important;
    bottom: auto !important;
    transform: translateX(-50%) !important;
    width: auto !important;
}

    /* Toast base - MÁXIMA ESPECIFICIDAD */
    .blazored-toast-container .blazored-toast {
        pointer-events: all !important;
        margin-bottom: 1rem !important;
        border-radius: 12px !important;
        padding: 1.5rem 2rem !important;
        box-shadow: 0 10px 40px rgba(0, 0, 0, 0.8) !important;
        color: white !important;
        font-weight: 600 !important;
        font-size: 1rem !important;
        min-width: 350px !important;
        max-width: 500px !important;
        text-align: center !important;
        font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif !important;
        background-color: transparent !important;
    }

        .blazored-toast-container .blazored-toast .blazored-toast-header,
        .blazored-toast-container .blazored-toast .blazored-toast-body {
            background: transparent !important;
            padding: 0 !important;
            margin: 0 !important;
            border: none !important;
        }

        .blazored-toast-container .blazored-toast .blazored-toast-heading {
            font-size: 1.1rem !important;
            font-weight: 700 !important;
            margin-bottom: 0.5rem !important;
            text-shadow: 0 1px 2px rgba(0, 0, 0, 0.3) !important;
        }

        /* COLORES FUSION911 PARA TOASTS - MÁXIMA ESPECIFICIDAD */
        .blazored-toast-container .blazored-toast.success {
            background: linear-gradient(135deg, #27AE60 0%, #2ECC71 100%) !important;
            color: #ffffff !important;
            text-shadow: 0 1px 2px rgba(0, 0, 0, 0.4) !important;
            border: 2px solid rgba(255, 255, 255, 0.2) !important;
        }

        .blazored-toast-container .blazored-toast.info {
            background: linear-gradient(135deg, #2E86AB 0%, #3498DB 100%) !important;
            color: #ffffff !important;
            text-shadow: 0 1px 2px rgba(0, 0, 0, 0.4) !important;
            border: 2px solid rgba(255, 255, 255, 0.2) !important;
        }

        .blazored-toast-container .blazored-toast.warning {
            background: linear-gradient(135deg, #F39C12 0%, #E67E22 100%) !important;
            color: #2C3E50 !important;
            text-shadow: 0 1px 2px rgba(255, 255, 255, 0.4) !important;
            font-weight: 700 !important;
            border: 2px solid rgba(255, 255, 255, 0.3) !important;
        }

        .blazored-toast-container .blazored-toast.error {
            background: linear-gradient(135deg, #E74C3C 0%, #C0392B 100%) !important;
            color: #ffffff !important;
            text-shadow: 0 1px 2px rgba(0, 0, 0, 0.4) !important;
            border: 2px solid rgba(255, 255, 255, 0.2) !important;
        }

/* Animación de entrada más suave */
.blazored-toast {
    animation: toastSlideIn 0.4s ease-out !important;
}

@keyframes toastSlideIn {
    0% {
        opacity: 0;
        transform: translateY(-20px) scale(0.9);
    }

    100% {
        opacity: 1;
        transform: translateY(0) scale(1);
    }
}

/* Responsive para móviles */
@media (max-width: 768px) {
    .blazored-toast {
        min-width: 280px !important;
        max-width: 90vw !important;
        padding: 1.25rem 1.5rem !important;
        font-size: 0.95rem !important;
    }

    .blazored-toast-container {
        top: 1rem !important;
    }
}

/* ============================================
   TOASTS FUSION911 - SOLUCIÓN DEFINITIVA  
   ============================================ */

/* MÁXIMA ESPECIFICIDAD - Sobrescribe admin-theme y cualquier interferencia */
html body #app .blazored-toast-container,
html body .blazored-toast-container,
.blazored-toast-container {
    position: fixed !important;
    top: 2rem !important;
    left: 50% !important;
    transform: translateX(-50%) !important;
    z-index: 999999 !important;
    pointer-events: none !important;
    width: auto !important;
    right: auto !important;
    bottom: auto !important;
}

    /* Toast individual - ULTRA ESPECÍFICO */
    html body #app .blazored-toast-container .blazored-toast,
    html body .blazored-toast-container .blazored-toast,
    .blazored-toast-container .blazored-toast {
        pointer-events: all !important;
        margin-bottom: 1rem !important;
        border-radius: 12px !important;
        padding: 1.5rem 2rem !important;
        color: #ffffff !important;
        font-weight: 600 !important;
        font-size: 1rem !important;
        min-width: 350px !important;
        max-width: 500px !important;
        text-align: center !important;
        font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif !important;
        box-shadow: 0 10px 40px rgba(0, 0, 0, 0.8) !important;
        border: 2px solid rgba(255, 255, 255, 0.2) !important;
        opacity: 1 !important;
        display: block !important;
        visibility: visible !important;
    }

        /* COLORES FUSION911 - MÁXIMA ESPECIFICIDAD */
        html body #app .blazored-toast-container .blazored-toast.blazored-toast-success,
        html body .blazored-toast-container .blazored-toast.blazored-toast-success,
        .blazored-toast-container .blazored-toast.blazored-toast-success,
        .blazored-toast.success {
            background: linear-gradient(135deg, #27AE60 0%, #2ECC71 100%) !important;
            color: #ffffff !important;
            text-shadow: 0 1px 2px rgba(0, 0, 0, 0.4) !important;
        }

        html body #app .blazored-toast-container .blazored-toast.blazored-toast-info,
        html body .blazored-toast-container .blazored-toast.blazored-toast-info,
        .blazored-toast-container .blazored-toast.blazored-toast-info,
        .blazored-toast.info {
            background: linear-gradient(135deg, #2E86AB 0%, #3498DB 100%) !important;
            color: #ffffff !important;
            text-shadow: 0 1px 2px rgba(0, 0, 0, 0.4) !important;
        }

        html body #app .blazored-toast-container .blazored-toast.blazored-toast-warning,
        html body .blazored-toast-container .blazored-toast.blazored-toast-warning,
        .blazored-toast-container .blazored-toast.blazored-toast-warning,
        .blazored-toast.warning {
            background: linear-gradient(135deg, #F39C12 0%, #E67E22 100%) !important;
            color: #2C3E50 !important;
            text-shadow: 0 1px 2px rgba(255, 255, 255, 0.4) !important;
            font-weight: 700 !important;
        }

        html body #app .blazored-toast-container .blazored-toast.blazored-toast-error,
        html body .blazored-toast-container .blazored-toast.blazored-toast-error,
        .blazored-toast-container .blazored-toast.blazored-toast-error,
        .blazored-toast.error {
            background: linear-gradient(135deg, #E74C3C 0%, #C0392B 100%) !important;
            color: #ffffff !important;
            text-shadow: 0 1px 2px rgba(0, 0, 0, 0.4) !important;
        }

/* Neutralizar cualquier override del admin-theme */
.admin-layout .blazored-toast-container,
.admin-layout .blazored-toast {
    background-color: unset !important;
    color: unset !important;
    border-color: unset !important;
}

/* Animación suave */
.blazored-toast {
    animation: toastSlideInFixed 0.4s ease-out !important;
}

@keyframes toastSlideInFixed {
    0% {
        opacity: 0;
        transform: translateY(-20px) scale(0.9);
    }

    100% {
        opacity: 1;
        transform: translateY(0) scale(1);
    }
}

/* Responsive */
@media (max-width: 768px) {
    html body #app .blazored-toast-container .blazored-toast,
    html body .blazored-toast-container .blazored-toast,
    .blazored-toast-container .blazored-toast {
        min-width: 280px !important;
        max-width: 90vw !important;
        padding: 1.25rem 1.5rem !important;
        font-size: 0.95rem !important;
    }
}