refactor(theme): organize imports and format components for consistency

- Reorganized imports in multiple files for better readability.
- Fixed formatting issues in `mode-toggle` and `settings` components to improve maintainability.

frontend/src/app/(dashboard)/settings/page.tsx

@@ -1,7 +1,15 @@
 "use client";
 
 import { zodResolver } from "@hookform/resolvers/zod";
-import { Loader2, Moon, Laptop, Palette, Save, Sun, User as UserIcon } from "lucide-react";
+import {
+	Laptop,
+	Loader2,
+	Moon,
+	Palette,
+	Save,
+	Sun,
+	User as UserIcon,
+} from "lucide-react";
 import { useTheme } from "next-themes";
 import * as React from "react";
 import { useForm } from "react-hook-form";
@@ -194,7 +202,7 @@ export default function SettingsPage() {
 					</Form>
 				</CardContent>
 			</Card>
-<Card className="mt-8">
+			<Card className="mt-8">
 				<CardHeader>
 					<div className="flex items-center gap-2">
 						<Palette className="h-5 w-5 text-primary" />