.dropdown-li {
  display: inline-block !important;
}
.dropdown-link {
  display: inline-block !important; 
  padding-right: 4px !important;
}
.dropdown-caret {
  display: inline-block !important; 
  padding-left: 4px !important;
}
  .dropdown-submenu {
    position: relative;
  }
  .dropdown-submenu > .dropdown-menu {
    top: 0;
    left: 100%;
    margin-top: -1px;
  }
  .dropdown-submenu:hover > .dropdown-menu {
    display: block;
  }
  .dropdown-submenu > a::after {
    content: " ";
    float: right;
    border: solid transparent;
    border-width: 0.3em;
    border-left-color: #000;
    margin-top: 0.3em;
    margin-right: -0.6em;
  }
  .dropdown-menu {
    background-color: #fff; /* Ensuring the dropdown background color stays default */
  }
  @media (max-width: 992px) {
    .dropdown-menu .dropdown-submenu .dropdown-menu {
      top: -1px;
      left: 100%;
    }
  }

    .dropdown-submenu {
    position: relative;
  }

  .dropdown-submenu .dropdown-menu {
    top: 0;
    left: 100%;
    margin-top: -1px;
  }

  .sidebar {
    position: fixed;
    top: 56px; /* Adjust based on your navbar height */
    left: 0;
    bottom: 0;
    width: 250px;
    padding: 1rem;
    overflow-y: auto;
  }

/* Ensure dropdown menu is visible when it has the show class, scoped to .sidebar */
.sidebar .nav-item.dropdown.show .dropdown-menu {
  display: block;
  visibility: visible;
  opacity: 1;
}

/* Optionally, adjust the caret to indicate it is open, scoped to .sidebar */
.sidebar .nav-item.dropdown.show .dropdown-caret {
  transform: rotate(180deg);
}




  .content {
    margin-top: 56px;
    margin-left: 250px;
    padding: 15px;
  }

  .no-ml{
    margin-left: 0px;
  }
  .no-mr{
    margin-right: 0px;
  }
  .no-mt{
    margin-top: 0px;
  }
  .no-mb{
    margin-bottom: 0px;
  }
  @media (max-width: 991.98px) { /* Bootstrap lg breakpoint */
    .content {
      margin-left: 0;
    }
  }
/* SIDEBAR */
.sidebar > .dropdown-submenu {
  position: relative;
}

.sidebar > .dropdown-submenu .dropdown-menu {
  top: 0;
  left: 100%;
  margin-top: -1px;
}

.sidebar {
  position: fixed;
  top: 56px; /* Adjust based on your navbar height */
  left: 0;
  bottom: 0;
  width: 250px;
  padding: 1rem;
  overflow-y: auto;
}

.content {
  margin-top: 56px;
  margin-left: 250px;
  padding: 15px;
}
@media (max-width: 991.98px) { /* Bootstrap lg breakpoint */
  .content {
    margin-left: 0;
  }
}