Move permission badge and share button to list title line

- Created ListHeader component with permission and share on same line as title
- Permission badge and share button now appear to the right of the title
- Removed permission/share section from ListDetailView
- More compact header layout with better use of space

app/list/[id]/page.tsx

@@ -7,6 +7,7 @@ import Link from 'next/link'
 import { ArrowLeft } from 'lucide-react'
 import InlineItemCreate from '@/components/InlineItemCreate'
 import ListDetailView from '@/components/ListDetailView'
+import ListHeader from '@/components/ListHeader'
 
 export const dynamic = 'force-dynamic'
 export const revalidate = 0
@@ -36,27 +37,22 @@ export default async function ListDetailPage({ params }: { params: { id: string
   return (
     <main className="container mx-auto px-4 sm:px-6 py-6 sm:py-8 max-w-6xl">
       {/* Header */}
-      <div className="mb-6 sm:mb-8">
-        <Link 
-          href="/" 
-          className="inline-flex items-center gap-2 text-gray-600 hover:text-gray-900 active:text-black mb-4 transition-colors tap-target-sm text-sm sm:text-base"
-        >
-          <ArrowLeft size={20} className="flex-shrink-0" />
-          <span>Back to Lists</span>
-        </Link>
-        
-        <div className="flex items-center gap-2 sm:gap-3 mb-2">
-          <div 
-            className="w-5 h-5 sm:w-6 sm:h-6 rounded-full flex-shrink-0" 
-            style={{ backgroundColor: list.color }}
-          />
-          <h1 className="text-2xl sm:text-3xl lg:text-4xl font-bold text-gray-900 truncate">{list.title}</h1>
-        </div>
-        
-        <p className="text-gray-600 text-sm sm:text-base">
-          {completedItems.length} of {list.items.length} tasks completed
-        </p>
-      </div>
+      <ListHeader
+        listId={list.id}
+        listTitle={list.title}
+        listColor={list.color}
+        completedCount={completedItems.length}
+        totalCount={list.items.length}
+        permission={permission}
+        canShare={canShare}
+        ownerId={list.ownerId}
+        ownerName={list.owner?.name}
+        ownerEmail={list.owner?.email || ''}
+        collaborators={list.collaborators.map(c => ({
+          ...c,
+          permission: c.permission as 'editor' | 'viewer'
+        }))}
+      />
 
       {/* Inline Item Creation - only show if user can edit */}
       {canEdit && (