.scrollbars {
  & ::-webkit-scrollbar {
    width: 0.6em;
    height: 0.6em;
    background: transparent;
  }

  & ::-webkit-scrollbar-track {
    --at-apply: bg-gray-100;
  }

  & ::-webkit-scrollbar-thumb {
    border-radius: 0.6em;
    --at-apply: bg-gray-300;
    &:hover {
      --at-apply: bg-gray-400;
    }
    &:active {
      --at-apply: bg-gray-500;
    }
  }

  &.dark {
    & ::-webkit-scrollbar-track {
      --at-apply: bg-gray-800;
    }

    & ::-webkit-scrollbar-thumb {
      --at-apply: bg-gray-700;
      &:hover {
        --at-apply: bg-gray-600;
      }
      &:active {
        --at-apply: bg-gray-500;
      }
    }
  }
}