import React from 'react';
import { Construction } from 'lucide-react';

interface ComingSoonProps {
  title?: string;
}

const ComingSoon: React.FC<ComingSoonProps> = ({ title = 'Coming Soon' }) => {
  return (
    <div className="flex items-center justify-center min-h-screen bg-gray-50 dark:bg-gray-900 p-4">
      <div className="text-center max-w-md">
        <div className="mb-6 flex justify-center">
          <div className="bg-blue-100 dark:bg-blue-900/30 p-6 rounded-full">
            <Construction size={64} className="text-blue-600 dark:text-blue-400" />
          </div>
        </div>
        <h1 className="text-4xl font-bold text-gray-900 dark:text-white mb-4">
          {title}
        </h1>
        <p className="text-lg text-gray-600 dark:text-gray-400 mb-8">
          This feature is currently under development and will be available soon.
        </p>
        <div className="bg-white dark:bg-gray-800 rounded-lg p-6 shadow-lg">
          <p className="text-sm text-gray-500 dark:text-gray-400">
            We're working hard to bring you the best experience. Stay tuned for updates!
          </p>
        </div>
      </div>
    </div>
  );
};

export default ComingSoon;

