feat: polish invoice editor and viewer UI with custom NumberInput

component

- Create custom NumberInput component with increment/decrement buttons
- Add 0.25 step increments for hours and rates in invoice forms
- Implement emerald-themed styling with hover states and accessibility
- Add keyboard navigation (arrow keys) and proper ARIA support
- Condense invoice editor tax/totals section into efficient grid layout
- Update client dropdown to single-line format (name + email)
- Add fixed footer with floating action bar pattern matching business
  forms
- Redesign invoice viewer with better space utilization and visual
  hierarchy
- Maintain professional appearance and consistent design system
- Fix Next.js 15 params Promise handling across all invoice pages
- Resolve TypeScript compilation errors and type-only imports

src/app/dashboard/clients/[id]/edit/page.tsx

@@ -1,5 +1,7 @@
+import Link from "next/link";
 import { HydrateClient } from "~/trpc/server";
 import { ClientForm } from "~/components/client-form";
+import { PageHeader } from "~/components/page-header";
 
 interface EditClientPageProps {
   params: Promise<{ id: string }>;
@@ -10,14 +12,11 @@ export default async function EditClientPage({ params }: EditClientPageProps) {
 
   return (
     <div>
-      <div className="mb-8">
-        <h1 className="bg-gradient-to-r from-emerald-600 to-teal-600 bg-clip-text text-3xl font-bold text-transparent">
-          Edit Client
-        </h1>
-        <p className="mt-1 text-lg text-gray-600">
-          Update client information below.
-        </p>
-      </div>
+      <PageHeader
+        title="Edit Client"
+        description="Update client information below."
+        variant="gradient"
+      />
       <HydrateClient>
         <ClientForm mode="edit" clientId={id} />
       </HydrateClient>