/* Smooth Fade In Animation for Results */
@keyframes fadeIn {
    from { opacity: 0; transform: translateY(10px); }
    to { opacity: 1; transform: translateY(0); }
}

/* Apply this class to the result box via JS if needed, 
   or the Tailwind 'transition' classes will handle hover states. */
.fade-in-up {
    animation: fadeIn 0.4s ease-out forwards;
}

/* Custom Scrollbar (Optional - makes it look more native on Windows) */
::-webkit-scrollbar {
    width: 10px;
}
::-webkit-scrollbar-track {
    background: #f1f5f9; 
}
::-webkit-scrollbar-thumb {
    background: #cbd5e1; 
    border-radius: 5px;
}
::-webkit-scrollbar-thumb:hover {
    background: #94a3b8; 
}

/* Ensure Dropzone transition is smooth */
#dropZone {
    transition: all 0.2s ease-in-out;
}