diff --git a/app/admin/login/page.tsx b/app/admin/login/page.tsx
index 849c2f1..1285f11 100644
--- a/app/admin/login/page.tsx
+++ b/app/admin/login/page.tsx
@@ -112,7 +112,7 @@ export default function AdminLogin() {
               <motion.div
                 initial={{ opacity: 0, y: -10 }}
                 animate={{ opacity: 1, y: 0 }}
-                className="bg-red-500/20 border border-red-500/50 rounded-lg p-3 text-red-200 text-sm"
+                className="bg-red-900/30 border border-red-800/60 rounded-lg p-3 text-red-100 text-sm"
               >
                 {error}
               </motion.div>
@@ -125,14 +125,14 @@ export default function AdminLogin() {
               </label>
               <div className="relative">
                 <div className="absolute inset-y-0 left-0 pl-3 flex items-center pointer-events-none">
-                  <User className="h-5 w-5 text-maritime-teal" />
+                  <User className="h-5 w-5 text-deep-sea-blue/60" />
                 </div>
                 <input
                   id="username"
                   type="text"
                   value={username}
                   onChange={(e) => setUsername(e.target.value)}
-                  className="w-full pl-10 pr-4 py-3 bg-white border border-light-gray-border rounded-lg text-deep-sea-blue placeholder-deep-sea-blue/40 focus:outline-none focus:ring-2 focus:ring-maritime-teal focus:border-maritime-teal transition-all"
+                  className="w-full pl-10 pr-4 py-3 bg-white border border-light-gray-border rounded-lg text-deep-sea-blue placeholder-deep-sea-blue/40 focus:outline-none focus:ring-2 focus:ring-deep-sea-blue/50 focus:border-deep-sea-blue transition-all"
                   placeholder="Enter your username"
                   required
                   disabled={isLoading}
@@ -147,14 +147,14 @@ export default function AdminLogin() {
               </label>
               <div className="relative">
                 <div className="absolute inset-y-0 left-0 pl-3 flex items-center pointer-events-none">
-                  <Lock className="h-5 w-5 text-maritime-teal" />
+                  <Lock className="h-5 w-5 text-deep-sea-blue/60" />
                 </div>
                 <input
                   id="password"
                   type="password"
                   value={password}
                   onChange={(e) => setPassword(e.target.value)}
-                  className="w-full pl-10 pr-4 py-3 bg-white border border-light-gray-border rounded-lg text-deep-sea-blue placeholder-deep-sea-blue/40 focus:outline-none focus:ring-2 focus:ring-maritime-teal focus:border-maritime-teal transition-all"
+                  className="w-full pl-10 pr-4 py-3 bg-white border border-light-gray-border rounded-lg text-deep-sea-blue placeholder-deep-sea-blue/40 focus:outline-none focus:ring-2 focus:ring-deep-sea-blue/50 focus:border-deep-sea-blue transition-all"
                   placeholder="Enter your password"
                   required
                   disabled={isLoading}
@@ -170,8 +170,8 @@ export default function AdminLogin() {
               whileTap={{ scale: isLoading ? 1 : 0.98 }}
               className={`w-full py-3 px-4 rounded-lg font-semibold text-white shadow-lg transition-all ${
                 isLoading
-                  ? 'bg-maritime-teal/50 cursor-not-allowed'
-                  : 'bg-gradient-to-r from-maritime-teal to-sea-green hover:from-sea-green hover:to-maritime-teal'
+                  ? 'bg-deep-sea-blue/50 cursor-not-allowed'
+                  : 'bg-deep-sea-blue hover:bg-deep-sea-blue/90'
               }`}
             >
               {isLoading ? (