/* Main sidebar styling */
.main-sidebar {
  height: calc(100vh + 100px); /* Extra height beyond viewport */
  overflow-y: auto; /* Enable vertical scrolling */
  overflow-x: hidden; /* Prevent horizontal scrolling */
  position: relative; /* Ensure proper positioning */
}

/* WebKit browsers (Chrome, Safari) */
.main-sidebar::-webkit-scrollbar {
  width: 4px; /* Even thinner scrollbar width */
}

.main-sidebar::-webkit-scrollbar-track {
  background: #f1f1f1; /* Track color */
  border-radius: 10px; /* Rounded corners */
}

.main-sidebar::-webkit-scrollbar-thumb {
  background: #888; /* Scrollbar color */
  border-radius: 10px; /* Rounded corners */
}

.main-sidebar::-webkit-scrollbar-thumb:hover {
  background: #555; /* Darker color on hover */
}

/* Firefox */
.main-sidebar {
  scrollbar-width: thin; /* Thin scrollbar */
  scrollbar-color: #888 #f1f1f1; /* Scrollbar color and track color */
}

/* Optional: Add smooth scrolling */
html {
  scroll-behavior: smooth;
}
.main-sidebar {
  height: 100vh; /* Extra height beyond viewport */
  overflow-y: auto; /* Enable vertical scrolling */
  overflow-x: hidden; /* Prevent horizontal scrolling */
  position: relative; /* Ensure proper positioning */
}

/* Ensure ul does not cause unwanted overflow */
.sidebar-ul {
  padding: 0;
  margin: 0;
}

/* Ensure nav items do not affect scrolling */
.nav-item {
  position: relative;
}

/* Adjust navigation link styling */
.nav-link {
  display: flex;
  align-items: center;
  color: #ffffff;
  text-decoration: none;
  padding: 10px;
  box-sizing: border-box; /* Include padding in height calculations */
}

.nav-text {
  margin-left: 10px;
  font-size: 16px;
}

/* Dropdown menu styling */
.dropdown-menu {
  background-color: #5b82f9;
  border: none;
  border-radius: 4px;
  padding: 0;
  position: absolute;
  top: 100%;
  left: 0;
  display: none;
  min-width: 232px;
  list-style: none;
}

.dropdown-menu.show {
  display: block;
}

.dropdown-menu li {
  display: flex;
  margin-right: 15px;
}

.dropdown-item {
  display: flex;
  align-items: center;
  padding: 10px 15px;
  color: #ffffff;
  text-decoration: none;
  min-width: 232px;
}

.dropdown-item:hover {
  background-color: #6c8ffa;
  border-radius: 4px;
}

.icon {
  width: 24px;
  height: 24px;
  margin-right: 10px;
}

.dropdown-text {
  margin: 0;
  font-size: 16px;
}