/* =========================================================
   SALTBAHIS – GREEN PREMIUM THEME (TEK PARÇA) | REV-3 (DESKTOP WEB)
   Bu CSS: siteyi tek temaya toplar (arka plan, header, butonlar, paneller, inputlar, popup vb.)
   ========================================================= */

/* =========================================================
   1) THEME TOKENS (ANA AYARLAR)  ✅ EN ÖNEMLİ KISIM
   Burayı tema kumandası gibi düşün:
   - Renkleri buradan değiştirirsen tüm site etkilenir.
   - "glass/panel" koyuluk ayarları da burada.
   ========================================================= */
:root{
  /* ✅ Arka plan gradient (site genel arka planı) */
  --g1: rgba(5, 33, 14, 0.98);   /* sol/sağ ton */
  --g2: rgba(7, 57, 22, 0.98);   /* orta ton */

  /* ✅ Genel metin renkleri */
  --txt: rgba(255,255,255,.92);   /* ana yazı */
  --txt2: rgba(255,255,255,.72);  /* açıklama/ikincil yazı */
  --muted: rgba(255,255,255,.60); /* daha soluk yazı */

  /* ✅ Cam/panel koyuluk (sen koyulaştırdın) */
  --glass: rgba(0,0,0,.80); /* cam hissi (overlay/panel gibi yerler) */
  --panel: rgba(6,10,7,.72);  /* kart/panel arka planı */
  --panel2: rgba(6,10,7,.84); /* daha güçlü panel (kupon gibi) */

  /* ✅ Kenarlık (border) tonları */
  --stroke: rgba(180,255,120,.16);  /* yeşilimsi border */
  --stroke2: rgba(255,255,255,.10); /* beyazımsı border */

  /* ✅ Neon renkler (özellikle Kayıt butonu) */
  --neon1: rgba(129,251,109,.95);
  --neon2: rgba(129,251,109,.95);
  --accent: rgba(129,251,109,.95);

  /* ✅ Durum renkleri (uyarı, hata vb. - bazı ekranlarda lazım olur) */
  --success: rgba(129,251,109,.95);
  --warn: rgba(255,214,84,.95);
  --danger: rgba(255,92,92,.92);

  /* ✅ Köşe yuvarlaklığı, gölge, focus halkası (tüm sitede hissi belirler) */
  --radius: 14px;     /* büyük radius */
  --radius2: 12px;    /* input gibi yerlerde */
  --shadow: 0 14px 34px rgba(0,0,0,.40);
  --shadow2: 0 10px 26px rgba(0,0,0,.32);
  --ring: 0 0 0 3px rgba(129,251,109,.18); /* input focus halkası */

  /* ✅ Buton ölçüleri (site genel buton boyu/padding) */
  --btn-h: 36px;
  --btn-pad: 0 12px;

  /* ✅ Sayfa içeriğinin genişliği (%90 = yanlardan boşluk) */
  --container: 90%;
}

/* =========================================================
   2) GLOBAL BACKGROUND + TEMEL RESET
   ✅ Etkisi: Her sayfada arka plan + genel link rengi + scroll bar
   ========================================================= */
html, body{
  /* ✅ Site arka planı: g1-g2 gradient */
  background: linear-gradient(90deg, var(--g1) 0%, var(--g2) 50%, var(--g1) 100%) !important;

  /* ✅ Genel yazı rengi */
  color: var(--txt) !important;
}

/* ✅ Tüm elementlerde box-model tutarlı olsun */
*{ box-sizing: border-box; }

/* ✅ Linkler beyaz ton olsun */
a{ color: var(--txt) !important; }
a:hover{ filter: brightness(1.06) !important; }

/* ✅ Yazı seçince yeşil ton gözüksün */
::selection{
  background: rgba(129,251,109,.25) !important;
}

/* ✅ Scrollbar görünümü (Chrome/Edge) */
*::-webkit-scrollbar{ width: 10px; height: 10px; }
*::-webkit-scrollbar-thumb{
  background: rgba(129,251,109,.20);
  border-radius: 999px;
  border: 2px solid rgba(0,0,0,.35);
}
*::-webkit-scrollbar-track{ background: rgba(0,0,0,.18); }

/* =========================================================
   3) ANA WRAPPER'LAR ŞEFFAF KALSIN
   ✅ Etkisi: Betconstruct container'ları beyaz yapmasın, alttaki gradient görünsün
   ========================================================= */
#root,
#app,
.app,
.layout,
.layout-wrapper-bc,
.layout-content-bc,
.main-content-bc,
.page-content-bc{
  background: transparent !important;
  color: var(--txt) !important;
}

/* =========================================================
   4) GENEL CONTAINER / ORTA ALAN GENİŞLİĞİ
   ✅ Etkisi: İçerik sayfaları %90 genişlikte ortalanır
   ========================================================= */
:where(.layout-content-holder-bc, .layout-content-bc, .layout-content-holder, .page-content-bc){
  width: var(--container) !important;   /* burayı 100% yaparsan tam geniş olur */
  margin-left: auto !important;
  margin-right: auto !important;
}

/* ✅ Home sayfası için aynı genişlik */
:is(.is-home, .is-home-page) > div.layout-content-holder-bc{
  width: var(--container) !important;
  margin: 0 auto !important;
}

/* =========================================================
   5) HEADER (ÜST BÖLÜM) + ALT NAV ŞERİTLER
   ✅ Etkisi: header arka planı yeşil gradient + gölge
   ========================================================= */
.hdr-main-content-bc{
  background: linear-gradient(90deg, var(--g1) 0%, var(--g2) 50%, var(--g1) 100%) !important;
  border: 0 !important;
  box-shadow: var(--shadow2) !important;
}
.hdr-main-content-bc,
.hdr-main-content-bc *{
  color: #fff !important;
}

/* ✅ Header alt bandları: menü/nav şeritleri */
:where(.hdr-main-nav-bc, .hdr-nav-bc, .hdr-menu-bc, .hdr-bottom-bc, .hdr-subnav-bc, .hdr-secondary-bc){
  background: linear-gradient(90deg, rgba(0,0,0,.30) 0%, rgba(0,0,0,.18) 50%, rgba(0,0,0,.30) 100%) !important;
  border-top: 1px solid rgba(129,251,109,.10) !important;
  border-bottom: 1px solid rgba(255,255,255,.06) !important;
}

/* =========================================================
   6) BUTON SİSTEMİ (Site genelinde)
   ✅ Etkisi: Birçok butona radius + hover/active hissi
   Not: Buton çok farklı class ile gelirse hedeflenmeyebilir.
   ========================================================= */

/* ✅ Genel: tüm butonlarda radius */
:where(button, .btn, a.btn){
  border-radius: var(--radius) !important;
  -webkit-tap-highlight-color: transparent !important;
}

/* ✅ Primary/Action gibi butonlar: boyut + font + gölge */
:where(
  .btn-primary, .primary, .btn.action, .btn.confirm, .btn-ok,
  .casino-popup-button-block .btn,
  .layout-betslip-holder-bc .btn
){
  height: var(--btn-h) !important;
  padding: var(--btn-pad) !important;
  font-weight: 900 !important;
  letter-spacing: .2px !important;
  border-radius: var(--radius) !important;
  box-shadow: inset 0 1px rgba(255,255,255,.12), 0 10px 22px rgba(0,0,0,.22) !important;
  transition: transform .12s ease, filter .12s ease, box-shadow .12s ease !important;
}

/* ✅ Secondary/ghost gibi butonlar: daha koyu cam */
:where(.btn-secondary, .secondary, .btn.cancel, .btn-close, .btn.ghost){
  background: rgba(0,0,0,.22) !important;
  color: rgba(255,255,255,.92) !important;
  border: 1px solid rgba(160,255,140,.30) !important;
}

/* ✅ Buton hover/active animasyonları */
:where(button, .btn, a.btn):hover{ filter: brightness(1.04) !important; }
:where(button, .btn, a.btn):active{ transform: scale(.99) !important; }

/* =========================================================
   7) GİRİŞ / KAYIT BUTONLARI (Header’daki) - özel
   ✅ Etkisi: Sadece header'daki giriş/kayıt butonları
   ========================================================= */
:where(
  .btn.sign-in,
  .btn.register,
  button[title="GİRİŞ"],
  button[title="Kayıt"],
  a[title="GİRİŞ"],
  a[title="Kayıt"],
  .hdr-user-bc .btn.s-small.sign-in,
  .hdr-user-bc .btn.s-small.register
){
  border-radius: var(--radius) !important;
  font-weight: 900 !important;
  letter-spacing: .2px !important;
  text-transform: none !important;
  box-shadow: none !important;
  -webkit-tap-highlight-color: transparent !important;
  transition: transform .12s ease, filter .12s ease, box-shadow .12s ease !important;
}

/* ✅ Butonlar yan yana */
.hdr-user-bc{
  display:flex !important;
  gap:10px !important;
  align-items:center !important;
}

/* ✅ Header giriş/kayıt buton boyutları */
.hdr-user-bc :where(.btn.sign-in, .btn.register, .btn.s-small.sign-in, .btn.s-small.register){
  width: 92px !important;
  height: 34px !important;
  padding: 0 !important;
}

/* ✅ GİRİŞ butonu: koyu cam */
:where(.btn.sign-in, button[title="GİRİŞ"], a[title="GİRİŞ"]){
  background: rgba(0,0,0,.28) !important;
  color: rgba(255,255,255,.96) !important;
  border: 1px solid rgba(160,255,140,.38) !important;
  box-shadow: inset 0 1px rgba(255,255,255,.07), 0 10px 22px rgba(0,0,0,.22) !important;
}

/* ✅ KAYIT butonu: neon gradient */
:where(.btn.register, button[title="Kayıt"], a[title="Kayıt"]){
  background: linear-gradient(90deg, var(--neon1) 0%, var(--neon2) 100%) !important;
  border: 1px solid rgba(255,255,255,.16) !important;
  box-shadow: inset 0 1px rgba(255,255,255,.12), 0 10px 22px rgba(0,0,0,.22) !important;
}

/* ✅ Kayıt yazısı her zaman siyah */
:where(.btn.register, button[title="Kayıt"], a[title="Kayıt"]),
:where(.btn.register, button[title="Kayıt"], a[title="Kayıt"]) *{
  color: #000 !important;
  -webkit-text-fill-color: #000 !important;
  text-shadow: none !important;
}
:where(.btn.register, button[title="Kayıt"], a[title="Kayıt"]) span{
  font-weight: 900 !important;
}

/* =========================================================
   8) PANEL / KART SİSTEMİ
   ✅ Etkisi: Kart/panel/box/widget gibi kutuları cam temaya çeker
   ========================================================= */
:where(
  .card, .panel, .widget, .box,
  .casino-card, .casino-tile, .casino-game-card,
  .wallet-block, .wallet-card,
  .promo-card, .promo-item,
  .content-box, .content-block,
  .status-popup-content-w-bc,
  .popup-inner-bc
){
  background: linear-gradient(180deg, var(--panel) 0%, rgba(0,0,0,.18) 100%) !important;
  border: 1px solid var(--stroke) !important;
  border-radius: var(--radius) !important;
  box-shadow: var(--shadow2) !important;
  color: var(--txt) !important;
}

/* ✅ Başlıklar */
:where(h1,h2,h3,h4,h5,h6){
  color: rgba(255,255,255,.94) !important;
}
/* ✅ açıklama metinleri */
:where(.subtitle, .muted, .desc, .hint){
  color: var(--txt2) !important;
}

/* ✅ ayırıcı çizgiler */
:where(hr, .divider, .line, .separator){
  border-color: rgba(255,255,255,.08) !important;
  opacity: 1 !important;
}

/* =========================================================
   9) FORM / INPUT SİSTEMİ
   ✅ Etkisi: login, wallet, kupon stake inputları
   ========================================================= */
:where(input[type="text"], input[type="password"], input[type="email"], input[type="number"], textarea, select){
  background: rgba(0,0,0,.28) !important;
  color: rgba(255,255,255,.92) !important;
  border: 1px solid rgba(255,255,255,.12) !important;
  border-radius: var(--radius2) !important;
  outline: none !important;
  box-shadow: none !important;
}

/* ✅ placeholder yazısı */
:where(input, textarea, select)::placeholder{
  color: rgba(255,255,255,.55) !important;
}

/* ✅ focus olunca yeşil halka */
:where(input[type="text"], input[type="password"], input[type="email"], input[type="number"], textarea, select):focus{
  border-color: rgba(129,251,109,.55) !important;
  box-shadow: var(--ring) !important;
}

/* ✅ Hata olan alanlarda kırmızı border */
:where(.error, .is-error, .has-error) :where(input, textarea, select){
  border-color: rgba(255,92,92,.55) !important;
  box-shadow: 0 0 0 3px rgba(255,92,92,.14) !important;
}

/* ✅ Başarılı alanlarda yeşil border */
:where(.success, .is-success) :where(input, textarea, select){
  border-color: rgba(129,251,109,.55) !important;
  box-shadow: 0 0 0 3px rgba(129,251,109,.14) !important;
}

/* ✅ checkbox/radio rengi */
:where(input[type="checkbox"], input[type="radio"]){
  accent-color: rgba(129,251,109,.95) !important;
}

/* =========================================================
   10) TABLO 'GENEL' / ODDS SATIRLARI
   ✅ Etkisi: sportsbook liste satırları + hover + odds butonları (genel class yakalama)
   ========================================================= */
:where(
  table, .table, .odds-table, .markets-table,
  .events-table, .sportsbook-table
){
  color: var(--txt) !important;
}

/* ✅ satırlar */
:where(
  .row, .table-row, .event-row, .market-row, .odds-row,
  .event-item, .match-row
){
  background: rgba(0,0,0,.14) !important;
  border-bottom: 1px solid rgba(255,255,255,.07) !important;
}

/* ✅ satır hover */
:where(
  .row, .table-row, .event-row, .market-row, .odds-row,
  .event-item, .match-row
):hover{
  background: rgba(129,251,109,.08) !important;
}

/* ✅ selected/active yakalama */
:where(.selected, .is-selected, .active, .is-active){
  background: rgba(129,251,109,.10) !important;
  border-color: rgba(129,251,109,.22) !important;
}

/* ✅ odds butonları (genel class yakalama) */
:where(.odd, .odds, .odd-btn, .odds-btn, .bet-button, .coef, .coefficient){
  background: rgba(0,0,0,.22) !important;
  border: 1px solid rgba(255,255,255,.10) !important;
  border-radius: 12px !important;
  color: rgba(255,255,255,.92) !important;
  transition: transform .12s ease, filter .12s ease, border-color .12s ease !important;
}
:where(.odd, .odds, .odd-btn, .odds-btn, .bet-button, .coef, .coefficient):hover{
  border-color: rgba(129,251,109,.35) !important;
  filter: brightness(1.05) !important;
}
:where(.odd.selected, .odds.selected, .odd-btn.selected, .odds-btn.selected, .bet-button.selected, .coef.selected, .coefficient.selected,
       .odd.active, .odds.active, .odd-btn.active, .odds-btn.active, .bet-button.active, .coef.active, .coefficient.active){
  background: rgba(129,251,109,.18) !important;
  border-color: rgba(129,251,109,.55) !important;
}

/* =========================================================
   11) BETSLIP / KUPON
   ✅ Etkisi: sağdaki kupon alanı ve içindeki satırlar
   ========================================================= */
:where(.layout-betslip-holder-bc, .betslip, .bet-slip, .betslip-holder){
  background: transparent !important;
}

/* ✅ kupon iç paneli */
:where(.layout-betslip-holder-bc .panel, .layout-betslip-holder-bc .card, .layout-betslip-holder-bc .betslip-content, .layout-betslip-holder-bc .betslip-inner){
  background: linear-gradient(180deg, var(--panel2) 0%, rgba(0,0,0,.22) 100%) !important;
  border: 1px solid rgba(129,251,109,.18) !important;
  border-radius: var(--radius) !important;
  box-shadow: var(--shadow) !important;
}

/* ✅ kupon iç satır */
:where(.layout-betslip-holder-bc .row, .layout-betslip-holder-bc .item, .layout-betslip-holder-bc .betslip-row, .layout-betslip-holder-bc .selection){
  background: rgba(0,0,0,.16) !important;
  border: 1px solid rgba(255,255,255,.06) !important;
  border-radius: 12px !important;
}

/* ✅ kupon iç inputlar */
:where(.layout-betslip-holder-bc input, .layout-betslip-holder-bc select, .layout-betslip-holder-bc textarea){
  background: rgba(0,0,0,.30) !important;
  border-color: rgba(255,255,255,.14) !important;
}

/* ✅ kupondaki ana aksiyon butonu (bahis yap gibi) */
:where(.layout-betslip-holder-bc .btn-primary, .layout-betslip-holder-bc .place-bet, .layout-betslip-holder-bc .bet-now, .layout-betslip-holder-bc .btn.action){
  background: linear-gradient(90deg, var(--neon1) 0%, var(--neon2) 100%) !important;
  border: 1px solid rgba(255,255,255,.16) !important;
  color: #000 !important;
  -webkit-text-fill-color: #000 !important;
  font-weight: 950 !important;
}

/* =========================================================
   12) DROPDOWN / MENU (genel)
   ✅ Etkisi: dropdown menüler, açılır listeler
   ========================================================= */
:where(.dropdown, .select, .menu, .dropdown-menu, .menu-dropdown, .popup-menu){
  background: rgba(10,18,12,.86) !important;
  border: 1px solid rgba(129,251,109,.18) !important;
  border-radius: var(--radius) !important;
  box-shadow: var(--shadow) !important;
  color: var(--txt) !important;
}
:where(.dropdown-item, .menu-item, .option, .select-option):hover{
  background: rgba(129,251,109,.10) !important;
}

/* =========================================================
   13) POPUP / MODAL
   ✅ Etkisi: popup overlay, popup kutusu, başlık, checkbox, close ikonu
   ========================================================= */

/* ✅ overlay (arka karartma) */
:where(.popup-holder-bc){
  background: rgba(0,0,0,.55) !important;
  backdrop-filter: blur(6px) !important;
}

/* ✅ popup kutusu */
:where(.popup-inner-bc){
  background: linear-gradient(180deg, rgba(10,18,12,.82) 0%, rgba(0,0,0,.30) 100%) !important;
  border: 1px solid rgba(129,251,109,.18) !important;
  border-radius: var(--radius) !important;
  box-shadow: var(--shadow) !important;
  overflow: hidden !important;
}

/* ✅ popup içerik padding */
:where(.status-popup-content-w-bc){
  padding: 16px !important;
}

/* ✅ popup başlık */
:where(.casino-popup-title){
  color: rgba(255,255,255,.95) !important;
  font-weight: 950 !important;
  letter-spacing: .2px !important;
  margin-bottom: 10px !important;
}

/* ✅ popup metin */
:where(.casino-popup-content){
  color: rgba(255,255,255,.80) !important;
}

/* ✅ popup checkbox yazısı */
:where(.checkbox-control-content-bc.popup-checkbox){
  color: rgba(255,255,255,.86) !important;
}

/* ✅ popup buton alanı */
:where(.casino-popup-button-block){
  display: flex !important;
  gap: 10px !important;
  align-items: center !important;
}

/* ✅ close ikonu */
#close_popup_button_id{
  cursor: pointer !important;
}
:where(.e-p-close-icon-bc){
  color: rgba(255,255,255,.85) !important;
  opacity: .9 !important;
  transition: transform .12s ease, opacity .12s ease, filter .12s ease !important;
}
:where(.e-p-close-icon-bc):hover{
  opacity: 1 !important;
  filter: brightness(1.08) !important;
  transform: scale(1.04) !important;
}

/* ✅ popup içindeki görseller taşmasın */
:where(.popup-inner-bc img, .status-popup-content-w-bc img){
  max-width: 100% !important;
  height: auto !important;
  display: block !important;
}

/* =========================================================
   14) TOAST / BİLDİRİM
   ✅ Etkisi: sağ üstte çıkan bildirimler (Toastify)
   ========================================================= */
:where(.Toastify, .Toastify__toast){
  color: rgba(255,255,255,.92) !important;
}
:where(.Toastify__toast){
  background: rgba(10,18,12,.86) !important;
  border: 1px solid rgba(129,251,109,.18) !important;
  border-radius: var(--radius) !important;
  box-shadow: var(--shadow2) !important;
}
:where(.Toastify__toast--success){
  border-color: rgba(129,251,109,.35) !important;
}
:where(.Toastify__toast--error){
  border-color: rgba(255,92,92,.35) !important;
}
:where(.Toastify__progress-bar){
  background: rgba(129,251,109,.55) !important;
}

/* =========================================================
   15) FOOTER (genel)
   ✅ Etkisi: footer arka planı ve üst çizgi
   ========================================================= */
:where(.layout-footer-holder-bc, footer, .footer){
  background: rgba(0,0,0,.18) !important;
  border-top: 1px solid rgba(255,255,255,.06) !important;
  color: rgba(255,255,255,.80) !important;
}

/* =========================================================
   16) RECAPTCHA BADGE
   ✅ Etkisi: sağ alttaki captcha rozeti (görünümünü yumuşatır)
   ========================================================= */
.grecaptcha-badge{
  filter: grayscale(1) opacity(.55) !important;
}

/* =========================================================
   SPORTSBOOK - UPCOMING / FILTERS (senin class'lara özel)
   ✅ Etkisi: "yaklaşan maçlar" filtresi ve market filtre kutuları
   ========================================================= */

/* ✅ upcoming container ve scroll container kutu gibi dursun */
.upcoming-games-container,
.widget-scroll-container{
  background: linear-gradient(180deg, var(--panel) 0%, rgba(0,0,0,.18) 100%) !important;
  border: 1px solid var(--stroke) !important;
  border-radius: var(--radius) !important;
  box-shadow: var(--shadow2) !important;
}

/* ✅ üstteki time filter bar */
.time-filters-bc{
  background: rgba(0,0,0,.20) !important;
  border-bottom: 1px solid rgba(255,255,255,.06) !important;
  border-radius: var(--radius) var(--radius) 0 0 !important;
  padding: 10px 12px !important;
}

/* ✅ yatay listede gap */
.horizontal-sl-list{
  gap: 8px !important;
}

/* ✅ market filter alanı (genel kutu) */
.market-filter-bc{
  background: rgba(0,0,0,.16) !important;
  border: 1px solid rgba(255,255,255,.06) !important;
  border-radius: 12px !important;
  padding: 10px 12px !important;
}

/* ✅ MS1/MS2 gibi küçük hücreler */
.market-filter-cell-bc{
  background: rgba(0,0,0,.20) !important;
  border: 1px solid rgba(255,255,255,.07) !important;
  border-radius: 12px !important;
  padding: 8px 10px !important;
}

/* ✅ MS1/MS2 metin */
.market-filter-info-bc{
  color: rgba(255,255,255,.88) !important;
  font-weight: 800 !important;
}

/* ✅ hover ve selected durum */
.market-filter-cell-bc:hover{
  border-color: rgba(129,251,109,.28) !important;
  background: rgba(129,251,109,.08) !important;
}
.market-filter-cell-bc.active,
.market-filter-cell-bc.selected{
  border-color: rgba(129,251,109,.45) !important;
  background: rgba(129,251,109,.14) !important;
}

/* =========================================================
   HEADER (header-bc) = hdr-main-content-bc ile aynı renk
   Hedef: Header'da gri kalan yerler de ana yeşil gradient olsun
   ========================================================= */

/* header-bc alanını, hdr-main-content-bc ile aynı background yap */
header.header-bc{
  background: linear-gradient(90deg, var(--g1) 0%, var(--g2) 50%, var(--g1) 100%) !important;
  border: 0 !important;
  box-shadow: var(--shadow2) !important;
}

/* header içindeki olası gri katmanları da kır (menü şeritleri) */
header.header-bc :where(.nav-content-bc, .nav-content-menu, nav.nav-menu-container.header-navigation){
  background: rgba(0,0,0,.18) !important;
  border-top: 1px solid rgba(129,251,109,.10) !important;
  border-bottom: 1px solid rgba(255,255,255,.06) !important;
}

/* =========================================================
   HEADER NAV: SADECE BG = hdr-main-content-bc rengi + ayırıcı çizgi
   ========================================================= */

/* Menü alanının BG'sini header ana rengiyle eşitle */
.nav-content-bc,
.nav-content-menu,
nav.nav-menu-container.header-navigation{
  background: linear-gradient(90deg, var(--g1) 0%, var(--g2) 50%, var(--g1) 100%) !important;
  border: 0 !important;
}

/* Menü listelerindeki item'lar arası çizgi (butonlar belli olsun) */
nav.nav-menu-container.header-navigation ul.nav-menu > li,
nav.nav-menu-container.header-navigation ul.nav-menu-other > li{
  position: relative !important;
}

/* Her item'dan sonra ince çizgi (sonuncu hariç) */
nav.nav-menu-container.header-navigation ul.nav-menu > li:not(:last-child)::after,
nav.nav-menu-container.header-navigation ul.nav-menu-other > li:not(:last-child)::after{
  content: "" !important;
  position: absolute !important;
  right: -6px !important;        /* çizgiyi araya taşı */
  top: 50% !important;
  transform: translateY(-50%) !important;
  width: 1px !important;
  height: 20px !important;
  background: rgba(255,255,255,.14) !important;  /* istersen yeşil yap: rgba(129,251,109,.18) */
}

/* Çizgi ile item çakışmasın diye hafif aralık */
nav.nav-menu-container.header-navigation ul.nav-menu,
nav.nav-menu-container.header-navigation ul.nav-menu-other{
  gap: 12px !important;
}
/* =========================================================
   HEADER NAV - Hover'da gri olmasın (premium yeşil/cam kalsın)
   ========================================================= */

/* Hover olan item veya linke gelen gri background'u kapat */
nav.nav-menu-container.header-navigation :where(li:hover, li:hover > a, a:hover){
  background: transparent !important;        /* griyi sıfırla */
  box-shadow: none !important;
}

/* Hover'da hafif premium vurgu (istersen tamamen kaldırabilirsin) */
nav.nav-menu-container.header-navigation :where(li:hover){
  filter: brightness(1.04) !important;       /* sadece hafif parlaklık */
}

/* Active/selected durumunda da gri yerine aynı tema */
nav.nav-menu-container.header-navigation :where(li.active, li.selected, li.is-active, li.is-selected,
                                                li.active > a, li.selected > a){
  background: transparent !important;
  filter: brightness(1.06) !important;
}





/* =========================================================
   HEADER SUB MENU (nav-menu-sub) - aynı yeşil BG + çizgi + hover gri yok
   ========================================================= */

/* Alt menü kutusu (dropdown) */
ul.nav-menu-sub{
  background: linear-gradient(90deg, var(--g1) 0%, var(--g2) 50%, var(--g1) 100%) !important;
  border: 1px solid rgba(255,255,255,.10) !important;
  border-radius: var(--radius) !important;
  box-shadow: var(--shadow2) !important;
  overflow: hidden !important;
}

/* Alt menü item'ları */
ul.nav-menu-sub > li{
  position: relative !important;
  background: transparent !important;
}

/* Item içindeki link/yazı */
ul.nav-menu-sub > li :where(a, span){
  color: rgba(255,255,255,.92) !important;
  background: transparent !important;
}

/* Item’lar arası ince çizgi */
ul.nav-menu-sub > li:not(:last-child)::after{
  content: "" !important;
  position: absolute !important;
  left: 12px !important;
  right: 12px !important;
  bottom: 0 !important;
  height: 1px !important;
  background: rgba(255,255,255,.14) !important; /* istersen yeşil: rgba(129,251,109,.18) */
}

/* Hover’da gri olmasın */
ul.nav-menu-sub > li:hover,
ul.nav-menu-sub > li:hover :where(a, span){
  background: transparent !important;
  filter: brightness(1.04) !important; /* istersen kaldır */
}



/* =========================================================
   PARA YATIR: yazı + ikon SİYAH
   ========================================================= */
.header-custom-buttons a.btn.a-color.header-icon-text[aria-label="PARA YATIR"]{
  color: #000 !important;
  -webkit-text-fill-color: #000 !important;
  text-shadow: none !important;
}

/* İçindeki ikon (i / svg / img) siyah */
.header-custom-buttons a.btn.a-color.header-icon-text[aria-label="PARA YATIR"] :where(i, svg){
  color: #000 !important;
  fill: #000 !important;
  filter: none !important;
}

/* Eğer ikon font-icon ise (::before ile geliyorsa) onu da siyah yap */
.header-custom-buttons a.btn.a-color.header-icon-text[aria-label="PARA YATIR"] i::before{
  color: #000 !important;
}


/* ERROR PAGE alanını tamamen kaldır */
.error-page{
  display: none !important;
}


/* Casino provider satırı: BG = site BG (ana gradient) */
.casinoProviderRow{
  background: linear-gradient(90deg, var(--g1) 0%, var(--g2) 50%, var(--g1) 100%) !important;
}


/* Casino oyun listesi header: BG = site BG (ana gradient) */
.casinoGameListBlockHeader,
.casinoGameListBlockHeader .casinoTitleSearch{
  background: linear-gradient(90deg, var(--g1) 0%, var(--g2) 50%, var(--g1) 100%) !important;
}

/* İçteki wrapper'lar koyu kutu basmasın */
.casinoGameListBlockHeader :where(.selectedProviderBlock, .casinoInputWrp){
  background: transparent !important;
}

/* Arama input alanı: cam gibi ama siteyle uyumlu */
.casinoGameListBlockHeader .searchInputWrp{
  background: rgba(0,0,0,.22) !important;
  border: 1px solid rgba(255,255,255,.10) !important;
  border-radius: 12px !important;
}

/* Input yazı/placeholder */
.casinoGameListBlockHeader .searchInput{
  background: transparent !important;
  color: rgba(255,255,255,.92) !important;
}
.casinoGameListBlockHeader .searchInput::placeholder{
  color: rgba(255,255,255,.60) !important;
}

/* Sağdaki sort icon butonu */
.casinoGameListBlockHeader .iconButtonBlock{
  background: rgba(0,0,0,.22) !important;
  border: 1px solid rgba(255,255,255,.10) !important;
  border-radius: 12px !important;
}


/* =========================================================
   CASINO CATEGORY SLIDER: BG = site BG + butonlar siteye uygun
   Hedef: .casinoProviderContent içindeki yatay kategori barı
   ========================================================= */

/* 1) Bu alanın arka planı site BG ile aynı olsun */
.casinoProviderContent,
.casinoCategoryChooserContainer,
.horizontalSliderWrp,
.horizontalSliderRow{
  background: linear-gradient(90deg, var(--g1) 0%, var(--g2) 50%, var(--g1) 100%) !important;
  border: 0 !important;
}

/* 2) Kutu görünümü istemiyorsun: item'larda arka plan/border kapat */
:where(.horizontalCategoryItemWrp, .horizontalCategoryItemWrp, .horizontalCategoryItemWrp, .horizontalCategoryItemWrp),
:where(.horizontalCategoryItem, .horizontalCategoryItem){
  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
}

/* 3) Yazı/ikon siteyle uyumlu */
:where(.horizontalCategoryItemWrp, .horizontalCategoryItemWrp) :where(.horCatItemTitle, p){
  color: rgba(255,255,255,.88) !important;
  font-weight: 850 !important;
  letter-spacing: .15px !important;
}
:where(.horizontalCategoryItemWrp, .horizontalCategoryItemWrp) :where(i, svg){
  color: rgba(255,255,255,.88) !important;
  fill: rgba(255,255,255,.88) !important;
}

/* 4) Hover: gri olmasın, sadece hafif parlaklık */
:where(.horizontalCategoryItemWrp, .horizontalCategoryItemWrp):hover{
  filter: brightness(1.07) !important;
}

/* 5) Active: premium ama kutusuz (alt çizgi + çok hafif üst ışık) */
:where(.horizontalCategoryItemWrp, .horizontalCategoryItemWrp).active{
  position: relative !important;
}
:where(.horizontalCategoryItemWrp, .horizontalCategoryItemWrp).active::after{
  content: "" !important;
  position: absolute !important;
  left: 12px !important;
  right: 12px !important;
  bottom: 6px !important;
  height: 2px !important;
  border-radius: 999px !important;
  background: rgba(129,251,109,.78) !important;
  box-shadow: 0 0 14px rgba(129,251,109,.20) !important;
}
:where(.horizontalCategoryItemWrp, .horizontalCategoryItemWrp).active::before{
  content: "" !important;
  position: absolute !important;
  left: 14px !important;
  right: 14px !important;
  top: 6px !important;
  height: 1px !important;
  background: rgba(255,255,255,.10) !important;
}

/* 6) Active yazı/ikon biraz daha net */
:where(.horizontalCategoryItemWrp, .horizontalCategoryItemWrp).active :where(.horCatItemTitle, p, i, svg){
  color: rgba(255,255,255,.96) !important;
  fill: rgba(255,255,255,.96) !important;
}

/* 7) Ok butonları (sağ/sol slider okları) siteye uyumlu */
.horizontalSliderWrp :where(.horizontalSliderNav, .horizontalSliderNav i, .horizontalSliderNav svg){
  color: rgba(255,255,255,.90) !important;
  fill: rgba(255,255,255,.90) !important;
}
.horizontalSliderWrp .horizontalSliderNav{
  background: rgba(0,0,0,.22) !important;
  border: 1px solid rgba(255,255,255,.10) !important;
  border-radius: 999px !important;
}
.horizontalSliderWrp .horizontalSliderNav:hover{
  filter: brightness(1.06) !important;
  border-color: rgba(129,251,109,.22) !important;
}




/* =========================================================
   HEADER NAV: daha uzun + butonlar ortalı
   ========================================================= */

/* 1) Menü bandını yükselt */
.nav-content-bc,
.nav-content-menu{
  min-height: 56px !important;           /* uzat (istersen 60 yap) */
  display: flex !important;
  align-items: center !important;        /* dikey ortalama */
}

/* 2) Menü container ortalansın */
nav.nav-menu-container.header-navigation{
  width: 100% !important;
  display: flex !important;
  align-items: center !important;        /* dikey ortalama */
  justify-content: center !important;    /* yatay ortalama */
}

/* 3) UL’ler (menü listeleri) ortalı ve aynı hizada */
nav.nav-menu-container.header-navigation :where(ul.nav-menu, ul.nav-menu-other){
  display: flex !important;
  align-items: center !important;        /* dikey ortalama */
  justify-content: center !important;    /* yatay ortalama */
  gap: 14px !important;                  /* buton arası boşluk */
  height: 56px !important;               /* band yüksekliğiyle eşitle */
}

/* 4) LI’lar bandın yüksekliğine uyup ortalansın */
nav.nav-menu-container.header-navigation :where(ul.nav-menu > li, ul.nav-menu-other > li){
  display: flex !important;
  align-items: center !important;
  height: 56px !important;
}

/* 5) Link (buton) tıklama alanını büyüt */
nav.nav-menu-container.header-navigation a.nav-menu-item{
  display: inline-flex !important;
  align-items: center !important;        /* icon + yazı ortalı */
  gap: 8px !important;
  padding: 0 14px !important;            /* genişlik hissi */
  height: 44px !important;               /* buton yüksekliği */
  line-height: 44px !important;
}

/* =========================================================
   License seal: kırpılmadan %30 büyüt + ortala (scale yok)
   ========================================================= */

/* Elemanın kendi inline max-width'ünü ez ve büyüt */
a[aria-label="View license details"]{
  display: block !important;
  margin: 0 auto !important;     /* ortala */

  width: 125px !important;       /* 96px * 1.3 ≈ 125px */
  max-width: none !important;    /* inline max-width:96px'i kır */
  height: auto !important;

  background-size: contain !important;     /* zaten var, garanti */
  background-position: center !important;
  background-repeat: no-repeat !important;
}

/* Kırpılma varsa: parent'larda overflow'u aç */
a[aria-label="View license details"]{
  overflow: visible !important;
}
a[aria-label="View license details"] *{
  overflow: visible !important;
}

/* Eğer bunu saran container kırpıyorsa (çok sık olur) */
a[aria-label="View license details"]{
  position: relative !important;
  z-index: 2 !important;
}
/* License seal sağdan kırpılmasın: parent kırpmayı aç + ortala */
a[aria-label="View license details"]{
  display: block !important;
  margin-left: auto !important;
  margin-right: auto !important;

  width: 125px !important;
  max-width: none !important;

  /* sağdan kesilmeyi engellemek için içte nefes */
  padding: 0 10px !important;
  box-sizing: content-box !important;

  position: relative !important;
  left: 0 !important;
  right: 0 !important;
}