diff --git a/src/components/Admin/AdminRoute.js b/src/components/Admin/AdminRoute.js
index 84da411..f22bfe1 100644
--- a/src/components/Admin/AdminRoute.js
+++ b/src/components/Admin/AdminRoute.js
@@ -1,13 +1,14 @@
 // src/components/Admin/AdminRoute.jsx
 import React, { useState, useEffect } from 'react';
-import { Navigate } from 'react-router-dom';
 import { supabase } from '../../lib/supabase';
 import AdminPanel from './AdminPanel';
 
-// This component protects the admin route by checking authentication
 const AdminRoute = () => {
   const [isAuthenticated, setIsAuthenticated] = useState(null);
   const [isLoading, setIsLoading] = useState(true);
+  const [email, setEmail] = useState('');
+  const [password, setPassword] = useState('');
+  const [authError, setAuthError] = useState(null);
 
   useEffect(() => {
     const checkAuth = async () => {
@@ -36,6 +37,28 @@ const AdminRoute = () => {
     };
   }, []);
 
+  const handleLogin = async (e) => {
+    e.preventDefault();
+    setIsLoading(true);
+    setAuthError(null);
+    
+    try {
+      const { data, error } = await supabase.auth.signInWithPassword({
+        email,
+        password
+      });
+      
+      if (error) throw error;
+      
+      setIsAuthenticated(true);
+    } catch (error) {
+      console.error('Error logging in:', error);
+      setAuthError(error.message);
+    } finally {
+      setIsLoading(false);
+    }
+  };
+
   if (isLoading) {
     return (
       <div className="admin-loading">
@@ -45,9 +68,39 @@ const AdminRoute = () => {
     );
   }
 
-  // If not authenticated, redirect to home page
-  if (isAuthenticated === false) {
-    return <Navigate to="/" replace />;
+  // If not authenticated, show login form
+  if (!isAuthenticated) {
+    return (
+      <div className="admin-login-container">
+        <div className="admin-login-card">
+          <h2>Admin Login</h2>
+          {authError && <div className="auth-error">{authError}</div>}
+          <form onSubmit={handleLogin}>
+            <div className="form-group">
+              <label htmlFor="email">Email</label>
+              <input
+                type="email"
+                id="email"
+                value={email}
+                onChange={(e) => setEmail(e.target.value)}
+                required
+              />
+            </div>
+            <div className="form-group">
+              <label htmlFor="password">Password</label>
+              <input
+                type="password"
+                id="password"
+                value={password}
+                onChange={(e) => setPassword(e.target.value)}
+                required
+              />
+            </div>
+            <button type="submit" className="login-button">Login</button>
+          </form>
+        </div>
+      </div>
+    );
   }
 
   // If authenticated, render the admin panel