/* V63 Sanal Lig — oran/kupon alanlarında stadyum yayın kimliği. */

:root {
  --v63-stadium: url("./sanal-stadium-motif.svg");
  --v63-ink: #10354e;
  --v63-teal: #0c6f72;
  --v63-gold: #c99b3c;
}

/* Oyuncu ve ana menü alanına saha çizgisi hissi. */
main.layout > section.card:first-child .body.grid {
  position: relative !important;
  isolation: isolate !important;
}

main.layout > section.card:first-child .body.grid::before {
  content: "" !important;
  position: absolute !important;
  z-index: -1 !important;
  left: -3% !important;
  right: -3% !important;
  top: 4% !important;
  height: 250px !important;
  background: var(--v63-stadium) center / cover no-repeat !important;
  opacity: .055 !important;
  pointer-events: none !important;
  -webkit-mask-image: linear-gradient(#000, transparent) !important;
  mask-image: linear-gradient(#000, transparent) !important;
}

#players .player,
.globalLeaderboard .globalRank {
  position: relative !important;
  overflow: hidden !important;
}

#players .player::after,
.globalLeaderboard .globalRank::after {
  content: "" !important;
  position: absolute !important;
  right: -18px !important;
  bottom: -24px !important;
  width: 92px !important;
  height: 72px !important;
  border: 1px solid rgba(21, 112, 91, .10) !important;
  border-radius: 50% !important;
  box-shadow: inset 0 0 0 13px rgba(21, 112, 91, .025) !important;
  pointer-events: none !important;
}

#players .player.active {
  outline: 0 !important;
  border-color: rgba(12, 116, 91, .48) !important;
  box-shadow:
    0 13px 28px rgba(6, 62, 51, .12),
    inset 4px 0 0 #168a63,
    inset 0 1px 0 rgba(255,255,255,.80) !important;
}

/* Kupon başlığına bağımsız, sade bir futbol topu rozeti. */
main.layout > aside.card > .cardTitle {
  padding-right: 58px !important;
}

main.layout > aside.card > .cardTitle::after {
  content: "⚽" !important;
  position: absolute !important;
  right: 15px !important;
  top: 50% !important;
  display: grid !important;
  place-items: center !important;
  width: 34px !important;
  height: 34px !important;
  transform: translateY(-50%) rotate(-8deg) !important;
  border: 1px solid rgba(239, 210, 137, .50) !important;
  border-radius: 50% !important;
  background: linear-gradient(145deg, rgba(255,255,255,.17), rgba(255,255,255,.04)) !important;
  box-shadow: 0 8px 18px rgba(0,10,22,.22), inset 0 1px 0 rgba(255,255,255,.15) !important;
  font-size: 18px !important;
}

#betControls {
  position: relative !important;
  overflow: hidden !important;
  padding: 12px !important;
  border: 1px solid rgba(93, 130, 146, .27) !important;
  border-radius: 17px !important;
  background:
    linear-gradient(90deg, rgba(250,252,248,.94), rgba(235,245,242,.91)),
    var(--v63-stadium) center 56% / cover no-repeat !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.86), 0 11px 25px rgba(4,28,44,.07) !important;
}

#betControls::after {
  content: "" !important;
  position: absolute !important;
  inset: 0 !important;
  z-index: 0 !important;
  background: var(--v63-stadium) center / cover no-repeat !important;
  opacity: .055 !important;
  pointer-events: none !important;
}

#betControls > * {
  position: relative !important;
  z-index: 1 !important;
}

.stakeField > span::before {
  content: "◈" !important;
  margin-right: 6px !important;
  color: var(--v63-gold) !important;
}

/* Aktif kupon, okunaklı bilet hissi; motif yalnızca sağ kenarda. */
.slipSummary {
  position: relative !important;
  isolation: isolate !important;
  overflow: hidden !important;
  border-color: rgba(180, 139, 51, .34) !important;
  background:
    radial-gradient(circle at 100% 0, rgba(214, 173, 74, .18), transparent 34%),
    linear-gradient(145deg, rgba(253,252,246,.96), rgba(232,243,240,.91)) !important;
  box-shadow:
    0 16px 32px rgba(4, 28, 44, .11),
    inset 4px 0 0 rgba(198, 151, 54, .72),
    inset 0 1px 0 rgba(255,255,255,.88) !important;
}

.slipSummary::before {
  content: "" !important;
  position: absolute !important;
  z-index: -1 !important;
  right: -82px !important;
  top: -12px !important;
  width: 260px !important;
  height: 180px !important;
  background: var(--v63-stadium) right center / auto 100% no-repeat !important;
  opacity: .075 !important;
  pointer-events: none !important;
}

.slipSummary > .row:first-child {
  padding-bottom: 9px !important;
  margin-bottom: 7px !important;
  border-bottom: 1px dashed rgba(86, 119, 132, .28) !important;
}

.slipSummary #activeSlipTitle {
  color: var(--v63-ink) !important;
  letter-spacing: .025em !important;
}

.slipSummary #activeSlipTitle::before {
  content: "▣" !important;
  margin-right: 7px !important;
  color: var(--v63-gold) !important;
}

#possibleText {
  margin-top: 8px !important;
  padding: 8px 10px !important;
  border-radius: 10px !important;
  color: #0d5d52 !important;
  background: rgba(13, 130, 101, .07) !important;
  font-weight: 900 !important;
}

#comboState {
  padding: 7px 10px 2px !important;
  color: #60798c !important;
}

#openNormalSlipDetails {
  position: relative !important;
  overflow: hidden !important;
  border-color: rgba(27, 104, 108, .31) !important;
  color: #174b59 !important;
  background: linear-gradient(180deg, rgba(236,248,246,.96), rgba(219,238,235,.94)) !important;
}

#openNormalSlipDetails::before {
  content: "⌕" !important;
  margin-right: 7px !important;
  color: #0d7270 !important;
  font-size: 17px !important;
}

/* Dünya Kupası ve klasik ligde dinamik üretilen kompakt maç kartları. */
#fixtures > .compactFixture {
  position: relative !important;
  isolation: isolate !important;
  overflow: hidden !important;
  border-color: rgba(73, 119, 139, .27) !important;
  background:
    radial-gradient(circle at 100% 0, rgba(205, 164, 67, .11), transparent 34%),
    linear-gradient(145deg, rgba(255,255,252,.96), rgba(235,244,243,.93)) !important;
  box-shadow: 0 9px 22px rgba(4, 29, 45, .075), inset 0 1px 0 rgba(255,255,255,.92) !important;
}

#fixtures > .compactFixture::before {
  content: "" !important;
  position: absolute !important;
  z-index: -1 !important;
  right: -62px !important;
  top: -17px !important;
  width: 210px !important;
  height: 120px !important;
  background: var(--v63-stadium) right center / auto 100% no-repeat !important;
  opacity: .045 !important;
  pointer-events: none !important;
}

#fixtures > .compactFixture.hasPersonalBet {
  border-color: rgba(197, 151, 53, .50) !important;
  box-shadow: 0 12px 26px rgba(4, 29, 45, .09), inset 4px 0 0 rgba(202, 157, 57, .72) !important;
}

#fixtures .compactDetailBtn {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  border-color: rgba(38, 107, 122, .30) !important;
  color: #174e61 !important;
  background: linear-gradient(180deg, rgba(239,249,248,.98), rgba(218,236,235,.95)) !important;
  box-shadow: inset 0 1px 0 #fff, 0 5px 12px rgba(4,31,46,.07) !important;
}

#fixtures .compactDetailBtn::before {
  content: "" !important;
  width: 8px !important;
  height: 8px !important;
  flex: 0 0 8px !important;
  margin-right: 4px !important;
  border: 2px solid #0d7772 !important;
  border-radius: 50% !important;
  box-shadow: 0 0 0 2px rgba(13,119,114,.10) !important;
}

#fixtures .compactOdds3 .odd {
  border-color: rgba(65, 113, 135, .27) !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.72), 0 5px 11px rgba(4,29,44,.05) !important;
}

#fixtures .compactOdds3 .odd.selected {
  border-color: rgba(212, 172, 75, .78) !important;
  background: linear-gradient(145deg, #163f55, #0b6567) !important;
  box-shadow: 0 8px 17px rgba(5, 73, 75, .16), inset 0 1px 0 rgba(255,255,255,.12) !important;
}

/* Ayrıntılı oranlar: stadyum zemini ve düzenli pazar adaları. */
.fixture.open {
  border-color: rgba(181, 137, 45, .42) !important;
  box-shadow: 0 16px 33px rgba(4, 30, 46, .12), inset 0 1px 0 #fff !important;
}

.fixture.open .arrow {
  color: #fff !important;
  background: linear-gradient(145deg, #0f7374, #095052) !important;
  border-color: rgba(210, 177, 94, .50) !important;
}

.fixture .details,
body.worldCupMode .wcFixture .details {
  position: relative !important;
  isolation: isolate !important;
  overflow: hidden !important;
  padding: 14px !important;
  background:
    linear-gradient(180deg, rgba(234,244,244,.96), rgba(246,248,243,.98)) !important;
  border-top-color: rgba(178, 137, 49, .28) !important;
}

.fixture .details::before,
body.worldCupMode .wcFixture .details::before {
  content: "" !important;
  position: absolute !important;
  z-index: -1 !important;
  inset: 0 !important;
  background: var(--v63-stadium) center / cover no-repeat !important;
  opacity: .065 !important;
  pointer-events: none !important;
}

.marketGroup {
  position: relative !important;
  margin: 0 0 10px !important;
  padding: 11px !important;
  border: 1px solid rgba(91, 129, 144, .25) !important;
  border-radius: 14px !important;
  background: rgba(255,255,252,.76) !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.86), 0 8px 18px rgba(4,31,47,.05) !important;
}

.marketGroup:last-child { margin-bottom: 0 !important; }

.marketGroupTitle {
  display: flex !important;
  align-items: center !important;
  gap: 7px !important;
  margin: 0 0 8px !important;
  color: #244d62 !important;
  font-size: 11px !important;
  font-weight: 1000 !important;
  letter-spacing: .035em !important;
}

.marketGroupTitle::before {
  content: "" !important;
  width: 13px !important;
  height: 13px !important;
  flex: 0 0 13px !important;
  border: 2px solid rgba(12, 112, 100, .72) !important;
  border-radius: 50% !important;
  background:
    radial-gradient(circle at 50% 50%, #0d7268 0 2px, transparent 2.5px),
    rgba(14, 132, 111, .08) !important;
  box-shadow: 0 0 0 3px rgba(14, 132, 111, .055) !important;
}

.details .odd,
body.worldCupMode .wcFixture .details .odd {
  position: relative !important;
  min-height: 44px !important;
  border-color: rgba(80, 122, 141, .34) !important;
  color: #f4fbff !important;
  background:
    radial-gradient(circle at 90% -20%, rgba(211, 174, 80, .19), transparent 42%),
    linear-gradient(145deg, #173f58, #0e2d43) !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.08), 0 7px 15px rgba(3,24,39,.09) !important;
}

.details .odd b,
.details .odd span,
body.worldCupMode .wcFixture .details .odd b,
body.worldCupMode .wcFixture .details .odd span {
  color: #f3fbff !important;
}

.details .odd b,
body.worldCupMode .wcFixture .details .odd b {
  color: #f0cc78 !important;
}

.details .odd:hover,
body.worldCupMode .wcFixture .details .odd:hover {
  border-color: rgba(227, 194, 112, .78) !important;
  transform: translateY(-1px) !important;
}

.details .odd.selected,
body.worldCupMode .wcFixture .details .odd.selected {
  color: #082b2c !important;
  background: linear-gradient(145deg, #f1d68f, #c89c42) !important;
  border-color: #f7e7b9 !important;
  box-shadow: 0 10px 22px rgba(139, 98, 26, .25), inset 0 1px 0 rgba(255,255,255,.55) !important;
}

.details .odd.selected b,
.details .odd.selected span,
body.worldCupMode .wcFixture .details .odd.selected b,
body.worldCupMode .wcFixture .details .odd.selected span {
  color: #153838 !important;
}

/* Normal kupon ayrıntı penceresi. */
.normalSlipDialog {
  position: relative !important;
  overflow: hidden !important;
  border: 1px solid rgba(218, 181, 91, .46) !important;
  border-radius: 22px !important;
  background: linear-gradient(180deg, rgba(251,252,248,.99), rgba(230,240,239,.98)) !important;
  box-shadow: 0 34px 90px rgba(0, 15, 28, .40) !important;
}

.normalSlipDialogHead {
  position: relative !important;
  min-height: 92px !important;
  color: #fff !important;
  background:
    linear-gradient(90deg, rgba(4,31,52,.96), rgba(8,79,83,.91)),
    var(--v63-stadium) center 43% / cover no-repeat !important;
  border-bottom-color: rgba(220, 183, 93, .54) !important;
}

.normalSlipDialogHead::after {
  content: "" !important;
  position: absolute !important;
  inset: 0 !important;
  background: var(--v63-stadium) center / cover no-repeat !important;
  opacity: .14 !important;
  pointer-events: none !important;
}

.normalSlipDialogHead > * { position: relative !important; z-index: 1 !important; }
.normalSlipDialogHead h2 { color: #fff !important; font-size: 21px !important; }
.normalSlipDialogHead p { color: #d6e8e9 !important; }
.normalSlipDialogClose {
  color: #fff !important;
  border-color: rgba(255,255,255,.23) !important;
  background: rgba(255,255,255,.10) !important;
}

.normalSlipModalSummary > div {
  border-color: rgba(89, 128, 142, .25) !important;
  background: rgba(255,255,252,.82) !important;
  box-shadow: inset 0 1px 0 #fff, 0 7px 16px rgba(4,28,43,.05) !important;
}

.normalSlipModalItem {
  border-left: 3px solid rgba(17, 119, 104, .55) !important;
  box-shadow: 0 9px 20px rgba(5, 30, 44, .06) !important;
}

/* Maçın form/güç karşılaştırması ve bütün ayrıntılı oran penceresi. */
.oddsDetailOverlay {
  z-index: 10050 !important;
}

.oddsDetailCard {
  position: relative !important;
  overflow: auto !important;
  border-color: rgba(214, 178, 89, .48) !important;
  background: linear-gradient(180deg, rgba(251,252,248,.99), rgba(229,240,239,.98)) !important;
  box-shadow: 0 35px 96px rgba(0, 16, 29, .43) !important;
}

.oddsDetailHead {
  position: relative !important;
  overflow: hidden !important;
  margin: -16px -16px 12px !important;
  padding: 18px 18px 15px !important;
  color: #fff !important;
  border-bottom-color: rgba(220, 183, 92, .52) !important;
  background: linear-gradient(95deg, rgba(5,32,53,.98), rgba(9,95,99,.94)) !important;
}

.oddsDetailHead::after {
  content: "" !important;
  position: absolute !important;
  inset: 0 !important;
  background: var(--v63-stadium) center 48% / cover no-repeat !important;
  opacity: .14 !important;
  pointer-events: none !important;
}

.oddsDetailHead > * { position: relative !important; z-index: 1 !important; }
.oddsDetailHead h2 { color: #fff !important; text-shadow: 0 7px 17px rgba(0,10,20,.25) !important; }
.oddsDetailHead p { color: #d7e9e9 !important; }
.oddsDetailClose {
  color: #fff !important;
  border-color: rgba(255,255,255,.23) !important;
  background: rgba(255,255,255,.10) !important;
}

#oddsDetailBody .oddsDetailMatchHero {
  position: relative !important;
  isolation: isolate !important;
  overflow: hidden !important;
  color: #fff !important;
  border-color: rgba(216, 180, 91, .42) !important;
  background: linear-gradient(90deg, rgba(7,52,67,.97), rgba(11,104,99,.92), rgba(7,52,67,.97)) !important;
  box-shadow: 0 13px 28px rgba(4,29,44,.13), inset 0 1px 0 rgba(255,255,255,.12) !important;
}

#oddsDetailBody .oddsDetailMatchHero::before {
  content: "" !important;
  position: absolute !important;
  z-index: -1 !important;
  inset: 0 !important;
  background: var(--v63-stadium) center 58% / cover no-repeat !important;
  opacity: .15 !important;
}

#oddsDetailBody .oddsDetailMatchHero .heroVs { color: #f0cd7c !important; }

#oddsDetailBody .marketGroup {
  border-color: rgba(82, 124, 142, .25) !important;
  background: rgba(255,255,252,.81) !important;
  box-shadow: inset 0 1px 0 #fff, 0 8px 18px rgba(4,29,44,.055) !important;
}

#oddsDetailBody .odd {
  border-color: rgba(72, 119, 139, .34) !important;
  color: #f4fbff !important;
  background: radial-gradient(circle at 92% -25%, rgba(214,174,78,.18), transparent 43%), linear-gradient(145deg, #173f58, #0d2d43) !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.08), 0 7px 15px rgba(3,24,39,.08) !important;
}

#oddsDetailBody .odd b { color: #f0cc78 !important; }
#oddsDetailBody .odd span { color: #f4fbff !important; }
#oddsDetailBody .odd.selected {
  border-color: #f5e4af !important;
  background: linear-gradient(145deg, #efd58d, #c99b3d) !important;
  box-shadow: 0 10px 22px rgba(139,98,26,.24), inset 0 1px 0 rgba(255,255,255,.53) !important;
}
#oddsDetailBody .odd.selected b,
#oddsDetailBody .odd.selected span { color: #153838 !important; }

/* Sezon öncesi pazar: üstte yayın/stadyum başlığı, sağda net kupon kâğıdı. */
.preseasonDialog,
.wcPreDialog,
.wcPreDialogV58 {
  position: relative !important;
  overflow: hidden !important;
  border: 1px solid rgba(215, 178, 88, .46) !important;
  border-radius: 24px !important;
  background: linear-gradient(180deg, rgba(250,252,248,.99), rgba(229,240,239,.98)) !important;
  box-shadow: 0 36px 100px rgba(0, 15, 29, .44) !important;
}

.preseasonHead {
  position: relative !important;
  min-height: 108px !important;
  overflow: hidden !important;
  color: #fff !important;
  background: linear-gradient(100deg, #061f37, #0c6468 72%, #0a3d50) !important;
  border-bottom: 1px solid rgba(224, 190, 106, .54) !important;
}

.preseasonHead::after {
  content: "" !important;
  position: absolute !important;
  inset: 0 !important;
  background: var(--v63-stadium) center 44% / cover no-repeat !important;
  opacity: .18 !important;
  pointer-events: none !important;
}

.preseasonHead > * { position: relative !important; z-index: 1 !important; }
.preseasonHead h2 { color: #fff !important; text-shadow: 0 7px 18px rgba(0,10,20,.28) !important; }
.preseasonHead p { color: #d4e8e7 !important; }
.preseasonClose {
  color: #fff !important;
  border-color: rgba(255,255,255,.24) !important;
  background: rgba(255,255,255,.10) !important;
}

.preseasonStats,
.preCouponSteps {
  position: relative !important;
  z-index: 2 !important;
}

.preseasonMarkets {
  position: relative !important;
  background:
    radial-gradient(circle at 100% 0, rgba(207, 166, 70, .10), transparent 29%),
    rgba(248,251,248,.74) !important;
}

.preseasonTeam {
  position: relative !important;
  overflow: hidden !important;
  border-color: rgba(91, 129, 144, .27) !important;
  background: rgba(255,255,252,.88) !important;
  box-shadow: inset 0 1px 0 #fff, 0 8px 18px rgba(4,29,44,.055) !important;
}

.preseasonTeam::after {
  content: "" !important;
  position: absolute !important;
  right: -17px !important;
  bottom: -25px !important;
  width: 83px !important;
  height: 63px !important;
  border: 1px solid rgba(12, 115, 93, .10) !important;
  border-radius: 50% !important;
  pointer-events: none !important;
}

.preseasonOdd {
  color: #9c6b13 !important;
  font-weight: 1000 !important;
}

.preseasonAdd,
.preseasonLock,
#preseasonBtn {
  background: linear-gradient(145deg, #128566, #08644f) !important;
  border: 1px solid rgba(236, 208, 139, .42) !important;
  box-shadow: 0 11px 24px rgba(5, 91, 69, .18), inset 0 1px 0 rgba(255,255,255,.16) !important;
}

.preseasonSlip {
  position: relative !important;
  overflow: hidden !important;
  border-left-color: rgba(190, 147, 55, .30) !important;
  background:
    linear-gradient(180deg, rgba(255,253,246,.96), rgba(239,246,242,.96)) !important;
}

.preseasonSlip::before {
  content: "" !important;
  position: absolute !important;
  right: -112px !important;
  top: 0 !important;
  width: 320px !important;
  height: 220px !important;
  background: var(--v63-stadium) right top / auto 100% no-repeat !important;
  opacity: .055 !important;
  pointer-events: none !important;
}

.preseasonSlip > * { position: relative !important; }
.preseasonTicket {
  border-left: 3px solid rgba(197, 150, 52, .62) !important;
  box-shadow: 0 8px 18px rgba(5,31,44,.06) !important;
}

@media (max-width: 760px) {
  main.layout > aside.card > .cardTitle { padding-right: 51px !important; }
  main.layout > aside.card > .cardTitle::after { right: 11px !important; width: 30px !important; height: 30px !important; font-size: 16px !important; }
  #betControls { padding: 10px !important; }
  .fixture .details,
  body.worldCupMode .wcFixture .details { padding: 9px !important; }
  .marketGroup { padding: 8px !important; border-radius: 11px !important; }
  .details .odd,
  body.worldCupMode .wcFixture .details .odd { min-height: 39px !important; }
  .normalSlipDialog,
  .preseasonDialog,
  .wcPreDialog,
  .wcPreDialogV58 { border-radius: 17px !important; }
  .normalSlipDialogHead { min-height: 78px !important; }
  .oddsDetailHead { margin: -12px -12px 10px !important; padding: 14px 14px 12px !important; }
  .oddsDetailCard { max-height: calc(100dvh - 20px) !important; }
  .preseasonHead { min-height: 92px !important; }
  .preseasonSlip { border-left: 0 !important; border-top: 1px solid rgba(190,147,55,.25) !important; }
}

@media (prefers-reduced-motion: reduce) {
  .fixture,
  .odd,
  .player,
  button { transition-duration: .01ms !important; }
}
