Add padding to the bottom of main content areas

Add `pb-24` class to `main` elements in various pages to provide adequate spacing between content and the bottom navigation bar.

Replit-Commit-Author: Agent
Replit-Commit-Session-Id: 0fb68265-c270-4198-9584-3d9be9bddb41
Replit-Commit-Checkpoint-Type: full_checkpoint
Replit-Commit-Screenshot-Url: https://storage.googleapis.com/screenshot-production-us-central1/3df548ff-50ae-432f-9be4-25d34eccc983/0fb68265-c270-4198-9584-3d9be9bddb41/hntn6cC

.replit

@@ -26,6 +26,10 @@ externalPort = 3001
 localPort = 38387
 externalPort = 3003
 
+[[ports]]
+localPort = 42967
+externalPort = 4200
+
 [[ports]]
 localPort = 43349
 externalPort = 3000

client/src/pages/AdminDashboard.tsx

@@ -188,7 +188,7 @@ export default function AdminDashboard() {
         </div>
       </header>
 
-      <main className="flex-1 max-w-7xl mx-auto px-4 py-4 w-full">
+      <main className="flex-1 max-w-7xl mx-auto px-4 py-4 pb-24 w-full">
         {outletsLoading ? (
           <div className="grid grid-cols-1 md:grid-cols-2 lg:grid-cols-3 xl:grid-cols-4 gap-4">
             {Array.from({ length: 12 }).map((_, i) => (

client/src/pages/Article.tsx

@@ -125,7 +125,7 @@ export default function Article() {
           </div>
         </header>
 
-        <main className="max-w-7xl mx-auto px-6 py-8">
+        <main className="max-w-7xl mx-auto px-6 py-8 pb-24">
           <div className="animate-pulse">
             <div className="h-8 bg-gray-300 rounded mb-4 w-3/4"></div>
             <div className="h-4 bg-gray-300 rounded mb-6 w-1/2"></div>
@@ -171,7 +171,7 @@ export default function Article() {
         </div>
       </header>
 
-      <main className="max-w-7xl mx-auto px-6 py-12">
+      <main className="max-w-7xl mx-auto px-6 py-12 pb-24">
         {/* Article Content */}
         <article className="mb-16 max-w-4xl mx-auto">
           <header className="mb-8">

client/src/pages/AuctionGuide.tsx

@@ -59,7 +59,7 @@ export default function AuctionGuide() {
         </div>
       </header>
 
-      <main className="px-6 py-6 w-full">
+      <main className="px-6 py-6 pb-24 w-full">
         {/* Header Section */}
         <div className="mb-4">
           <h1 className="text-2xl font-bold mb-1" data-testid="text-guide-title">

client/src/pages/Auctions.tsx

@@ -409,7 +409,7 @@ export default function Auctions() {
         </div>
       </header>
 
-      <main className="flex-1 px-6 py-3 w-full">
+      <main className="flex-1 px-6 py-3 pb-24 w-full">
         {/* Auction Explanation */}
         <div className="mb-4">
           <Card>

client/src/pages/MediaOutlet.tsx

@@ -339,7 +339,7 @@ export default function MediaOutlet() {
         </div>
       </header>
 
-      <main className="flex-1 max-w-7xl mx-auto px-6 py-4 w-full">
+      <main className="flex-1 max-w-7xl mx-auto px-6 py-4 pb-24 w-full">
         {/* Outlet Header */}
         <div className="mb-4">
           <div className="flex items-start space-x-4 mb-3">

client/src/pages/MediaOutletAuction.tsx

@@ -176,7 +176,7 @@ export default function MediaOutletAuction() {
           </div>
         </header>
 
-        <main className="max-w-4xl mx-auto px-6 py-8">
+        <main className="max-w-4xl mx-auto px-6 py-8 pb-24">
           <div className="text-center">
             <h1 className="text-2xl font-bold mb-2">진행 중인 경매가 없습니다</h1>
             <p className="text-muted-foreground mb-4">
@@ -216,7 +216,7 @@ export default function MediaOutletAuction() {
         </div>
       </header>
 
-      <main className="max-w-4xl mx-auto px-6 py-8">
+      <main className="max-w-4xl mx-auto px-6 py-8 pb-24">
         {/* Outlet Header */}
         <div className="mb-8">
           <div className="flex items-start space-x-6 mb-6">

client/src/pages/Report.tsx

@@ -39,7 +39,7 @@ export default function Report() {
       </header>
 
       {/* Main Content */}
-      <main className="flex-1 max-w-7xl mx-auto px-4 py-8 w-full">
+      <main className="flex-1 max-w-7xl mx-auto px-4 py-8 pb-24 w-full">
         <Tabs defaultValue="report" className="w-full">
           <TabsList className="grid w-full max-w-md mx-auto grid-cols-2 mb-8">
             <TabsTrigger value="report" data-testid="tab-report">

client/src/pages/SuperAdminDashboard.tsx

@@ -140,7 +140,7 @@ export default function SuperAdminDashboard() {
         </div>
       </header>
 
-      <main className="max-w-7xl mx-auto px-6 py-8">
+      <main className="max-w-7xl mx-auto px-6 py-8 pb-24">
         <div className="flex items-center justify-between mb-8">
           <div>
             <h1 className="text-3xl font-bold">Super Admin Dashboard</h1>