/* ==========================================================================
   games-slider.css — горизонтальная прокрутка карточек игр (BEM: games-slider__*)
   Нативный overflow-x скролл, без карусельных точек/стрелок — на всех разрешениях.
   ========================================================================== */

.games-slider {
  margin-top: var(--paragraph-gap);
}

.games-slider__track {
  display: flex;
  align-items: stretch;
  gap: var(--card-gap);
  overflow-x: auto;
  overscroll-behavior-x: contain;
  scroll-snap-type: x proximity;
  -webkit-overflow-scrolling: touch;
  padding-bottom: 0.75rem;
  scrollbar-width: thin;
  scrollbar-color: var(--color-btn-secondary-border) transparent;
}

.games-slider__track::-webkit-scrollbar {
  height: 6px;
}

.games-slider__track::-webkit-scrollbar-track {
  background: transparent;
}

.games-slider__track::-webkit-scrollbar-thumb {
  background: var(--color-btn-secondary-border);
  border-radius: 3px;
}

.games-slider__item {
  flex: 0 0 auto;
  width: clamp(150px, 26vw, 190px);
  scroll-snap-align: start;
}

@media (min-width: 1024px) {
  .games-slider__item {
    width: clamp(170px, 14vw, 200px);
  }
}

.games-slider .game-card {
  height: 100%;
  padding: 0.9rem;
  display: flex;
  flex-direction: column;
}

.games-slider .game-card__name {
  flex-grow: 1;
}

.games-slider .game-card__play {
  width: 100%;
  padding: 0.55rem 1rem;
  font-size: var(--fs-small);
  margin-top: auto;
}