/* ==========================================================================
 * ПОЛОСЫ ПРОКРУТКИ: страница, каталог, диалоги, формы и горизонтальные ленты.
 * Цвета наследуются: тёплое золото на тёмном фоне, каменный оттенок на светлом.
 * Используется нативная прокрутка без JS. На телефонах видимость определяет ОС.
 * ========================================================================== */
:root {
  --scrollbar-thumb: #8e8e8e;
  --scrollbar-thumb-hover: #e6e6e6;
  --scrollbar-track: rgba(255,255,255,.035);
}
.shop-dialog,.legal-dialog,.legal-content,.callback-card,.lead-capture {
  --scrollbar-thumb: #8e8e8e;
  --scrollbar-thumb-hover: #656565;
  --scrollbar-track: rgba(53,53,53,.045);
}

/* Firefox и браузеры со стандартным Scrollbars API. */
* {
  scrollbar-width: thin;
  scrollbar-color: var(--scrollbar-thumb) var(--scrollbar-track);
}

/* Chrome, Edge, Safari: скруглённый ползунок с воздушным отступом от края. */
@supports selector(::-webkit-scrollbar) {
  * { scrollbar-width: auto; scrollbar-color: auto; }
  *::-webkit-scrollbar { width: 10px; height: 10px; }
  *::-webkit-scrollbar-track { background: var(--scrollbar-track); border-radius: 999px; }
  *::-webkit-scrollbar-thumb {
    min-height: 32px;
    min-width: 32px;
    border: 2px solid transparent;
    border-radius: 999px;
    background: var(--scrollbar-thumb);
    background-clip: padding-box;
  }
  *::-webkit-scrollbar-thumb:hover { background-color: var(--scrollbar-thumb-hover); }
  *::-webkit-scrollbar-thumb:active { background-color: var(--scrollbar-thumb-hover); }
  *::-webkit-scrollbar-button { display: none; width: 0; height: 0; }
  *::-webkit-scrollbar-corner { background: transparent; }
}

/* Системный контраст имеет приоритет над оформлением сайта. */
@media(forced-colors:active) {
  * { scrollbar-width: auto; scrollbar-color: auto; }
  *::-webkit-scrollbar-thumb { background: ButtonText; }
  *::-webkit-scrollbar-track { background: Canvas; }
}