/* V127 — Lottery play: solid green chrome (#2DBE60). Game RGB bets stay.
   Scoped to html.co-lot-theme only. Home stays green. */

html.co-lot-theme {
  --co-lot-gold: #2DBE60;
  --co-lot-gold-deep: #26a955;
  --co-lot-gold-ink: #ffffff;
  --co-lot-red: #2DBE60;
  --co-lot-red-deep: #26a955;
  --co-lot-red-soft: #4fd07a;
  --co-lot-plate: #3a3a3e;
  --co-lot-deposit: #2DBE60;
  --co-lot-violet: #9C48E0;
  --co-lot-big: #FFA726;
  --co-lot-small: #42A5F5;
  --co-lot-ink: #111314;
  --main-color: #2DBE60;
  --main_gradient-color: linear-gradient(90deg, #4fd07a 0%, #2DBE60 100%);
  --main_gradient-color2: linear-gradient(180deg, #4fd07a 0%, #2DBE60 100%);
  --light-main-color: #2DBE60;
  --tab1: #2DBE60;
  --tab2: #4fd07a;
  --pop_bg-color: linear-gradient(180deg, #4fd07a 0%, #2DBE60 100%);
  --icon1: rgba(45, 190, 96, 0.6);
  --icon2: rgba(45, 190, 96, 0.3);
  --iconSecondary: rgba(45, 190, 96, 0.3);
  --norm_Purple-color: #9C48E0;
  --norm_purple1_color: #9C48E0;
  --norm_purple2_color: #9C48E0;
  --norm_bule-color: #42A5F5;
  --norm_blue_color: #42A5F5;
  --norm_secondary-color: #FFA726;
  --norm_Orange_color: #FFA726;
  --norm_red-color: #F54545;
  --norm_green-color: #2DBE60;
  --Secondary_green_color: #2DBE60;
  --Secondary_red_color: #F54545;
}

/* One-frame fallback: Vue can mount .lottery-info before co-lot-theme is on.
   Home / deposit have no .lottery-info so they stay untouched. */
html:has(#app .lottery-info),
html:has(#app .lottery-info) body,
html:has(#app .lottery-info) #app,
#app:has(.lottery-info),
#app:has(.lottery-info) .lottery-info,
#app:has(.lottery-info) .Betting__C {
  background: #282828 !important;
  background-color: #282828 !important;
}

#app:has(.lottery-info) .Wallet__C {
  background: transparent !important;
  background-image: none !important;
}

#app:has(.lottery-info) .Wallet__C-balance {
  background: #3a3a3e !important;
  background-color: #3a3a3e !important;
  background-image: none !important;
  filter: none !important;
}

#app:has(.lottery-info) .Wallet__C:before,
#app:has(.lottery-info) .Wallet__C:after,
#app:has(.lottery-info) .Wallet__C-balance:before,
#app:has(.lottery-info) .Wallet__C-balance:after {
  content: none !important;
  display: none !important;
  opacity: 0 !important;
}

#app:has(.lottery-info) .Wallet__C-balance-l3 {
  display: flex !important;
  flex-direction: row-reverse !important;
  align-items: center !important;
  gap: 0.2791rem !important;
}

#app:has(.lottery-info) .Wallet__C-balance-l3 > div {
  flex: 1 1 0 !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  height: 0.93033rem !important;
  border-radius: 0.18606rem !important;
  font-weight: 600 !important;
  color: #000 !important;
  background-image: linear-gradient(90deg, #fffd80, #ffdb6c) !important;
}

#app:has(.lottery-info) .Wallet__C-balance-l3 > div + div {
  background-image: linear-gradient(90deg, #24ee89, #9fe871) !important;
  color: #000 !important;
}

html.co-lot-theme,
html.co-lot-theme body,
html.co-lot-theme.co-home-v106,
html.co-lot-theme.co-home-v106 body,
html.co-lot-theme #app,
html.co-lot-theme.co-home-v106 #app,
html.co-lot-theme #app > div,
html.co-lot-theme .lottery-container,
html.co-lot-theme .lottery-info,
html.co-lot-theme .Betting__C,
html.co-lot-theme [class*="saasLottery"] {
  background: #282828 !important;
  background-color: #282828 !important;
}

html.co-lot-theme #app .noticeBar__container.lottery-notice,
html.co-lot-theme .lottery-info .lottery-notice,
html.co-lot-theme .lottery-info .noticeBar__container,
html.co-lot-theme .lottery-info .noticeBar__container.lottery-notice,
html.co-lot-theme body .lottery-info .lottery-notice {
  display: none !important;
  visibility: hidden !important;
  height: 0 !important;
  min-height: 0 !important;
  margin: 0 !important;
  padding: 0 !important;
  overflow: hidden !important;
  pointer-events: none !important;
  border: 0 !important;
}

html.co-lot-theme .lottery-info .bg,
html.co-lot-theme .lottery-info .bg[class] {
  background: #282828 !important;
  background-image: none !important;
  border: 0 !important;
  box-shadow: none !important;
  border-radius: 0 !important;
  filter: none !important;
}

html.co-lot-theme .navbar,
html.co-lot-theme .navbar .navbar-fixed,
html.co-lot-theme .navbar-fixed,
html.co-lot-theme .navbar.lottery,
html.co-lot-theme .navbar.lottery .navbar-fixed,
html.co-lot-theme .van-nav-bar,
html.co-lot-theme .van-nav-bar__content,
html.co-lot-theme .van-hairline--bottom:after,
html.co-lot-theme #app .navbar,
html.co-lot-theme #app .navbar-fixed,
html.co-lot-theme #app .navbar .navbar-fixed,
html.co-lot-theme #app .navbar.lottery .navbar-fixed,
html.co-lot-theme #app .navbar.main .navbar-fixed {
  background: transparent !important;
  background-color: transparent !important;
  background-image: none !important;
  border: 0 !important;
  border-bottom: 0 !important;
  outline: none !important;
  box-shadow: none !important;
  border-radius: 0 !important;
  filter: none !important;
}

/* Page-only header (no *_bg). Bet popup header keeps 13L color + notch. */
html.co-lot-theme #app .lottery-container > .header:not([class*="_bg"]) {
  background: transparent !important;
  background-color: transparent !important;
  background-image: none !important;
  border: 0 !important;
  box-shadow: none !important;
  filter: none !important;
}

html.co-lot-theme .navbar.lottery .navbar-fixed:after,
html.co-lot-theme .navbar-fixed:after,
html.co-lot-theme .van-hairline--bottom:after,
html.co-lot-theme .van-nav-bar:after,
html.co-lot-theme .navbar:before,
html.co-lot-theme .navbar:after {
  display: none !important;
  border: 0 !important;
  height: 0 !important;
  background: none !important;
}

html.co-lot-theme .navbar__content,
html.co-lot-theme .navbar__content-center,
html.co-lot-theme .navbar__content-left,
html.co-lot-theme .navbar__content-right {
  background: transparent !important;
}

html.co-lot-theme .navbar__content-center .headLogo,
html.co-lot-theme .navbar__content-center > img:not(.co-lot-brand),
html.co-lot-theme .navbar__content-center .headLogo[style] {
  display: none !important;
  background-image: none !important;
}

.co-lot-brand {
  display: block;
  height: 1.08rem;
  max-height: 1.12rem;
  width: auto;
  max-width: 5.1rem;
  object-fit: contain;
  object-position: center;
  pointer-events: none;
  user-select: none;
}

html.co-lot-theme #app .Wallet__C,
html.co-lot-theme.co-home-v106 #app .Wallet__C {
  background: transparent !important;
  background-color: transparent !important;
  background-image: none !important;
}

html.co-lot-theme #app .lottery-info .Wallet__C-balance,
html.co-lot-theme #app .Wallet__C-balance,
html.co-lot-theme.co-home-v106 #app .Wallet__C-balance,
html.co-lot-theme.co-home-v106 #app .lottery-info .Wallet__C-balance {
  background: var(--co-lot-plate) !important;
  background-color: var(--co-lot-plate) !important;
  background-image: none !important;
  filter: none !important;
  width: 100% !important;
  min-height: 3.57333rem !important;
  margin: 0 !important;
  padding: 0.46667rem 0.54667rem 0.4rem !important;
  border-radius: 0.53333rem !important;
  overflow: hidden !important;
  box-sizing: border-box !important;
}

html.co-lot-theme #app .Wallet__C-balance-l1 {
  min-height: 0.58667rem !important;
  line-height: 0.58667rem !important;
  font-size: 0.48rem !important;
  text-align: center !important;
}

html.co-lot-theme #app .Wallet__C-balance-l2 {
  height: 0.53333rem !important;
  margin-top: 0.18667rem !important;
  font-size: 0.34667rem !important;
  justify-content: center !important;
}

html.co-lot-theme #app .Wallet__C-balance-l2 > svg {
  width: 0.53333rem !important;
  height: 0.53333rem !important;
}

html.co-lot-theme #app .Wallet__C-balance-l3 {
  display: flex !important;
  flex-direction: row-reverse !important;
  align-items: center !important;
  justify-content: space-between !important;
  gap: 0.2791rem !important;
  margin-top: 0.46667rem !important;
}

html.co-lot-theme #app .Wallet__C:before,
html.co-lot-theme #app .Wallet__C:after,
html.co-lot-theme #app .Wallet__C-balance:before,
html.co-lot-theme #app .Wallet__C-balance:after {
  content: none !important;
  display: none !important;
  background: none !important;
  background-image: none !important;
  opacity: 0 !important;
}

/* Account-page CTAs: Withdraw gold + Deposit green, black ink + icon */
html.co-lot-theme #app .Wallet__C-balance-l3 > div {
  flex: 1 1 0 !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 0.1rem !important;
  width: auto !important;
  min-width: 0 !important;
  height: 0.93033rem !important;
  line-height: 1 !important;
  padding: 0 0.16rem !important;
  box-sizing: border-box !important;
  border: 0 !important;
  border-radius: 0.18606rem !important;
  font-size: 0.37213rem !important;
  font-weight: 600 !important;
  color: #000 !important;
  background: #ffdb6c !important;
  background-image: linear-gradient(90deg, #fffd80, #ffdb6c) !important;
  box-shadow: 0 0 0.22rem rgba(255, 187, 0, 0.38), inset 0 -0.05333rem #ffdb6c !important;
}

html.co-lot-theme #app .Wallet__C-balance-l3 > div + div {
  background: #24ee89 !important;
  background-image: linear-gradient(90deg, #24ee89, #9fe871) !important;
  box-shadow: 0 0 0.32rem rgba(35, 238, 136, 0.3), inset 0 -0.05333rem #1dca6a !important;
  color: #000 !important;
}

html.co-lot-theme #app .Wallet__C-balance-l3 > div svg.co-lot-wd-ico {
  width: 0.5582rem !important;
  height: 0.5582rem !important;
  flex: none !important;
  display: block !important;
  fill: #000 !important;
  color: #000 !important;
}

/* WinGo row — 13L: dark tray; active = full red box + large outline clock. */
html.co-lot-theme #app .lottery-info .timer-cards,
html.co-lot-theme #app .timer-cards,
html.co-lot-theme #app .GameList__C,
html.co-lot-theme.co-home-v106 #app .timer-cards,
html.co-lot-theme.co-home-v106 #app .lottery-info .timer-cards,
html.co-lot-theme.co-home-v106 #app .GameList__C {
  display: grid !important;
  grid-template-columns: repeat(4, 1fr) !important;
  align-items: stretch !important;
  width: 100% !important;
  height: 2.66667rem !important;
  margin: 0.32rem 0 0 !important;
  padding: 0.06rem !important;
  box-sizing: border-box !important;
  background: var(--co-lot-plate) !important;
  background-color: var(--co-lot-plate) !important;
  background-image: none !important;
  filter: none !important;
  box-shadow: none !important;
  border-radius: 0.32rem !important;
  overflow: hidden !important;
}

html.co-lot-theme #app .timer-card,
html.co-lot-theme #app .GameList__C-item,
html.co-lot-theme body .GameList__C-item.active {
  display: flex !important;
  flex-direction: column !important;
  align-items: center !important;
  justify-content: center !important;
  background: transparent !important;
  background-image: none !important;
  box-shadow: none !important;
  width: 100% !important;
  height: 100% !important;
  min-height: 0 !important;
  border-radius: 0.24rem !important;
  transition: background-color 0.22s ease !important;
}

html.co-lot-theme #app .timer-card.active,
html.co-lot-theme #app .GameList__C-item.active {
  background: var(--co-lot-gold) !important;
  background-image: none !important;
}

html.co-lot-theme #app .timer-card .clock-icon,
html.co-lot-theme #app .GameList__C-item .box,
html.co-lot-theme #app .GameList__C-item > div:first-child {
  position: relative !important;
  background: transparent !important;
  background-image: none !important;
  border: 0 !important;
  border-radius: 0 !important;
  width: 1rem !important;
  height: 1rem !important;
  margin: 0.06rem auto 0.02rem !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  box-shadow: none !important;
}

html.co-lot-theme #app .timer-card.active .clock-icon,
html.co-lot-theme #app .GameList__C-item.active .box,
html.co-lot-theme #app .GameList__C-item.active > div:first-child {
  background: transparent !important;
  background-image: none !important;
  width: 1.32rem !important;
  height: 1.32rem !important;
  margin: 0.02rem auto 0 !important;
}

/* Original WinGo clock PNG — never invert (invert = white disk). */
html.co-lot-theme #app .timer-card .timeIcon,
html.co-lot-theme #app .timer-card .clock-icon img,
html.co-lot-theme #app .timer-card .clock-icon .timeIcon {
  display: block !important;
  width: 1rem !important;
  height: 1rem !important;
  opacity: 1 !important;
  visibility: visible !important;
  filter: none !important;
  object-fit: contain !important;
  pointer-events: none !important;
}

html.co-lot-theme #app .timer-card.active .timeIcon,
html.co-lot-theme #app .timer-card.active .clock-icon img,
html.co-lot-theme #app .timer-card.active .clock-icon .timeIcon {
  width: 1.32rem !important;
  height: 1.32rem !important;
  filter: none !important;
}

html.co-lot-theme #app .timer-card .clock-icon .clock-circle {
  display: none !important;
}

html.co-lot-theme #app .timer-card .clock-icon::before,
html.co-lot-theme #app .timer-card .clock-icon::after {
  content: none !important;
  display: none !important;
  background: none !important;
}

html.co-lot-theme #app .timer-card .clock-icon svg.co-lot-clock {
  display: none !important;
  width: 0 !important;
  height: 0 !important;
}

html.co-lot-theme #app .timer-card .card-title,
html.co-lot-theme #app .GameList__C-item {
  color: #929292 !important;
  padding: 0 0.04rem !important;
  font-size: 0.32rem !important;
  line-height: 0.38rem !important;
  font-weight: 400 !important;
  text-align: center !important;
  display: flex !important;
  flex-direction: column !important;
  align-items: center !important;
  justify-content: flex-start !important;
}

html.co-lot-theme #app .timer-card .card-title {
  max-width: 1.72rem !important;
  white-space: normal !important;
  overflow-wrap: break-word !important;
}

html.co-lot-theme #app .timer-card .card-title .co-lot-line {
  display: block !important;
  width: 100% !important;
  text-align: center !important;
  color: inherit !important;
  line-height: 0.38rem !important;
}

html.co-lot-theme #app .timer-card.active .card-title,
html.co-lot-theme #app .timer-card.active .card-title .co-lot-line,
html.co-lot-theme #app .timer-card.active .card-duration {
  color: var(--co-lot-gold-ink) !important;
  font-weight: 700 !important;
}

html.co-lot-theme #app .lottery-container .green_bg {
  background: linear-gradient(90deg, #4fd07a, #2DBE60) !important;
}

/* Timer card — solid green plate (no issue PNG) */
html.co-lot-theme #app .lottery-info .TimeLeft__C,
html.co-lot-theme #app .TimeLeft__C {
  background: var(--co-lot-gold) !important;
  background-color: var(--co-lot-gold) !important;
  background-image: none !important;
  filter: none !important;
  box-shadow: none !important;
  border: 0 !important;
  border-radius: 0.28rem !important;
  color: var(--co-lot-gold-ink) !important;
  width: calc(100% - 0.69334rem) !important;
  max-width: 100% !important;
  height: 2.66667rem !important;
  margin: 0.32rem auto 0 !important;
  box-sizing: border-box !important;
  position: relative !important;
  overflow: hidden !important;
}

html.co-lot-theme #app .TimeLeft__C::after {
  content: "" !important;
  display: block !important;
  position: absolute !important;
  left: 50% !important;
  top: 0.24rem !important;
  bottom: 0.24rem !important;
  width: 0 !important;
  border-left: 0.01333rem dashed rgba(255, 255, 255, 0.55) !important;
  pointer-events: none !important;
  z-index: 2 !important;
}

html.co-lot-theme #app .TimeLeft__C-rule {
  border-color: rgba(255, 255, 255, 0.88) !important;
  color: #fff !important;
  background: rgba(255, 255, 255, 0.18) !important;
}

html.co-lot-theme #app .TimeLeft__C-rule svg {
  color: var(--co-lot-gold-ink) !important;
  fill: currentColor;
}

html.co-lot-theme #app .TimeLeft__C-name,
html.co-lot-theme #app .TimeLeft__C-id,
html.co-lot-theme #app .TimeLeft__C-text {
  color: var(--co-lot-gold-ink) !important;
}

html.co-lot-theme #app .TimeLeft__C-time > div {
  background: #111314 !important;
  background-color: #111314 !important;
  color: #fff !important;
}

html.co-lot-theme #app .TimeLeft__C-time > div:nth-child(1),
html.co-lot-theme #app .TimeLeft__C-time > div:nth-child(5),
html.co-lot-theme #app .TimeLeft__C-time > div:first-child,
html.co-lot-theme #app .TimeLeft__C-time > div:last-child {
  background: #111314 !important;
}

/* Color bets stay 13L hues */
html.co-lot-theme #app .Betting__C-head-green {
  background: #2DBE60 !important;
}

html.co-lot-theme #app .Betting__C-head-violet {
  background: #9C48E0 !important;
}

html.co-lot-theme #app .Betting__C-head-red {
  background: #F54545 !important;
}

/* Random / X1 = gold chrome; Green/Violet/Red bets stay game hues */
html.co-lot-theme #app .Betting__C-multiple-l {
  border-color: var(--co-lot-gold) !important;
  color: var(--co-lot-gold) !important;
  background: transparent !important;
}

html.co-lot-theme #app .Betting__C-multiple-r {
  background: #2a2a2e !important;
  color: #fff !important;
}

html.co-lot-theme #app .Betting__C-multiple-r.active {
  background: var(--co-lot-gold) !important;
  color: var(--co-lot-gold-ink) !important;
}

html.co-lot-theme #app .Betting__C-foot-b {
  background-color: #FFA726 !important;
}

html.co-lot-theme #app .Betting__C-foot-s {
  background: #42A5F5 !important;
}

/* Game history / Chart / My history tabs — 13L solid red active */
html.co-lot-theme #app .history .nav > .nav-container > div,
html.co-lot-theme #app .history .nav-container > div {
  background: #2a2a2e !important;
  color: #fff !important;
  box-shadow: none !important;
}

html.co-lot-theme #app .history .nav > .nav-container > div.active,
html.co-lot-theme #app .history .nav-container > div.active {
  background: var(--co-lot-gold) !important;
  color: var(--co-lot-gold-ink) !important;
}

html.co-lot-theme .fun-tabs,
html.co-lot-theme .fun-tabs__tab-list,
html.co-lot-theme .fun-tab-bar-wrap {
  background: transparent !important;
}

html.co-lot-theme .fun-tabs .fun-tab-item {
  background: #2a2a2e !important;
  color: #fff !important;
  border-radius: 0.2rem !important;
  font-size: 0.32rem !important;
  padding: 0.22rem 0.16rem !important;
}

html.co-lot-theme .fun-tabs .fun-tab-item.active,
html.co-lot-theme .fun-tabs .fun-tab-item.act,
html.co-lot-theme .fun-tabs .fun-tab-item.fun-tab-item-active {
  background: var(--co-lot-gold) !important;
  color: var(--co-lot-gold-ink) !important;
}

html.co-lot-theme .van-tabs--card .van-tab,
html.co-lot-theme .van-tabs__nav--card .van-tab {
  background: #2a2a2e !important;
  color: #fff !important;
  border: 0 !important;
  border-radius: 0.2rem !important;
}

html.co-lot-theme .van-tabs--card .van-tab--active,
html.co-lot-theme .van-tab--card.van-tab--active {
  background: var(--co-lot-gold) !important;
  color: var(--co-lot-gold-ink) !important;
}

html.co-lot-theme .fun-tabs__active-line {
  background: var(--co-lot-gold) !important;
}

/* History table header */
html.co-lot-theme #app .record-head,
html.co-lot-theme body .record .record-head,
html.co-lot-theme #app .t .t_head,
html.co-lot-theme .t .t_head,
html.co-lot-theme .Trend__C-head,
html.co-lot-theme #app .GameRecord__C-head {
  background: var(--co-lot-gold) !important;
  color: var(--co-lot-gold-ink) !important;
}

/* Pagination next = gold */
html.co-lot-theme #app .t-foot-previous,
html.co-lot-theme #app .t-foot-next,
html.co-lot-theme #app .record-foot-previous,
html.co-lot-theme #app .record-foot-next,
html.co-lot-theme #app .my_r-foot-previous,
html.co-lot-theme #app .my_r-foot-next,
html.co-lot-theme #app .Trend__C-foot-previous,
html.co-lot-theme #app .Trend__C-foot-next {
  background: var(--co-lot-gold) !important;
  color: var(--co-lot-gold-ink) !important;
}

html.co-lot-theme #app .t-foot-previous.disabled,
html.co-lot-theme #app .t-foot-next.disabled,
html.co-lot-theme #app .record-foot-previous.disabled,
html.co-lot-theme #app .record-foot-next.disabled,
html.co-lot-theme #app .my_r-foot-previous.disabled,
html.co-lot-theme #app .my_r-foot-next.disabled {
  background: #323738 !important;
  color: #838b8d !important;
}

html.co-lot-theme #app .MyGameRecord__C-head-moreB {
  border-color: var(--co-lot-gold) !important;
  color: var(--co-lot-gold) !important;
}

/* My history: Small badge blue, Lose red */
html.co-lot-theme #app .my_r-body .list-item-l.betClSmall {
  background-color: #42A5F5 !important;
}

html.co-lot-theme #app .my_r-body .list-item-l.betClBig {
  background-color: #FFA726 !important;
}

html.co-lot-theme #app .my_r-body .list-item-r:not(.success),
html.co-lot-theme #app .my_r-body .list-item-r:not(.success) span,
html.co-lot-theme #app .my_r-body .list-item-r:not(.success) > div,
html.co-lot-theme #app .my_r-body .list-inlineB.red,
html.co-lot-theme #app .Failed,
html.co-lot-theme #app .negative {
  color: #F54545 !important;
  border-color: #F54545 !important;
}

html.co-lot-theme #app .my_r-body .list-item-r.success,
html.co-lot-theme #app .my_r-body .list-item-r.success span,
html.co-lot-theme #app .my_r-body .list-item-r.success > div,
html.co-lot-theme #app .my_r-body .list-item-r .success,
html.co-lot-theme #app .Succeed,
html.co-lot-theme #app .positive {
  color: #2DBE60 !important;
  border-color: #2DBE60 !important;
}

html.co-lot-theme #app .winner_result .color_green {
  background: #2DBE60 !important;
}

html.co-lot-theme #app .winner_result .color_red {
  background: #F54545 !important;
}

html.co-lot-theme #app .winner_result .color_violet {
  background: #9C48E0 !important;
}

html.co-lot-theme #app .record-body .mixedColor0,
html.co-lot-theme #app .mixedColor0 {
  background: linear-gradient(180deg, #F54545 50.96%, #9C48E0 50.97%) !important;
  -webkit-background-clip: text !important;
  background-clip: text !important;
  -webkit-text-fill-color: transparent !important;
}

html.co-lot-theme #app .record-body .mixedColor5,
html.co-lot-theme #app .mixedColor5 {
  background: linear-gradient(180deg, #2DBE60 50%, #9C48E0 50%) !important;
  -webkit-background-clip: text !important;
  background-clip: text !important;
  -webkit-text-fill-color: transparent !important;
}

html.co-lot-theme #app .record-origin-I.green {
  background: #2DBE60 !important;
}

html.co-lot-theme #app .record-origin-I.red {
  background: #F54545 !important;
}

html.co-lot-theme #app .record-origin-I.violet {
  background: #9C48E0 !important;
}

html.co-lot-theme #app .BettingRecordWin__C-head {
  background: var(--co-lot-gold) !important;
  color: var(--co-lot-gold-ink) !important;
}

/* Overlay only on the 10rem game column — full-viewport overlay paints the
   desktop sides pitch-black and can sit above the sheet (z-index 2004 vs 2001). */
html.co-lot-theme,
html.co-lot-theme body {
  background: #282828 !important;
  background-color: #282828 !important;
}

html.co-lot-theme body > .van-overlay,
html.co-lot-theme .van-overlay.co-lot-bet-overlay {
  position: fixed !important;
  top: 0 !important;
  bottom: 0 !important;
  right: auto !important;
  left: 50% !important;
  width: 10rem !important;
  max-width: 100vw !important;
  margin: 0 0 0 -5rem !important;
  background: rgba(0, 0, 0, 0.42) !important;
  z-index: 2000 !important;
}

html.co-lot-theme .van-popup.van-popup--bottom:has(.lottery-container),
html.co-lot-theme .van-popup.co-lot-bet-sheet {
  position: fixed !important;
  top: auto !important;
  right: auto !important;
  bottom: 0 !important;
  left: 50% !important;
  width: 10rem !important;
  max-width: 100vw !important;
  height: 8.66667rem !important;
  max-height: 8.66667rem !important;
  margin: 0 0 0 -5rem !important;
  background: #232626 !important;
  overflow: hidden !important;
  z-index: 2002 !important;
  border-radius: 0 !important;
  -webkit-transform: none !important;
  transform: none !important;
}

html.co-lot-theme .van-popup.van-popup--bottom:has(.lottery-container).van-popup-slide-bottom-enter-from,
html.co-lot-theme .van-popup.van-popup--bottom:has(.lottery-container).van-popup-slide-bottom-leave-active,
html.co-lot-theme .van-popup.co-lot-bet-sheet.van-popup-slide-bottom-enter-from,
html.co-lot-theme .van-popup.co-lot-bet-sheet.van-popup-slide-bottom-leave-active {
  -webkit-transform: translate3d(0, 100%, 0) !important;
  transform: translate3d(0, 100%, 0) !important;
}

@media screen and (max-width: 500px) {
  html.co-lot-theme body > .van-overlay,
  html.co-lot-theme .van-overlay.co-lot-bet-overlay,
  html.co-lot-theme .van-popup.van-popup--bottom:has(.lottery-container),
  html.co-lot-theme .van-popup.co-lot-bet-sheet {
    left: 0 !important;
    width: 100% !important;
    max-width: none !important;
    margin: 0 !important;
  }
}

html.co-lot-theme .van-popup .lottery-container,
html.co-lot-theme .van-popup.co-lot-bet-sheet .lottery-container {
  position: relative !important;
  width: 100% !important;
  height: 8.66667rem !important;
  min-height: 8.66667rem !important;
  max-height: 8.66667rem !important;
  margin: 0 !important;
  background: #232626 !important;
  background-color: #232626 !important;
  overflow: hidden !important;
}

html.co-lot-theme .van-popup .lottery-container .content {
  padding: 0 0.34667rem 1.12rem !important;
  pointer-events: auto !important;
}

html.co-lot-theme .van-popup .lottery-container .amount-buttons,
html.co-lot-theme .van-popup .lottery-container .multiplier-buttons {
  position: relative !important;
  z-index: 3 !important;
  pointer-events: auto !important;
}

html.co-lot-theme .van-popup .lottery-container .amount-buttons > div,
html.co-lot-theme .van-popup .lottery-container .multiplier-buttons > div {
  pointer-events: auto !important;
}

html.co-lot-theme .van-popup .lottery-container .footer {
  position: absolute !important;
  left: 0 !important;
  right: 0 !important;
  bottom: 0 !important;
  height: 0.96rem !important;
  z-index: 1 !important;
}

html.co-lot-theme .van-popup .lottery-container .header,
html.co-lot-theme #app .van-popup .lottery-container .header {
  position: relative !important;
  height: 2.53333rem !important;
  padding-top: 0.4rem !important;
  margin-bottom: 0.72rem !important;
  text-align: center !important;
  border: 0 !important;
  border-radius: 0 !important;
  box-shadow: none !important;
  filter: none !important;
  overflow: visible !important;
  -webkit-clip-path: polygon(0 0, 100% 0, 100% 70%, 50% 100%, 0 70%) !important;
  clip-path: polygon(0 0, 100% 0, 100% 70%, 50% 100%, 0 70%) !important;
}

html.co-lot-theme .van-popup .lottery-container .header.small_bg,
html.co-lot-theme #app .van-popup .lottery-container .header.small_bg {
  background: #6ca6f3 !important;
  background-image: linear-gradient(90deg, #5b9cf0, #87bcf5) !important;
}

html.co-lot-theme .van-popup .lottery-container .header.big_bg,
html.co-lot-theme #app .van-popup .lottery-container .header.big_bg {
  background: #ffa726 !important;
  background-image: linear-gradient(90deg, #ff9800, #ffb74d) !important;
}

html.co-lot-theme .van-popup .lottery-container .header.green_bg,
html.co-lot-theme #app .van-popup .lottery-container .header.green_bg,
html.co-lot-theme #app .van-popup .lottery-container .green_bg {
  background: #2dbe60 !important;
  background-image: linear-gradient(90deg, #3faa70, #47ba7c) !important;
}

html.co-lot-theme .van-popup .lottery-container .header.red_bg,
html.co-lot-theme #app .van-popup .lottery-container .header.red_bg {
  background: #f54545 !important;
  background-image: linear-gradient(90deg, #fc5050, #ff646c) !important;
}

html.co-lot-theme .van-popup .lottery-container .header.violet_bg,
html.co-lot-theme #app .van-popup .lottery-container .header.violet_bg {
  background: #9c48e0 !important;
  background-image: none !important;
}

html.co-lot-theme .van-popup .lottery-container .header.zero_bg,
html.co-lot-theme #app .van-popup .lottery-container .header.zero_bg {
  background: #f54545 !important;
  background-image: linear-gradient(to bottom right, #f54545 50%, #9c48e0 0) !important;
}

html.co-lot-theme .van-popup .lottery-container .header.five_bg,
html.co-lot-theme #app .van-popup .lottery-container .header.five_bg {
  background: #2dbe60 !important;
  background-image: linear-gradient(to bottom right, #2dbe60 50%, #9c48e0 0) !important;
}

html.co-lot-theme .van-popup .lottery-container .header h1 {
  color: #fff !important;
  font-size: 0.48rem !important;
  font-weight: 700 !important;
  line-height: 0.58667rem !important;
  height: auto !important;
  margin: 0 0 0.2rem !important;
  padding: 0 !important;
}

html.co-lot-theme .van-popup .lottery-container .header .selection-text,
html.co-lot-theme .van-popup .lottery-container .header .selection-text span {
  background-color: #fff !important;
  color: #1a1a1a !important;
}

html.co-lot-theme .van-popup .lottery-container .header .selection-text {
  display: block !important;
  margin: 0 auto !important;
  width: 7.46667rem !important;
  max-width: calc(100% - 1.2rem) !important;
  height: 0.66667rem !important;
  line-height: 0.66667rem !important;
  border-radius: 0.16rem !important;
  font-size: 0.34667rem !important;
  font-weight: 600 !important;
  text-align: center !important;
}

html.co-lot-theme .van-popup .lottery-container .content .label {
  color: #fff !important;
  font-size: 0.4rem !important;
}

html.co-lot-theme .van-popup .lottery-container .amount-section .label {
  font-size: 0 !important;
  line-height: 0.4rem !important;
}

html.co-lot-theme .van-popup .lottery-container .amount-section .label::after {
  content: "Amount" !important;
  font-size: 0.4rem !important;
  color: #fff !important;
  line-height: 0.4rem !important;
}

html.co-lot-theme .van-popup .lottery-container .amount-buttons .default,
html.co-lot-theme .van-popup .lottery-container .multiplier-buttons .default {
  background-color: #323738 !important;
  color: rgba(255, 255, 255, 0.72) !important;
  border-radius: 0.08rem !important;
}

html.co-lot-theme .van-popup .lottery-container .amount-buttons .primary,
html.co-lot-theme .van-popup .lottery-container .multiplier-buttons .primary {
  color: #fff !important;
  border-radius: 0.08rem !important;
}

html.co-lot-theme .van-popup .lottery-container .n_small {
  background: #42a5f5 !important;
  color: #fff !important;
}

html.co-lot-theme .van-popup .lottery-container .n_big {
  background: #ffa726 !important;
  color: #fff !important;
}

html.co-lot-theme .van-popup .lottery-container .n_green,
html.co-lot-theme .van-popup .lottery-container .n_1,
html.co-lot-theme .van-popup .lottery-container .n_3,
html.co-lot-theme .van-popup .lottery-container .n_7,
html.co-lot-theme .van-popup .lottery-container .n_9,
html.co-lot-theme .van-popup .lottery-container .n_5 {
  background: #2dbe60 !important;
  color: #fff !important;
}

html.co-lot-theme .van-popup .lottery-container .n_red,
html.co-lot-theme .van-popup .lottery-container .n_2,
html.co-lot-theme .van-popup .lottery-container .n_4,
html.co-lot-theme .van-popup .lottery-container .n_6,
html.co-lot-theme .van-popup .lottery-container .n_8,
html.co-lot-theme .van-popup .lottery-container .n_0 {
  background: #f54545 !important;
  color: #fff !important;
}

html.co-lot-theme .van-popup .lottery-container .n_violet {
  background: #9c48e0 !important;
  color: #fff !important;
}

html.co-lot-theme .van-popup .lottery-container .m > div {
  min-width: 0.74667rem !important;
  height: 0.74667rem !important;
  line-height: 0.74667rem !important;
  text-align: center !important;
  border-radius: 0.08rem !important;
  font-size: 0.48rem !important;
  font-weight: 700 !important;
}

html.co-lot-theme .van-popup .lottery-container .m > input {
  background: #1e2020 !important;
  background-color: #1e2020 !important;
  color: #fff !important;
  border: 0.01333rem solid #323738 !important;
  border-radius: 0.08rem !important;
  -moz-appearance: textfield !important;
  appearance: textfield !important;
}

html.co-lot-theme .van-popup .lottery-container .m > input::-webkit-outer-spin-button,
html.co-lot-theme .van-popup .lottery-container .m > input::-webkit-inner-spin-button {
  -webkit-appearance: none !important;
  margin: 0 !important;
}

html.co-lot-theme .van-popup .lottery-container .agreement .van-checkbox__icon--checked .van-icon,
html.co-lot-theme .van-popup .lottery-container .agreement .van-icon-success {
  background-color: #f54545 !important;
  border-color: #f54545 !important;
  color: #fff !important;
}

html.co-lot-theme .van-popup .lottery-container .agreement .van-checkbox__label {
  color: #fff !important;
  font-size: 0 !important;
}

html.co-lot-theme .van-popup .lottery-container .agreement .van-checkbox__label::before {
  content: "Agree " !important;
  font-size: 0.32rem !important;
  color: #fff !important;
}

html.co-lot-theme .van-popup .lottery-container .agreement .rules {
  color: #fd565c !important;
  font-size: 0 !important;
}

html.co-lot-theme .van-popup .lottery-container .agreement .rules::after {
  content: "Presale Rules" !important;
  font-size: 0.32rem !important;
  color: #fd565c !important;
}

html.co-lot-theme .van-popup .lottery-container .footer .cancel,
html.co-lot-theme .van-popup .lottery-container .footer .cancel.van-button {
  background: #3a3d40 !important;
  background-image: none !important;
  color: rgba(255, 255, 255, 0.72) !important;
  border: 0 !important;
  border-radius: 0 !important;
}

html.co-lot-theme .van-popup .lottery-container .footer .bet-amount,
html.co-lot-theme .van-popup .lottery-container .footer .bet-amount.van-button {
  color: #fff !important;
  border: 0 !important;
  border-radius: 0 !important;
  background-image: none !important;
}

html.co-lot-theme .van-popup .lottery-container .footer .bet-amount.n_small,
html.co-lot-theme .van-popup .lottery-container .footer .van-button.bet-amount.n_small,
html.co-lot-theme .van-popup .lottery-container .footer .van-button.bet-amount.n_small .van-button__content {
  background: #42a5f5 !important;
  background-color: #42a5f5 !important;
}

html.co-lot-theme .van-popup .lottery-container .footer .bet-amount.n_big,
html.co-lot-theme .van-popup .lottery-container .footer .van-button.bet-amount.n_big,
html.co-lot-theme .van-popup .lottery-container .footer .van-button.bet-amount.n_big .van-button__content {
  background: #ffa726 !important;
  background-color: #ffa726 !important;
}

html.co-lot-theme .van-popup .lottery-container .footer .bet-amount.n_green,
html.co-lot-theme .van-popup .lottery-container .footer .van-button.bet-amount.n_green {
  background: #2dbe60 !important;
}

html.co-lot-theme .van-popup .lottery-container .footer .bet-amount.n_red,
html.co-lot-theme .van-popup .lottery-container .footer .van-button.bet-amount.n_red {
  background: #f54545 !important;
}

html.co-lot-theme .van-popup .lottery-container .footer .bet-amount.n_violet,
html.co-lot-theme .van-popup .lottery-container .footer .van-button.bet-amount.n_violet {
  background: #9c48e0 !important;
}

html.co-lot-theme .van-popup .lottery-container .m > div.n_small {
  background: #42a5f5 !important;
}

html.co-lot-theme .van-popup .lottery-container .m > div.n_big {
  background: #ffa726 !important;
}
