@media (min-width: 992px) {
  #mainmenu {
    width: 300px;
    height: calc(100dvh) !important;
    overflow: scroll !important;
    position: fixed;
    overflow-x: hidden !important;
    /* Custom scrollbar for Windows */
    scrollbar-width: thin;
    scrollbar-color: rgba(255, 255, 255, 0.4) transparent;
  }
  #mainmenu li {
    width: 100%;
    overflow-x: hidden;
  }
  #content {
    padding-left: 300px;
    height: 100vh !important;
    overflow-x: hidden;
    /* Custom scrollbar for Windows */
    scrollbar-width: thin;
    scrollbar-color: rgba(0, 0, 0, 0.2) transparent;
  }

  #contextmenu {
    height: 100vh !important;
    /* Custom scrollbar for Windows */
    scrollbar-width: thin;
    scrollbar-color: rgba(255, 255, 255, 0.4) transparent;
    overflow-x: hidden !important;
  }
  #content-frame {
    height: calc(100vh - 55px) !important;
    /* Custom scrollbar for Windows */
    scrollbar-width: thin;
    scrollbar-color: rgba(0, 0, 0, 0.2) transparent;
    overflow-x: hidden;
  }

  @supports (height: 100dvh) {
    #content-frame {
      height: calc(100dvh - 55px) !important;
    }
  }
}

@media (max-width: 991.98px) {
  #mainmenu {
    height: 54px;
    /* Custom scrollbar for Windows */
    scrollbar-width: thin;
    scrollbar-color: rgba(255, 255, 255, 0.4) transparent;
  }

  #content {
    /* Custom scrollbar for Windows */
    scrollbar-width: thin;
    scrollbar-color: rgba(0, 0, 0, 0.2) transparent;
    overflow-x: hidden;
  }

  #content-frame {
    height: calc(100vh - 55px - 55px) !important;
    /* Custom scrollbar for Windows */
    scrollbar-width: thin;
    scrollbar-color: rgba(0, 0, 0, 0.2) transparent;
    overflow-x: hidden;
  }

  @supports (height: 100dvh) {
    #content-frame {
      height: calc(100dvh - 55px - 55px) !important;
    }
  }
}

/* Global scrollbar styling */
* {
  scrollbar-width: thin;
  scrollbar-color: rgba(0, 0, 0, 0.2) transparent;
}

*::-webkit-scrollbar {
  width: 8px;
  height: 0; /* Hide horizontal scrollbar globally */
}

*::-webkit-scrollbar-track {
  background: transparent;
}

*::-webkit-scrollbar-thumb {
  background-color: rgba(0, 0, 0, 0.2);
  border-radius: 20px;
  border: 2px solid transparent;
  background-clip: padding-box;
}

*::-webkit-scrollbar-thumb:hover {
  background-color: rgba(0, 0, 0, 0.3);
}