/* Shared, intentional scroll surfaces. */
.scroll-x,
.utility-nav,
.competition-nav,
.ops-jumpnav,
.ranking-switch,
.data-table-wrap,
.ops-table-wrap {
  overflow-x: auto;
  overscroll-behavior-inline: contain;
  -webkit-overflow-scrolling: touch;
}

.scroll-y,
.selection-list,
.app-select-options {
  overflow-y: auto;
  overscroll-behavior: contain;
}

.scrollbar-thin,
.competition-nav,
.selection-list {
  scrollbar-width: thin;
}

@media (max-width: 640px) {
  .scrollbar-hidden-mobile,
  .utility-nav,
  .competition-nav,
  .ops-jumpnav,
  .ranking-switch,
  .data-table-wrap,
  .ops-table-wrap,
  .app-select-options {
    scrollbar-width: none;
  }

  .scrollbar-hidden-mobile::-webkit-scrollbar,
  .utility-nav::-webkit-scrollbar,
  .competition-nav::-webkit-scrollbar,
  .ops-jumpnav::-webkit-scrollbar,
  .ranking-switch::-webkit-scrollbar,
  .data-table-wrap::-webkit-scrollbar,
  .ops-table-wrap::-webkit-scrollbar,
  .app-select-options::-webkit-scrollbar {
    display: none;
  }

  html:has(.scroll-viewport-contained-mobile),
  body:has(.scroll-viewport-contained-mobile) {
    max-width: 100%;
    overflow-x: hidden;
  }
}