import { Wrench, Clock } from 'lucide-react';

export function MaintenanceScreen() {
  return (
    <div className="flex min-h-[70vh] flex-col items-center justify-center rounded-3xl border border-slate-100 bg-white px-6 py-16 text-center shadow-sm">
      <div className="mb-4 flex h-14 w-14 items-center justify-center rounded-full bg-amber-100 text-amber-700">
        <Wrench className="h-6 w-6" />
      </div>
      <h2 className="text-2xl font-semibold text-slate-900">Maintenance in Progress</h2>
      <p className="mt-2 max-w-xl text-sm text-slate-500">
        The system is temporarily in maintenance mode. Please check back soon. Deliveries will be available once maintenance is complete.
      </p>
      <div className="mt-6 flex items-center gap-2 rounded-full bg-slate-100 px-4 py-2 text-xs font-semibold text-slate-600">
        <Clock className="h-3.5 w-3.5" />
        We’ll be back shortly
      </div>
    </div>
  );
}