add daily login perks underneath "Login streak: 4 days" - Follow Up Deployment

index.html

@@ -304,8 +304,8 @@
     <!-- Navbar -->
     <header class="fixed top-0 left-0 right-0 z-50 flex justify-between items-center px-4 py-3 glass-panel">
         <div class="flex items-center">
-            <div class="w-10 h-10 flex items-center justify-center bg-niopurple rounded-full">
-                <span class="text-xl font-bold text-niogold">N</span>
+            <div class="w-10 h-10 flex items-center justify-center bg-niogold rounded-full">
+                <span class="text-xl font-bold text-white">N</span>
             </div>
             <span class="ml-2 text-xl font-bold text-niogold">Nioplay</span>
         </div>
@@ -399,7 +399,11 @@
             <div class="absolute bottom-0 left-0 right-0 p-4">
                 <h2 class="text-2xl font-bold glow-text">NEW: Diamond Riches Megaways™</h2>
                 <p class="text-sm mb-3">Unlock unlimited ways to win with cascading symbols!</p>
-                <button class="px-6 py-2 bg-gradient-to-r from-niogold to-niopurple rounded-full text-sm font-semibold pulse">PLAY NOW</button>
+                <button class="px-6 py-2 glass-panel rounded-full text-sm font-semibold glow-text hover:shadow-glow transition-all duration-300 flex items-center">
+                    <span class="relative z-10">PLAY NOW</span>
+                    <i class="fas fa-play ml-2 text-xs relative z-10"></i>
+                    <div class="absolute inset-0 rounded-full bg-gradient-to-r from-niogold/80 to-niopurple/80 opacity-70 hover:opacity-100 transition-opacity duration-300"></div>
+                </button>
             </div>
         </div>
         
@@ -443,7 +447,10 @@
                         <h3 class="font-bold">Flash Offer</h3>
                     </div>
                     <p class="text-sm mb-3">200% bonus + 50 free spins on first deposit!</p>
-                    <button class="px-4 py-1.5 bg-gradient-to-r from-red-500 to-pink-600 rounded-full text-xs font-semibold">CLAIM NOW</button>
+                    <button class="px-4 py-1.5 glass-panel rounded-full text-xs font-semibold glow-text hover:shadow-glow transition-all duration-300 flex items-center">
+                        <span class="relative z-10">CLAIM NOW</span>
+                        <div class="absolute inset-0 rounded-full bg-gradient-to-r from-red-500/80 to-pink-600/80 opacity-70 hover:opacity-100 transition-opacity duration-300"></div>
+                    </button>
                 </div>
             </div>
         </div>
@@ -687,6 +694,32 @@
                         <i class="fas fa-check-circle text-green-500 mr-2"></i>
                         <p>Login streak: 4 days</p>
                     </div>
+                    <div class="mt-3">
+                        <div class="flex justify-between text-xs mb-1">
+                            <span>Day 1: 10 Free Spins</span>
+                            <span class="text-niogold">Claimed</span>
+                        </div>
+                        <div class="flex justify-between text-xs mb-1">
+                            <span>Day 2: 25 Free Spins</span>
+                            <span class="text-niogold">Claimed</span>
+                        </div>
+                        <div class="flex justify-between text-xs mb-1">
+                            <span>Day 3: 50 Free Spins</span>
+                            <span class="text-niogold">Claimed</span>
+                        </div>
+                        <div class="flex justify-between text-xs mb-1">
+                            <span>Day 4: 100 Free Spins</span>
+                            <span class="text-niogold">Claimed</span>
+                        </div>
+                        <div class="flex justify-between text-xs mb-1">
+                            <span>Day 5: 200 Free Spins + $5 Bonus</span>
+                            <span class="text-gray-400">Available in 1 day</span>
+                        </div>
+                        <div class="flex justify-between text-xs">
+                            <span>Day 6: 300 Free Spins + $10 Bonus</span>
+                            <span class="text-gray-400">Available in 2 days</span>
+                        </div>
+                    </div>
                 </div>
                 
                 <!-- Tournament Leaderboard -->
@@ -839,8 +872,10 @@
             </div>
             
             <div class="flex justify-center mt-4">
-                <button class="px-3 py-1 bg-gradient-to-r from-niogold to-amber-100 rounded-full text-xs font-semibold text-gray-900 flex items-center">
-                    <i class="fas fa-th-large mr-1 text-xs"></i> View All
+                <button class="px-3 py-1 glass-panel rounded-full text-xs font-semibold glow-text hover:shadow-glow transition-all duration-300 flex items-center">
+                    <i class="fas fa-th-large mr-1 text-xs relative z-10"></i>
+                    <span class="relative z-10">View All</span>
+                    <div class="absolute inset-0 rounded-full bg-gradient-to-r from-niogold/80 to-amber-100/80 opacity-70 hover:opacity-100 transition-opacity duration-300"></div>
                 </button>
             </div>
         </div>
@@ -851,12 +886,30 @@
                 <h3 class="font-bold text-xl mr-4">Featured Games</h3>
                 <div class="flex-1 scroll-container overflow-x-auto pb-2">
                     <div class="flex space-x-2" style="min-width: max-content;">
-                        <button class="category-btn active px-4 py-2 rounded-full text-sm">Slots</button>
-                        <button class="category-btn glass-panel px-4 py-2 rounded-full text-sm">Live Casino</button>
-                        <button class="category-btn glass-panel px-4 py-2 rounded-full text-sm">Table Games</button>
-                        <button class="category-btn glass-panel px-4 py-2 rounded-full text-sm">Jackpots</button>
-                        <button class="category-btn glass-panel px-4 py-2 rounded-full text-sm">New Games</button>
-                        <button class="category-btn glass-panel px-4 py-2 rounded-full text-sm">Popular</button>
+                        <button class="category-btn active px-4 py-2 rounded-full text-sm glow-text hover:shadow-glow transition-all duration-300 relative overflow-hidden">
+                            <span class="relative z-10">Slots</span>
+                            <div class="absolute inset-0 rounded-full bg-gradient-to-r from-niogold/80 to-niopurple/80"></div>
+                        </button>
+                        <button class="category-btn glass-panel px-4 py-2 rounded-full text-sm hover:shadow-glow transition-all duration-300 relative overflow-hidden">
+                            <span class="relative z-10">Live Casino</span>
+                            <div class="absolute inset-0 rounded-full bg-gray-800/50 hover:bg-gray-800/70 transition-all duration-300"></div>
+                        </button>
+                        <button class="category-btn glass-panel px-4 py-2 rounded-full text-sm hover:shadow-glow transition-all duration-300 relative overflow-hidden">
+                            <span class="relative z-10">Table Games</span>
+                            <div class="absolute inset-0 rounded-full bg-gray-800/50 hover:bg-gray-800/70 transition-all duration-300"></div>
+                        </button>
+                        <button class="category-btn glass-panel px-4 py-2 rounded-full text-sm hover:shadow-glow transition-all duration-300 relative overflow-hidden">
+                            <span class="relative z-10">Jackpots</span>
+                            <div class="absolute inset-0 rounded-full bg-gray-800/50 hover:bg-gray-800/70 transition-all duration-300"></div>
+                        </button>
+                        <button class="category-btn glass-panel px-4 py-2 rounded-full text-sm hover:shadow-glow transition-all duration-300 relative overflow-hidden">
+                            <span class="relative z-10">New Games</span>
+                            <div class="absolute inset-0 rounded-full bg-gray-800/50 hover:bg-gray-800/70 transition-all duration-300"></div>
+                        </button>
+                        <button class="category-btn glass-panel px-4 py-2 rounded-full text-sm hover:shadow-glow transition-all duration-300 relative overflow-hidden">
+                            <span class="relative z-10">Popular</span>
+                            <div class="absolute inset-0 rounded-full bg-gray-800/50 hover:bg-gray-800/70 transition-all duration-300"></div>
+                        </button>
                     </div>
                 </div>
             </div>
@@ -876,7 +929,10 @@
                                     <div class="text-xs">
                                         <i class="fas fa-star text-amber-300"></i> 4.8
                                     </div>
-                                    <button class="px-3 py-1 bg-gradient-to-r from-niogold to-amber-100 text-xs rounded-full font-semibold">PLAY</button>
+                                    <button class="px-3 py-1 glass-panel text-xs rounded-full font-semibold glow-text hover:shadow-glow transition-all duration-300 flex items-center justify-center">
+                                        <span class="relative z-10">PLAY</span>
+                                        <div class="absolute inset-0 rounded-full bg-gradient-to-r from-niogold/80 to-amber-100/80 opacity-70 hover:opacity-100 transition-opacity duration-300"></div>
+                                    </button>
                                 </div>
                             </div>
                         </div>