fix: improve dark mode compatibility and chart visibility

- Fix TopQuestionsChart with proper dark mode colors using CSS variables and shadcn/ui components
- Enhance ResponseTimeDistribution with thicker bars (maxBarSize: 60)
- Replace GeographicMap with dark/light mode compatible CartoDB tiles
- Add custom text selection background color with primary theme color
- Update all loading states to use proper CSS variables instead of hardcoded colors
- Fix dashboard layout background to use bg-background instead of bg-gray-100

app/providers.tsx

@@ -2,16 +2,24 @@
 
 import { SessionProvider } from "next-auth/react";
 import { ReactNode } from "react";
+import { ThemeProvider } from "@/components/theme-provider";
 
 export function Providers({ children }: { children: ReactNode }) {
   // Including error handling and refetch interval for better user experience
   return (
-    <SessionProvider
-      // Re-fetch session every 30 minutes (reduced from 10)
-      refetchInterval={30 * 60}
-      refetchOnWindowFocus={false}
+    <ThemeProvider
+      attribute="class"
+      defaultTheme="system"
+      enableSystem
+      disableTransitionOnChange
     >
-      {children}
-    </SessionProvider>
+      <SessionProvider
+        // Re-fetch session every 30 minutes (reduced from 10)
+        refetchInterval={30 * 60}
+        refetchOnWindowFocus={false}
+      >
+        {children}
+      </SessionProvider>
+    </ThemeProvider>
   );
 }