diff --git a/backend/app/assets/stylesheets/spree/backend/components/_navigation.scss b/backend/app/assets/stylesheets/spree/backend/components/_navigation.scss
index f8f7809a813..91abe39158f 100644
--- a/backend/app/assets/stylesheets/spree/backend/components/_navigation.scss
+++ b/backend/app/assets/stylesheets/spree/backend/components/_navigation.scss
@@ -119,7 +119,7 @@ nav.menu {
     &:before {
       position: absolute;
       left: 1em;
-      @include transform(translateX(-50%));
+      transform: translateX(-50%);
     }
   }
 
diff --git a/backend/app/assets/stylesheets/spree/backend/components/_progress.scss b/backend/app/assets/stylesheets/spree/backend/components/_progress.scss
index e861d846097..d5869d7ac86 100644
--- a/backend/app/assets/stylesheets/spree/backend/components/_progress.scss
+++ b/backend/app/assets/stylesheets/spree/backend/components/_progress.scss
@@ -6,7 +6,7 @@
   bottom: 0;
   z-index: 1000;
   opacity: 0.8;
-  @include calc(width, "100% - #{$width-sidebar}");
+  width: calc(100% - #{$width-sidebar});
 
   .wrapper {
     border-radius: 10px;
@@ -40,15 +40,15 @@
   height: 30px;
   border: 6px solid rgba($color-spinner, 0.2);
   border-left-color: rgba($color-spinner, 1);
-  @include animation(spinner 1s infinite linear);
+  animation: spinner 1s infinite linear;
   border-radius: 50%;
 }
 
-@include keyframes(spinner) {
+@keyframes spinner {
   from {
-    @include transform(rotate(0));
+    transform: rotate(0);
   }
   to {
-    @include transform(rotate(360deg));
+    transform: rotate(360deg);
   }
 }
diff --git a/backend/app/assets/stylesheets/spree/backend/components/_tabs.scss b/backend/app/assets/stylesheets/spree/backend/components/_tabs.scss
index d549bdcf9a2..7ee3ddcd83e 100644
--- a/backend/app/assets/stylesheets/spree/backend/components/_tabs.scss
+++ b/backend/app/assets/stylesheets/spree/backend/components/_tabs.scss
@@ -1,5 +1,5 @@
 .tabs {
-  @include display(flex);
+  display: flex;
   margin: 1em 0;
   border-bottom: 1px solid $color-border;
   white-space: nowrap;
@@ -18,8 +18,8 @@
 }
 
 .tabs > li:not(.in-dropdown) {
-  @include flex-grow(0);
-  @include flex-shrink(0);
+  flex-grow: 0;
+  flex-shrink: 0;
 
   // Move down one pixel to sit on top of the ul's border-bottom
   position: relative;
@@ -54,13 +54,13 @@
 }
 
 .tabs-overflowed.tabs > li:not(.tabs-dropdown) {
-  @include flex-grow(1);
-  @include flex-shrink(1);
+  flex-grow: 1;
+  flex-shrink: 1;
 }
 
 .tabs-dropdown {
-  @include flex-grow(0);
-  @include flex-shrink(0);
+  flex-grow: 0;
+  flex-shrink: 0;
   position: relative;
 
   .tabs:not(.tabs-overflowed) & {
diff --git a/backend/app/assets/stylesheets/spree/backend/sections/_style_guide.scss b/backend/app/assets/stylesheets/spree/backend/sections/_style_guide.scss
index b6894af118a..d4a0fb7a786 100644
--- a/backend/app/assets/stylesheets/spree/backend/sections/_style_guide.scss
+++ b/backend/app/assets/stylesheets/spree/backend/sections/_style_guide.scss
@@ -1,5 +1,5 @@
 .style-guide {
-  @include display(flex);
+  display: flex;
 
   &-sidebar {
     width: 225px;
@@ -23,7 +23,7 @@
   }
 
   &-main-content {
-    @include flex(1);
+    flex: 1;
   }
 
   ul {
@@ -109,12 +109,12 @@
 }
 
 .color-variables {
-  @include display(flex);
-  @include flex-wrap(wrap);
+  display: flex;
+  flex-wrap: wrap;
 }
 
 .color-variable {
-  @include flex-shrink(0);
+  flex-shrink: 0;
   width: 240px;
   padding: 1rem;
 
diff --git a/backend/app/assets/stylesheets/spree/backend/shared/_forms.scss b/backend/app/assets/stylesheets/spree/backend/shared/_forms.scss
index 045665d4439..1740192c7e6 100644
--- a/backend/app/assets/stylesheets/spree/backend/shared/_forms.scss
+++ b/backend/app/assets/stylesheets/spree/backend/shared/_forms.scss
@@ -142,8 +142,8 @@ span.info {
 
   &.checkbox {
     min-height: 73px;
-    @include display(flex);
-    @include align-items(center);
+    display: flex;
+    align-items: center;
 
     input[type="checkbox"] {
       display: inline-block;
diff --git a/backend/app/assets/stylesheets/spree/backend/shared/_header.scss b/backend/app/assets/stylesheets/spree/backend/shared/_header.scss
index 14db73ca36b..26a61c839db 100644
--- a/backend/app/assets/stylesheets/spree/backend/shared/_header.scss
+++ b/backend/app/assets/stylesheets/spree/backend/shared/_header.scss
@@ -1,6 +1,6 @@
 .main-header {
-  @include display(flex);
-  @include align-items(center);
+  display: flex;
+  align-items: center;
   padding: 15px $grid-gutter-width;
   background-color: very-light($color-3, 4);
   border-bottom: 1px solid $color-border;
@@ -25,7 +25,7 @@
 }
 
 .header-actions {
-  @include flex-grow(1);
+  flex-grow: 1;
   text-align: right;
   line-height: 38px;