@keyframes slideIn {
    from {
        opacity: 0;
        transform: translateY(-10px);
    }
    to {
        opacity: 1;
        transform: translateY(0);
    }
}

.task-item {
    animation: slideIn 0.3s ease-out forwards;
}

.completed .task-text {
    text-decoration: line-through;
    color: #9ca3af; 
}

.filter-active {
    color: #2563eb !important; 
    text-decoration: underline;
    font-weight: bold;
}