/* ===================================================
   TREEBETS – MASTER CSS
   v2.0 | + 4 Product Cards Hover Effect
   =================================================== */
/* === TEST: NPS font size fix === */
.jackpot-pool__price[data-cur="NPS"] {
  font-size: 100px !important;
  white-space: nowrap !important;
}
.jackpot-pool__money-inner {
  overflow: hidden !important;
}
/* === FIX: Odometer ribbon bleed === */
html.is-web .hm-row-bc .jackpot-pool-card.sportsbook-jackpot .odometer-digit-inner {
  overflow: hidden !important;
}
html.is-web .hm-row-bc .jackpot-pool-card.sportsbook-jackpot .jackpot-pool__price[data-cur="NPS"] {
  font-size: 0.82em !important;
}

/* === Main Hero Banner Slide Items === */
.hm-row-bc.has-slider .hm-row-bc-inner:first-child .sdr-item-bc { position: relative !important; overflow: hidden !important; display: block !important; }
.hm-row-bc.has-slider .hm-row-bc-inner:first-child .sdr-item-bc img.sdr-image-bc { position: relative !important; z-index: 1 !important; }
.hm-row-bc.has-slider .hm-row-bc-inner:first-child .sdr-item-bc::before {
  content: '' !important; position: absolute !important; top: -50% !important; left: -50% !important;
  width: 200% !important; height: 200% !important;
  background: linear-gradient(0deg, transparent, transparent 30%, rgba(255,200,0,0.32)) !important;
  transform: rotate(-45deg) !important; opacity: 0 !important; z-index: 2 !important;
  pointer-events: none !important; transition: opacity 0.6s ease, transform 0.6s ease !important;
}
.hm-row-bc.has-slider .hm-row-bc-inner:first-child .sdr-item-bc:hover {
  box-shadow: 0 0 50px rgba(255,200,0,0.4), inset 0 0 80px rgba(255,200,0,0.06) !important;
}
.hm-row-bc.has-slider .hm-row-bc-inner:first-child .sdr-item-bc:hover::before { opacity: 1 !important; transform: rotate(-45deg) translateY(100%) !important; }

/* === Main Slider Hover Scale Effect === */
@keyframes sliderFloat {
  0%, 100% { transform: translateY(0px); box-shadow: 0 8px 32px rgba(0,0,0,0.45), 0 0 0px rgba(0,161,64,0); }
  50% { transform: translateY(-5px); box-shadow: 0 18px 52px rgba(0,0,0,0.55), 0 8px 30px rgba(0,161,64,0.12); }
}
.slider-bc {
  animation: none !important; border-radius: 12px !important; overflow: hidden !important;
  will-change: auto !important; scale: 1; transition: scale 1s ease, box-shadow 1s ease !important;
}
.slider-bc:hover { scale: 1.008 !important; box-shadow: 0 24px 60px rgba(0,0,0,0.6), 0 0 40px rgba(0,161,64,0.18) !important; }

/* === CSS Custom Property for Animated Borders === */
@property --border-angle { syntax: '<angle>'; initial-value: 0deg; inherits: false; }

/* === Header Sign In Button === */
.hdr-user-bc .btn.sign-in {
  background: transparent !important; background-image: none !important;
  border: 1px solid #ffffff !important; color: #ffffff !important;
  animation: none !important; box-shadow: none !important; font-weight: 700 !important;
  font-size: 13px !important; letter-spacing: 0.5px !important; padding: 8px 22px !important;
  border-radius: 6px !important; cursor: pointer !important; text-decoration: none !important;
  transition: background 0.3s ease, box-shadow 0.3s ease !important;
}
.hdr-user-bc .btn.sign-in span { color: #ffffff !important; position: relative !important; z-index: 5 !important; text-decoration: none !important; }
.hdr-user-bc .btn.sign-in::before { display: none !important; }
.hdr-user-bc .btn.sign-in::after { display: none !important; }
.hdr-user-bc .btn.sign-in:hover { background: rgba(255,255,255,0.08) !important; box-shadow: none !important; transform: none !important; }

/* === Product Banner Cards Hover === */
.hm-row-bc-inner:not(.products) .product-banner-container-bc.col-4 .product-banner-bc {
  position: relative !important; overflow: visible !important; border-radius: 4px !important;
  transition: transform 0.6s cubic-bezier(0.22,1,0.36,1), box-shadow 0.6s ease, filter 0.6s ease !important;
}
.hm-row-bc-inner:not(.products) .product-banner-container-bc.col-4 .product-banner-bc::before {
  content: '' !important; position: absolute !important; top: -2px !important; right: -2px !important;
  bottom: -2px !important; left: -2px !important; border: 1.5px solid rgba(0,200,90,0.8) !important;
  border-radius: 6px !important; background: transparent !important; --border-angle: 0deg;
  -webkit-mask: conic-gradient(from -90deg, #000 var(--border-angle), transparent var(--border-angle)) !important;
  mask: conic-gradient(from -90deg, #000 var(--border-angle), transparent var(--border-angle)) !important;
  transition: --border-angle 0.8s ease !important; pointer-events: none !important; z-index: 10 !important;
}
.hm-row-bc-inner:not(.products) .product-banner-container-bc.col-4 .product-banner-bc:hover {
  transform: scale(1.05) !important; box-shadow: 0 0 18px rgba(0,200,90,0.35), 0 8px 28px rgba(0,0,0,0.4) !important; filter: brightness(1.08) !important;
}
.hm-row-bc-inner:not(.products) .product-banner-container-bc.col-4 .product-banner-bc:hover::before { --border-angle: 360deg; }

/* === Fix: Always expand the leagues/product-without-titles section === */
.hm-row-bc:has(.product-banner-container-bc.product-banner-without-titles.col-4) {
  max-height: none !important;
  overflow: visible !important;
  opacity: 1 !important;
  pointer-events: auto !important;
}

/* === Sport/Casino Product Icons Hover === */
@keyframes productSweep {
  0%   { filter: drop-shadow(0 6px 16px rgba(0,161,64,0.65)) drop-shadow(0 0 30px rgba(0,161,64,0.3)) brightness(1); }
  40%  { filter: drop-shadow(0 6px 16px rgba(0,161,64,0.65)) drop-shadow(-12px -12px 22px rgba(184,134,11,0.5)) brightness(1.25); }
  100% { filter: drop-shadow(0 6px 16px rgba(0,161,64,0.65)) drop-shadow(0 0 30px rgba(0,161,64,0.3)) brightness(1.12); }
}
.hm-row-bc-inner.products .product-banner-bc { background: transparent !important; transition: transform 0.5s cubic-bezier(0.22,1,0.36,1), filter 0.5s ease !important; }
.hm-row-bc-inner.products .product-banner-bc:hover { transform: scale(1.08) translateY(-4px) !important; animation: productSweep 0.7s ease forwards !important; }

/* === Language / Currency Selector Dropdown === */
.hdr-main-content-bc .form-control-bc.select.compact-mode {
  position: relative !important; background: rgba(0,0,0,0.3) !important;
  border: 1px solid rgba(0,161,64,0.25) !important; border-top: 1px solid rgba(0,161,64,0.25) !important;
  border-radius: 6px !important; margin-left: 12px !important; min-width: 95px !important;
  cursor: pointer !important; transition: background 0.3s ease, box-shadow 0.3s ease, border-color 0.3s ease !important;
}
.hdr-main-content-bc .form-control-bc.select.compact-mode .form-control-select-bc { padding-inline-end: 10px !important; }
.hdr-main-content-bc .form-control-bc.select.compact-mode::after { display: none !important; }
.hdr-main-content-bc .form-control-bc.select.compact-mode:hover {
  background: rgba(0,161,64,0.12) !important; border-color: rgba(0,200,80,0.55) !important;
  box-shadow: 0 0 12px rgba(0,161,64,0.35), 0 3px 10px rgba(0,0,0,0.3) !important;
}
.hdr-main-content-bc .form-control-bc.select.compact-mode .multi-select-label-bc { padding: 4px !important; }
.hdr-main-content-bc .form-control-bc.select.compact-mode .checkbox-control-content-bc {
  border-radius: 6px !important; padding: 7px 12px !important; cursor: pointer !important;
  transition: background 0.25s ease, box-shadow 0.25s ease !important; border: 1px solid transparent !important;
}
.hdr-main-content-bc .form-control-bc.select.compact-mode .checkbox-control-content-bc:hover {
  background: rgba(0,161,64,0.18) !important; border-color: rgba(0,200,80,0.4) !important; box-shadow: 0 0 10px rgba(0,161,64,0.3) !important;
}
.hdr-main-content-bc .form-control-bc.select.compact-mode .checkbox-control-content-bc.active {
  background: rgba(0,161,64,0.25) !important; border-color: rgba(0,200,80,0.5) !important;
}

/* === Popular Games Slider === */
.hm-row-bc-inner.populargames .swiper-slide { position: relative !important; border-radius: 10px !important; transition: filter 0.35s ease !important; }
.hm-row-bc-inner.populargames .swiper-slide .product-banner-bc,
.hm-row-bc-inner.populargames .swiper-slide img,
.hm-row-bc-inner.populargames .swiper-slide > * { transform: none !important; transition: none !important; }
.hm-row-bc-inner.populargames .swiper-slide::before {
  content: '' !important; position: absolute !important; inset: 0 !important; border: 2px solid #D4A017 !important;
  border-radius: 10px !important; background: transparent !important; --border-angle: 0deg;
  -webkit-mask: conic-gradient(from -90deg, #000 var(--border-angle), transparent var(--border-angle)) !important;
  mask: conic-gradient(from -90deg, #000 var(--border-angle), transparent var(--border-angle)) !important;
  transition: --border-angle 0.9s ease !important; pointer-events: none !important; z-index: 999 !important;
}
.hm-row-bc-inner.populargames .swiper-slide:hover { filter: brightness(1.05) drop-shadow(0 0 10px rgba(184,134,11,0.4)) !important; }
.hm-row-bc-inner.populargames .swiper-slide:hover::before { --border-angle: 360deg; }
.hm-row-bc-inner.populargames .swiper-slide .product-banner-bc,
.hm-row-bc-inner.populargames .swiper-slide img { transition: transform 1.2s cubic-bezier(0.22,1,0.36,1) !important; }
.hm-row-bc-inner.populargames .swiper-slide:hover .product-banner-bc,
.hm-row-bc-inner.populargames .swiper-slide:hover img { transform: scale(1.01) !important; }

/* === Crash Games Slider === */
.hm-row-bc-inner.crashgames .swiper-slide { position: relative !important; border-radius: 10px !important; transition: filter 0.35s ease !important; }
.hm-row-bc-inner.crashgames .swiper-slide .product-banner-bc,
.hm-row-bc-inner.crashgames .swiper-slide img,
.hm-row-bc-inner.crashgames .swiper-slide > * { transform: none !important; transition: none !important; }
.hm-row-bc-inner.crashgames .swiper-slide::before {
  content: '' !important; position: absolute !important; inset: 0 !important; border: 1px solid #B8860B !important;
  border-radius: 10px !important; background: transparent !important; --border-angle: 0deg;
  -webkit-mask: conic-gradient(from -90deg, #000 var(--border-angle), transparent var(--border-angle)) !important;
  mask: conic-gradient(from -90deg, #000 var(--border-angle), transparent var(--border-angle)) !important;
  transition: --border-angle 0.9s ease !important; pointer-events: none !important; z-index: 999 !important;
}
.hm-row-bc-inner.crashgames .swiper-slide:hover { filter: brightness(1.45) drop-shadow(0 0 10px rgba(184,134,11,0.4)) !important; }
.hm-row-bc-inner.crashgames .swiper-slide:hover::before { --border-angle: 360deg; }
.hm-row-bc-inner.crashgames .swiper-slide .product-banner-bc,
.hm-row-bc-inner.crashgames .swiper-slide img { transition: transform 1.2s cubic-bezier(0.22,1,0.36,1) !important; }
.hm-row-bc-inner.crashgames .swiper-slide:hover .product-banner-bc,
.hm-row-bc-inner.crashgames .swiper-slide:hover img { transform: scale(1.01) !important; }

/* === Live Casino Slider === */
.hm-row-bc-inner.livecasino .swiper-slide { position: relative !important; cursor: pointer !important; border-radius: 10px !important; transition: filter 0.35s ease !important; }
.hm-row-bc-inner.livecasino .swiper-slide::before {
  content: '' !important; position: absolute !important; inset: 0 !important; border: 2px solid rgba(0,161,64,0.9) !important;
  border-radius: 10px !important; background: transparent !important; --border-angle: 0deg;
  -webkit-mask: conic-gradient(from -90deg, #000 var(--border-angle), transparent var(--border-angle)) !important;
  mask: conic-gradient(from -90deg, #000 var(--border-angle), transparent var(--border-angle)) !important;
  transition: --border-angle 0.9s ease !important; pointer-events: none !important; z-index: 999 !important;
}
.hm-row-bc-inner.livecasino .swiper-slide:hover::before { --border-angle: 360deg; }
.hm-row-bc-inner.livecasino .swiper-slide::after {
  content: '' !important; position: absolute !important; inset: 0 !important; border-radius: 10px !important;
  background: radial-gradient(ellipse at center, transparent 25%, rgba(0,161,64,0.28) 100%) !important;
  opacity: 0 !important; transition: opacity 0.7s ease !important; pointer-events: none !important; z-index: 5 !important;
}
.hm-row-bc-inner.livecasino .swiper-slide:hover::after { opacity: 1 !important; }
.hm-row-bc-inner.livecasino .swiper-slide img { transition: transform 1s cubic-bezier(0.22,1,0.36,1), filter 0.5s ease !important; }
.hm-row-bc-inner.livecasino .swiper-slide:hover img { transform: scale(1.00) !important; filter: brightness(1.18) !important; }

/* === Sign In Popup === */
.entrance-popup-bc.sign-in {
  background: linear-gradient(160deg, #0b1f14 0%, #0d1a10 60%, #091510 100%) !important;
  border: 1px solid rgba(0,161,64,0.2) !important;
  box-shadow: 0 0 60px rgba(0,0,0,0.8), 0 0 30px rgba(0,161,64,0.08) !important;
}
.entrance-popup-bc.sign-in input {
  background: rgba(255,255,255,0.05) !important; border: 1px solid rgba(0,161,64,0.2) !important;
  border-radius: 8px !important; color: #fff !important; transition: border-color 0.3s ease, box-shadow 0.3s ease !important;
}
.entrance-popup-bc.sign-in input:-webkit-autofill,
.entrance-popup-bc.sign-in input:-webkit-autofill:hover,
.entrance-popup-bc.sign-in input:-webkit-autofill:focus {
  -webkit-box-shadow: 0 0 0px 1000px #0d1a10 inset !important;
  -webkit-text-fill-color: #ffffff !important;
  border: 1px solid rgba(0,161,64,0.2) !important;
  caret-color: #ffffff !important;
}
.entrance-form-actions-holder-bc.login-ext-1 .btn.a-color { position: relative !important; overflow: visible !important; }
.entrance-form-actions-holder-bc.login-ext-1 .btn.a-color::before {
  content: '' !important; position: absolute !important; inset: -3px !important; border: 1.5px solid #D4A017 !important;
  border-radius: 11px !important; background: transparent !important; --border-angle: 0deg;
  -webkit-mask: conic-gradient(from -90deg, #000 var(--border-angle), transparent var(--border-angle)) !important;
  mask: conic-gradient(from -90deg, #000 var(--border-angle), transparent var(--border-angle)) !important;
  transition: --border-angle 1s ease !important; pointer-events: none !important; z-index: 10 !important;
}
.entrance-form-actions-holder-bc.login-ext-1 .btn.a-color:hover::before { --border-angle: 360deg; }
.entrance-popup-bc.sign-in input:focus { border-color: rgba(0,200,80,0.6) !important; box-shadow: 0 0 12px rgba(0,161,64,0.25) !important; outline: none !important; }
.entrance-form-actions-holder-bc.login-ext-1 .btn.a-color {
  background: linear-gradient(to right, #33b558, #155e25) !important; color: #fff !important;
  font-weight: 700 !important; border: none !important; border-radius: 8px !important; letter-spacing: 1px !important;
  box-shadow: 0 0 20px rgba(0,161,64,0.35), 0 4px 16px rgba(0,0,0,0.4) !important;
  transition: filter 0.3s ease, box-shadow 0.3s ease !important;
}
.entrance-form-actions-holder-bc.login-ext-1 .btn.a-color:hover { filter: brightness(1.12) !important; box-shadow: 0 0 30px rgba(0,161,64,0.55), 0 4px 20px rgba(0,0,0,0.5) !important; }

/* === Logo Hover Glow === */
.hdr-logo-bc { transition: transform 0.4s cubic-bezier(0.22,1,0.36,1), filter 0.4s ease !important; filter: drop-shadow(0 0 8px rgba(0,161,64,0.3)) !important; }
.hdr-logo-bc:hover { transform: scale(1.06) !important; filter: drop-shadow(0 0 12px rgba(0,161,64,0.6)) drop-shadow(0 0 24px rgba(0,161,64,0.2)) brightness(1.1) !important; }


/* === Hamburger Button === */
i.hdr-toggle-button-bc {
  color: rgba(255,255,255,0.7) !important; background: rgba(0,161,64,0.1) !important;
  border: 1.5px solid rgba(0,161,64,0.3) !important; border-radius: 8px !important;
  transition: color 0.3s ease, background 0.3s ease, box-shadow 0.3s ease, border-color 0.3s ease !important;
}
i.hdr-toggle-button-bc:hover { color: #fff !important; background: rgba(0,161,64,0.18) !important; border-color: rgba(0,200,80,0.6) !important; box-shadow: 0 0 12px rgba(0,161,64,0.4) !important; }

/* === Smart Panel Buttons === */
.hdr-smart-panel-holder-bc .sp-button-bc { background: rgba(0,161,64,0.08) !important; border: 1.5px solid rgba(0,161,64,0.2) !important; border-radius: 10px !important; color: rgba(255,255,255,0.6) !important; transition: background 0.3s ease, border-color 0.3s ease, box-shadow 0.3s ease, color 0.3s ease !important; }
.hdr-smart-panel-holder-bc .sp-button-bc:hover { background: rgba(0,161,64,0.18) !important; border-color: rgba(0,200,80,0.55) !important; box-shadow: 0 0 14px rgba(0,161,64,0.4) !important; color: #fff !important; }
.hdr-smart-panel-holder-bc .sp-button-bc.active { background: rgba(0,161,64,0.25) !important; border-color: rgba(0,200,80,0.6) !important; box-shadow: 0 0 18px rgba(0,161,64,0.45) !important; color: #fff !important; }

/* === Header Clock === */
time.infoTime { color: rgba(255,255,255,0.85) !important; font-weight: 700 !important; font-size: 13px !important; letter-spacing: 1px !important; background: rgba(0,161,64,0.08) !important; border: 1.5px solid rgba(0,161,64,0.2) !important; border-radius: 8px !important; padding: 4px 10px !important; box-shadow: 0 0 10px rgba(0,161,64,0.15) !important; font-variant-numeric: tabular-nums !important; }

/* === +10% Badge === */
@keyframes badge3DRoll {
  0%   { transform: perspective(250px) rotateY(0deg) rotateX(0deg); }
  25%  { transform: perspective(250px) rotateY(22deg) rotateX(8deg); }
  50%  { transform: perspective(250px) rotateY(0deg) rotateX(0deg); }
  75%  { transform: perspective(250px) rotateY(-22deg) rotateX(-8deg); }
  100% { transform: perspective(250px) rotateY(0deg) rotateX(0deg); }
}

/* === Remove old +10% badge from hdr-user-bc === */
.hdr-user-bc::before { display: none !important; }

/* === +10% Badge – header-custom-buttons link === */
.header-custom-buttons a.btn.bc-i-deposit {
  min-width: 44px !important; height: 34px !important;
  background: linear-gradient(145deg, #0a1205, #1a2a08) !important;
  border-radius: 8px !important; border: 2px solid rgba(180,220,40,0.65) !important;
  box-shadow: 0 0 14px rgba(180,220,40,0.4), inset 0 0 10px rgba(180,220,40,0.08) !important;
  animation: badge3DRoll 3.5s ease-in-out infinite !important;
  cursor: pointer !important; padding: 0 !important; position: relative !important; text-decoration: none !important;
}
.header-custom-buttons a.btn.bc-i-deposit::before {
  content: '+10%' !important; display: flex !important; align-items: center !important;
  justify-content: center !important; position: absolute !important; inset: 0 !important;
  color: #c8f040 !important; font-size: 13px !important; font-weight: 900 !important;
  letter-spacing: -0.5px !important; font-family: 'Arial Black', Arial, sans-serif !important;
  text-shadow: 0 0 8px rgba(200,240,60,0.9), 0 0 20px rgba(200,240,60,0.5) !important;
  background: none !important;
}
.header-custom-buttons a.btn.bc-i-deposit > * { display: none !important; }

/* === Welcome Bonus Cards – CSS Custom Properties === */
@property --casino-angle { syntax: '<angle>';  initial-value: 0deg; inherits: false; }
@property --sports-angle { syntax: '<angle>';  initial-value: 0deg; inherits: false; }
@property --casino-spin  { syntax: '<angle>';  initial-value: 0deg; inherits: false; }
@property --sports-spin  { syntax: '<angle>';  initial-value: 0deg; inherits: false; }
@property --casino-hover { syntax: '<number>'; initial-value: 0;    inherits: false; }
@property --sports-hover { syntax: '<number>'; initial-value: 0;    inherits: false; }

/* === Welcome Cards Animations === */
@keyframes casinoTrace {
  0%     { --casino-angle: 0deg; }
  35%    { --casino-angle: 360deg; }
  62%    { --casino-angle: 360deg; }
  62.01% { --casino-angle: 0deg; }
  100%   { --casino-angle: 0deg; }
}
@keyframes sportsTrace {
  0%     { --sports-angle: 0deg; }
  35%    { --sports-angle: 360deg; }
  62%    { --sports-angle: 360deg; }
  62.01% { --sports-angle: 0deg; }
  100%   { --sports-angle: 0deg; }
}
@keyframes casinoSpin { from { --casino-spin: 0deg; } to { --casino-spin: 360deg; } }
@keyframes sportsSpin { from { --sports-spin: 0deg; } to { --sports-spin: 360deg; } }

/* === Welcome Cards Container Reset === */
.hm-row-bc.has-slider .hm-row-bc-inner:nth-child(2) .slider-bc,
.hm-row-bc.has-slider .hm-row-bc-inner:nth-child(2) .carouselWrapper,
.hm-row-bc.has-slider .hm-row-bc-inner:nth-child(2) .swiper,
.hm-row-bc.has-slider .hm-row-bc-inner:nth-child(2) .swiper-wrapper,
.hm-row-bc.has-slider .hm-row-bc-inner:nth-child(2) .swiper-slide {
  background: transparent !important; border: none !important;
  box-shadow: none !important; animation: none !important;
  overflow: visible !important; border-radius: 0 !important;
}

/* === Welcome Cards Grid Layout === */
.hm-row-bc.has-slider .hm-row-bc-inner:nth-child(2) .sdr-item-holder-bc {
  display: grid !important; grid-template-rows: 185px 185px !important;
  grid-template-columns: 1fr !important; gap: 12px !important; padding: 0 12px !important;
  height: auto !important; box-sizing: border-box !important; background: transparent !important;
  border: none !important; box-shadow: none !important; overflow: visible !important; position: relative !important;
}

/* === Welcome Cards Invisible Click Layer === */
.hm-row-bc.has-slider .hm-row-bc-inner:nth-child(2) .sdr-item-holder-bc .sdr-item-bc {
  display: block !important; grid-row: 2 !important; grid-column: 1 !important;
  width: 100% !important; height: 100% !important; opacity: 0 !important;
  background: transparent !important; pointer-events: auto !important; z-index: 10 !important; cursor: pointer !important;
}

/* === Casino Welcome Card === */
.hm-row-bc.has-slider .hm-row-bc-inner:nth-child(2) .sdr-item-holder-bc::before {
  content: '' !important; display: block !important; grid-row: 1 !important; grid-column: 1 !important;
  border: 2px solid transparent !important; border-radius: 14px !important; overflow: hidden !important;
  --casino-hover: 0; transition: --casino-hover 0.45s ease !important;
  animation: casinoTrace 4.5s ease-in-out infinite, casinoSpin 2.5s linear infinite !important;
  background:
    url('https://cmsbetconstruct.com/storage/medias/treebets-18775478/media_18775478_e658e80e5c480b6279aa73023eb6aa34.png') center / cover no-repeat padding-box,
    linear-gradient(145deg, #0d1a0a, #122010, #091508) padding-box,
    conic-gradient(from var(--casino-spin), rgba(212,160,23,calc(var(--casino-hover)*0.9)) 0deg, rgba(255,215,0,calc(var(--casino-hover)*1.0)) 40deg, rgba(212,160,23,calc(var(--casino-hover)*0.4)) 90deg, rgba(212,160,23,calc(var(--casino-hover)*0.12)) 140deg, rgba(212,160,23,calc(var(--casino-hover)*0.4)) 190deg, rgba(212,160,23,calc(var(--casino-hover)*0.9)) 230deg, rgba(255,215,0,calc(var(--casino-hover)*1.0)) 270deg, rgba(212,160,23,calc(var(--casino-hover)*0.4)) 315deg, rgba(212,160,23,calc(var(--casino-hover)*0.12)) 345deg, rgba(212,160,23,calc(var(--casino-hover)*0.9)) 360deg) border-box,
    conic-gradient(from calc(var(--casino-angle) - 90deg), rgba(212,160,23,calc((1 - var(--casino-hover))*0.08)) 0deg, rgba(212,160,23,calc((1 - var(--casino-hover))*0.08)) 300deg, rgba(212,160,23,calc((1 - var(--casino-hover))*0.35)) 325deg, rgba(212,160,23,calc((1 - var(--casino-hover))*0.85)) 342deg, rgba(255,215,0,calc((1 - var(--casino-hover))*1.0)) 350deg, rgba(212,160,23,calc((1 - var(--casino-hover))*0.5)) 357deg, rgba(212,160,23,calc((1 - var(--casino-hover))*0.08)) 360deg) border-box !important;
  cursor: pointer !important;
}

/* === Sports Welcome Card (Jackpot Banner) === */
.hm-row-bc.has-slider .hm-row-bc-inner:nth-child(2) .sdr-item-holder-bc::after {
  content: '' !important; display: block !important; grid-row: 2 !important; grid-column: 1 !important;
  border: 2px solid transparent !important; border-radius: 14px !important; overflow: hidden !important;
  --sports-hover: 0; transition: --sports-hover 0.45s ease !important;
  animation: sportsTrace 4.5s ease-in-out 1.2s infinite, sportsSpin 2.5s linear infinite !important;
  background:
    url('https://cmsbetconstruct.com/storage/medias/treebets-18775478/media_18775478_044a24f5a3d3dde9f18ec00d8cfab74f.jpeg') center / cover no-repeat padding-box,
    linear-gradient(145deg, #001509, #001f0d, #000e06) padding-box,
    conic-gradient(from var(--sports-spin), rgba(0,200,80,calc(var(--sports-hover)*0.9)) 0deg, rgba(0,255,100,calc(var(--sports-hover)*1.0)) 40deg, rgba(0,200,80,calc(var(--sports-hover)*0.4)) 90deg, rgba(0,200,80,calc(var(--sports-hover)*0.12)) 140deg, rgba(0,200,80,calc(var(--sports-hover)*0.4)) 190deg, rgba(0,200,80,calc(var(--sports-hover)*0.9)) 230deg, rgba(0,255,100,calc(var(--sports-hover)*1.0)) 270deg, rgba(0,200,80,calc(var(--sports-hover)*0.4)) 315deg, rgba(0,200,80,calc(var(--sports-hover)*0.12)) 345deg, rgba(0,200,80,calc(var(--sports-hover)*0.9)) 360deg) border-box,
    conic-gradient(from calc(var(--sports-angle) - 90deg), rgba(0,200,80,calc((1 - var(--sports-hover))*0.08)) 0deg, rgba(0,200,80,calc((1 - var(--sports-hover))*0.08)) 300deg, rgba(0,200,80,calc((1 - var(--sports-hover))*0.35)) 325deg, rgba(0,200,80,calc((1 - var(--sports-hover))*0.85)) 342deg, rgba(0,255,100,calc((1 - var(--sports-hover))*1.0)) 350deg, rgba(0,200,80,calc((1 - var(--sports-hover))*0.5)) 357deg, rgba(0,200,80,calc((1 - var(--sports-hover))*0.08)) 360deg) border-box !important;
  cursor: pointer !important;
}

/* === Welcome Card Hover States === */
.hm-row-bc.has-slider .hm-row-bc-inner:nth-child(2) .sdr-item-holder-bc:hover:not(:has(.sdr-item-bc:hover))::before { --casino-hover: 1 !important; }
.hm-row-bc.has-slider .hm-row-bc-inner:nth-child(2) .sdr-item-holder-bc:has(.sdr-item-bc:hover)::after { --sports-hover: 1 !important; }

/* === Nav Menu Alignment Fix === */
nav.nav-menu-container.header-navigation { background: transparent !important; height: auto !important; align-items: center !important; }
.nav-menu-container .nav-menu-other { order: 1 !important; align-self: center !important; }

/* === Game Showcase Slider === */
.hm-row-bc-inner.gameshowcase .swiper-slide {
  border-radius: 16px !important; overflow: hidden !important; position: relative !important;
  border: 2px solid rgba(0,200,80,0.4) !important; box-shadow: 0 0 20px rgba(0,200,80,0.15) !important;
  transition: transform 0.3s ease, box-shadow 0.3s ease, border-color 0.3s ease !important; cursor: pointer !important;
}
.hm-row-bc-inner.gameshowcase .swiper-slide:hover {
  transform: scale(1.03) translateY(-4px) !important; border-color: rgba(0,220,80,0.9) !important;
  box-shadow: 0 0 30px rgba(0,200,80,0.5), 0 8px 24px rgba(0,0,0,0.4) !important;
}
.hm-row-bc-inner.gameshowcase .swiper-slide img {
  width: 100% !important; height: 100% !important; object-fit: cover !important;
  border-radius: 14px !important; transition: transform 0.4s ease !important;
}
.hm-row-bc-inner.gameshowcase .swiper-slide:hover img { transform: scale(1.05) !important; }

/* === GIF Divider Below Products Row – English === */
.hm-row-bc:has(.hm-row-bc-inner.products) {
  margin-bottom: 0 !important; padding-bottom: 0 !important;
  position: relative !important; overflow: visible !important; background-color: transparent !important;
}
.hm-row-bc:has(.hm-row-bc-inner.products)::after {
  content: '' !important; display: block !important; width: 100% !important; height: 60px !important;
  background: url('https://cmsbetconstruct.com/storage/medias/treebets-18775478/media_18775478_0f2604c004fbca4d8a89fd682ad543b1.gif') center / 100% 100% no-repeat !important;
  position: absolute !important; bottom: -75px !important; left: 0 !important; z-index: 100 !important;
}
.hm-row-bc:has(.hm-row-bc-inner.products) + .hm-row-bc { margin-top: 100px !important; }

/* === GIF Divider – Arabic Override === */
html[dir="rtl"] .hm-row-bc:has(.hm-row-bc-inner.products)::after {
  background: url('https://cmsbetconstruct.com/storage/medias/treebets-18775478/media_18775478_accc82ff0b7c478a98b453d1fb2ded07.gif') center / 100% 100% no-repeat !important;
}

/* === Main Banner Spinning Conic Border === */
@property --mb-spin { syntax: '<angle>'; initial-value: 0deg; inherits: false; }
@keyframes mbSpin { from { --mb-spin: 0deg; } to { --mb-spin: 360deg; } }

.hm-row-bc.has-slider .hm-row-bc-inner:first-child { position: relative !important; }
.hm-row-bc.has-slider .hm-row-bc-inner:first-child::after {
  content: '' !important; position: absolute !important; inset: 0 !important;
  border-radius: 14px !important; padding: 1.5px !important; pointer-events: none !important;
  z-index: 1 !important; animation: mbSpin 7s linear infinite !important;
  background: conic-gradient(
    from var(--mb-spin),
    rgba(0,200,80,  0.10)   0deg,
    rgba(0,200,80,  0.10) 280deg,
    rgba(0,200,80,  0.70) 320deg,
    rgba(255,215,0, 1.00) 342deg,
    rgba(255,215,0, 0.80) 352deg,
    rgba(255,215,0, 0.50) 358deg,
    rgba(0,200,80,  0.10) 360deg
  ) !important;
  -webkit-mask: linear-gradient(#fff 0 0) content-box, linear-gradient(#fff 0 0) !important;
  -webkit-mask-composite: xor !important;
  mask: linear-gradient(#fff 0 0) content-box, linear-gradient(#fff 0 0) !important;
  mask-composite: exclude !important;
}

/* === Global Page Background === */
body { background-color: #0d1a10 !important; }

/* === Hero Right Box – Casino === */
.hm-row-bc.has-slider > .hm-row-bc-inner:nth-child(2) > .hm-row-bc:nth-child(1) > .hm-row-bc-inner {
  background: url('https://cmsbetconstruct.com/storage/medias/treebets-18775478/media_18775478_e658e80e5c480b6279aa73023eb6aa34.png') center / cover no-repeat !important;
  border-radius: 12px !important; overflow: hidden !important; cursor: pointer !important; position: relative !important;
}

/* === Hero Right Box – Sports (Jackpot Banner) === */
.hm-row-bc.has-slider > .hm-row-bc-inner:nth-child(2) > .hm-row-bc:nth-child(2) > .hm-row-bc-inner {
  background: url('https://cmsbetconstruct.com/storage/medias/treebets-18775478/media_18775478_044a24f5a3d3dde9f18ec00d8cfab74f.jpeg') center / cover no-repeat !important;
  border-radius: 12px !important; overflow: hidden !important; cursor: pointer !important; position: relative !important;
}

/* === Hero Casino Box – Gold Spinning Border on Hover === */
.hm-row-bc.has-slider > .hm-row-bc-inner:nth-child(2) > .hm-row-bc:nth-child(1) > .hm-row-bc-inner::before {
  content: '' !important; position: absolute !important; inset: 0 !important;
  border-radius: 12px !important; padding: 1.5px !important;
  background: conic-gradient(from var(--casino-spin),
    #FFD700 0deg, #FFF59D 40deg, #FFD700 80deg, #F57F17 120deg,
    #FFD700 160deg, #FFFF8D 200deg, #B8860B 240deg, #FFD700 280deg,
    #FFF176 320deg, #FFD700 360deg) !important;
  -webkit-mask: linear-gradient(#fff 0 0) content-box, linear-gradient(#fff 0 0) !important;
  -webkit-mask-composite: xor !important;
  mask: linear-gradient(#fff 0 0) content-box, linear-gradient(#fff 0 0) !important;
  mask-composite: exclude !important;
  pointer-events: none !important; z-index: 10 !important; opacity: 0 !important;
  transition: opacity 0.7s ease-in-out !important; animation: casinoSpin 1.8s linear infinite !important;
}
.hm-row-bc.has-slider > .hm-row-bc-inner:nth-child(2) > .hm-row-bc:nth-child(1) > .hm-row-bc-inner:hover::before { opacity: 1 !important; }

/* === Hero Sports Box – Green Spinning Border on Hover === */
.hm-row-bc.has-slider > .hm-row-bc-inner:nth-child(2) > .hm-row-bc:nth-child(2) > .hm-row-bc-inner::before {
  content: '' !important; position: absolute !important; inset: 0 !important;
  border-radius: 12px !important; padding: 1.5px !important;
  background: conic-gradient(from var(--sports-spin),
    #00FF64 0deg, #CCFF90 40deg, #00E676 80deg, #00420F 120deg,
    #00FF64 160deg, #69FF47 200deg, #00A140 240deg, #00FF64 280deg,
    #B9F6CA 320deg, #00FF64 360deg) !important;
  -webkit-mask: linear-gradient(#fff 0 0) content-box, linear-gradient(#fff 0 0) !important;
  -webkit-mask-composite: xor !important;
  mask: linear-gradient(#fff 0 0) content-box, linear-gradient(#fff 0 0) !important;
  mask-composite: exclude !important;
  pointer-events: none !important; z-index: 10 !important; opacity: 0 !important;
  transition: opacity 0.7s ease-in-out !important; animation: sportsSpin 1.8s linear infinite !important;
}
.hm-row-bc.has-slider > .hm-row-bc-inner:nth-child(2) > .hm-row-bc:nth-child(2) > .hm-row-bc-inner:hover::before { opacity: 1 !important; }

/* === Footer === */
.footerCopyrights { color: rgba(0,200,80,0.6) !important; }
.footerWarningAge { color: #00e05a !important; border-color: #00e05a !important; text-shadow: 0 0 8px rgba(0,220,80,0.6) !important; }

/* === Loyalty Bonus Ribbon === */
a.loyaltyBonusHeader {
  --hero: 30, 120, 55 !important; background: linear-gradient(to right, #33b558, #155e25) !important;
  font-size: 10px !important; height: 24px !important; line-height: 24px !important;
  flex-grow: 0 !important; flex-shrink: 0 !important; width: fit-content !important;
  align-self: center !important; overflow: visible !important; margin-right: 40px !important;
}
a.loyaltyBonusHeader::before, a.loyaltyBonusHeader::after { background: rgba(30,120,55,1) !important; height: 80% !important; }
p.loyaltyBonusHeaderBackground { width: 130% !important; }
p.loyaltyBonusHeaderBackground::before, p.loyaltyBonusHeaderBackground::after { background: rgba(30,120,55,1) !important; height: 80% !important; }
p.loyaltyBonusHeaderShadow { background: rgba(0,0,0,0.6) !important; filter: blur(4px) !important; opacity: 0.5 !important; }

/* === Footer 18+ Circle === */
span.footerWarningAge {
  background: linear-gradient(135deg, #1e7837 0%, #0a3314 100%) !important;
  -webkit-background-clip: unset !important; -webkit-text-fill-color: transparent !important;
  background-clip: unset !important; border: none !important; box-shadow: none !important;
  border-radius: 50% !important; color: transparent !important; text-shadow: none !important;
  width: 48px !important; height: 48px !important; min-width: 48px !important; font-size: 0 !important;
  display: flex !important; align-items: center !important; justify-content: center !important;
  position: relative !important;
}
span.footerWarningAge::after {
  content: '21+' !important;
  font-size: 14px !important;
  color: #ffffff !important;
  font-weight: 700 !important;
  -webkit-text-fill-color: #ffffff !important;
}

/* === Header Register Button === */
@keyframes registerBreath {
  0%, 100% { box-shadow: 0 0 10px rgba(51,181,88,0.4), 0 0 20px rgba(51,181,88,0.15); }
  50% { box-shadow: 0 0 22px rgba(51,181,88,0.85), 0 0 45px rgba(51,181,88,0.3), 0 4px 16px rgba(0,0,0,0.3); }
}
button.register {
  background: linear-gradient(to right, #33b558, #155e25) !important;
  background-image: linear-gradient(to right, #33b558, #155e25) !important;
  border-color: #155e25 !important; color: white !important; padding: 8px 28px !important;
  animation: registerBreath 2.2s ease-in-out infinite !important;
}
button.register span { color: white !important; }

/* === Register Popup === */
.entrance-popup-bc.register .btn.a-color { position: relative !important; overflow: visible !important; }
.entrance-popup-bc.register .btn.a-color::before {
  content: '' !important; position: absolute !important; inset: -3px !important; border: 1.5px solid #D4A017 !important;
  border-radius: 11px !important; background: transparent !important; --border-angle: 0deg;
  -webkit-mask: conic-gradient(from -90deg, #000 var(--border-angle), transparent var(--border-angle)) !important;
  mask: conic-gradient(from -90deg, #000 var(--border-angle), transparent var(--border-angle)) !important;
  transition: --border-angle 1s ease !important; pointer-events: none !important; z-index: 10 !important;
}
.entrance-popup-bc.register .btn.a-color:hover::before { --border-angle: 360deg; }
.entrance-popup-bc.register .btn.a-color {
  background: linear-gradient(to right, #33b558, #155e25) !important; color: #fff !important;
  font-weight: 700 !important; border: none !important; border-radius: 8px !important; letter-spacing: 1px !important;
  box-shadow: 0 0 20px rgba(0,161,64,0.35), 0 4px 16px rgba(0,0,0,0.4) !important;
  transition: filter 0.3s ease, box-shadow 0.3s ease !important;
}
.entrance-popup-bc.register .btn.a-color:hover { filter: brightness(1.12) !important; box-shadow: 0 0 30px rgba(0,161,64,0.55), 0 4px 20px rgba(0,0,0,0.5) !important; }

span#login_button_id {
  border: 0.5px solid #ffffff !important; border-radius: 6px !important; padding: 6px 16px !important;
  text-decoration: none !important; color: #ffffff !important; font-weight: 700 !important; cursor: pointer !important;
}
.steps-indicator { display: none !important; }

/* === Loyalty Program Link === */
a[href*="loyalty-program"] {
  color: #ffffff !important; border: 1px solid #ffffff !important; border-radius: 8px !important;
  text-decoration: none !important; padding: 6px 18px !important; font-weight: 600 !important;
  font-size: 12px !important; letter-spacing: 0.5px !important; display: inline-block !important;
  margin-top: 16px !important; transition: background 0.3s ease, box-shadow 0.3s ease !important;
}
a[href*="loyalty-program"]:hover { background: rgba(255,255,255,0.1) !important; box-shadow: 0 0 10px rgba(255,255,255,0.15) !important; }
.hm-row-bc.has-slider a[href*="loyalty-program"] {
  border: none !important; border-radius: 0 !important; padding: 0 !important; display: block !important;
  margin-top: 0 !important; font-size: inherit !important; font-weight: inherit !important;
  letter-spacing: inherit !important; box-shadow: none !important; background: transparent !important;
}
.loyaltyLevelContent { margin-top: 20px !important; padding-top: 12px !important; }

/* === Popular Games Section === */
.hm-row-bc:has(.testcss1) { position: relative !important; z-index: 2 !important; overflow: hidden !important; }
.hm-row-bc:has(.testcss2) { margin-top: -440px !important; position: relative !important; padding-top: 90px !important; z-index: 1 !important; width: 100% !important; }
.testcss1 .product-banner-container-bc { margin-left: 37.5%; margin-top: 40px; width: 90%; overflow: hidden !important; }
.testcss1 .swiper-slide { height: 310px !important; }
.testcss1 .product-banner-info-bc { height: 100% !important; }
.testcss1 .product-banner-img-bc { height: 100% !important; object-fit: cover !important; }
.testcss1 .carouselWrapper, .testcss1 .swiper { position: static !important; }

/* === Green circle arrows – top right === */
.testcss1 .swiper-button-prev,
.testcss1 .swiper-button-next {
  display: flex !important; align-items: center !important; justify-content: center !important;
  position: absolute !important; top: 21px !important; bottom: auto !important; left: auto !important;
  z-index: 100 !important; background: rgba(0,0,0,0.65) !important; border: 2px solid #33b558 !important;
  border-radius: 50% !important; width: 26px !important; height: 26px !important;
  box-shadow: 0 0 12px rgba(51,181,88,0.7), 0 0 24px rgba(51,181,88,0.3) !important;
}
.testcss1 .swiper-button-prev { right: 48px !important; }
.testcss1 .swiper-button-next { right: 6px !important; }
.testcss1 .swiper-button-prev::after,
.testcss1 .swiper-button-next::after { font-size: 13px !important; color: #33b558 !important; font-weight: bold !important; }

/* === RTL Arabic – Popular Games Section === */
html[dir="rtl"] .testcss1 .product-banner-container-bc { margin-left: 0 !important; margin-right: 37.5% !important; }
html[dir="rtl"] .testcss1 .swiper-button-prev { right: auto !important; left: 48px !important; }
html[dir="rtl"] .testcss1 .swiper-button-next { right: auto !important; left: 6px !important; }

/* === Wide Screen Adjustments === */
@media (min-width: 1800px) {
  .hm-row-bc:has(.testcss2) { margin-top: -520px !important; padding-top: 120px !important; }
  .testcss1 .product-banner-container-bc { margin-top: 50px; }
  .testcss1 .swiper-slide { height: 360px !important; }
}
@media (min-width: 2100px) {
  .hm-row-bc:has(.testcss1) { overflow: visible !important; }
  body { overflow-x: hidden !important; }
}

/* === Arabic Welcome Cards – Casino Image === */
html[dir="rtl"] .hm-row-bc.has-slider .hm-row-bc-inner:nth-child(2) .sdr-item-holder-bc::before {
  background:
    url('https://cmsbetconstruct.com/storage/medias/treebets-18775478/media_18775478_5b7a0613fa4d096680f30c23dacb5160.jpeg') center / cover no-repeat padding-box,
    linear-gradient(145deg, #0d1a0a, #122010, #091508) padding-box,
    conic-gradient(from var(--casino-spin), rgba(212,160,23,calc(var(--casino-hover)*0.9)) 0deg, rgba(255,215,0,calc(var(--casino-hover)*1.0)) 40deg, rgba(212,160,23,calc(var(--casino-hover)*0.4)) 90deg, rgba(212,160,23,calc(var(--casino-hover)*0.12)) 140deg, rgba(212,160,23,calc(var(--casino-hover)*0.4)) 190deg, rgba(212,160,23,calc(var(--casino-hover)*0.9)) 230deg, rgba(255,215,0,calc(var(--casino-hover)*1.0)) 270deg, rgba(212,160,23,calc(var(--casino-hover)*0.4)) 315deg, rgba(212,160,23,calc(var(--casino-hover)*0.12)) 345deg, rgba(212,160,23,calc(var(--casino-hover)*0.9)) 360deg) border-box,
    conic-gradient(from calc(var(--casino-angle) - 90deg), rgba(212,160,23,calc((1 - var(--casino-hover))*0.08)) 0deg, rgba(212,160,23,calc((1 - var(--casino-hover))*0.08)) 300deg, rgba(212,160,23,calc((1 - var(--casino-hover))*0.35)) 325deg, rgba(212,160,23,calc((1 - var(--casino-hover))*0.85)) 342deg, rgba(255,215,0,calc((1 - var(--casino-hover))*1.0)) 350deg, rgba(212,160,23,calc((1 - var(--casino-hover))*0.5)) 357deg, rgba(212,160,23,calc((1 - var(--casino-hover))*0.08)) 360deg) border-box !important;
}

/* === Arabic Welcome Cards – Sports Image === */
html[dir="rtl"] .hm-row-bc.has-slider .hm-row-bc-inner:nth-child(2) .sdr-item-holder-bc::after {
  background:
    url('https://cmsbetconstruct.com/storage/medias/treebets-18775478/media_18775478_608e408a81c2776f714aa32c35937406.jpeg') center / cover no-repeat padding-box,
    linear-gradient(145deg, #001509, #001f0d, #000e06) padding-box,
    conic-gradient(from var(--sports-spin), rgba(0,200,80,calc(var(--sports-hover)*0.9)) 0deg, rgba(0,255,100,calc(var(--sports-hover)*1.0)) 40deg, rgba(0,200,80,calc(var(--sports-hover)*0.4)) 90deg, rgba(0,200,80,calc(var(--sports-hover)*0.12)) 140deg, rgba(0,200,80,calc(var(--sports-hover)*0.4)) 190deg, rgba(0,200,80,calc(var(--sports-hover)*0.9)) 230deg, rgba(0,255,100,calc(var(--sports-hover)*1.0)) 270deg, rgba(0,200,80,calc(var(--sports-hover)*0.4)) 315deg, rgba(0,200,80,calc(var(--sports-hover)*0.12)) 345deg, rgba(0,200,80,calc(var(--sports-hover)*0.9)) 360deg) border-box,
    conic-gradient(from calc(var(--sports-angle) - 90deg), rgba(0,200,80,calc((1 - var(--sports-hover))*0.08)) 0deg, rgba(0,200,80,calc((1 - var(--sports-hover))*0.08)) 300deg, rgba(0,200,80,calc((1 - var(--sports-hover))*0.35)) 325deg, rgba(0,200,80,calc((1 - var(--sports-hover))*0.85)) 342deg, rgba(0,255,100,calc((1 - var(--sports-hover))*1.0)) 350deg, rgba(0,200,80,calc((1 - var(--sports-hover))*0.5)) 357deg, rgba(0,200,80,calc((1 - var(--sports-hover))*0.08)) 360deg) border-box !important;
}

/* === Arabic Hero Boxes === */
html[dir="rtl"] .hm-row-bc.has-slider > .hm-row-bc-inner:nth-child(2) > .hm-row-bc:nth-child(1) > .hm-row-bc-inner {
  background: url('https://cmsbetconstruct.com/storage/medias/treebets-18775478/media_18775478_5b7a0613fa4d096680f30c23dacb5160.jpeg') center / cover no-repeat !important;
}
html[dir="rtl"] .hm-row-bc.has-slider > .hm-row-bc-inner:nth-child(2) > .hm-row-bc:nth-child(2) > .hm-row-bc-inner {
  background: url('https://cmsbetconstruct.com/storage/medias/treebets-18775478/media_18775478_608e408a81c2776f714aa32c35937406.jpeg') center / cover no-repeat !important;
}

/* === Social Media Icons === */
a.bc-i-facebook, a.bc-i-instagram, a.bc-i-telegram, a.bc-i-youtube {
  position: fixed !important; top: 11px !important; z-index: 9999 !important;
  background: transparent !important; background-color: transparent !important;
  border: none !important; box-shadow: none !important; border-radius: 0 !important;
  padding: 0 !important; margin-left: 30px !important; width: 34px !important; height: 34px !important;
}
a.bc-i-facebook  { left: 200px !important; }
a.bc-i-instagram { left: 244px !important; }
a.bc-i-telegram  { left: 288px !important; }
a.bc-i-youtube   { left: 332px !important; }
a.bc-i-facebook::before, a.bc-i-instagram::before, a.bc-i-telegram::before, a.bc-i-youtube::before {
  content: '' !important; display: block !important; width: 34px !important; height: 34px !important;
  background-size: contain !important; background-repeat: no-repeat !important; background-position: center !important;
}
a.bc-i-facebook span, a.bc-i-instagram span, a.bc-i-telegram span, a.bc-i-youtube span { display: none !important; }
a.bc-i-facebook::before  { background-image: url('https://cmsbetconstruct.com/storage/medias/treebets-18775478/media_18775478_17da93901b42534a9edc9cde1988434a.png') !important; }
a.bc-i-instagram::before { background-image: url('https://cmsbetconstruct.com/storage/medias/treebets-18775478/media_18775478_49d36aefb816ee5e9438b4bcc06fd9f6.png') !important; }
a.bc-i-telegram::before  { background-image: url('https://cmsbetconstruct.com/storage/medias/treebets-18775478/media_18775478_2b5922c1e2b8a6210f98c3aeb7e5a76b.png') !important; }
a.bc-i-youtube::before   { background-image: url('https://cmsbetconstruct.com/storage/medias/treebets-18775478/media_18775478_06821f1b6d832a691021f74ee4f6e34b.png') !important; }
a.bc-i-facebook::after, a.bc-i-instagram::after, a.bc-i-telegram::after, a.bc-i-youtube::after { display: none !important; }

/* === Social Icons — Arabic RTL === */
html[dir="rtl"] a.bc-i-facebook, html[dir="rtl"] a.bc-i-instagram,
html[dir="rtl"] a.bc-i-telegram, html[dir="rtl"] a.bc-i-youtube { left: auto !important; }
html[dir="rtl"] a.bc-i-facebook  { right: 200px !important; }
html[dir="rtl"] a.bc-i-instagram { right: 244px !important; }
html[dir="rtl"] a.bc-i-telegram  { right: 288px !important; }
html[dir="rtl"] a.bc-i-youtube   { right: 332px !important; }

/* === Footer Social Icons — Web === */
.footerInnerLeftCol .footerSocialLinks .footerSocialLink {
  background: transparent !important; border: none !important; box-shadow: none !important;
  border-radius: 0 !important; padding: 0 !important; list-style: none !important;
}
.footerInnerLeftCol .footerSocialLinks .footerSocialLink::before,
.footerInnerLeftCol .footerSocialLinks .footerSocialLink::after { display: none !important; }
.footerInnerLeftCol .footerSocialLinks .footerSocialLink a {
  background: transparent !important; background-color: transparent !important;
  background-image: none !important; border: none !important; box-shadow: none !important;
  border-radius: 0 !important; padding: 0 !important; margin: 0 4px !important;
  width: 34px !important; height: 34px !important; display: flex !important;
  align-items: center !important; justify-content: center !important;
  outline: none !important; filter: none !important;
}
.footerInnerLeftCol .footerSocialLinks .footerSocialLink a::after { display: none !important; }
.footerInnerLeftCol .footerSocialLinks .footerSocialLink a > * { display: none !important; }
.footerInnerLeftCol .footerSocialLinks .footerSocialLink a::before {
  content: '' !important; display: block !important; width: 30px !important; height: 30px !important;
  background-color: transparent !important; background-size: contain !important;
  background-repeat: no-repeat !important; background-position: center !important;
  border: none !important; box-shadow: none !important; border-radius: 0 !important;
}
.footerInnerLeftCol .footerSocialLinks .footerSocialLink a[aria-label="Visit our Facebook"]::before  { background-image: url('https://cmsbetconstruct.com/storage/medias/treebets-18775478/media_18775478_17da93901b42534a9edc9cde1988434a.png') !important; }
.footerInnerLeftCol .footerSocialLinks .footerSocialLink a[aria-label="Visit our Instagram"]::before { background-image: url('https://cmsbetconstruct.com/storage/medias/treebets-18775478/media_18775478_49d36aefb816ee5e9438b4bcc06fd9f6.png') !important; }
.footerInnerLeftCol .footerSocialLinks .footerSocialLink a[aria-label="Visit our Telegram"]::before  { background-image: url('https://cmsbetconstruct.com/storage/medias/treebets-18775478/media_18775478_2b5922c1e2b8a6210f98c3aeb7e5a76b.png') !important; }
.footerInnerLeftCol .footerSocialLinks .footerSocialLink a[aria-label="Visit our Youtube"]::before   { background-image: url('https://cmsbetconstruct.com/storage/medias/treebets-18775478/media_18775478_06821f1b6d832a691021f74ee4f6e34b.png') !important; }

/* === SPORTSBOOK JACKPOT – inside bottombox === */
html.is-web .hm-row-bc:has(.jackpot-pools-widget) {
  position: relative !important; overflow: visible !important; height: 0 !important;
  min-height: 0 !important; margin: 0 !important; padding: 0 !important; z-index: 5 !important;
}
html.is-web .hm-row-bc-inner:has(.jackpot-pools-widget) {
  position: absolute !important; bottom: -10px !important; right: 0 !important; left: auto !important;
  width: 24.85% !important; height: 90px !important; overflow: visible !important;
  background: transparent !important; padding: 0 !important; border: none !important;
  box-shadow: none !important; z-index: 5 !important;
}

html.is-web .hm-row-bc .jackpot-pools-widget,
html.is-web .hm-row-bc .jackpot-pools-widget__carousel,
html.is-web .hm-row-bc .jackpot-pools-widget .carouselWrapper,
html.is-web .hm-row-bc .jackpot-pools-widget .swiper,
html.is-web .hm-row-bc .jackpot-pools-widget .swiper-wrapper,
html.is-web .hm-row-bc .jackpot-pools-widget .swiper-slide {
  width: 100% !important; height: 90px !important;
  overflow: visible !important; background: transparent !important;
  border: none !important; box-shadow: none !important;
}
html.is-web .hm-row-bc .jackpot-pools-widget .swiper-pagination,
html.is-web .hm-row-bc .jackpot-pools-widget [class*="swiper-button"],
html.is-web .hm-row-bc .jackpot-pools-widget [class*="pagination"],
html.is-web .hm-row-bc .jackpot-pools-widget .swiper-scrollbar { display: none !important; }
html.is-web .hm-row-bc .jackpot-pool-card.sportsbook-jackpot {
  width: 100% !important; height: 90px !important;
  background: transparent !important; border: none !important;
  box-shadow: none !important; border-radius: 0 !important;
  overflow: visible !important; outline: none !important;
}
html.is-web .hm-row-bc .jackpot-pool-card.sportsbook-jackpot::before,
html.is-web .hm-row-bc .jackpot-pool-card.sportsbook-jackpot::after { display: none !important; }
html.is-web .hm-row-bc .jackpot-pool-card.sportsbook-jackpot *::before,
html.is-web .hm-row-bc .jackpot-pool-card.sportsbook-jackpot *::after { display: none !important; }
html.is-web .hm-row-bc .jackpot-pool-card.sportsbook-jackpot .jackpot-pool-card__title { display: none !important; }
html.is-web .hm-row-bc .jackpot-pool-card.sportsbook-jackpot .jackpot-pool-card__wrapper,
html.is-web .hm-row-bc .jackpot-pool-card.sportsbook-jackpot .jackpot-pool-card__level {
  display: flex !important; flex-direction: column !important;
  justify-content: center !important; background: transparent !important;
  overflow: visible !important; border: none !important; box-shadow: none !important;
}
html.is-web .hm-row-bc .jackpot-pool-card.sportsbook-jackpot .jackpot-pool-card__pools {
  display: flex !important; flex-direction: row !important;
  gap: clamp(3px, 0.4vw, 8px) !important;
  padding: 0 clamp(4px, 0.6vw, 12px) !important;
  width: 100% !important; box-sizing: border-box !important;
  align-items: center !important; justify-content: center !important;
  background: transparent !important;
  margin-top: calc(-4.2vw - 129px) !important;
}
html.is-web .hm-row-bc .jackpot-pool-card.sportsbook-jackpot .jackpot-pool-card__first,
html.is-web .hm-row-bc .jackpot-pool-card.sportsbook-jackpot .jackpot-pools-list { display: contents !important; }
html.is-web .hm-row-bc .jackpot-pool-card.sportsbook-jackpot .tooltipIconWrapper {
  display: flex !important; flex: 1 !important; position: relative !important;
}
html.is-web .hm-row-bc .jackpot-pool-card.sportsbook-jackpot .tooltipIconWrapper .jackpot-pool {
  position: relative !important;
  top: 0 !important; left: 0 !important; right: auto !important; bottom: auto !important;
  transform: none !important;
}
html.is-web .hm-row-bc .jackpot-pool-card.sportsbook-jackpot .jackpot-pool {
  flex: 1 !important; display: flex !important; flex-direction: column !important;
  align-items: center !important; justify-content: center !important;
  background: transparent !important; border: none !important; box-shadow: none !important;
  border-radius: 0 !important; padding: 2px 4px !important;
  gap: clamp(1px, 0.25vw, 5px) !important; overflow: visible !important;
}
html.is-web .hm-row-bc .jackpot-pool-card.sportsbook-jackpot .jackpot-pool-card__first > .jackpot-pool {
  order: 2 !important;
}
html.is-web .hm-row-bc .jackpot-pool-card.sportsbook-jackpot .jackpot-pools-list > .tooltipIconWrapper:first-child {
  order: 1 !important;
}
html.is-web .hm-row-bc .jackpot-pool-card.sportsbook-jackpot .jackpot-pools-list > .tooltipIconWrapper:last-child {
  order: 3 !important;
}
html.is-web .hm-row-bc .jackpot-pool-card.sportsbook-jackpot .jackpot-pool__icon { display: none !important; }
html.is-web .hm-row-bc .jackpot-pool-card.sportsbook-jackpot .jackpot-pool__item--align-left,
html.is-web .hm-row-bc .jackpot-pool-card.sportsbook-jackpot .jackpot-pool__item--display-horizontal {
  align-items: center !important; flex-direction: column !important; text-align: center !important;
}
html.is-web .hm-row-bc .jackpot-pool-card.sportsbook-jackpot .jackpot-pool__money {
  display: flex !important; flex-direction: column !important;
  align-items: center !important; text-align: center !important;
}
html.is-web .hm-row-bc .jackpot-pool-card.sportsbook-jackpot .jackpot-pool__title,
html.is-web .hm-row-bc .jackpot-pool-card.sportsbook-jackpot .ds-caption {
  font-size: clamp(6px, 0.65vw, 11px) !important; font-weight: 800 !important;
  letter-spacing: clamp(0.5px, 0.1vw, 2px) !important;
  color: rgba(255,255,255,0.75) !important; text-align: center !important; margin-bottom: 0 !important;
}
html.is-web .hm-row-bc .jackpot-pool-card.sportsbook-jackpot .jackpot-pool__money-inner {
  color: #fff !important; font-size: clamp(10px, 1.05vw, 20px) !important;
  font-weight: 900 !important; letter-spacing: 0.5px !important;
  text-align: center !important; justify-content: center !important;
}
html.is-web .hm-row-bc .jackpot-pool-card.sportsbook-jackpot .jackpot-pool--large .jackpot-pool__money-inner {
  color: #ffd700 !important; font-size: clamp(11px, 1.2vw, 23px) !important;
}
html.is-web .hm-row-bc .jackpot-pool-card.sportsbook-jackpot .jackpot-pool__currency-symbol {
  font-size: inherit !important; color: inherit !important;
}

/* === ARABIC RTL – flip jackpot to left side === */
html.is-web[dir="rtl"] .hm-row-bc-inner:has(.jackpot-pools-widget) {
  right: auto !important;
  left: 0 !important;
}
/* === END JACKPOT === */

/* === Footer Email – Selectable/Copyable (English + Arabic) === */
.footerLinkColLinks .footerLinkColEl a,
html[dir="rtl"] .footerLinkColLinks .footerLinkColEl a {
  user-select: text !important;
  -webkit-user-select: text !important;
  cursor: text !important;
}

/* === HEADER LINKS === */
nav.nav-menu-container.header-navigation { justify-content: center !important; margin-bottom: 12px !important; }
.nav-content-bc { padding-top: 6px !important; padding-bottom: 6px !important; }
ul.nav-menu { gap: 6px !important; justify-content: center !important; padding: 4px !important; }
ul.nav-menu > li { height: auto !important; }
ul.nav-menu > li > a.nav-menu-item {
  display: flex !important; align-items: center !important;
  padding: 10px 16px 10px 12px !important; height: auto !important; min-height: 40px !important;
  border-radius: 8px !important; border: 1px solid rgba(0,200,80,0.25) !important;
  background: linear-gradient(135deg, rgba(0,161,64,0.12) 0%, rgba(21,94,37,0.22) 100%) !important;
  transition: all 0.3s ease !important;
  position: relative !important; overflow: hidden !important;
}
ul.nav-menu > li > a.nav-menu-item::before {
  content: '' !important; position: absolute !important; top: -50% !important; left: -50% !important;
  width: 200% !important; height: 200% !important;
  background: linear-gradient(0deg, transparent, transparent 30%, rgba(0,255,100,0.18)) !important;
  transform: rotate(-45deg) !important; transition: all 0.5s ease !important;
  opacity: 0 !important; z-index: 0 !important; pointer-events: none !important;
}
ul.nav-menu > li > a.nav-menu-item:hover {
  background: linear-gradient(135deg, rgba(0,200,80,0.25) 0%, rgba(21,94,37,0.4) 100%) !important;
  border-color: rgba(0,220,80,0.55) !important;
  box-shadow: 0 0 16px rgba(0,161,64,0.4) !important;
  transform: scale(1.05) !important;
}
ul.nav-menu > li > a.nav-menu-item:hover::before {
  opacity: 1 !important; transform: rotate(-45deg) translateY(100%) !important;
}
ul.nav-menu > li.active > a.nav-menu-item,
ul.nav-menu > li > a.nav-menu-item.active {
  border-color: rgba(0,161,64,0.6) !important;
  box-shadow: 0 0 12px rgba(0,161,64,0.3) !important;
}
/* === SUB NAV row (Event View / Live Calendar / Results / Sport Tournaments) === */
div.nav-content-bc > nav.nav-menu-container.header-navigation {
  margin-top: 10px !important;
}

/* ── Hoory button: move near social icons + replace with custom icon ── */
[class*="bc-i-hoory"] {
    position: fixed !important;
    left: 376px !important;
    top: 11px !important;
    margin-left: 30px !important;
    background-image: url('https://cmsbetconstruct.com/storage/medias/treebets-18775478/media_18775478_9db6dbb102fb7f64247cf224514b5d68.png') !important;
    background-size: 68px 44px !important;
    background-repeat: no-repeat !important;
    background-position: center !important;
    background-color: transparent !important;
    width: 34px !important;
    height: 34px !important;
    min-width: 34px !important;
    padding: 0 !important;
    z-index: 9999 !important;
}

[class*="bc-i-hoory"]::before,
[class*="bc-i-hoory"]::after {
    content: '' !important;
    display: none !important;
    font-size: 0 !important;
    width: 0 !important;
    height: 0 !important;
    background: none !important;
}

/* ── Hoory button: Arabic RTL mirror ── */
html[dir="rtl"] [class*="bc-i-hoory"] {
    left: auto !important;
    right: 376px !important;
}
/* === Footer: Support Email — green highlight when selected === */
.footerLinkColEl a:not([href])::selection,
.footerLinkColEl a:not([href]) .footerLinkColText::selection {
    background: rgba(51, 181, 88, 0.35);
    color: #ffffff;
}

/* === Footer: Chat With Us — pointer + green hover (LTR + RTL) === */
.footerLinkColEl a[href*="hoory.ai"],
html[dir="rtl"] .footerLinkColEl a[href*="hoory.ai"] {
    cursor: pointer !important;
}
.footerLinkColEl a[href*="hoory.ai"] .footerLinkColText,
html[dir="rtl"] .footerLinkColEl a[href*="hoory.ai"] .footerLinkColText {
    transition: color 0.25s ease, text-shadow 0.25s ease !important;
}
.footerLinkColEl a[href*="hoory.ai"]:hover .footerLinkColText,
html[dir="rtl"] .footerLinkColEl a[href*="hoory.ai"]:hover .footerLinkColText {
    color: #33b558 !important;
    text-shadow: 0 0 10px rgba(51, 181, 88, 0.5) !important;
}
/* === Hoory Chat Bubble — Spinning Ring === */
@property --hoory-ring { syntax: '<angle>'; initial-value: 0deg; inherits: false; }
@keyframes hooryRingSpin { from { --hoory-ring: 0deg; } to { --hoory-ring: 360deg; } }
@keyframes hooryGlowPulse {
  0%, 100% { box-shadow: 0 0 10px rgba(180,220,40,0.4), 0 0 0 0px rgba(180,220,40,0.5); }
  50%       { box-shadow: 0 0 22px rgba(180,220,40,0.7), 0 0 0 6px rgba(180,220,40,0); }
}

.open-icon-wrapper {
    position: relative !important;
    border-radius: 50% !important;
    animation: hooryGlowPulse 2.5s ease-in-out infinite !important;
}

.open-icon-wrapper::before {
    content: '' !important;
    position: absolute !important;
    inset: -5px !important;
    border-radius: 50% !important;
    background: conic-gradient(from var(--hoory-ring),
        transparent           0deg,
        rgba(180,220,40,0.5)  60deg,
        rgba(255,215,0, 1.0)  110deg,
        rgba(180,220,40,0.5)  160deg,
        transparent           220deg,
        transparent           360deg
    ) !important;
    -webkit-mask: radial-gradient(farthest-side, transparent 87%, #fff 87%) !important;
    mask: radial-gradient(farthest-side, transparent 87%, #fff 87%) !important;
    animation: hooryRingSpin 3s linear infinite !important;
    pointer-events: none !important;
    z-index: 1 !important;
}

/* ── TreeBets Text Selection ──────────────────── */
::selection {
  background: rgba(245, 197, 24, 0.35) !important;
  color: #ffffff !important;
}
::-moz-selection {
  background: rgba(245, 197, 24, 0.35) !important;
  color: #ffffff !important;
}

.form-control-input-bc::selection,
.form-control-input-bc input::selection {
  background: rgba(51, 181, 88, 0.5) !important;
  color: #ffffff !important;
}
.form-control-input-bc::-moz-selection,
.form-control-input-bc input::-moz-selection {
  background: rgba(51, 181, 88, 0.5) !important;
  color: #ffffff !important;
}
.nav-menu-container.header-navigation ul.nav-menu li a.nav-menu-item::before,
.nav-menu-container.header-navigation ul.nav-menu li a.nav-menu-item::after {
  content: "" !important;
}
/* ── Fix container alignment ── */
.hdr-user-bc {
  display: flex !important;
  align-items: center !important;
  gap: 8px !important;
}

.header-custom-buttons,
.header-buttons-wallet {
  display: flex !important;
  align-items: center !important;
  flex-shrink: 0 !important;
}

/* ── DEPOSIT — eye-catching, readable ── */
@keyframes depositRings {
  0%   { box-shadow: 0 0 0 0 rgba(51,181,88,0.7), 0 0 0 0 rgba(51,181,88,0.35), 0 4px 18px rgba(0,0,0,0.4); }
  70%  { box-shadow: 0 0 0 8px rgba(51,181,88,0), 0 0 0 16px rgba(51,181,88,0), 0 4px 18px rgba(0,0,0,0.4); }
  100% { box-shadow: 0 0 0 0 rgba(51,181,88,0), 0 0 0 0 rgba(51,181,88,0), 0 4px 18px rgba(0,0,0,0.4); }
}
@keyframes depositShimmer {
  0%   { background-position: -300% center; }
  100% { background-position: 300% center; }
}

a.bc-i-money-dollar {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  height: 37px !important;
  padding: 0 24px !important;
  background: linear-gradient(
    105deg,
    #0f4d22 0%,
    #1a7a38 18%,
    rgba(255,255,255,0.2) 48%,
    #1a7a38 52%,
    #155e25 82%,
    #0a3314 100%
  ) !important;
  background-size: 300% auto !important;
  border: 1.5px solid rgba(100,220,130,0.6) !important;
  border-radius: 8px !important;
  color: #ffffff !important;
  font-family: inherit !important;
  font-size: 13px !important;
  font-weight: 700 !important;
  -webkit-text-stroke: 0.4px #ffffff !important;
  letter-spacing: 1px !important;
  text-transform: uppercase !important;
  text-decoration: none !important;
  text-shadow: 0 1px 4px rgba(0,0,0,0.5) !important;
  white-space: nowrap !important;
  animation: depositRings 1.9s ease-out infinite, depositShimmer 2.8s linear infinite !important;
  transition: transform 0.15s, filter 0.15s !important;
}

a.bc-i-money-dollar::before,
a.bc-i-money-dollar::after {
  display: none !important;
  content: '' !important;
}

a.bc-i-money-dollar span {
  font-family: inherit !important;
  font-size: 13px !important;
  font-weight: 700 !important;
  -webkit-text-stroke: 0.4px #ffffff !important;
  letter-spacing: 1px !important;
  color: #ffffff !important;
  text-shadow: 0 1px 4px rgba(0,0,0,0.5) !important;
}

a.bc-i-money-dollar:hover {
  transform: translateY(-1px) scale(1.04) !important;
  filter: brightness(1.15) !important;
}

/* Hide original icon if any */
a.bc-i-money-dollar::after { display: none !important; }

/* ── CONNECT TO WALLET — secondary, clean gold ── */
button.connect-wallet {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 6px !important;
  height: 36px !important;
  padding: 0 18px !important;
  min-width: max-content !important;
  background: rgba(245,197,24,0.08) !important;
  border: 1.5px solid rgba(245,197,24,0.6) !important;
  border-radius: 8px !important;
  color: #f5c518 !important;
  font-size: 12.5px !important;
  font-weight: 800 !important;
  letter-spacing: 0.6px !important;
  text-transform: uppercase !important;
  white-space: nowrap !important;
  overflow: visible !important;
  cursor: pointer !important;
  transition: background 0.2s, border-color 0.2s, box-shadow 0.2s, transform 0.15s !important;
}

button.connect-wallet:hover {
  background: rgba(245,197,24,0.15) !important;
  border-color: #f5c518 !important;
  box-shadow: 0 0 14px rgba(245,197,24,0.3) !important;
  transform: translateY(-1px) !important;
}

button.connect-wallet span {
  color: #f5c518 !important;
  font-size: 12.5px !important;
  font-weight: 800 !important;
  white-space: nowrap !important;
}

/* Fix any parent clipping the wallet button */
.header-buttons-wallet {
  overflow: visible !important;
  min-width: max-content !important;
}

/* === FIX: Odometer ribbon bleed (NPS digits showing below) === */
html.is-web .hm-row-bc .jackpot-pool-card.sportsbook-jackpot .odometer-digit-inner {
  overflow: hidden !important;
}
html.is-web .hm-row-bc .jackpot-pool-card.sportsbook-jackpot .jackpot-pool__price[data-cur="NPS"] {
  font-size: 0.82em !important;
}