/* * overlay.css — Oyun kartı hover katmanı (bizim eklememiz; BC CSS'ine dokunmaz) * ----------------------------------------------------------------------------- * BC'de .casinoGameItemBlock (favori/bilgi + oyun adı + Demo/Oyna) yalnız fare * üstüne gelince MOUNT ediliyordu (React). Bizim server-render kartlarımızda blok * her zaman DOM'da → casino-game-layer animasyonu 0→1 çalışıp KALICI görünüyordu. * Burada: default GİZLE, yalnız hover/focus'ta göster (BC'nin doğal davranışı). */ .casinoGameItemContent .casinoGameItemBlock { animation: none !important; opacity: 0; pointer-events: none; transition: opacity .18s ease; } .casinoGameItemContent .casinoGameItem:hover .casinoGameItemBlock, .casinoGameItemContent .casinoGameItem:focus-within .casinoGameItemBlock { opacity: 1; pointer-events: auto; } /* Oyun detay popup'ının "DİĞER OYUNLAR" ızgarası: çekirdek kural masaüstünde * 6 sütun veriyor, popup 600px → kartlar okunamayacak kadar küçülüyordu. * Seçici (0,2,0) ile eşit ağırlıkta ama overlay.css sonra yükleniyor → kazanır. */ .casinoGameDetailsPopup .casinoGamesList { grid-template-columns: repeat(3, 1fr); } /* ----------------------------------------------------------------------------- * Yatay taşma fix (QA D: "banner taşmış / responsive bozuk") * Sağ kenardaki nav öğesinin gizli hover alt-menüsü (.nav-menu-sub, absolute + * visibility:hidden) kapalıyken bile layout'ta yer tutup ~92px yatay scrollbar * yaratıyordu. Hero/slider aslında taşmıyor. Header static olduğu için body'de * overflow-x kısıtı sticky'yi bozmaz. clip: scroll-container yaratmaz (dikey * scroll + sticky güvende), hidden fallback eski tarayıcılar için. */ html, body { overflow-x: hidden !important; overflow-x: clip !important; } /* `.sport-subnav-item` kuralları SİLİNDİ 2026-08-14: SportSubnav.js o sınıfı * basmıyor (`bg-subnav-btn` kullanıyor, casino şeridiyle ORTAK görünüm) — iki * ölü seçici + kimsenin tanımlamadığı bir `--hero-btn-bc` yeşili taşıyorlardı. */ /* ----------------------------------------------------------------------------- * Bonus cüzdanı seçim ekranı (oyun açılırken: "Gerçek parayla / Bonusla") * ----------------------------------------------------------------------------- * İşaretleme operatörün verdiği referans siteden birebir alındı; bu sınıfların * HİÇBİRİ bizim BC paketinde yok (ölçüldü) → kutu ortalanmıyor, düğmeler çıplak * kalıyordu. Buradaki kurallar referansın YALNIZ bu ekrana ait olanları. * * ⚠️ İki uyarlama zorunluydu: * 1) Referans `[class=browser]` (TAM eşleşen html sınıfı) ile masaüstü * ölçülerini veriyor; bizim `` → o seçici hiç tutmaz. * Masaüstü uygulaması olduğu için ölçüler doğrudan temel kurala yazıldı. * 2) Referansın `--b-text` değişkeni bizde YOK; karşılığı `--b-sc` * (arka plan `--b` üzerindeki metin rengi). */ .availableBonusModalHolder { display: flex; flex-direction: column; position: fixed; width: 100%; height: 100%; left: 0; top: 0; z-index: 999; background-color: rgba(var(--b), .8); -webkit-backdrop-filter: blur(20px); backdrop-filter: blur(20px); overflow-y: auto; overflow-x: hidden; padding: 1.6rem; } .availableBonusContent { flex: 0 0 auto; display: flex; justify-content: center; align-items: center; flex-direction: column; margin: auto; width: 100%; color: rgba(var(--b-sc), 1); gap: 32px; max-width: 640px; animation: availableBonusContentShow 480ms ease-in-out; } @keyframes availableBonusContentShow { 0% { transform: translate(0, -8rem); opacity: 0 } 100% { transform: initial; opacity: 1 } } .availableBonusImg { display: block; object-fit: contain; width: 160px } .availableBonusTitle { font-weight: bold; text-align: center; text-transform: uppercase; text-shadow: 0 3px 0 rgba(0, 0, 0, .2); font-size: 30px; line-height: 36px; } .availableBonusTitleDesc { text-align: center; color: rgba(var(--b-sc), .8); font-size: 16px; line-height: 20px; } .availableBonusContent .divider { width: 100%; border-bottom: 2px solid hsla(0, 0%, 100%, .1) } .availableBtnBlock { display: flex; justify-content: center; align-items: center; flex-direction: column; width: 100%; margin: 4px 0; gap: 16px; } .availableBtnBlock.flexRow { flex-direction: row } .availableButton { display: flex; align-items: center; justify-content: center; border: none; outline: none; box-shadow: 0 4px 7px 0 rgba(var(--b), .3); cursor: pointer; width: 100%; transition: opacity 120ms; height: 40px; border-radius: 8px; padding: 0 12px; max-width: 295px; } .availableButton:hover { opacity: .8 } .availableButton:active { transform: scale(.98) } .availableButton.type-2 { background-color: var(--gold, #eecd24); color: #05060a } .availableButton.type-4 { background-color: hsla(0, 0%, 100%, .15); color: #fff } .availableButtonText { color: inherit; text-transform: uppercase; font-weight: 600; font-size: 12px; line-height: 16px; letter-spacing: 1px; } /* ----------------------------------------------------------------------------- * HEADER NAVİGASYONU — ana navbar + altındaki casino/spor şeridi + açılır menü. * * 🔴 Neden BURADA, custom.css'te DEĞİL: bu tasarım üç turdur custom.css'ten * `!important` yığarak deneniyordu ve her seferinde ya paket ya custom.css'in * kendi eski reset'i kazanıyordu. Sınıflar artık BİZİM (`bg-*`, işaretlemeye * Header.js / CasinoSubnav.js / SportSubnav.js'ten eklendi) ve bu dosya paketten * SONRA yükleniyor (Kabuk.js: custom.css → sayfa CSS'i → overlay.css) — tek * `!important` gerekmiyor, `#root` öneki eşit özgüllükteki paket kurallarını * geçmeye yetiyor. * * Kutu geometrisi (yükseklik/padding/flex payı) PAKETTEN + custom.css'teki * yayılım kuralından; burada yalnız YÜZEY var (zemin, çerçeve, renk, geçiş). * ---------------------------------------------------------------------------*/ /* 🔴 ANA NAV giydirmesi KALDIRILDI (istek): `.bg-nav*` ve açılır panel * (`.bg-nav-panel*`) kuralları silindi — ana navbar ve alt menü artık paketin * kendi stiliyle çiziliyor. İşaretlemedeki `bg-nav-*` sınıfları duruyor (zararsız, * geri açmak istenirse tutamak). Alt şerit (casino/spor) kuralları aşağıda korundu. */ #root .bg-subnav { border-radius: 0 0 var(--border-radius, 4px) var(--border-radius, 4px); margin: 0; padding: 4px 10px; } /* KRİTİK: satırlar