Fix scrollbar color mixin to use body color variable instead of RGB (#2246)

.changeset/twenty-moles-provide.md

@@ -0,0 +1,5 @@
+---
+"@tabler/core": patch
+---
+
+Fix scrollbar color mixin to use body color variable

core/scss/mixins/_mixins.scss

@@ -15,7 +15,7 @@
 
 @mixin scrollbar($color: var(--#{$prefix}body-color-rgb)) {
   #{if(&, "&", "*")} {
-    scrollbar-color: rgba(var(--#{$prefix}scrollbar-color, var(--#{$prefix}body-color-rgb)), .16);
+    scrollbar-color: color-transparent(var(--#{$prefix}scrollbar-color, var(--#{$prefix}body-color)), .20);
   }
 
   #{if(&, "&", "*")}::-webkit-scrollbar {
@@ -27,7 +27,7 @@
   #{if(&, "&", "*")}::-webkit-scrollbar-thumb {
     border-radius: 1rem;
     border: 5px solid transparent;
-    box-shadow: inset 0 0 0 1rem rgba(var(--#{$prefix}scrollbar-color, var(--#{$prefix}body-color-rgb)), .16);
+    box-shadow: inset 0 0 0 1rem color-transparent(var(--#{$prefix}scrollbar-color, var(--#{$prefix}body-color)), .20);
   }
 
   #{if(&, "&", "*")}::-webkit-scrollbar-track {
@@ -35,7 +35,7 @@
   }
 
   #{if(&, "&", "*")}:hover::-webkit-scrollbar-thumb {
-    box-shadow: inset 0 0 0 1rem rgba(var(--#{$prefix}scrollbar-color, var(--#{$prefix}body-color-rgb)), .32);
+    box-shadow: inset 0 0 0 1rem color-transparent(var(--#{$prefix}scrollbar-color, var(--#{$prefix}body-color)), .40);
   }
 
   #{if(&, "&", "*")}::-webkit-scrollbar-corner {