diff --git a/components/status/StatusTranslation.vue b/components/status/StatusTranslation.vue
index 56e022f6..a7667de8 100644
--- a/components/status/StatusTranslation.vue
+++ b/components/status/StatusTranslation.vue
@@ -27,7 +27,7 @@ const toggleTranslation = async () => {
   <div>
     <button
       v-if="isTranslationEnabled && status.language !== languageCode" pl-0 flex="~ center" gap-2
-      :disabled="translating" disabled-bg-transparent btn-text @click="toggleTranslation"
+      :disabled="translating" disabled-bg-transparent btn-text class="disabled-text-$c-text-btn-disabled-deeper" @click="toggleTranslation"
     >
       <span v-if="translating" block animate-spin preserve-3d>
         <span block i-ri:loader-2-fill />
diff --git a/styles/vars.css b/styles/vars.css
index ea82106a..a64555d7 100644
--- a/styles/vars.css
+++ b/styles/vars.css
@@ -19,6 +19,7 @@
 
   --c-bg-btn-disabled: #a1a1a1;
   --c-text-btn-disabled: #fff;
+  --c-text-btn-disabled-deeper: #a1a1a1;
   --c-text-btn: #232323;
 
   --c-success: #67C23A;