.TableWrapper {
  height: 600px;
  position: absolute;
  overflow-x: scroll;
  width: 100%;

  /* Hide scrollbar for IE, Edge and Firefox */
  -ms-overflow-style: none;
  /* IE and Edge */
  scrollbar-width: none;
  /* Firefox */
}

/* Hide scrollbar for Chrome, Safari and Opera */
.TableWrapper::-webkit-scrollbar {
  display: none;
}

/* Custom scrollbar for screen width 640px and above */
@media screen and (min-width: 640px) {
  .TableWrapper::-webkit-scrollbar {
    cursor: pointer;
    display: block;
    width: 8px;
    /* Adjust width for vertical scrollbar */
    height: 8px;
    /* Adjust height for horizontal scrollbar */
  }

  .TableWrapper::-webkit-scrollbar-thumb {
    background: var(--main-color);
    /* Scrollbar color */
    border-radius: 3px;
    /* Rounded corners for scrollbar */
  }

  .TableWrapper::-webkit-scrollbar-track {
    background: transparent;
    /* Scrollbar track color */
  }

  /* For Firefox */
  .TableWrapper {
    scrollbar-color: var(--main-color) transparent;
    /* Scrollbar and track colors */
    scrollbar-width: thin;
    /* Adjust scrollbar width */
  }

  /* For IE and Edge */
  .TableWrapper {
    -ms-overflow-style: auto;
  }

  /* Adjust vertical scrollbar specifically */
  .TableWrapper::-webkit-scrollbar-vertical {
    width: 8px;
    /* Adjust width for vertical scrollbar */
  }
}