import { Link } from 'react-router-dom';
import { UiPage, UiSection } from '../components/ui/primitives';

/**
 * NotFoundPage - 404 error page
 */
export function NotFoundPage() {
  return (
    <UiPage>
      <UiSection className="py-12 text-center">
        <h2 className="mb-4 text-4xl font-bold text-[var(--text-h)]">404</h2>
        <p className="mb-8 text-xl text-[var(--text-dim)]">Page not found</p>
        <Link to="/" className="ui-btn ui-btn-primary inline-flex items-center">
          Back to Recipes
        </Link>
      </UiSection>
    </UiPage>
  );
}
