import { Card, CardContent } from "@/components/ui/card";
import { motion } from "framer-motion";
import { Wrench } from "lucide-react";

export default function UnderConstruction() {
  return (
    <div className="min-h-screen flex items-center justify-center bg-gradient-to-br from-gray-900 via-gray-800 to-gray-900 text-white">
      <motion.div
        initial={{ opacity: 0, scale: 0.9 }}
        animate={{ opacity: 1, scale: 1 }}
        transition={{ duration: 0.6 }}
      >
        <Card className="rounded-2xl shadow-2xl bg-white/5 backdrop-blur-xl border border-white/10">
          <CardContent className="p-10 text-center space-y-6">
            <motion.div
              animate={{ rotate: [0, 10, -10, 0] }}
              transition={{ repeat: Infinity, duration: 2 }}
              className="flex justify-center"
            >
              <Wrench className="w-12 h-12 text-yellow-400" />
            </motion.div>

            <h1 className="text-3xl font-bold">🚧 网站建设中</h1>

            <p className="text-gray-300 text-sm">
              我们正在努力打造更好的体验，请稍后再来访问。
            </p>

            <div className="text-xs text-gray-400">
              © {new Date().getFullYear()} Your Site. All rights reserved.
            </div>
          </CardContent>
        </Card>
      </motion.div>
    </div>
  );
}