/**
 * UpPay canonical document scrollbar.
 *
 * Reserving the gutter keeps fixed and centred shared chrome in the same
 * horizontal coordinates on short and long pages.
 */

html {
  scrollbar-gutter: stable;
  scrollbar-color: rgba(88, 108, 132, 0.68) rgba(7, 11, 21, 0.36);
}

html::-webkit-scrollbar {
  width: 9px;
}

html::-webkit-scrollbar-track {
  background: rgba(7, 11, 21, 0.36);
}

html::-webkit-scrollbar-thumb {
  min-height: 3rem;
  border: 1px solid rgba(7, 11, 21, 0.36);
  border-radius: 999px;
  background: rgba(88, 108, 132, 0.68);
  background-clip: padding-box;
}

html::-webkit-scrollbar-thumb:hover {
  background: rgba(112, 134, 162, 0.82);
  background-clip: padding-box;
}

html::-webkit-scrollbar-button {
  display: none;
  width: 0;
  height: 0;
}

@supports not (scrollbar-gutter: stable) {
  html {
    overflow-y: scroll;
  }
}
