/* Direct Upload Styles */

/* Preview container animations */
.direct-upload-preview {
  animation: fadeIn 0.3s ease-in;
  @media (prefers-reduced-motion: reduce) {
    animation: none;
  }
}

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

/* Upload progress bar */
.upload-progress {
  transition: width 0.3s ease-out;
}

/* Loading spinner overlay */
.direct-upload-loading {
  backdrop-filter: blur(2px);
}

/* Error state */
.direct-upload-error {
  border-color: hsl(var(--er));
  animation: shake 0.5s;
  @media (prefers-reduced-motion: reduce) {
    animation: none;
  }
}

@keyframes shake {
  0%, 100% { transform: translateX(0); }
  25% { transform: translateX(-5px); }
  75% { transform: translateX(5px); }
}

/* Success state */
.direct-upload-complete {
  border-color: hsl(var(--su));
}