add a customer service icon for the left side navigation bar - Follow Up Deployment

index.html

@@ -193,6 +193,17 @@
             50% { text-shadow: 0 0 15px rgba(212, 175, 55, 0.8); }
             100% { text-shadow: 0 0 5px rgba(212, 175, 55, 0.8); }
         }
+
+        @keyframes providerBounce {
+            0%, 100% { 
+                transform: translateY(0) scale(1); 
+                color: #9CA3AF;
+            }
+            50% { 
+                transform: translateY(-5px) scale(1.1); 
+                color: #D4AF37;
+            }
+        }
         
         .vip-gradient-bg {
             background: linear-gradient(to right, #1A1A1A, #2D1420, #1A1A1A);
@@ -404,6 +415,14 @@
                 <i class="fas fa-wallet text-xl group-hover:animate-[iconBounce_0.5s_ease-in-out]"></i>
                 <span class="absolute left-16 bg-black text-white text-xs px-2 py-1 rounded opacity-0 group-hover:opacity-100 transition-opacity">Wallet</span>
             </a>
+            <a href="#" class="w-12 h-12 flex items-center justify-center glass-panel rounded-xl text-niogold hover:bg-opacity-100 transition-all group">
+                <i class="fas fa-question-circle text-xl group-hover:animate-[iconBounce_0.5s_ease-in-out]"></i>
+                <span class="absolute left-16 bg-black text-white text-xs px-2 py-1 rounded opacity-0 group-hover:opacity-100 transition-opacity">FAQ</span>
+            </a>
+            <a href="#" class="w-12 h-12 flex items-center justify-center glass-panel rounded-xl text-niogold hover:bg-opacity-100 transition-all group">
+                <i class="fas fa-headset text-xl group-hover:animate-[iconBounce_0.5s_ease-in-out]"></i>
+                <span class="absolute left-16 bg-black text-white text-xs px-2 py-1 rounded opacity-0 group-hover:opacity-100 transition-opacity">Support</span>
+            </a>
         </div>
     </div>
     
@@ -525,7 +544,7 @@
         <div class="glass-panel px-3 py-4 rounded-xl mb-6">
             <div class="flex items-center mb-3">
                 <div class="w-3 h-6 bg-gradient-to-r from-niogold to-amber-200 rounded mr-2"></div>
-                <h3 class="font-bold">Live Games</h3>
+                <h3 class="font-bold">Recent Games</h3>
                 <span class="ml-2 text-red-500 flex items-center">
                     <span class="w-2 h-2 bg-red-500 rounded-full mr-1 animate-pulse"></span> LIVE
                 </span>
@@ -785,14 +804,14 @@
                 <div class="marquee-container overflow-hidden">
                     <div class="marquee flex space-x-4 py-2">
                         <!-- Provider Logos with simple gray icons -->
-                        <div class="flex-shrink-0 flex flex-col items-center px-4">
-                            <i class="fas fa-dice text-gray-400 text-xl mb-1"></i>
-                            <span class="text-xs text-gray-300">Pragmatic</span>
+                        <div class="flex-shrink-0 flex flex-col items-center px-4 group">
+                            <i class="fas fa-dice text-gray-400 text-xl mb-1 group-hover:animate-[providerBounce_0.5s_ease-in-out]"></i>
+                            <span class="text-xs text-gray-300 group-hover:text-niogold transition-colors">Pragmatic</span>
                         </div>
                         
-                        <div class="flex-shrink-0 flex flex-col items-center px-4">
-                            <i class="fas fa-chess-queen text-gray-400 text-xl mb-1"></i>
-                            <span class="text-xs text-gray-300">Playtech</span>
+                        <div class="flex-shrink-0 flex flex-col items-center px-4 group">
+                            <i class="fas fa-chess-queen text-gray-400 text-xl mb-1 group-hover:animate-[providerBounce_0.5s_ease-in-out]"></i>
+                            <span class="text-xs text-gray-300 group-hover:text-niogold transition-colors">Playtech</span>
                         </div>
                         
                         <div class="flex-shrink-0 flex flex-col items-center px-4">