/* Efecto neón púrpura en los bordes del toast */
.colored-toast.swal2-popup.swal2-toast {
    background-color: rgba(0, 0, 0, 0.58) !important;
    /* Fondo oscuro semitransparente */
    border-radius: 10px !important;
    padding: 20px !important;
    /* Espacio adicional para que el neón se vea */
    margin: 5px !important;
    box-shadow: 0 0 5px rgba(128, 0, 128, 0.5),
        /* Sombra púrpura cercana */
        0 0 5px rgba(128, 0, 255, 0.6),
        /* Sombra púrpura media */
        0 0 7px rgba(128, 0, 255, 0.7),
        /* Sombra púrpura más fuerte */
        0 0 8px rgba(128, 0, 255, 0.8);
    /* Sombra púrpura externa */
    color: #fff !important;
}

/* Estilo neón en el texto del toast */
.colored-toast .swal2-title {
    color: #00ff00 !important;
    /* Texto verde neón */
    text-shadow: 0 0 5px #00ff00 !important, 0 0 10px #00ff00 !important, 0 0 20px #00ff00 !important;
    font-weight: bold !important;
}

/* Estilo neón en los íconos del toast */
.colored-toast .swal2-icon {
    color: #00ff00 !important;
    /* Color del ícono verde neón */
    text-shadow: 0 0 5px #00ff00 !important, 0 0 10px #00ff00 !important, 0 0 20px #00ff00 !important;
}

/* Remover fondo predeterminado de los íconos del toast */
.swal2-toast .swal2-icon.swal2-success,
.swal2-toast .swal2-icon.swal2-error,
.swal2-toast .swal2-icon.swal2-warning,
.swal2-toast .swal2-icon.swal2-info,
.swal2-toast .swal2-icon.swal2-question {
    background-color: transparent !important;
}

/* Alert */

.custom-bgs {
    background-color: rgba(0, 0, 0, 0.4);
    border-radius: 1em;
    backdrop-filter: blur(10px);
    box-shadow: 0 0 30px rgba(191, 0, 255, 0.5), 0 0 60px rgba(0, 0, 0, 0.3);
    padding: 20px;
}

.custom-html {
    color: white;
}

.custom-button {
    background-color: #bf00ff;
    color: white;
    border: none;
    border-radius: 5px;
    padding: 10px 20px;
    box-shadow: 0 0 10px rgba(191, 0, 255, 0.5);
}

.success-text {
    color: #00ff00;
    text-shadow: 0 0 3px #00ff00, 0 0 7px #00ff00, 0 0 10px #00ff00;
    font-weight: bold;
}

.error-text {
    color: red;
    text-shadow: 0 0 5px red, 0 0 10px red, 0 0 20px red;
}