/** * Banner, oyun şeritleri ve jackpot slider düzeltmeleri. * Kart genişliği: --sn-lobby-carousel-card-width (sn-layout-tokens.css). * Swiper JS tabanlı touch handling (cssMode: false) kullanır. */ /* --sn-lobby-carousel-card-width sn-layout-tokens.css'te tanımlı ama bazı build/cascade durumlarında üzerinde boş çözümlenip kart genişliğini `auto`ya düşürüyordu (kapağı yüklenmemiş kartlar 0 genişliğe çöküyordu). Tüketen dosyada yeniden tanımlayıp her kullanımda fallback veriyoruz. */ html { --sn-lobby-carousel-card-width: clamp(108px, 28vw, 156px); --sn-lobby-carousel-card-aspect: 1.333; } @media (min-width: 768px) { html { --sn-lobby-carousel-card-width: clamp(120px, 14vw, 168px); } } /* Banner: Swiper slide tam genişlik */ .banners-carousel_root-pijlK .banners-carousel_swiper-pijlK.swiper { width: 100%; overflow: hidden; } /* Casino / canlı casino üst banner — iOS Safari grid + height:100% çöküşü */ @media (max-width: 1023.98px) { .sn-casino-lobby-grid > .banners-carousel_root-pijlK, .sn-casino-lobby-grid > [data-sn-lobby-hero-banner-slot] > .banners-carousel_root-pijlK { -webkit-transform: translateZ(0); transform: translateZ(0); } html.sn-platform-ios .sn-casino-lobby-grid > .banners-carousel_root-pijlK .banner_image-d5s4V, html.sn-platform-ios .sn-casino-lobby-grid > [data-sn-lobby-hero-banner-slot] > .banners-carousel_root-pijlK .banner_image-d5s4V { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; } } .banners-carousel_root-pijlK .banners-carousel_swiper-pijlK .swiper-wrapper { display: flex; align-items: stretch; } .banners-carousel_root-pijlK .banners-carousel_swiper-pijlK .swiper-slide { flex-shrink: 0; width: 100% !important; height: auto; box-sizing: border-box; } /* * API defer: slider şeritleri #sn-casino-slider-sections içinde toplanır. * SSR /casino'da her şerit #sn-casino-lobby-mid (display:contents) altında ayrı * flex çocuğu olur ve [data-sn-page=casino] gap'i (spacing-24/32) uygulanır. * Aynı aralık için kapsayıcıyı şeffaf yapıp mount'ları sayfa gap'ine dahil ediyoruz. */ #sn-casino-lobby-mid > #sn-casino-slider-sections { display: contents; } /* * Ana sayfa: /casino ile aynı dikey aralık. * Hero, her slider şeridi ve son kazançlar [data-sn-page=home] gap'ine dahil olur. */ [data-sn-page="home"] { display: flex; flex-direction: column; gap: var(--spacing-24); width: 100%; } @media (min-width: 1024px) { [data-sn-page="home"] { gap: var(--spacing-32); } } #sn-home-slider-sections { display: contents; } .sn-lobby-slider-mount { min-width: 0; } #sn-casino-slider-sections .sn-home-lobby-skeleton-row, #sn-home-slider-sections .sn-home-lobby-skeleton-row { margin-bottom: 0; } /* Oyun şeridi: kartlar ezilmesin */ .games-section_root-SVc9f { min-width: 0; padding: 18px 0; } /* * Oyun şeridi blokları (Blackjack vb.): üst komşu ile toplam dikey aralık ~%50. * Flex gap katkısı + section padding (18px → 9px). */ .sn-lobby-section-flow > [data-index], .sn-lobby-slider-mount > [data-index] { margin-block-start: calc(var(--sn-lobby-section-gap, var(--spacing-24)) * -0.5); } .sn-lobby-section-flow > [data-index] .games-section_root-SVc9f, .sn-lobby-slider-mount > [data-index] .games-section_root-SVc9f { padding-block: 9px; } .games-section_root-SVc9f .games-grid_carousel-iixhO { display: flex !important; flex-wrap: nowrap !important; align-items: stretch; /* 1win index.css: mobile 12px / desktop 16px + snap mandatory */ gap: 12px var(--spacing-8); width: 100%; min-width: 0; overflow-x: auto; overflow-y: hidden; -webkit-overflow-scrolling: touch; overscroll-behavior-x: contain; scroll-snap-type: x mandatory; scrollbar-width: none; -ms-overflow-style: none; padding: var(--spacing-12) var(--spacing-8); margin: calc(var(--spacing-12) * -1) calc(var(--spacing-8) * -1); touch-action: pan-x pan-y; } .games-section_root-SVc9f .games-grid_carousel-iixhO::-webkit-scrollbar { display: none; } @media (min-width: 1024px) { .games-section_root-SVc9f .games-grid_carousel-iixhO { gap: 16px var(--spacing-16); } .games-section_root-SVc9f .games-grid_carousel-iixhO > * { scroll-margin: var(--spacing-8); } } .games-section_root-SVc9f .games-grid_carousel-iixhO > .game-card_root-al9vQ, .games-section_root-SVc9f .games-grid_carousel-iixhO > a.game-card_root-al9vQ, .games-section_root-SVc9f .games-grid_carousel-iixhO > .sn-game-card-wrap { flex: 0 0 auto !important; width: var(--sn-lobby-carousel-card-width, clamp(108px, 28vw, 156px)) !important; min-width: var(--sn-lobby-carousel-card-width, clamp(108px, 28vw, 156px)) !important; max-width: none !important; scroll-snap-align: start; } .games-section_root-SVc9f .games-section_header-SVc9f { gap: var(--spacing-8); align-items: center; } .games-section_root-SVc9f .arrows_root-7YoI1 { flex-shrink: 0; display: flex; gap: var(--spacing-4); } @media (max-width: 1023.98px) { .games-section_root-SVc9f .arrows_root-7YoI1 { display: none; } } /* Jackpot swiper (legacy blade hydrate) */ #casino-jackpot .jackpot_slider-8SLfV { z-index: 2; container-type: inline-size; container-name: jackpot-slider; } @media (max-width: 1023.98px) { .sn-jackpot-edge-hide-below-1024 { display: none !important; } } @container jackpot-slider (max-width: 1023px) { #casino-jackpot .slider_root-4hTRI .slider_game-4hTRI { box-sizing: border-box; margin-right: 0 !important; width: calc((100cqw - 2 * var(--spacing-8, 8px)) / 3) !important; flex: 0 0 calc((100cqw - 2 * var(--spacing-8, 8px)) / 3) !important; max-width: none !important; } } #casino-jackpot .slider_root-4hTRI.swiper { width: 100%; overflow: hidden; } #casino-jackpot .slider_root-4hTRI.swiper .swiper-slide.slider_game-4hTRI { flex-shrink: 0; height: auto !important; width: calc(33.3333% - var(--padding-mobile-inline, 12px) * 4 / 3) !important; } @media (min-width: 768px) { #casino-jackpot .slider_root-4hTRI.swiper .swiper-slide.slider_game-4hTRI { width: 79px !important; } } @media (min-width: 1024px) { #casino-jackpot .slider_root-4hTRI.swiper .swiper-slide.slider_game-4hTRI { width: 108px !important; } } @media (min-width: 1440px) { #casino-jackpot .slider_root-4hTRI.swiper .swiper-slide.slider_game-4hTRI { width: 142px !important; } } /* Son kazançlar */ .sn-last-wins-swiper.swiper { width: 100%; min-width: 0; overflow: hidden; } .sn-last-wins-swiper .swiper-slide { width: auto !important; height: auto !important; } /* Freemoney chip scroll */ .freemoney_root-jnsDU .arrows-scroll-view_content-lRygf { -webkit-overflow-scrolling: touch; scroll-snap-type: x proximity; } .freemoney_root-jnsDU .arrows-scroll-view_content-lRygf > * { scroll-snap-align: start; } /* Kategori sekmeleri taşması */ .sticky-search_searchSection-Kiwm1 .arrows-scroll-view_content-lRygf { display: flex; flex-wrap: nowrap; overflow-x: auto; -webkit-overflow-scrolling: touch; min-width: 0; max-width: 100%; } /* Android: yatay şerit kaydırması dikey scroll ile çakışmasın */ .sn-platform-android .games-section_root-SVc9f .games-grid_carousel-iixhO { touch-action: pan-x pan-y pinch-zoom; scroll-snap-type: x proximity; overscroll-behavior-x: contain; } .sn-mobile-touch .games-section_root-SVc9f .games-grid_carousel-iixhO { scroll-padding-inline: 4px; } /* iOS Safari: vw + flex min-width:0 kartları küçültür; sabit genişlik kullan */ @media (max-width: 1023.98px) { html.sn-platform-ios .games-section_root-SVc9f .games-grid_carousel-iixhO > .game-card_root-al9vQ, html.sn-platform-ios .games-section_root-SVc9f .games-grid_carousel-iixhO > a.game-card_root-al9vQ, html.sn-platform-ios .games-section_root-SVc9f .games-grid_carousel-iixhO > .sn-game-card-wrap { flex: 0 0 124px !important; width: 124px !important; min-width: 124px !important; max-width: 124px !important; } html.sn-platform-ios .games-section_root-SVc9f .games-grid_carousel-iixhO > .sn-game-card-wrap > .game-card_root-al9vQ { width: 100% !important; min-width: 0 !important; max-width: none !important; } } @supports (-webkit-touch-callout: none) { @media (max-width: 1023.98px) { .games-section_root-SVc9f .games-grid_carousel-iixhO > .game-card_root-al9vQ, .games-section_root-SVc9f .games-grid_carousel-iixhO > a.game-card_root-al9vQ, .games-section_root-SVc9f .games-grid_carousel-iixhO > .sn-game-card-wrap { flex: 0 0 124px !important; width: 124px !important; min-width: 124px !important; max-width: 124px !important; } } } html.sn-platform-ios .games-section_root-SVc9f .games-grid_carousel-iixhO { touch-action: pan-x pan-y; overscroll-behavior-x: contain; -webkit-overflow-scrolling: touch; }