Replace the "Live Chat" panel with a "VIP Progression" module with corresponding elements.

index.html

@@ -756,58 +756,51 @@
             <h3 class="font-bold mb-4 text-center">Rewards & Tournaments</h3>
             
             <div class="grid grid-cols-1 md:grid-cols-2 gap-4">
-                <!-- Live Chat -->
+                <!-- VIP Progression -->
                 <div class="glass-panel p-4 rounded-xl relative overflow-hidden vip-gradient-bg h-full">
-                    <div class="flex items-center justify-between mb-3">
-                        <h4 class="font-bold text-niogold">Live Chat</h4>
-                        <div class="flex items-center text-xs">
-                            <div class="w-2 h-2 bg-green-500 rounded-full mr-1 animate-pulse"></div>
-                            <span>12 Online</span>
+                    <div class="flex items-center mb-3">
+                        <div class="w-10 h-10 rounded-full bg-gradient-to-r from-niogold to-amber-200 flex items-center justify-center mr-2">
+                            <i class="fas fa-crown text-black"></i>
+                        </div>
+                        <div>
+                            <h4 class="font-bold text-niogold">VIP Status</h4>
+                            <p class="text-xs text-gray-400">Diamond Tier</p>
                         </div>
                     </div>
-                    
-                    <div class="h-40 mb-3 overflow-y-auto scroll-container">
-                        <div class="space-y-2">
-                            <div class="flex">
-                                <div class="w-8 h-8 rounded-full bg-gray-700 flex-shrink-0 flex items-center justify-center mr-2">
-                                    <i class="fas fa-user text-xs"></i>
-                                </div>
-                                <div>
-                                    <p class="text-xs font-semibold">BigWinner88 <span class="text-gray-400 ml-1">2:45 PM</span></p>
-                                    <p class="text-xs">Just hit the jackpot on Diamond Riches! 🎰💰</p>
-                                </div>
-                            </div>
-                            
-                            <div class="flex">
-                                <div class="w-8 h-8 rounded-full bg-gray-700 flex-shrink-0 flex items-center justify-center mr-2">
-                                    <i class="fas fa-user text-xs"></i>
-                                </div>
-                                <div>
-                                    <p class="text-xs font-semibold">LuckySpin99 <span class="text-gray-400 ml-1">2:47 PM</span></p>
-                                    <p class="text-xs">Congrats! I'm on a cold streak today 😅</p>
-                                </div>
-                            </div>
-                            
-                            <div class="flex">
-                                <div class="w-8 h-8 rounded-full bg-gradient-to-r from-niogold to-amber-200 flex-shrink-0 flex items-center justify-center mr-2">
-                                    <i class="fas fa-crown text-xs text-black"></i>
-                                </div>
-                                <div>
-                                    <p class="text-xs font-semibold text-niogold">Nioplay Support <span class="text-gray-400 ml-1">2:49 PM</span></p>
-                                    <p class="text-xs">Remember to check out our new game Fortune Tiger for a chance to win big! 🐯</p>
-                                </div>
-                            </div>
+
+                    <!-- VIP Progress Bar -->
+                    <div class="mb-4">
+                        <div class="flex justify-between text-xs mb-1">
+                            <span>Level 5</span>
+                            <span>2,150/5,000 points</span>
+                        </div>
+                        <div class="w-full bg-gray-700 rounded-full h-2">
+                            <div class="bg-gradient-to-r from-niogold to-amber-200 h-2 rounded-full" style="width: 43%"></div>
                         </div>
                     </div>
-                    
-                    <div class="relative">
-                        <input type="text" placeholder="Type your message..." class="w-full py-2 px-3 bg-nioglass rounded-full text-sm focus:outline-none focus:ring-1 focus:ring-niogold">
-                        <button class="absolute right-2 top-1/2 transform -translate-y-1/2 bg-gradient-to-r from-niogold to-amber-200 rounded-full w-6 h-6 flex items-center justify-center">
-                            <i class="fas fa-paper-plane text-xs text-black"></i>
-                        </button>
+
+                    <!-- VIP Benefits -->
+                    <div class="space-y-2 mb-3">
+                        <div class="flex items-center">
+                            <i class="fas fa-check-circle text-emerald-400 mr-2 text-xs"></i>
+                            <span class="text-xs">5% Cashback Boost</span>
+                        </div>
+                        <div class="flex items-center">
+                            <i class="fas fa-check-circle text-emerald-400 mr-2 text-xs"></i>
+                            <span class="text-xs">Personal Account Manager</span>
+                        </div>
+                        <div class="flex items-center">
+                            <i class="fas fa-check-circle text-emerald-400 mr-2 text-xs"></i>
+                            <span class="text-xs">Exclusive Bonuses</span>
+                        </div>
                     </div>
+
+                    <button class="w-full py-2 glass-panel rounded-full text-sm font-semibold glow-text hover:shadow-glow transition-all duration-300 flex items-center justify-center">
+                        <span class="relative z-10">VIEW VIP BENEFITS</span>
+                        <div class="absolute inset-0 rounded-full bg-gradient-to-r from-niogold/80 to-black-100/80 opacity-70 hover:opacity-100 transition-opacity duration-300"></div>
+                    </button>
                 </div>
-                <!-- Tournament Leaderboard -->
+<!-- Tournament Leaderboard -->
                 <div class="glass-panel p-4 rounded-xl relative overflow-hidden vip-gradient-bg" style="height: 100%;">
 <div class="flex justify-between items-center mb-3">
                         <h4 class="font-bold text-niogold">Mega Tournament</h4>