feat: add global styles and transitions for dark mode support

- Created style.css for base styles and color variables for light and dark themes.
- Added tailwind.css for Tailwind CSS integration and custom theme variables.
- Introduced transitions.css to manage global transitions and reduce motion preferences.
- Updated tsconfig.app.json to include path aliases for easier imports.
- Modified tsconfig.json to set baseUrl and paths for module resolution.
- Added typed-router.d.ts for auto-generated route types.
- Enhanced vite.config.ts with Vue Router plugin, Tailwind CSS integration, and server proxy settings.

frontend/vite.config.ts

@@ -1,11 +1,34 @@
+import tailwindcss from "@tailwindcss/vite";
 import vue from "@vitejs/plugin-vue";
+import path from "node:path";
 import { defineConfig } from "vite";
+import vueDevTools from "vite-plugin-vue-devtools";
 import { VitePWA } from "vite-plugin-pwa";
+import VueRouter from "unplugin-vue-router/vite";
 
 // https://vite.dev/config/
+
 export default defineConfig({
   plugins: [
+    VueRouter(),
     vue(),
+    vueDevTools(),
+    tailwindcss(),
     VitePWA({ registerType: "autoUpdate", devOptions: { enabled: true } }),
   ],
+  resolve: {
+    alias: {
+      "@": path.resolve(__dirname, "./src"),
+    },
+  },
+  server: {
+    proxy: {
+      "/api": {
+        target: "http://localhost:3000", // Replace with your API server URL
+        changeOrigin: true,
+        rewrite: (path) => path.replace(/^\/api/, ""),
+      },
+    },
+    port: 3001, // Replace with your desired port
+  },
 });