diff --git a/src/routes/+layout.svelte b/src/routes/+layout.svelte
index ea152e2..c3bace0 100644
--- a/src/routes/+layout.svelte
+++ b/src/routes/+layout.svelte
@@ -1,8 +1,5 @@
 <script lang="ts">
-	import { useThemeMode } from '$lib/theme-mode';
 	import '../app.css';
-
-	useThemeMode();
 </script>
 
 <slot></slot>
diff --git a/src/routes/+layout.ts b/src/routes/+layout.ts
index 9cde7a6..98d9ef4 100644
--- a/src/routes/+layout.ts
+++ b/src/routes/+layout.ts
@@ -1,11 +1,17 @@
+import { browser } from '$app/environment';
 import { loadTranslations } from '$lib/i18n';
+import { themeMode } from '$lib/theme-mode';
 
 export const load = async ({ url }) => {
-  const { pathname } = url;
+	const { pathname } = url;
 
-  const initLocale = 'en'; // get from cookie, user session, ...
+	const initLocale = 'en'; // get from cookie, user session, ...
 
-  await loadTranslations(initLocale, pathname);
+	if (browser) {
+		themeMode.subscribe((value) => document.documentElement.setAttribute('theme-base', value));
+	}
 
-  return {};
-}
+	await loadTranslations(initLocale, pathname);
+
+	return {};
+};
diff --git a/src/routes/device/+page.svelte b/src/routes/device/+page.svelte
index 88b860e..89bf1e9 100644
--- a/src/routes/device/+page.svelte
+++ b/src/routes/device/+page.svelte
@@ -2,6 +2,7 @@
 	import type { ActionData, PageData } from './$types';
 	import { env } from '$env/dynamic/public';
 	import { t } from '$lib/i18n';
+	import { enhance } from '$app/forms';
 	import Alert from '$lib/components/Alert.svelte';
 	import Button from '$lib/components/Button.svelte';
 	import MainContainer from '$lib/components/container/MainContainer.svelte';
@@ -36,13 +37,13 @@
 		<OAuth2ScopesCard client={form.client} />
 
 		<div class="decision">
-			<form action="" method="POST">
+			<form action="" method="POST" use:enhance>
 				<input type="hidden" value={form.code} name="code" />
 				<input type="hidden" value="1" name="decision" />
 				<Button type="submit" variant="primary">{$t('oauth2.authorize.authorize')}</Button>
 			</form>
 
-			<form action="" method="POST">
+			<form action="" method="POST" use:enhance>
 				<input type="hidden" value={form.code} name="code" />
 				<input type="hidden" value="0" name="decision" />
 				<Button type="submit" variant="link">{$t('oauth2.authorize.reject')}</Button>
@@ -54,9 +55,9 @@
 		<h2 class="title">{$t('oauth2.device.title')}</h2>
 		<p>{$t('oauth2.device.description')}</p>
 
-		<form action="" method="POST">
+		<form action="" method="POST" use:enhance>
 			<FormWrapper>
-				<FormErrors errors={form?.errors} prefix="oauth2.errors" />
+				<FormErrors errors={form?.errors || []} prefix="oauth2.errors" />
 				<FormControl>
 					<label for="form-code">{$t('oauth2.device.deviceCode')}</label>
 					<input type="text" autocomplete="off" name="code" id="form-code" />