diff --git a/src/routes/+layout.svelte b/src/routes/+layout.svelte
index f836b9fb..eaf30f84 100644
--- a/src/routes/+layout.svelte
+++ b/src/routes/+layout.svelte
@@ -544,8 +544,8 @@ $effect(() => {
 
 {#if (browser && $ae_loc && $ae_sess && ($ae_loc.ver != $ae_sess.ver))}
     <div class="flex flex-col items-center justify-center h-full max-w-lg mx-auto space-y-4">
-        <h1 class="text-4xl font-bold text-red-500">New Version Available</h1>
-        <p class="text-lg text-center text-gray-500">A new version of the site is available. Please reload the page.</p>
+        <h1 class="text-4xl font-bold text-red-600 dark:text-red-400">New Version Available</h1>
+        <p class="text-lg text-center text-gray-800 dark:text-gray-200">A new version of the site is available. Please reload the page.</p>
         <button
             type="button"
             onclick={() => {
@@ -631,7 +631,7 @@ $effect(() => {
                 // window.location.reload(true);
                 window.location.reload();
             }}
-            class="btn btn-sm m-1 variant-glass-surface hover:variant-outline-warning hover:variant-glass-warning text-error-400 hover:text-error-800 transition-all"
+            class="btn btn-sm m-1 variant-ghost-surface hover:variant-ghost-warning hover:variant-outline-warning text-error-600 hover:text-error-900 transition-all"
             title="Reload and clear the page cache"
             >
             <span class="fas fa-sync mx-1"></span>