checkout/src/arquivos/sass/utils/_mixin.scss

@@ -1,7 +1,7 @@
 /**
  * @reference (https://github.com/engageinteractive/core/blob/master/src/scss/utility/_mixins.scss)
  */
-@mixin push--auto {
+ @mixin push--auto {
 	margin: {
 		left: auto;
 		right: auto;

checkout/src/arquivos/sass/utils/_variaveis.scss

@@ -2,37 +2,67 @@
 @import url("https://fonts.googleapis.com/css2?family=Tenor+Sans&display=swap");
 @import url("https://fonts.googleapis.com/css2?family=Open+Sans:wght@300;400;500;600;700;800&display=swap");
 $font-family: "Open Sans", sans-serif;
-$font-family-secundary:"Tenor Sans", sans-serif;
+$font-family-secundary: "Tenor Sans", sans-serif;
 
 /* Colors */
+$black: #000;
+$color-black-000: #000000;
 $color-black: #292929;
+$color-black2: #292929;
 
 $color-white: #fff;
+$color-white2: #ededed;
+$white: #fff;
+
+$gray: #c4c4c4;
+$gray-200: #8d8d8d;
+$gray-500: #292929;
 
 $color-gray: #6c6c6c;
 $color-gray2: #7d7d7d;
 $color-gray3: #f0f0f0;
 $color-gray4: #8d8d8d;
 $color-gray5: #e5e5e5;
+$color-gray6: #c4c4c4;
+$color-gray7: #989898;
+$color-gray8: #828282;
+$color-gray9: #bdbdbd;
+$color-gray10: #c4c4c4;
+$color-gray11: #ededed;
+$color-gray12: #989898;
+
+$color-orange: #f15a31;
 
 $color-blue: #4267b2;
+$color-blue2: #00c8ff;
+
+$color-red: #ff0000;
 
 $color-green: #4caf50;
 
 /* Grid breakpoints */
 $grid-breakpoints: (
-	xs: 0,
-	cstm: 400,
-	sm: 576px,
-	md: 768px,
-	lg: 992px,
-	xl: 1200px
+    xs: 0,
+    Gf: 328px,
+    cstm: 400,
+    f: 375px,
+    c: 376px,
+    m: 491px,
+    sm: 576px,
+    md: 768px,
+    lg: 992px,
+    tb: 1024px,
+    dt: 1025px,
+    l: 1025px,
+    xl: 1200px,
+    tv: 2500px,
+    xxl: 2500px,
 ) !default;
 
 $z-index: (
-	level1: 5,
-	level2: 10,
-	level3: 15,
-	level4: 20,
-	level5: 25
+    level1: 5,
+    level2: 10,
+    level3: 15,
+    level4: 20,
+    level5: 25,
 ) !default;