interface LoadingFallbackProps {
  message?: string
  color?: 'purple' | 'blue' | 'green' | 'orange' | 'red'
}

export function LoadingFallback({ message = 'Загрузка...', color = 'purple' }: LoadingFallbackProps) {
  const colorClasses = {
    purple: 'border-purple-600',
    blue: 'border-blue-600',
    green: 'border-green-600',
    orange: 'border-orange-600',
    red: 'border-red-600',
  }

  return (
    <div className="flex items-center justify-center min-h-screen">
      <div className="text-center space-y-4">
        <div
          className={`w-8 h-8 border-4 ${colorClasses[color]} border-t-transparent rounded-full animate-spin mx-auto`}
        ></div>
        <p className="text-white/60">{message}</p>
      </div>
    </div>
  )
}
