@import 'defaults';
@import 'variables';

::-webkit-scrollbar {
  width: 6.5px;
  height: 6.5px;
}

* {
  -ms-overflow-style: -ms-autohiding-scrollbar;
  scrollbar-width: thin;
  scrollbar-color: rgba(0, 0, 0, 0.3) transparent;
}

::-webkit-scrollbar-thumb {
  background: rgba(0, 0, 0, 0.3);
  border-radius: 6px;
}

::-webkit-scrollbar-button,
::-webkit-scrollbar-track-piece,
::-webkit-scrollbar-corner,
::-webkit-resizer {
  display: none;
}

// code blocks
.markdown pre::-webkit-scrollbar {
  background-color: transparent;
}

.markdown pre {
  scrollbar-color: transparent transparent;
}
.markdown pre:hover {
  scrollbar-color: rgba(255, 255, 255, 0.3) transparent;
}
.markdown pre:active {
  scrollbar-color: rgba(255, 255, 255, 0.4) transparent;
}

.markdown pre::-webkit-scrollbar-thumb {
  background-color: transparent;
}
.markdown pre:hover::-webkit-scrollbar-thumb {
  background-color: rgba(255, 255, 255, 0.3);
}
.markdown pre::-webkit-scrollbar-thumb:active {
  background-color: rgba(255, 255, 255, 0.4);
}

// toc
.toc > ol {
  scrollbar-color: transparent transparent;
}
.toc > ol:hover {
  scrollbar-color: inherit;
}

.toc > ol::-webkit-scrollbar {
  display: none;
}
.toc > ol:hover::-webkit-scrollbar {
  display: initial;
}
