Redesign interface across member dashboard and events pages

The changes involve a comprehensive interface redesign across multiple
pages, including:

- Updated peer support badge with shield design
- Switched privacy toggle to use USwitch component
- Added light/dark mode support throughout
- Enhanced layout and spacing in default template
- Added series details page with timeline view
- Improved event cards and status indicators
- Refreshed member profile styles for better readability
- Introduced global cursor styling for interactive elements

app/pages/events/index.vue

@@ -8,7 +8,7 @@
     />
 
     <!-- Events Section with Tabs -->
-    <section class="py-20 bg-ghost-900 dark:bg-ghost-950">
+    <section class="bg-ghost-900 dark:bg-ghost-950">
       <UContainer>
         <UTabs
           v-model="activeTab"
@@ -138,10 +138,11 @@
       v-if="activeSeries.length > 0"
       class="space-y-6 max-w-6xl mx-auto mb-20"
     >
-      <div
+      <NuxtLink
         v-for="series in activeSeries.slice(0, 6)"
         :key="series.id"
-        class="bg-ghost-900 rounded-xl p-6 shadow-lg border border-ghost-700"
+        :to="`/series/${series.id}`"
+        class="block bg-ghost-900 rounded-xl p-6 shadow-lg border border-ghost-700 hover:border-purple-500 hover:shadow-xl transition-all duration-300"
       >
         <div class="flex items-start justify-between mb-4">
           <div
@@ -158,7 +159,9 @@
           </div>
         </div>
 
-        <h3 class="text-lg font-semibold text-ghost-100 mb-2">
+        <h3
+          class="text-lg font-semibold text-ghost-100 mb-2 hover:text-purple-400 transition-colors"
+        >
           {{ series.title }}
         </h3>
 
@@ -209,7 +212,7 @@
             {{ series.status }}
           </span>
         </div>
-      </div>
+      </NuxtLink>
     </div>
 
     <!-- Attend Our Events -->