diff --git a/frontend/src/components/Sidebar.css b/frontend/src/components/Sidebar.css
index fbc41fad..75f7d171 100644
--- a/frontend/src/components/Sidebar.css
+++ b/frontend/src/components/Sidebar.css
@@ -77,7 +77,7 @@
 }
 
 /* Navigation links section container */
-.nav-links {
+.sidebar .nav-links {
   list-style: none;
   width: 100%;
   margin: 0;
@@ -90,7 +90,7 @@
 }
 
 /* Settings section container */
-.nav-settings {
+.sidebar .nav-settings {
   list-style: none;
   width: 100%;
   margin: 0;
@@ -110,16 +110,18 @@
 }
 
 /* Individual navigation buttons styling */
-.nav-item {
+.sidebar .nav-item {
   margin: 0;
-  width: auto;
+  width: 100%;
   background: none;
   border: none;
   padding: 0;
+  display: flex;
+  justify-content: center;
 }
 
 /* Nav option list styling - Dark theme (default) */
-.nav-link {
+.sidebar .nav-link {
   display: flex;
   align-items: center;
   justify-content: center;
@@ -145,24 +147,26 @@
 }
 
 /* Expanded state styling */
-.nav-link.expanded {
+.sidebar .nav-link.expanded {
   border-radius: 25px;
-  width: auto;
-  min-width: 160px;
-  padding: 0 20px;
+  width: 190px;
+  min-width: 190px;
+  max-width: 190px;
+  min-height: 54px;
+  padding: 0 18px;
   justify-content: flex-start;
   gap: 15px;
 }
 
 /* Styling for currently selected nav item or setting */
-.nav-link.active {
+.sidebar .nav-link.active {
   background-color: #3b82f6;
   color: #ffffff;
   box-shadow: 0 4px 20px rgba(59, 130, 246, 0.4);
 }
 
 /* Hover effects on navigation items - Dark theme */
-.nav-link:hover {
+.sidebar .nav-link:hover {
   background-color: #475569;
   transform: translateY(-2px);
   box-shadow: 0 6px 16px rgba(0, 0, 0, 0.3);
@@ -175,13 +179,13 @@
 }
 
 /* Hover effect when the navigation item is also the currently selected item */
-.nav-link.active:hover {
+.sidebar .nav-link.active:hover {
   background-color: #2563eb;
   color: white;
 }
 
 /* Icon styling */
-.nav-icon {
+.sidebar .nav-icon {
   font-size: 20px;
   width: 20px;
   height: 20px;
@@ -191,7 +195,7 @@
 }
 
 /* Text label styling */
-.nav-text {
+.sidebar .nav-text {
   white-space: nowrap;
   font-size: 14px;
   font-weight: 500;