import React from 'react';
import { useNavigate } from 'react-router';
import { Button } from 'antd';
import { useTheme } from '../hooks/ThemeProvider';

export const NotFoundPage = () => {
  const navigate = useNavigate();
  const { isDark } = useTheme();
  
  return (
    <div className="flex flex-col items-center justify-center flex-grow p-4"
      style={{ color: isDark ? '#fff' : 'inherit' }}
    >
      <div className="max-w-3xl w-full">
        <h1 className="text-2xl font-bold mb-4">404 - 页面未找到</h1>
        <p className="mb-6 text-gray-600 dark:text-gray-300">
          您访问的页面不存在或已被移除
        </p>
        <div className="flex gap-4">
          <Button 
            type="primary" 
            onClick={() => navigate('/admin')}
          >
            返回首页
          </Button>
        </div>
      </div>
    </div>
  );
};