diff --git a/frontend/src/styles/_scrollbar.scss b/frontend/src/styles/_scrollbar.scss
index 811e65a..a54f64f 100644
--- a/frontend/src/styles/_scrollbar.scss
+++ b/frontend/src/styles/_scrollbar.scss
@@ -6,16 +6,16 @@
 }
 
 ::-webkit-scrollbar-track {
-  background-color: transparent;
+  background-color: $gray-800;
 }
 
 ::-webkit-scrollbar-thumb {
-  background-color: $primary;
+  background-color: $gray-600;
   border-radius: 20px;
   border: 4px solid transparent;
   background-clip: content-box;
 }
 
 ::-webkit-scrollbar-thumb:hover {
-  background-color: #ae8000;
+  background-color: $primary;
 }
diff --git a/frontend/src/styles/_tom-select.scss b/frontend/src/styles/_tom-select.scss
index 0de30df..f78e230 100644
--- a/frontend/src/styles/_tom-select.scss
+++ b/frontend/src/styles/_tom-select.scss
@@ -1,5 +1,5 @@
 @import "tom-select/dist/css/tom-select.bootstrap5.min.css";
-@import "variables.scss";
+@import "variables";
 
 /* FIX BOOTSTRAP STYLING FOR TOM SELECT */
 .ts-dropdown,
diff --git a/frontend/src/styles/style.scss b/frontend/src/styles/style.scss
index c90d24d..23671fc 100644
--- a/frontend/src/styles/style.scss
+++ b/frontend/src/styles/style.scss
@@ -1,10 +1,10 @@
 @import "variables";
-@import "font-awesome.scss";
-@import "bootstrap.scss";
-@import "datepicker.scss";
-@import "tom-select.scss";
-@import "animations.scss";
-@import "scrollbar.scss";
+@import "font-awesome";
+@import "bootstrap";
+@import "datepicker";
+@import "tom-select";
+@import "animations";
+@import "scrollbar";
 @import "./tailwind.css";
 
 .sticky-sidebar {