diff --git a/sass/components/_buttons.scss b/sass/components/_buttons.scss
index 01f6e1dc7f..c3dad68e2f 100644
--- a/sass/components/_buttons.scss
+++ b/sass/components/_buttons.scss
@@ -1,4 +1,4 @@
-.btn, .btn-floating, .btn-large, .btn-small, .btn-flat {
+:root {
   --btn-height: 40px;
   --btn-font-size-icon: 16px;
   --btn-padding: 24px;
@@ -6,7 +6,9 @@
   --btn-gap-icon: 8px;
   --btn-border-radius: 4px;
   --btn-font-size: 14px;
+}
 
+.btn, .btn-floating, .btn-large, .btn-small, .btn-flat {
   @include btn(
       var(--btn-height),
       var(--btn-border-radius),
diff --git a/sass/materialize.scss b/sass/materialize.scss
index 2134022682..0afe47bff0 100644
--- a/sass/materialize.scss
+++ b/sass/materialize.scss
@@ -18,6 +18,7 @@
 
 // components
 @import "components/global";
+@import "components/buttons";
 @import "components/collection";
 @import "components/badges";
 @import "components/icons-material-design";
@@ -29,7 +30,6 @@
 @import "components/toast";
 @import "components/tabs";
 @import "components/tooltip";
-@import "components/buttons";
 @import "components/dropdown";
 
 @import "components/modal";