/* 🌌 Base Background (desktop & tablets) */
body {
  background-image: url('https://cmsbetconstruct.com/storage/medias/betgo/media_1204_c69067ca142474eadbdcc8372c896d56.jpeg') !important;
  background-attachment: scroll !important;
  background-position: top center !important;
  background-repeat: no-repeat !important;
  background-size: cover !important;
}

/* 🧼 Make containers transparent */
body,
html,
.theme-white,
.main-wrapper,
.app-container,
#root,
.page-content,
body > div {
  background-color: transparent !important;
}

/* 🎨 Overlay */
body::before {
  content: "";
  position: fixed;
  top: 0;
  left: 0;
  width: 100vw;
  height: 100vh;
  background-color: rgba(15, 19, 35, 0.7);
  z-index: -1;
}

/* 🎨 Color Palette */
:root {
  --hero: 167, 31, 103 !important;
  --hero-hover: 210, 38, 129 !important;
  --accent: 170, 127, 0 !important;
  --accent-hover: 220, 165, 0 !important;
  --b: 0, 12, 36 !important;
  --header: 0, 12, 36 !important;
  --menu: 0, 12, 36 !important;
  --tab-navigation: 0, 12, 36 !important;
}

/* 🔘 Promo Button */
.promo-btn {
  background: linear-gradient(45deg, #a71f67, #c61e77, #a71f67) !important;
  color: white !important;
  border-radius: 8px !important;
  font-size: 16px !important;
  font-weight: 600 !important;
  text-transform: uppercase !important;
  position: relative;
  overflow: hidden;
  z-index: 1;
}
.promo-btn::after {
  content: "";
  position: absolute;
  inset: 0;
  background: linear-gradient(45deg, #a71f67, #69007f, #fc0987);
  opacity: 0;
  filter: blur(10px);
  transition: 0.5s;
  z-index: -1;
}
.promo-btn:hover::after {
  opacity: 1;
}

/* 🔻 Footer Transparency */
.theme-white .footerContainerWrapper {
  background: rgba(0, 0, 0, 0.25) !important;
}

/* 🎯 Odds Styling */
.market-odd-bc {
  color: #FFD700 !important;
  font-size: 12px !important;
  font-family: Roboto, Arial, Helvetica, sans-serif !important;
  font-weight: 600 !important;
}
.market-bc {
  background-color: #2f3447 !important;
}
.market-bc:hover {
  background-color: #d80d83 !important;
}
.market-bc:hover .market-odd-bc {
  color: #ffffff !important;
}
.market-bc.active .market-odd-bc {
  color: #d80d83 !important;
}

/* 🟪 Bet Box Layout */
.slider-market-coefficient-container .market-bc {
  box-shadow: none !important;
  border: none !important;
  border-radius: 5px !important;
  width: 100px !important;
  height: 38px !important;
}
.slider-market-coefficient-container .market-bc:nth-child(2):not(:last-child),
.slider-market-coefficient-container .market-bc:nth-child(2):not(:last-child):hover {
  border-left: 4px solid #fff !important;
  border-right: 4px solid #fff !important;
  border-radius: 0 !important;
}

/* 🔍 Telegram Icon Cleanup */
.header-bc .hdr-main-content-bc .bc-i-telegram.header-icon {
  background-color: transparent !important;
}
.header-bc .hdr-main-content-bc .bc-i-telegram.header-icon:before {
  content: "" !important;
  width: 65px;
  height: 100%;
  background: none !important;
}

/* ⏳ Countdown Banner */
.slider-bc:first-child .countdown-banner-content {
  left: 50% !important;
  top: 50% !important;
  transform: translate(-50%, -50%);
  background: transparent !important;
  border: none !important;
  box-shadow: none !important;
  backdrop-filter: none !important;
}
.slider-bc:first-child .countdown-banner-content .countdown-banner-date {
  font-size: 70px !important;
  line-height: 60px !important;
  font-weight: 700 !important;
  color: #fff !important;
}
.slider-bc:first-child .countdown-banner-content .countdown-banner-names {
  font-size: 16px !important;
  color: #fff !important;
}

/* 📱 Mobile overrides: remove background image & overlay */
@media (max-width: 768px) {
  body {
    background-image: none !important;
    background-color: #0f1323 !important; /* fallback solid color */
    background-attachment: initial !important;
    background-position: initial !important;
    background-repeat: initial !important;
    background-size: auto !important;
  }

  /* Disable the dark overlay on mobile */
  body::before {
    content: none !important;
    background-color: transparent !important;
  }
}
