.flex {
  display: flex;
}
.items-center {
  align-items: center;
}
.justify-self-stretch {
  justify-self: stretch;
}
.justify-between {
  justify-content: space-between;
}
.flex-1 {
  flex: 1;
}
.w-full {
  width: 100%;
}
.hlxb-scrollbar {
  --thumb-width: 4px;
  --thumb-hover-width: 8px;
  position: relative;
  height: 100%;
  overflow: hidden;
}
.hlxb-scrollbar__wrap {
  position: relative;
  height: 100%;
  overflow: auto;
  scrollbar-width: none;
  -ms-overflow-style: none;
}
.hlxb-scrollbar__wrap::-webkit-scrollbar {
  width: 0;
  height: 0;
}
.hlxb-scrollbar__view {
  display: block;
}
.hlxb-scrollbar__bar {
  position: absolute;
  right: 0;
  bottom: 0;
  z-index: 1;
  border-radius: calc(var(--thumb-hover-width) / 2);
  opacity: 0;
  transition: all 0.2s ease-out;
  background-color: transparent;
}
.hlxb-scrollbar__bar.is-vertical {
  top: 0;
  width: var(--thumb-width);
}
.hlxb-scrollbar__bar.is-horizontal {
  left: 0;
  height: var(--thumb-width);
}
.hlxb-scrollbar__thumb {
  position: relative;
  display: block;
  width: 100%;
  height: 100%;
  border-radius: calc(var(--thumb-width) / 2);
  background-color: #bcbfc2;
  cursor: pointer;
  transition: all 0.2s linear;
}
.hlxb-scrollbar--dragging > .hlxb-scrollbar__bar,
.hlxb-scrollbar--always > .hlxb-scrollbar__bar,
.hlxb-scrollbar:hover > .hlxb-scrollbar__bar {
  opacity: 1;
}
.hlxb-scrollbar__bar:hover {
  background-color: #dfdfdf;
  border-radius: calc(var(--thumb-hover-width) / 2);
}
.hlxb-scrollbar__bar:hover.is-vertical {
  width: var(--thumb-hover-width);
}
.hlxb-scrollbar__bar:hover.is-horizontal {
  height: var(--thumb-hover-width);
}
.hlxb-scrollbar--dragging--vertical > .hlxb-scrollbar__bar.is-vertical {
  background-color: #dfdfdf;
  width: var(--thumb-hover-width);
  border-radius: calc(var(--thumb-hover-width) / 2);
}
.hlxb-scrollbar--dragging--vertical > .hlxb-scrollbar__bar.is-vertical .hlxb-scrollbar__thumb {
  background-color: #a8adb3;
  border-radius: calc(var(--thumb-hover-width) / 2);
}
.hlxb-scrollbar--dragging--horizontal > .hlxb-scrollbar__bar.is-horizontal {
  background-color: #dfdfdf;
  height: var(--thumb-hover-width);
  border-radius: calc(var(--thumb-hover-width) / 2);
}
.hlxb-scrollbar--dragging--horizontal > .hlxb-scrollbar__bar.is-horizontal .hlxb-scrollbar__thumb {
  background-color: #a8adb3;
  border-radius: calc(var(--thumb-hover-width) / 2);
}
.hlxb-scrollbar__thumb:hover {
  background-color: #a8adb3;
  border-radius: calc(var(--thumb-hover-width) / 2);
}