/**
 * Shared overlay scrollbar — Admin / B2B / Shop.
 * Brand-tinted pill on a clear track so it reads as chrome, not a system bar.
 */

html,
body,
#root,
* {
  scrollbar-width: thin;
  scrollbar-color: var(--scrollbar-thumb) transparent;
}

*::-webkit-scrollbar {
  width: var(--scrollbar-size);
  height: var(--scrollbar-size);
}

*::-webkit-scrollbar-track,
*::-webkit-scrollbar-corner {
  background: transparent;
}

*::-webkit-scrollbar-thumb {
  background: var(--scrollbar-thumb);
  border: 3px solid transparent;
  border-radius: 999px;
  background-clip: padding-box;
}

*::-webkit-scrollbar-thumb:hover {
  background: var(--scrollbar-thumb-hover);
  border: 3px solid transparent;
  background-clip: padding-box;
}

*::-webkit-scrollbar-button {
  display: none;
  width: 0;
  height: 0;
}

.ui-scroll,
.shell-nav,
.shop-category__sidebar,
.shop-account-sidebar {
  scrollbar-gutter: auto;
  scrollbar-width: thin;
  scrollbar-color: var(--scrollbar-thumb-idle) transparent;
}

.ui-scroll:hover,
.ui-scroll:focus-within,
.ui-scroll.is-scrolling,
.shell-nav:hover,
.shell-nav:focus-within,
.shell-nav.is-scrolling,
.shop-category__sidebar:hover,
.shop-category__sidebar:focus-within,
.shop-category__sidebar.is-scrolling,
.shop-account-sidebar:hover,
.shop-account-sidebar:focus-within,
.shop-account-sidebar.is-scrolling {
  scrollbar-color: var(--scrollbar-thumb) transparent;
}

.ui-scroll::-webkit-scrollbar-thumb,
.shell-nav::-webkit-scrollbar-thumb,
.shop-category__sidebar::-webkit-scrollbar-thumb,
.shop-account-sidebar::-webkit-scrollbar-thumb {
  background: var(--scrollbar-thumb-idle);
  border: 3px solid transparent;
  background-clip: padding-box;
}

.ui-scroll:hover::-webkit-scrollbar-thumb,
.ui-scroll:focus-within::-webkit-scrollbar-thumb,
.ui-scroll.is-scrolling::-webkit-scrollbar-thumb,
.shell-nav:hover::-webkit-scrollbar-thumb,
.shell-nav:focus-within::-webkit-scrollbar-thumb,
.shell-nav.is-scrolling::-webkit-scrollbar-thumb,
.shop-category__sidebar:hover::-webkit-scrollbar-thumb,
.shop-category__sidebar:focus-within::-webkit-scrollbar-thumb,
.shop-category__sidebar.is-scrolling::-webkit-scrollbar-thumb,
.shop-account-sidebar:hover::-webkit-scrollbar-thumb,
.shop-account-sidebar:focus-within::-webkit-scrollbar-thumb,
.shop-account-sidebar.is-scrolling::-webkit-scrollbar-thumb {
  background: var(--scrollbar-thumb);
}

.ui-scroll:hover::-webkit-scrollbar-thumb:hover,
.shell-nav:hover::-webkit-scrollbar-thumb:hover,
.shop-category__sidebar:hover::-webkit-scrollbar-thumb:hover,
.shop-account-sidebar:hover::-webkit-scrollbar-thumb:hover {
  background: var(--scrollbar-thumb-hover);
}

.scrollbar-none {
  scrollbar-width: none;
}

.scrollbar-none::-webkit-scrollbar {
  display: none;
  width: 0;
  height: 0;
}