feat: add form components and UI elements for enhanced user interaction

- Introduced Form, FormField, FormItem, FormLabel, FormControl, FormDescription, FormMessage components for structured form handling.
- Added Input, Textarea, and Select components for user input.
- Implemented Label and Separator components for better UI organization.
- Created Skeleton component for loading states.
- Developed Toast and Toaster components for user notifications.
- Integrated useToast hook for managing toast notifications.
- Established AI analysis functionality with analyzeJournalWithLocalAI.
- Set up Dexie for local database management with Journal and Task models.
- Configured Supabase client for server-side and browser-side interactions.
- Defined database schema for journals, tasks, chat sessions, and messages with Row Level Security policies.

Co-authored-by: Copilot <copilot@github.com>

tailwind.config.ts

@@ -1,7 +1,8 @@
 import type { Config } from "tailwindcss";
 
 const config: Config = {
-  content: ["./app/**/*.{js,ts,jsx,tsx,mdx}"],
+  darkMode: ["class"],
+  content: ["./app/**/*.{js,ts,jsx,tsx,mdx}", "./components/**/*.{js,ts,jsx,tsx,mdx}"],
   theme: {
     extend: {
       colors: {
@@ -11,13 +12,51 @@ const config: Config = {
         coral: "#d8644a",
         sun: "#e3aa38",
         sky: "#4f7fbf",
+        border: "var(--border)",
+        input: "var(--input)",
+        ring: "var(--ring)",
+        background: "var(--background)",
+        foreground: "var(--foreground)",
+        primary: {
+          DEFAULT: "var(--primary)",
+          foreground: "var(--primary-foreground)",
+        },
+        secondary: {
+          DEFAULT: "var(--secondary)",
+          foreground: "var(--secondary-foreground)",
+        },
+        destructive: {
+          DEFAULT: "var(--destructive)",
+          foreground: "var(--destructive-foreground)",
+        },
+        muted: {
+          DEFAULT: "var(--muted)",
+          foreground: "var(--muted-foreground)",
+        },
+        accent: {
+          DEFAULT: "var(--accent)",
+          foreground: "var(--accent-foreground)",
+        },
+        popover: {
+          DEFAULT: "var(--popover)",
+          foreground: "var(--popover-foreground)",
+        },
+        card: {
+          DEFAULT: "var(--card)",
+          foreground: "var(--card-foreground)",
+        },
+      },
+      borderRadius: {
+        lg: "var(--radius)",
+        md: "calc(var(--radius) - 2px)",
+        sm: "calc(var(--radius) - 4px)",
       },
       boxShadow: {
         soft: "0 18px 50px rgba(23, 33, 31, 0.08)",
       },
     },
   },
-  plugins: [],
+  plugins: [require("tailwindcss-animate")],
 };
 
 export default config;