/* Viewport = kaydırılabilir alan, track = genişleyen içerik */
.home-carousel-viewport {
  width: 100%;
  max-width: 100%;
  min-width: 0;
  overflow-x: auto;
  overflow-y: hidden;
  -webkit-overflow-scrolling: touch;
  overscroll-behavior-x: contain;
  touch-action: pan-x;
  scrollbar-width: none;
  scroll-behavior: smooth;
  scroll-snap-type: x proximity;
}

.home-carousel-viewport::-webkit-scrollbar {
  display: none;
}

.home-carousel-viewport > .home-carousel-track,
.home-carousel-viewport > .game-row,
.home-carousel-viewport > .sport-row {
  display: flex;
  flex-wrap: nowrap;
  width: max-content !important;
  min-width: 100%;
  max-width: none !important;
  overflow: visible !important;
  overflow-x: visible !important;
  transform: none !important;
}

.home-carousel-section.is-carousel-mode .game-card,
.home-carousel-section.is-carousel-mode .sport-card {
  flex: 0 0 auto;
  flex-shrink: 0;
  scroll-snap-align: start;
}

.home-carousel-section.home-carousel-has-scroll .home-carousel-viewport {
  padding-bottom: 2px;
}

.home-carousel-section.home-carousel-has-scroll .game-row,
.home-carousel-section.home-carousel-has-scroll .sport-row {
  padding-bottom: 6px;
}

.home-scroll-footer {
  display: none;
  align-items: center;
  justify-content: center;
  gap: 14px;
  padding: 8px 2px 2px;
  width: 100%;
}

.home-scroll-footer.is-visible {
  display: flex !important;
}

.home-scroll-arrow {
  width: 36px;
  height: 36px;
  border-radius: 50%;
  border: 1px solid rgba(177, 108, 255, .42);
  background: rgba(141, 85, 255, .18);
  color: #fff;
  display: grid;
  place-items: center;
  font-size: 20px;
  line-height: 1;
  cursor: pointer;
  transition: background .15s ease, opacity .15s ease, transform .15s ease;
  box-shadow: 0 4px 14px rgba(0, 0, 0, .18);
}

.home-scroll-arrow:not(:disabled):hover {
  background: rgba(141, 85, 255, .32);
  transform: translateY(-1px);
}

.home-scroll-arrow:disabled {
  opacity: .35;
  cursor: default;
  pointer-events: none;
}

.home-scroll-indicator {
  min-width: 52px;
  text-align: center;
  font-size: 11px;
  font-weight: 800;
  color: var(--muted, #c9bdf1);
  letter-spacing: .04em;
}
