Add admin analytics trend views

src/components/common/StatCard.vue

@@ -1,6 +1,12 @@
 <template>
-  <div class="p-6 rounded-lg shadow-md transition-colors duration-300"
-    :class="[isDarkMode ? 'bg-gray-800 bg-opacity-70' : 'bg-white']">
+  <div
+    class="group rounded-lg p-6 shadow-md transition-all duration-300 hover:-translate-y-0.5 hover:shadow-lg"
+    :class="[
+      isDarkMode
+        ? 'bg-gray-800/70 hover:bg-gray-800 hover:shadow-black/20'
+        : 'bg-white hover:shadow-gray-200/80'
+    ]"
+  >
     <div class="flex items-center justify-between">
       <div>
         <p class="text-sm" :class="[isDarkMode ? 'text-gray-400' : 'text-gray-600']">
@@ -10,7 +16,10 @@
           {{ value }}
         </h3>
       </div>
-      <div class="p-3 rounded-full" :class="iconBgClass">
+      <div
+        class="rounded-full p-3 transition-transform duration-300 group-hover:scale-105"
+        :class="iconBgClass"
+      >
         <component :is="icon" class="w-6 h-6" :class="iconClass" />
       </div>
     </div>