/* Animaciones para la burbuja en la esquina izquierda */
@keyframes slideInLeft {
    from { transform: translateX(-120%); opacity: 0; }
    to { transform: translateX(0); opacity: 1; }
}

@keyframes slideOutLeft {
    from { transform: translateX(0); opacity: 1; }
    to { transform: translateX(-120%); opacity: 0; }
}

.toast-enter { 
    animation: slideInLeft 0.5s cubic-bezier(0.175, 0.885, 0.32, 1.275) forwards; 
}

.toast-exit { 
    animation: slideOutLeft 0.4s cubic-bezier(0.6, -0.28, 0.735, 0.045) forwards; 
}

/* Animación suave para el menú desplegable (Acordeón) */
.accordion-content {
    transition: max-height 0.4s ease-in-out, opacity 0.3s ease-in-out;
    max-height: 0;
    opacity: 0;
    overflow: hidden;
}
.accordion-content.open {
    max-height: 1000px;
    opacity: 1;
}
.rotate-arrow {
    transform: rotate(180deg);
}

/* Animación de entrada para las filas de cuentas */
.fila-oculta {
    opacity: 0;
    transform: translateY(-10px);
}

.animacion-entrada {
    animation: aparecerFila 0.4s ease forwards;
}

@keyframes aparecerFila {
    to {
        opacity: 1;
        transform: translateY(0);
    }
}