feat: reposition ThemeSwitcher component in Header and enhance button styling

src/app/components/Header/index.tsx

@@ -35,7 +35,6 @@ export const Header = () => {
 		<Navbar className="mb-2">
 			<NavbarBrand>
 				<p className="font-bold text-inherit">Toogether</p>
-				<ThemeSwitcher />
 			</NavbarBrand>
 			<NavbarContent as="div" justify="end">
 				<Dropdown placement="bottom-end">
@@ -66,6 +65,7 @@ export const Header = () => {
 						</DropdownItem>
 					</DropdownMenu>
 				</Dropdown>
+				<ThemeSwitcher />
 			</NavbarContent>
 		</Navbar>
 	);

src/app/components/ThemeSwitcher/ThemeSwitcher.tsx

@@ -14,7 +14,7 @@ export const ThemeSwitcher = () => {
 
 	return (
 		<button
-			className={`fixed bottom-4 right-4 rounded-lg ${theme === "light" ? "bg-black" : "bg-white"
+			className={`backdrop-blur-sm rounded-lg ${theme === "light" ? "bg-black/10" : "bg-white/10"
 				} p-2`}
 			onClick={() => setTheme(theme === "light" ? "dark" : "light")}
 		>