/**
 * PC fixes: wallet/profile dropdowns + back-to-top above slider/media,
 * and match mobile purple-dark header colors (rgb 18,10,40).
 */
html.is-web {
  --header: 18, 10, 40 !important;
  --header-hover: 168, 85, 247 !important;
  --header-sc: 255, 255, 255 !important;
  --menu: 10, 5, 24 !important;
  --menu-hover: 168, 85, 247 !important;
  --menu-sc: 255, 255, 255 !important;
  --hero: 168, 85, 247 !important;
  --hero-hover: 200, 130, 255 !important;
  --brand: 168, 85, 247 !important;
  --brand-hover: 200, 130, 255 !important;
  --gold: linear-gradient(138deg,
      rgba(76, 29, 149, 1) 0%,
      rgba(147, 51, 234, 1) 25%,
      rgba(232, 121, 255, 1) 50%,
      rgba(192, 132, 252, 1) 75%,
      rgba(76, 29, 149, 1) 100%) !important;
}

/* Kill grey karbet override on PC header */
html.is-web .header-bc,
html.is-web .hdr-main-content-bc,
html.is-web .layout-header-holder-bc .header-bc,
html.is-web .layout-header-holder-bc .hdr-main-content-bc,
html.is-web .layout-header-holder-bc .nav-content-bc,
html.is-web .layout-header-holder-bc .nav-menu-container.header-navigation:first-child {
  background: rgb(18, 10, 40) !important;
}

html.is-web .layout-header-holder-bc .header-bc,
html.is-web .header-bc {
  box-shadow: 0 10px 20px #120a28 !important;
  border-bottom: 1px solid rgba(147, 51, 234, 0.35) !important;
}

html.is-web .nav-menu-container.header-navigation:first-child {
  border-top: 1px solid #9333ea !important;
}

html.is-web .layout-header-holder-bc .nav-menu > li > a,
html.is-web .layout-header-holder-bc .nav-menu-other > .nav-menu-item,
html.is-web #root > div.layout-header-holder-bc > header > div.nav-content-bc > div > nav > ul.nav-menu > li > a {
  background: #120a28 !important;
  border-right: 1px solid #9333ea !important;
  border-color: #9333ea !important;
}

/* ===== Stacking: header + dropdowns + floating btn above ALL page media ===== */
html.is-web .layout-header-holder-bc {
  position: relative !important;
  z-index: 200000 !important;
  isolation: auto !important; /* do not trap fixed children / menus */
  overflow: visible !important;
}

html.is-web .layout-header-holder-bc .header-bc,
html.is-web .layout-header-holder-bc .hdr-main-content-bc,
html.is-web .layout-header-holder-bc .hdr-user-bc,
html.is-web .layout-header-holder-bc .header-user-nav,
html.is-web .layout-header-holder-bc .nav-menu-container,
html.is-web .layout-header-holder-bc .nav-menu-other,
html.is-web .layout-header-holder-bc .nav-menu-other > li {
  position: relative !important;
  overflow: visible !important;
  z-index: auto !important;
}

html.is-web .layout-content-holder-bc,
html.is-web .layout-content-holder-bc .hm-row-bc,
html.is-web .layout-content-holder-bc .hm-row-bc.has-slider,
html.is-web .layout-content-holder-bc .carousel,
html.is-web .layout-content-holder-bc .carousel-viewport,
html.is-web .layout-content-holder-bc .carousel-container,
html.is-web .layout-content-holder-bc .swiper,
html.is-web .layout-content-holder-bc .slider-bc,
html.is-web .layout-content-holder-bc .slider,
html.is-web .layout-content-holder-bc video,
html.is-web .layout-content-holder-bc iframe,
html.is-web .layout-content-holder-bc canvas,
html.is-web .layout-content-holder-bc .product-banner-container-bc,
html.is-web .layout-content-holder-bc .casinoGameItem,
html.is-web .layout-content-holder-bc .sg-game-list-item,
html.is-web main,
html.is-web .homepage-layout {
  position: relative !important;
  z-index: 1 !important;
}

html.is-web .layout-content-holder-bc .carousel-viewport,
html.is-web .layout-content-holder-bc .carousel-container {
  isolation: isolate !important;
  z-index: 1 !important;
}

/* Wallet + profile dropdowns */
html.is-web .header-user-nav .nav-menu-sub,
html.is-web .header-user-nav .nav-menu-sub-wallet,
html.is-web .layout-header-holder-bc .nav-menu-sub,
html.is-web .layout-header-holder-bc .nav-menu-sub-wallet {
  position: absolute !important;
  z-index: 200050 !important;
  pointer-events: auto !important;
  background: rgb(18, 10, 40) !important;
  border: 1px solid rgba(147, 51, 234, 0.45) !important;
  border-radius: 12px !important;
  box-shadow: 0 18px 42px rgba(0, 0, 0, 0.55) !important;
  padding: 8px !important;
  min-width: 228px !important;
}

html.is-web .header-user-nav .nav-menu-sub .nav-menu-item,
html.is-web .header-user-nav .nav-menu-sub-wallet .nav-menu-item {
  position: relative !important;
  z-index: 200051 !important;
  background: rgba(18, 10, 40, 0.98) !important;
  border: 1px solid rgba(147, 51, 234, 0.28) !important;
  color: #fff !important;
}

html.is-web .header-user-nav .nav-menu-sub .nav-menu-item span,
html.is-web .header-user-nav .nav-menu-sub .nav-menu-item .checkbox-control-text-bc,
html.is-web .header-user-nav .nav-menu-sub-wallet .nav-menu-item span,
html.is-web .header-user-nav .nav-menu-sub-wallet .nav-menu-item .checkbox-control-text-bc {
  background: none !important;
  -webkit-background-clip: border-box !important;
  background-clip: border-box !important;
  -webkit-text-fill-color: #f3e8ff !important;
  color: #f3e8ff !important;
}

html.is-web .header-user-nav .nav-menu-sub .nav-menu-item > i,
html.is-web .header-user-nav .nav-menu-sub-wallet .nav-menu-item > i {
  color: #c084fc !important;
}

html.is-web .header-user-nav .nav-menu-sub .nav-menu-item:hover,
html.is-web .header-user-nav .nav-menu-sub .nav-menu-item:focus-visible,
html.is-web .header-user-nav .nav-menu-sub-wallet .nav-menu-item:hover,
html.is-web .header-user-nav .nav-menu-sub-wallet .nav-menu-item:focus-visible {
  background: rgba(76, 29, 149, 0.85) !important;
  border-color: #c084fc !important;
}

html.is-web .header-user-nav .nav-menu-sub .nav-menu-item:hover span,
html.is-web .header-user-nav .nav-menu-sub .nav-menu-item:hover .checkbox-control-text-bc,
html.is-web .header-user-nav .nav-menu-sub-wallet .nav-menu-item:hover span,
html.is-web .header-user-nav .nav-menu-sub-wallet .nav-menu-item:hover .checkbox-control-text-bc {
  -webkit-text-fill-color: #ffffff !important;
  color: #ffffff !important;
}

/* Back-to-top must sit above banners/videos/images */
html.is-web .header-bc .center-bottom-btn,
html.is-web .layout-bc .center-bottom-btn {
  position: relative !important;
  z-index: 200080 !important;
  pointer-events: none !important;
}

html.is-web .header-bc .center-bottom-btn > .nav-floating-btn,
html.is-web .header-bc .center-bottom-btn > button,
html.is-web .layout-bc .nav-floating-btn {
  position: fixed !important;
  z-index: 200090 !important;
  pointer-events: auto !important;
}

html.is-web .header-bc .center-bottom-btn:not(.nav-floating-btn-hide) > .nav-floating-btn,
html.is-web .header-bc .center-bottom-btn:not(.nav-floating-btn-hide) > button {
  pointer-events: auto !important;
}


/* PC back-to-top ported to body — above videos/images/sliders */
html.is-web body > .center-bottom-btn,
html.is-web body > .center-bottom-btn[data-bm-backtop-ported="1"] {
  position: fixed !important;
  left: 0 !important;
  right: 0 !important;
  bottom: 90px !important;
  top: auto !important;
  margin: 0 !important;
  z-index: 2147483000 !important;
  pointer-events: none !important;
  display: flex !important;
  justify-content: center !important;
  align-items: center !important;
  width: 100% !important;
  height: auto !important;
  transform: none !important;
  isolation: isolate !important;
}

html.is-web body > .center-bottom-btn > .nav-floating-btn,
html.is-web body > .center-bottom-btn > button {
  position: relative !important;
  left: auto !important;
  right: auto !important;
  bottom: auto !important;
  top: auto !important;
  margin: 0 !important;
  z-index: 2147483001 !important;
  pointer-events: auto !important;
}

html.is-web body > .center-bottom-btn.nav-floating-btn-hide {
  opacity: 0 !important;
  pointer-events: none !important;
}

html.is-web body > .center-bottom-btn:not(.nav-floating-btn-hide) > .nav-floating-btn {
  pointer-events: auto !important;
}


/* Restore circular glass look for body-ported back-to-top */
html.is-web body > .center-bottom-btn > .nav-floating-btn,
html.is-web body > .center-bottom-btn > button.nav-floating-btn {
  width: 56px !important;
  height: 56px !important;
  min-width: 56px !important;
  min-height: 56px !important;
  border-radius: 50% !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  background: rgba(255, 255, 255, 0.1) !important;
  border: 1px solid rgba(255, 255, 255, 0.32) !important;
  box-shadow:
    0 8px 28px rgba(0, 0, 0, 0.22),
    inset 0 1px 0 rgba(255, 255, 255, 0.28) !important;
  backdrop-filter: blur(16px) saturate(1.35) !important;
  -webkit-backdrop-filter: blur(16px) saturate(1.35) !important;
  color: #fff !important;
  font-size: 18px !important;
  line-height: 1 !important;
  padding: 0 !important;
  text-shadow: 0 1px 2px rgba(0, 0, 0, 0.55) !important;
  -webkit-font-smoothing: antialiased !important;
}

html.is-web body > .center-bottom-btn > .nav-floating-btn::before,
html.is-web body > .center-bottom-btn > button.nav-floating-btn::before {
  color: #fff !important;
  opacity: 1 !important;
  text-shadow:
    0 0 1px rgba(0, 0, 0, 0.85),
    0 1px 3px rgba(0, 0, 0, 0.55) !important;
}