:root {
    --cs-pr: #D4AF37 !important;
    --cs-sc: #F4C430 !important;
    --cs-dark: #000000 !important;
    --cs-white: #ffffff !important;

    --cs-gr-pr: #050505 !important;
    --cs-gr-sc: #0A0A0A !important;

    --cs-header-gradient: linear-gradient(to left, #000000 0%, #0A0A0A 50%, #000000 100%) !important;
    --cs-btn-gradient: linear-gradient(to bottom, #F4C430 0%, #D4AF37 100%) !important;
    --cs-icon-gradient: linear-gradient(to bottom, #F4C430 0%, #D4AF37 100%) !important;

    --yellow: #D4AF37 !important;
    --gold: #F4C430 !important;
    --orange: #D4AF37 !important;

    --hero: 212, 175, 55 !important;
    --header: 0, 0, 0 !important;
    --b: 0, 0, 0 !important;

    --layout-width: 1670px;
    --cs-bg: none;
}

body {
    background: radial-gradient(circle at top, #0a0a0a 0%, #000000 70%) !important;
    background-color: #000000 !important;
    background-repeat: no-repeat !important;
    background-size: cover !important;
    color: #ffffff !important;
}

/* =========================
   MAIN BACKGROUNDS
========================= */

.header-bc,
.layout-content-holder-bc,
.layout-footer-holder-bc,
.layout-header-holder-bc,
.nav-content-bc,
.nav-menu-container,
.sportsbook-container,
.left-menu-container,
.right-menu-container,
.center-column-container,
.betslip-holder-bc,
.betslip-bc,
.footer-bc,
.popup-inner-bc,
.modal-content,
.dialog-content {
    background: #050505 !important;
    background-color: #050505 !important;
}

/* HEADER GRADIENT */
.header-bc,
.nav-menu-sub {
    background: linear-gradient(
        to left,
        #000000 0%,
        #0A0A0A 50%,
        #000000 100%
    ) !important;
}

/* =========================
   ICONS / ACTIVE COLORS
========================= */

.sport-search-icon-bc,
.sgm-market-search-icon,
.search-icon,
.favorite-icon,
.icon-star,
.star-icon i,
.active-icon {
    color: #D4AF37 !important;
    border-color: #D4AF37 !important;
}

.active,
.selected,
.highlighted {
    border-color: #D4AF37 !important;
}

/* TEXT COLORS */
.text-yellow,
.yellow-text,
.gold-text {
    color: #D4AF37 !important;
}

/* =========================
   BUTTONS
========================= */

.hdr-user-bc .btn.sign-in,
.header-custom-buttons a[class*=promotions],
.hdr-user-bc a[class*=promotions],
.btn.a-color,
.hdr-toggle-button-bc {
    color: #ffffff !important;
    background: transparent !important;
    border: 1px solid #D4AF37 !important;
    border-radius: 8px !important;
}

.hdr-user-bc .btn.sign-in:hover,
.header-custom-buttons a[class*=promotions]:hover,
.hdr-user-bc a[class*=promotions]:hover,
.btn.a-color:hover,
.hdr-toggle-button-bc:hover {
    background: rgba(212,175,55,.12) !important;
}

/* REGISTER BUTTON */
.hdr-user-bc .btn.register {
    color: #000000 !important;
    background: linear-gradient(
        to bottom,
        #F4C430 0%,
        #D4AF37 100%
    ) !important;
    border: 1px solid #D4AF37 !important;
    border-radius: 8px !important;
    font-weight: 700 !important;
}

/* =========================
   NAV MENU
========================= */

.nav-menu-container.header-navigation:first-child .nav-menu>li>.nav-menu-item,
.nav-menu-container.header-navigation:first-child .nav-menu-other>.nav-menu-item {
    color: #ffffff !important;
}

.nav-menu-container.header-navigation:first-child .nav-menu>li>.nav-menu-item>i,
.nav-menu-container.header-navigation:first-child .nav-menu-other>.nav-menu-item>i {
    background-image: linear-gradient(
        to bottom,
        #F4C430 0%,
        #D4AF37 100%
    ) !important;
}

.nav-menu-container.header-navigation:first-child .nav-menu>li:hover>.nav-menu-item,
.nav-menu-container.header-navigation:first-child .nav-menu-other:hover>.nav-menu-item {
    background: rgba(212,175,55,.08) !important;
    box-shadow: 0 0 20px rgba(212,175,55,.15) !important;
}

/* =========================
   MARKET / ODDS
========================= */

.market-bc,
.market-bc .coeff-bc,
.market-bc .market-name-bc,
.odd_coefficient,
.eur-odd,
.coef,
.d-odd,
.coefficient-bc {
    color: #ffffff !important;
    background-color: rgba(255,255,255,.03) !important;
    border: 1px solid rgba(212,175,55,.15) !important;
}

.market-bc.active,
.market-bc.active * {
    background: #D4AF37 !important;
    color: #000000 !important;
    border-color: #D4AF37 !important;
    box-shadow: 0 0 15px rgba(212,175,55,.40) !important;
}

/* =========================
   LOYALTY / HERO AREA
========================= */

.u-i-p-a-content-bc:before {
    content: "";
    position: absolute !important;
    inset: 0 !important;
    opacity: .95 !important;
    background: radial-gradient(
        circle at 0% 100%,
        #0a0a0a,
        #000000 180%
    ) !important;
}

.u-i-p-a-loyaltyPoint-bc {
    background-image: radial-gradient(
        circle at -14% 113%,
        #0a0a0a,
        #D4AF37
    ) !important;
    border: 1px solid #D4AF37 !important;
}

/* =========================
   ANIMATION
========================= */

@keyframes pulse-force-gold {
    0% {
        box-shadow: 0 0 0 0 rgba(212,175,55,.8);
    }
    70% {
        box-shadow: 0 0 0 15px rgba(212,175,55,0);
    }
    100% {
        box-shadow: 0 0 0 0 rgba(212,175,55,0);
    }
}

.nav-menu-container.header-navigation:first-child .nav-menu > li > .nav-menu-item[aria-label="YILBA5I BİLETİ"]::after {
    animation: pulse-force-gold 2s infinite !important;
}

/* =========================
   ACTIVE STATES
========================= */

.nav-menu-container.header-navigation:first-child .nav-menu > li > .nav-menu-item.active,
.tab-bc.active,
.btn.active,
.selected {
    background: linear-gradient(to bottom, #F4C430, #D4AF37) !important;
    color: #000000 !important;
    border-radius: 12px !important;
    box-shadow: 0 0 15px rgba(212,175,55,.30) !important;
}


/* === bl-promo-embed-fix 2026-10-29 ===
   Promosyon HTML'i tam ekran modal (position:fixed + body overflow:hidden).
   SPA icine gomulunce mobil kaydirma ve <details> acilmiyor. */
html:has(.promotion-details-info),
body:has(.promotion-details-info) {
  overflow: auto !important;
  height: auto !important;
  max-height: none !important;
}
.promotion-details-info,
.promotion-details-info * {
  pointer-events: auto !important;
}
.promotion-details-info {
  overflow: visible !important;
  max-height: none !important;
  height: auto !important;
}
.promotion-details-info .bl-overlay,
.promotion-details-info .overlay {
  position: relative !important;
  inset: auto !important;
  top: auto !important;
  right: auto !important;
  bottom: auto !important;
  left: auto !important;
  z-index: auto !important;
  display: block !important;
  padding: 0 !important;
  margin: 0 !important;
  width: 100% !important;
  min-height: 0 !important;
  max-height: none !important;
  height: auto !important;
  overflow: visible !important;
  background: none !important;
  backdrop-filter: none !important;
  place-items: unset !important;
  align-items: stretch !important;
  justify-content: flex-start !important;
  touch-action: auto !important;
}
.promotion-details-info .bl-modal,
.promotion-details-info .modal,
.promotion-details-info .scroll {
  position: relative !important;
  max-height: none !important;
  height: auto !important;
  overflow: visible !important;
  width: 100% !important;
  flex: none !important;
  touch-action: auto !important;
}
.promotion-details-info details,
.promotion-details-info .bl-fold,
.promotion-details-info .accordion {
  display: block !important;
  overflow: visible !important;
  max-height: none !important;
}
.promotion-details-info summary {
  cursor: pointer !important;
  pointer-events: auto !important;
  -webkit-user-select: none !important;
  user-select: none !important;
}
.promotion-details-info details[open] > .bl-detail,
.promotion-details-info details[open] > .detail {
  display: block !important;
  max-height: none !important;
  overflow: visible !important;
}


/* === bl-promo-single-img 2026-10-29 ===
   SPA .promotion-details-img + icerik .bl-hero img ayni kampanya gorseli.
   Icerikteki tasarim gorseli kalsin, sablon kopyasi gizlensin. */
body:has(.promotion-details-info .bl-hero img) img.promotion-details-img,
body:has(.promotion-details-info .hero img) img.promotion-details-img,
body:has(.promotion-details-info header img) img.promotion-details-img,
.promotion-details-header img.promotion-details-img {
  display: none !important;
  height: 0 !important;
  max-height: 0 !important;
  visibility: hidden !important;
  margin: 0 !important;
  padding: 0 !important;
}


/* === bl-promo-web-scroll 2026-11-01 ===
   Web popup .popup-inner-bc overflow:hidden oldugu icin detay kesiliyor, kaymiyor.
   Iki sutun + gizli SPA gorseli bos sol kolon birakiyor. Tek kolon + ic kaydirma. */
html.is-web:has(.promotion-details-popup),
html.is-web body:has(.promotion-details-popup) {
  overflow: hidden !important;
  height: 100% !important;
  max-height: 100% !important;
}
html.is-web .popup-holder-bc.promotion-details-popup {
  width: 100% !important;
  max-width: 100vw !important;
  height: 100% !important;
  max-height: 100vh !important;
  left: 0 !important;
  right: 0 !important;
  top: 0 !important;
  overflow: hidden !important;
}
html.is-web .popup-holder-bc.promotion-details-popup .popup-middleware-bc {
  width: min(1080px, calc(100vw - 16px)) !important;
  max-width: 100% !important;
  height: 100% !important;
  max-height: 100vh !important;
  margin: 0 auto !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
}
html.is-web .popup-holder-bc.promotion-details-popup .popup-inner-bc {
  width: 100% !important;
  max-width: 100% !important;
  max-height: calc(100vh - 24px) !important;
  overflow-x: hidden !important;
  overflow-y: auto !important;
  -webkit-overflow-scrolling: touch !important;
  overscroll-behavior: contain !important;
}
html.is-web .promotion-details-container {
  display: flex !important;
  flex-direction: column !important;
  grid-template-columns: 1fr !important;
  width: 100% !important;
  max-width: 100% !important;
  min-width: 0 !important;
  height: auto !important;
  overflow: visible !important;
}
html.is-web .promotion-details-header,
html.is-web .promotion-details-info,
html.is-web .promotion-details-info .bl-overlay,
html.is-web .promotion-details-info .overlay,
html.is-web .promotion-details-info .bl-modal,
html.is-web .promotion-details-info .modal {
  width: 100% !important;
  max-width: 100% !important;
  min-width: 0 !important;
  height: auto !important;
  max-height: none !important;
  overflow: visible !important;
  box-sizing: border-box !important;
}
html.is-web .promotion-details-info img,
html.is-web .promotion-details-info .bl-hero,
html.is-web .promotion-details-info .bl-content,
html.is-web .promotion-details-info .bl-title,
html.is-web .promotion-details-info .bl-facts,
html.is-web .promotion-details-info .bl-rates,
html.is-web .promotion-details-info .rates {
  max-width: 100% !important;
  min-width: 0 !important;
  box-sizing: border-box !important;
}
html.is-web .promotion-details-info img {
  height: auto !important;
}
html.is-web .promotion-details-info .bl-title h1,
html.is-web .promotion-details-info h1 {
  overflow-wrap: anywhere !important;
  word-break: break-word !important;
  max-width: 100% !important;
}


/* === bl-promo-web-vw 2026-11-01 === */
html.is-web body .popup-holder-bc.windowed.promotion-details-popup,
html.is-web .popup-holder-bc.windowed.promotion-details-popup,
html.is-web .popup-holder-bc.promotion-details-popup {
  width: 100vw !important;
  max-width: 100vw !important;
  min-width: 0 !important;
  left: 0 !important;
  right: 0 !important;
  box-sizing: border-box !important;
  transform: none !important;
}
html.is-web body .popup-holder-bc.windowed.promotion-details-popup .popup-middleware-bc,
html.is-web .popup-holder-bc.promotion-details-popup .popup-middleware-bc {
  width: min(1080px, calc(100vw - 16px)) !important;
  max-width: calc(100vw - 16px) !important;
  margin-left: auto !important;
  margin-right: auto !important;
  left: auto !important;
  right: auto !important;
}
html.is-web .popup-holder-bc.promotion-details-popup .popup-inner-bc {
  max-width: 100% !important;
  width: 100% !important;
  box-sizing: border-box !important;
}