/* ==========================================================================
   YANKIBET — ÖZEL TEMA (custom.css)
   Soğuk siyah zemin + şampanya altın vurgu. Tek aksan: altın.
   ========================================================================== */

/* ---------- Temel yüzey ---------- */
body {
  background-color: #0B0B10 !important;
  background-image:
    radial-gradient(1200px 500px at 50% -10%, rgba(232, 184, 75, 0.05), transparent 60%),
    radial-gradient(900px 400px at 85% 110%, rgba(232, 184, 75, 0.03), transparent 60%) !important;
  background-repeat: no-repeat !important;
  background-attachment: fixed !important;
  background-size: cover !important;
  color: #F2F2F5 !important;
}

:root {
  /* BC native (rgb triplet) */
  --b: 11, 11, 16 !important;            /* zemin */
  --header: 16, 16, 23 !important;       /* header bar */
  --menu: 16, 16, 23 !important;         /* menü */
  --tab-navigation: 22, 22, 31 !important;
  --hero: 232, 184, 75 !important;       /* ana altın */
  --oc-1: 232, 184, 75 !important;
  --oc-2: 255, 255, 255 !important;
  --oc-1-sc: 20, 16, 8 !important;       /* altın üstü koyu metin */
  --hero-sc: 20, 16, 8 !important;

  /* özel şema */
  --cs-pr: #E8B84B !important;           /* birincil altın */
  --cs-sc: #C1912C !important;           /* koyu altın (gradyan sonu) */
  --cs-dark: #0B0B10 !important;
  --cs-white: #F2F2F5 !important;
  --cs-gr-pr: #14141C !important;        /* yükseltilmiş yüzey */
  --cs-gr-sc: #0E0E14 !important;        /* derin yüzey */
  --cs-header-gradient: linear-gradient(to bottom, #14141C 0%, #101017 100%) !important;
  --cs-btn-gradient: linear-gradient(to bottom, #F0C35C 0%, #D9A838 55%, #C1912C 100%) !important;
  --cs-icon-gradient: linear-gradient(to bottom, #E8B84B 0%, #C1912C 100%) !important;
  --cs-bg: none;

  --yk-surface: #14141C;
  --yk-surface-2: #1A1A24;
  --yk-border: #262630;
  --yk-border-soft: #1E1E28;
  --yk-text: #F2F2F5;
  --yk-text-muted: #A2A2B0;
  --yk-win: #34C77B;
  --yk-lose: #E05A5A;

  --layout-width: 1670px;
}

/* ---------- Header ---------- */
.header-bc {
  background: #101017 !important;
  border-bottom: 1px solid rgba(232, 184, 75, 0.35) !important;
  box-shadow: 0 1px 0 rgba(0, 0, 0, 0.6), 0 6px 24px rgba(0, 0, 0, 0.35) !important;
}
.layout-header-holder-bc,
.nav-content-bc {
  background: transparent !important;
}
.hdr-logo-bc img {
  filter: drop-shadow(0 0 10px rgba(232, 184, 75, 0.25));
}
.nav-menu-container {
  background: transparent !important;
}

/* Üst menü öğeleri */
.nav-menu-container .menu-item,
.nav-menu-container a,
.nav-menu-container button {
  color: #C9C9D4 !important;
  font-weight: 600 !important;
  letter-spacing: 0.02em !important;
}
.nav-menu-container .menu-item:hover,
.nav-menu-container a:hover,
.nav-menu-container button:hover,
.nav-menu-container .active {
  color: #E8B84B !important;
}

/* Sağ üst kullanıcı alanı */
.hdr-user-bc,
.hdr-dynamic-content {
  background: rgba(232, 184, 75, 0.06) !important;
  border: 1px solid var(--yk-border) !important;
  border-radius: 8px !important;
}
.hdr-toggle-button-bc {
  color: #E8B84B !important;
}

/* ---------- Butonlar ---------- */
.btn,
button.btn,
.btn-gradient {
  background-image: linear-gradient(to bottom, #F0C35C 0%, #D9A838 55%, #C1912C 100%) !important;
  background-color: #D9A838 !important;
  color: #14100A !important;
  font-weight: 700 !important;
  text-transform: uppercase !important;
  letter-spacing: 0.04em !important;
  border: none !important;
  box-shadow: 0 2px 10px rgba(232, 184, 75, 0.25), inset 0 1px 0 rgba(255, 255, 255, 0.25) !important;
}
.btn:hover,
.btn-gradient:hover {
  filter: brightness(1.06) !important;
  box-shadow: 0 4px 16px rgba(232, 184, 75, 0.35), inset 0 1px 0 rgba(255, 255, 255, 0.3) !important;
}
.btn:active,
.btn-gradient:active {
  transform: translateY(1px) !important;
  filter: brightness(0.97) !important;
}

/* İkincil butonlar */
.btn-secondary {
  background: transparent !important;
  background-image: none !important;
  color: #E8B84B !important;
  border: 1px solid rgba(232, 184, 75, 0.5) !important;
  box-shadow: none !important;
}
.btn-secondary:hover {
  background: rgba(232, 184, 75, 0.08) !important;
  border-color: #E8B84B !important;
}

/* ---------- Betslip / kupon ---------- */
.betslip-holder-bc,
.betslip-bc {
  background: #14141C !important;
  border-left: 1px solid var(--yk-border) !important;
}
.betslip-bc .betslip-header,
.betslip-holder-bc .betslip-header {
  background: #101017 !important;
  border-bottom: 1px solid rgba(232, 184, 75, 0.3) !important;
  color: #E8B84B !important;
  font-weight: 700 !important;
  letter-spacing: 0.06em !important;
}
.betslip-bc .betslip-event,
.betslip-holder-bc .betslip-event {
  background: #1A1A24 !important;
  border: 1px solid var(--yk-border-soft) !important;
  border-radius: 6px !important;
}
.betslip-bc .betslip-odds,
.betslip-holder-bc .betslip-odds {
  color: #E8B84B !important;
  font-weight: 700 !important;
}
.betslip-bc input,
.betslip-holder-bc input {
  background: #0E0E14 !important;
  border: 1px solid var(--yk-border) !important;
  color: #F2F2F5 !important;
  border-radius: 6px !important;
}
.betslip-bc input:focus,
.betslip-holder-bc input:focus {
  border-color: #E8B84B !important;
  outline: none !important;
  box-shadow: 0 0 0 2px rgba(232, 184, 75, 0.15) !important;
}
.betslip-bc .betslip-place-bet button,
.betslip-holder-bc .betslip-place-bet button,
.betslip-bc button[type="submit"] {
  background-image: linear-gradient(to bottom, #F0C35C 0%, #D9A838 55%, #C1912C 100%) !important;
  color: #14100A !important;
  font-weight: 800 !important;
  border: none !important;
}

/* Kupon kazanç/kayıp rozetleri */
.text-yellow,
.bc-i-won {
  color: #34C77B !important;
}

/* ---------- Spor / marketler ---------- */
.sportsbook-container {
  background: transparent !important;
}
.market-bc {
  background: #14141C !important;
  border: 1px solid var(--yk-border-soft) !important;
  border-radius: 6px !important;
}
.sgm-market-g-i-cell-bc {
  background: #1A1A24 !important;
  border: 1px solid var(--yk-border-soft) !important;
  border-radius: 4px !important;
  color: #E8B84B !important;
}
.sgm-market-g-i-cell-bc:hover {
  background: rgba(232, 184, 75, 0.12) !important;
  border-color: rgba(232, 184, 75, 0.4) !important;
}
.market-bc .market-group-name,
.sportsbook-container .competition-name {
  color: #F2F2F5 !important;
  font-weight: 600 !important;
}
.sp-sub-list-bc,
.spoiler-content {
  background: #101017 !important;
}
.sidebar-content {
  background: #101017 !important;
  border-right: 1px solid var(--yk-border-soft) !important;
}

/* Canlı / maç kartları */
.game-line,
.match-line,
.game-content-bc {
  border-color: var(--yk-border-soft) !important;
}

/* ---------- Widget'lar / kartlar ---------- */
.informative-widget-container,
.widget-container,
.promotionsListEl-bc {
  background: #14141C !important;
  border: 1px solid var(--yk-border-soft) !important;
  border-radius: 10px !important;
}
.informative-widget-container:hover,
.promotionsListEl-bc:hover {
  border-color: rgba(232, 184, 75, 0.35) !important;
}
.informative-widget-link {
  color: #E8B84B !important;
}

/* Widget başlıkları: ince altın çubuk + beyaz başlık */
.informative-widget-container .widget-title,
.widget-title,
.sliderTitle {
  color: #F2F2F5 !important;
  font-weight: 700 !important;
  border-left: 3px solid #E8B84B !important;
  padding-left: 10px !important;
  letter-spacing: 0.03em !important;
}

/* ---------- Popuplar / auth ---------- */
.popup-holder-bc,
.popup-content-w-bc,
.popup-inner-bc,
.popup-content {
  background: #14141C !important;
  border: 1px solid var(--yk-border) !important;
  border-radius: 12px !important;
  box-shadow: 0 24px 80px rgba(0, 0, 0, 0.6) !important;
}
.overlay-header {
  background: #101017 !important;
  border-bottom: 1px solid rgba(232, 184, 75, 0.3) !important;
  color: #E8B84B !important;
}
.popup-holder-bc input,
.popup-content-w-bc input,
.popup-inner-bc input {
  background: #0E0E14 !important;
  border: 1px solid var(--yk-border) !important;
  color: #F2F2F5 !important;
  border-radius: 6px !important;
}
.popup-holder-bc input:focus,
.popup-content-w-bc input:focus {
  border-color: #E8B84B !important;
  box-shadow: 0 0 0 2px rgba(232, 184, 75, 0.15) !important;
}
.popup-holder-bc label,
.popup-content-w-bc label {
  color: #A2A2B0 !important;
}

/* ---------- Promosyon detay ---------- */
.promotion-details-container {
  background: #14141C !important;
  border: 1px solid var(--yk-border-soft) !important;
  border-radius: 10px !important;
  color: #D6D6DE !important;
}
.promotion-details-container h1,
.promotion-details-container h2,
.promotion-details-container h3 {
  color: #E8B84B !important;
}

/* ---------- Footer ---------- */
.layout-footer-holder-bc,
.footer-bc {
  background: #0E0E14 !important;
  border-top: 1px solid rgba(232, 184, 75, 0.25) !important;
  color: #A2A2B0 !important;
}
.footerSocialLinks a {
  color: #E8B84B !important;
}
.footer-bc a:hover {
  color: #F0C35C !important;
}

/* ---------- Kayıt / giriş sekmeleri, tablar ---------- */
.tab-navigation,
.tab-navigation-bc {
  background: #101017 !important;
  border-bottom: 1px solid var(--yk-border) !important;
}
.tab-navigation .active,
.tab-navigation-bc .active {
  color: #E8B84B !important;
  border-bottom: 2px solid #E8B84B !important;
}

/* ---------- Genel metin yardımcıları ---------- */
a {
  color: #E8B84B;
}
a:hover {
  color: #F0C35C;
}
h1, h2, h3, h4 {
  color: #F2F2F5;
}

/* Scrollbar */
::-webkit-scrollbar {
  width: 10px;
  height: 10px;
}
::-webkit-scrollbar-track {
  background: #0E0E14;
}
::-webkit-scrollbar-thumb {
  background: #262630;
  border-radius: 5px;
  border: 2px solid #0E0E14;
}
::-webkit-scrollbar-thumb:hover {
  background: #E8B84B;
}
