:root {
  .os-theme-custom {
    --os-handle-bg: rgba(0, 0, 0, 0.07);
    --os-handle-bg-hover: rgba(0, 0, 0, 0.3);
    --os-handle-bg-active: rgba(0, 0, 0, 0.55);

    --os-size: 11px;
    --os-padding-perpendicular: 3px;
    --os-padding-axis: 2px;
    --os-track-border-radius: 10px;
    --os-handle-interactive-area-offset: 4px;
    --os-handle-border-radius: 10px;
  }

}
.dark .os-theme-custom {
  --os-handle-bg: rgba(255, 255, 255, 0.2);
  --os-handle-bg-hover: rgba(255, 255, 255, 0.55);
  --os-handle-bg-active: rgba(255, 255, 255, 0.66);
}


::-webkit-scrollbar {
  background-color: transparent;
  width: 5px;
  height: 5px;
  z-index: 999999;
}

::-webkit-scrollbar-thumb {
  background-color: rgba(0, 0, 0, 0.07);
  border-radius: 9999px;
}

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

::-webkit-scrollbar-thumb:horizontal {
  min-width: 20px;
}

::-webkit-scrollbar-thumb:vertical {
  min-height: 20px;
}

.dark ::-webkit-scrollbar-thumb {
  background-color: rgba(255, 255, 255, 0.2);
}

.dark ::-webkit-scrollbar-thumb:hover {
  background-color: rgba(255, 255, 255, 0.55);
}

main::-webkit-scrollbar {
  display: none;
}