diff --git a/addons/mass_mailing/static/src/scss/themes/theme_basic.scss b/addons/mass_mailing/static/src/scss/themes/theme_basic.scss
index 00f3a6304bc..d65ea077f5f 100644
--- a/addons/mass_mailing/static/src/scss/themes/theme_basic.scss
+++ b/addons/mass_mailing/static/src/scss/themes/theme_basic.scss
@@ -1,3 +1,32 @@
+
+// TODO remove in master
+// Themes scss have to use bg-variant and text-emphasis-variant mixins of BS4
+// to properly work. That use was introduced as a fix in 12.0... but the BS4
+// mixins are unavailable in the mailing assets. As a stable fix cannot
+// introduce static code which requires an XML update to not crash, the mixins
+// were duplicated here instead.
+@mixin bg-variant($parent, $color) {
+    #{$parent} {
+        background-color: $color !important;
+    }
+    a#{$parent},
+    button#{$parent} {
+        &:hover, &:focus {
+            background-color: darken($color, 10%) !important;
+        }
+    }
+}
+@mixin text-emphasis-variant($parent, $color) {
+    #{$parent} {
+        color: $color !important;
+    }
+    a#{$parent} {
+        &:hover, &:focus {
+            color: darken($color, 10%) !important;
+        }
+    }
+}
+
 // ============================
 // Mass Mailing "Theme Basic"
 // ============================
diff --git a/addons/mass_mailing/static/src/scss/themes/theme_default.scss b/addons/mass_mailing/static/src/scss/themes/theme_default.scss
index 2fcc5bf2915..a2443fa01db 100644
--- a/addons/mass_mailing/static/src/scss/themes/theme_default.scss
+++ b/addons/mass_mailing/static/src/scss/themes/theme_default.scss
@@ -23,19 +23,10 @@ $o-mm-def-btn-bg        : $o-mm-def-color-gamma;
 $o-mm-def-btn-text      : $o-mm-def-color-beta;
 
 // ===== Colors =====
-.bg-beta {
-    background-color: $o-mm-def-color-zeta;
-    color:  $o-mm-def-color-beta;
-}
-.text-beta {
-    color: $o-mm-def-color-zeta;
-}
-.bg-delta {
-    background-color: $o-mm-def-color-eta;
-}
-.bg-gray-lighter {
-    background-color: $o-mm-def-color-alpha;
-}
+@include bg-variant(".bg-beta", $o-mm-def-color-zeta);
+@include text-emphasis-variant(".text-beta", $o-mm-def-color-zeta);
+@include bg-variant(".bg-delta", $o-mm-def-color-eta);
+@include bg-variant(".bg-gray-lighter", $o-mm-def-color-alpha);
 
 td {
     // Default browser style but needed so that alignment works on some mail