diff --git a/resources/scripts/customer/layouts/LayoutBasic.vue b/resources/scripts/customer/layouts/LayoutBasic.vue
index e37005b7..9bffa5d1 100644
--- a/resources/scripts/customer/layouts/LayoutBasic.vue
+++ b/resources/scripts/customer/layouts/LayoutBasic.vue
@@ -6,7 +6,7 @@
 
     <!-- <SiteSidebar /> -->
 
-    <main class="mt-16 pb-16 h-screen overflow-y-auto min-h-0">
+    <main class="h-screen min-h-0 pb-16 mt-16 overflow-y-auto">
       <router-view />
     </main>
   </div>
diff --git a/resources/scripts/customer/layouts/LayoutLogin.vue b/resources/scripts/customer/layouts/LayoutLogin.vue
index 5ff1ae34..61286d3c 100644
--- a/resources/scripts/customer/layouts/LayoutLogin.vue
+++ b/resources/scripts/customer/layouts/LayoutLogin.vue
@@ -1,31 +1,24 @@
 <template>
   <div
-    class="
-      min-h-screen
-      bg-gray-200
-      flex flex-col
-      justify-center
-      py-12
-      sm:px-6
-      lg:px-8
-    "
+    class="flex flex-col justify-center h-full min-h-screen py-12 overflow-hidden bg-gray-100 sm:px-6 lg:px-8 dark:bg-gray-800/80 dark:text-white font-base "
   >
     <NotificationRoot />
 
-    <div class="sm:mx-auto sm:w-full sm:max-w-md px-4 sm:px-0">
+    <div class="px-4 sm:mx-auto sm:w-full sm:max-w-md sm:px-0">
       <MainLogo
         v-if="!customerLogo"
-        class="block w-48 h-auto max-w-full text-primary-400 mx-auto"
+        class="block w-48 h-auto max-w-full mx-auto text-primary-400"
       />
       <img
         v-else
         :src="customerLogo"
-        class="block w-48 h-auto max-w-full text-primary-400 mx-auto"
+        class="block w-48 h-auto max-w-full mx-auto text-primary-400"
       />
     </div>
 
-    <div class="mt-8 sm:mx-auto sm:w-full sm:max-w-md px-4 sm:px-0">
-      <div class="bg-white py-8 px-4 shadow rounded-lg sm:px-10">
+    <div class="px-4 mt-8 sm:mx-auto sm:w-full sm:max-w-md sm:px-0">
+      <div class="px-4 py-8 bg-white rounded-lg shadow sm:px-10 dark:from-gray-700/70 dark:to-gray-800/70 dark:bg-transparent dark:backdrop-blur-xl dark:shadow-glass dark:border dark:border-white/10">
+      <BaseDarkHighlight/>
         <router-view />
       </div>
     </div>