/* Betyap desktop custom CSS v1.3.6 (casino salon, sports fixes, see-through page, insights prices and hover, bet slip), 2026-10-27 */
@import url("https://fonts.googleapis.com/css2?family=Inter:ital,wght@0,400..800;1,400..600&display=swap");

/* Theme: the platform paints with these variables; every colour is set together with its text colour (-sc) */
html {
  --b: 255, 255, 255 !important;
  --b-sc: 17, 19, 24 !important;
  --header-sc: 17, 19, 24 !important;
  --menu: 255, 255, 255 !important;
  --menu-sc: 17, 19, 24 !important;
  --hero-sc: 17, 19, 24 !important;
  --accent: 17, 19, 24 !important;
  --accent-sc: 255, 255, 255 !important;
  --oc-1: 17, 19, 24 !important;
  --oc-1-sc: 255, 255, 255 !important;
  --oc-1-hover: 52, 55, 64 !important;
  --oc-2: 17, 19, 24 !important;
  --oc-2-sc: 255, 255, 255 !important;
  --border-radius: 8px !important;
  --font-family: "Inter", Roboto, Arial, sans-serif !important;

  --by-canvas: 244, 245, 247;
  --by-band: 233, 235, 238;
  --by-surface: 255, 255, 255;
  --by-inverse: 17, 19, 24;
  --by-inverse-sc: 255, 255, 255;
  --by-line: rgba(17, 19, 24, 0.08);
  --by-green: 14, 122, 30;
  --by-green-hover: 10, 100, 24;
  --by-shadow-pop: 0 24px 64px rgba(17, 19, 24, 0.22), 0 2px 8px rgba(17, 19, 24, 0.08);
  --by-shadow-menu: 0 12px 32px rgba(17, 19, 24, 0.14);
}

/* Page: grey canvas; with the betslip hidden the picture fills the page and shows under the content too */
#root {
  background: rgb(var(--by-canvas));
}
#root.betslip-Hidden {
  background: rgb(var(--by-canvas)) url(https://fghjklcvccbcnskfjnz.cloud/media/byap/bg.jpg?2) center top / cover no-repeat fixed;
}
#root.betslip-Hidden .layout-content-holder-bc {
  max-width: 1400px;
  margin: 0 auto;
}
#root .header-bc .hdr-main-content-bc,
#root .nav-menu-container {
  max-width: 1380px;
  margin: 0 auto;
}
#root .header-icon-text[class*="bc-i"] > span {
  font-family: var(--font-family);
}
#root ::selection {
  background: rgba(var(--hero), 0.4);
}
#root :is(a, button, [role="button"]):focus-visible {
  outline: 2px solid rgb(var(--hero));
  outline-offset: 2px;
}

/* Announcement strip */
#root .hdr-dynamic-content {
  padding: 0;
  background: rgb(var(--by-band));
  box-shadow: inset 0 -1px 0 var(--by-line);
}
#root .hdr-dynamic-content :is(.informative-widget, .informative-widget-link) {
  margin: 0;
  border: 0;
  border-radius: 0;
  background: transparent;
}
#root .hdr-dynamic-content .informative-widget-container {
  padding: 9px 20px;
}
#root .hdr-dynamic-content .informative-widget-container :is(span, p, i) {
  color: rgba(var(--b-sc), 0.8);
  font-size: 13px;
  font-weight: 500;
}
#root .hdr-dynamic-content .e-p-close-icon-bc {
  color: rgba(var(--b-sc), 0.45);
}
body .layout-header-holder-bc .hdr-dynamic-content:first-child .product-banner-container-bc {
  position: absolute;
  z-index: 999999 !important;
  top: 4px !important;
  left: 190px;
  display: flex;
  width: auto;
  grid-template-columns: repeat(auto-fill, minmax(100px, 1fr)) !important;
}
body .layout-header-holder-bc .hdr-dynamic-content:first-child .pb-component-wrapper {
  position: relative;
  display: block;
  width: 1400px;
  margin: 0 auto;
}

/* Header */
#root .layout-header-holder-bc {
  box-shadow: none;
}
#root .hdr-user-bc .btn,
#root .hdr-main-content-bc :is(.btn.sign-in, .btn.register) {
  height: 34px;
  padding: 0 16px;
  border-radius: 8px;
  font-size: 12px;
  font-weight: 700;
  letter-spacing: 0.02em;
}
#root .hdr-user-bc .header-icon-text {
  margin-inline-start: 4px;
  padding: 0 12px;
  color: rgba(var(--b-sc), 0.78);
  background: transparent;
}
#root .hdr-user-bc .header-icon-text:after {
  content: none;
}
#root .hdr-user-bc .header-icon-text:hover {
  color: rgb(var(--b-sc));
  background: rgba(var(--b-sc), 0.06);
}
#root .hdr-user-bc :is(.bc-i-wallet, .bc-i-deposit, .bc-i-community, .deposit-btn) {
  margin-inline-end: 8px;
  padding: 0 16px;
  color: #fff;
  background: rgb(var(--by-green));
}
#root .hdr-user-bc :is(.bc-i-wallet, .bc-i-deposit, .bc-i-community, .deposit-btn):hover {
  color: #fff;
  background: rgb(var(--by-green-hover));
}
#root .hdr-main-content-bc .btn.sign-in {
  margin-inline-start: 12px;
  color: rgb(var(--b-sc));
  background: rgb(var(--by-surface));
  box-shadow: inset 0 0 0 1px rgba(var(--b-sc), 0.2);
  text-decoration: none;
}
#root .hdr-main-content-bc .btn.sign-in:hover {
  box-shadow: inset 0 0 0 1px rgba(var(--b-sc), 0.5);
}
#root .hdr-main-content-bc .btn.register {
  margin-inline: 8px 0;
  color: rgb(var(--hero-sc));
  background: rgb(var(--hero));
}
#root .hdr-main-content-bc .btn.register:hover {
  background: rgb(var(--hero-hover));
}
#root .hdr-main-content-bc :is(.infoTime, .hdr-toggle-button-bc) {
  height: 34px;
  border-radius: 8px;
  color: rgba(var(--b-sc), 0.6);
  background: transparent;
  line-height: 34px;
  font-variant-numeric: tabular-nums;
}
#root .hdr-main-content-bc .hdr-toggle-button-bc:hover {
  background: rgba(var(--b-sc), 0.06);
}
#root :is(a.btn.a-color.header-icon-text.bc-i-call, a.loyaltyBonusHeader) {
  display: none;
}

/* Main menu */
#root :is(.nav-content-bc, .nav-content-menu) {
  border-radius: 0;
}
#root .nav-content-menu {
  padding: 7px 10px;
  background: rgb(var(--by-surface));
  border-bottom: 1px solid var(--by-line);
}
#root .nav-menu-container.header-navigation:first-child {
  background: none;
  border: 0;
}
/* the "more" menu's divider is anchored to the bar, not to the menu, so on our white bar it stood alone left of the first link */
#root .nav-menu-container.header-navigation .nav-menu-other::after {
  content: none;
}
#root .nav-menu-container.header-navigation:first-child .nav-menu > li {
  margin: 0 2px;
}
#root .nav-menu-container.header-navigation:first-child :is(.nav-menu > li, .nav-menu-other) > .nav-menu-item {
  padding: 0 12px;
  border-radius: 8px;
  color: rgba(var(--menu-sc), 0.88);
  font-size: 13px;
  font-weight: 600;
  letter-spacing: 0.02em;
  text-transform: uppercase;
  box-shadow: none;
}
#root .nav-menu-container.header-navigation:first-child :is(.nav-menu > li, .nav-menu-other):hover > .nav-menu-item {
  color: rgb(var(--menu-sc));
  background: rgba(var(--menu-sc), 0.06);
  box-shadow: none;
}
#root .nav-menu-container.header-navigation:first-child :is(.nav-menu > li, .nav-menu-other) > .nav-menu-item.active {
  color: rgb(var(--hero-sc));
  background: rgb(var(--hero));
}
.nav-menu > li > .nav-menu-item[class*="badge-"]::after {
  top: -5px !important;
}
#root .nav-content-bc .nav-menu-container .nav-menu-sub {
  padding: 6px;
  border-radius: 0 0 12px 12px;
  box-shadow: var(--by-shadow-menu);
}
#root .nav-content-bc .nav-menu-container .nav-menu-sub .nav-menu-item {
  height: 36px;
  border-radius: 8px;
  background: none;
  font-size: 12px;
  font-weight: 600;
  letter-spacing: 0.02em;
  text-transform: uppercase;
}
#root .nav-menu-container .nav-menu-sub .nav-menu-item:hover:before {
  background: rgba(var(--menu-sc), 0.06);
}
#root .nav-menu-container.header-navigation:nth-child(2) .nav-menu-item {
  font-size: 13px;
  font-weight: 600;
  letter-spacing: 0.02em;
  text-transform: uppercase;
}

/* Surfaces: white panels on the grey canvas */
#root :is(.left-menu-container, .sportsbook-center-section, .results-container-bc),
#root .layout-betslip-holder-bc .betslip-bc {
  background: rgb(var(--by-surface));
  border-radius: 12px;
}
#root :is(.casino-info-block, .casino-winners-block, .bbAiRecBetsItem, .featuredGameItemVersion1),
#root .tournamentSection .tournamentSectionMainContainer {
  background-color: rgb(var(--by-surface));
  border-color: var(--by-line);
  border-radius: 12px;
  backdrop-filter: none;
}
#root .popular-matches-bc {
  padding: 16px;
  background: rgb(var(--by-surface));
  border-radius: 12px;
}
#root .sectionTitleText {
  color: rgb(var(--b-sc));
  font-size: 16px;
  font-weight: 700;
  letter-spacing: 0.01em;
  text-transform: uppercase;
}

/* Segmented tabs */
#root :is(.layout-content-holder-bc, .popup-holder-bc, .sidePanel-holder) .second-tabs-bc {
  height: 38px;
  padding: 3px;
  border-radius: 10px;
  background: rgba(var(--b-sc), 0.05);
}
#root :is(.layout-content-holder-bc, .popup-holder-bc, .sidePanel-holder) .second-tabs-bc .tab-bc {
  flex: 1 1 0;
  min-width: 0;
  margin: 0;
  border-radius: 8px;
  color: rgba(var(--b-sc), 0.6);
  background: transparent;
  font-weight: 600;
  box-shadow: none;
}
#root :is(.layout-content-holder-bc, .popup-holder-bc, .sidePanel-holder) .second-tabs-bc .tab-bc span {
  color: inherit;
}
#root :is(.layout-content-holder-bc, .popup-holder-bc, .sidePanel-holder) .second-tabs-bc .tab-bc:hover {
  color: rgb(var(--b-sc));
}
#root :is(.layout-content-holder-bc, .popup-holder-bc, .sidePanel-holder) .second-tabs-bc .tab-bc.active {
  color: rgb(var(--b-sc));
  background: rgb(var(--by-surface));
  box-shadow: 0 1px 3px rgba(17, 19, 24, 0.12);
}

/* Home slider and banners */
#root .sdr-item-bc {
  border-radius: 12px;
}
#root .sdr-item-bc:before {
  display: none;
}
#root .product-banner-container-bc {
  background: none;
}
.is-home-page .product-banner-without-titles .product-banner-img-bc {
  width: 100%;
}
.hm-row-bc:nth-child(5) .product-banner-container-bc.col-4.product-banner-without-titles {
  grid-template-columns: repeat(auto-fit, minmax(200px, 1fr)) !important;
}
#root .expressWidget {
  border-radius: 12px;
  background: rgb(var(--by-surface));
  box-shadow: inset 0 0 0 1px var(--by-line);
}
#root .expressWidgetWrapperBonus {
  right: 8px;
  border-radius: 6px;
  color: rgb(var(--hero-sc));
  background: rgb(var(--hero));
}
#root .expressWidgetWrapperBonus:before {
  display: none;
}
#root .power-bank-leaderboard {
  overflow: hidden;
  border: 1px solid var(--by-line);
  border-radius: 12px;
}
#root .power-bank-leaderboard-banner {
  background: rgb(var(--by-surface));
  box-shadow: inset 0 -1px 0 var(--by-line);
}
#root .power-bank-leaderboard__table {
  padding: 4px 16px 12px;
  background: rgb(var(--by-surface));
}
#root .power-bank-leaderboard-row {
  border-radius: 0;
  background: transparent;
  box-shadow: inset 0 -1px 0 var(--by-line);
}
#root .power-bank-leaderboard-row:hover {
  background: rgba(var(--b-sc), 0.03);
}
#root .featuredGameItemVersion1 .market-group-holder-bc .market-group-item-bc .market-bc:not(.active):not(:hover) {
  border-radius: 8px;
  background: rgba(var(--b-sc), 0.05);
}

/* Odds, wherever they appear */
#root .market-bc:not(.active):not(.disabled-market-bc):not(.m-g-header):not(.market-base):not(:hover) {
  background: rgba(var(--b-sc), 0.06);
}
#root :is(.market-odd-bc, .bs-bet-i-b-coefficient-bc, .bs-bet-i-b-amount-bc, .BBEventHeaderPriceBlock) {
  font-variant-numeric: tabular-nums;
}
#root .market-odd-bc {
  font-weight: 700;
}

/* Sports menu: one white list on hairlines instead of stacked grey boxes */
#root .left-menu-search {
  padding: 12px 12px 8px;
  border-radius: 0;
  background: none;
}
#root .left-menu-container .sport-search-bc {
  height: 38px;
  border: 0;
  border-radius: 10px;
  background: rgba(var(--b-sc), 0.05);
}
#root .left-menu-container .sport-search-bc :is(.ss-input-bc, .ss-icon-holder-bc) {
  background: transparent;
}
#root .left-menu-container .ss-input-bc {
  padding-inline-start: 12px;
  font-size: 13px;
  text-overflow: ellipsis;
}
#root .left-menu-container > .second-tabs-bc {
  width: auto;
  margin: 0 12px;
}
#root .left-menu-container > .second-tabs-bc .tab-bc {
  font-size: 12px;
  text-transform: uppercase;
}
#root .left-menu-container > .second-tabs-bc .tab-bc.active {
  color: rgb(var(--hero-sc));
  background: rgb(var(--hero));
  box-shadow: none;
}
#root .left-menu-container > .filter-sports-bc {
  height: auto;
  margin: 0;
  padding: 8px 12px 10px;
  border-radius: 0;
  background: none;
  box-shadow: inset 0 -1px 0 var(--by-line);
}
#root .left-menu-scroll > .filter-sports-bc {
  height: auto;
  margin: 0;
  padding: 12px 12px 8px;
  border-radius: 0;
  background: none;
}
#root .left-menu-scroll > .sport-search-bc {
  width: auto;
  margin: 0 12px 12px;
}
#root .filter-sports-bc .btn.a-outline {
  width: 36px;
  height: 32px;
  border: 0;
  border-radius: 8px;
  background: rgba(var(--b-sc), 0.05);
}
#root .filter-sports-bc .btn.a-outline.active {
  background: rgb(var(--hero));
}
#root .left-menu-container .form-control-bc.s-small {
  height: 32px;
}
#root .left-menu-container .form-control-bc.s-small .form-control-select-bc {
  height: 32px;
  padding-top: 0;
  padding-bottom: 0;
  border-radius: 8px;
  background: rgba(var(--b-sc), 0.05);
  line-height: 32px;
}
#root .left-menu-container .pp-sport-list-holder-bc {
  margin: 0;
}
#root .left-menu-scroll {
  padding: 0;
}
#root .left-menu-scroll .sp-sub-list-bc {
  max-height: 40px;
  margin: 0;
  padding: 0;
  border-radius: 0;
  background: transparent;
  box-shadow: none;
}
#root .left-menu-scroll .sp-sub-list-bc.active {
  max-height: 150000px;
}
#root .left-menu-scroll .sp-s-l-head-bc {
  height: 40px;
  padding: 0 12px;
  border-radius: 0;
  background: transparent;
  box-shadow: inset 0 -1px 0 var(--by-line);
}
#root .left-menu-scroll .sp-s-l-head-bc:hover {
  background: rgba(var(--b-sc), 0.035);
}
#root .left-menu-scroll > .sp-sub-list-bc.active > .sp-s-l-head-bc {
  background: rgb(var(--by-surface));
}
#root .left-menu-scroll .sp-s-l-b-content-bc {
  margin: 0;
  padding: 0;
  border-radius: 0;
  background: transparent;
}
#root .left-menu-scroll .sp-s-l-h-title-bc {
  color: rgba(var(--b-sc), 0.85);
  font-size: 12px;
}
#root .left-menu-scroll > .sp-sub-list-bc > .sp-s-l-head-bc .sp-s-l-h-title-bc {
  color: rgb(var(--b-sc));
  font-size: 13px;
  font-weight: 600;
}
#root .left-menu-scroll .sp-sub-list-bc .sp-sub-list-bc .sp-sub-list-bc > .sp-s-l-head-bc {
  padding-inline-start: 42px;
}
#root .left-menu-scroll .sp-sub-list-bc .sp-sub-list-bc .sp-sub-list-bc .sp-s-l-h-title-bc {
  color: rgba(var(--b-sc), 0.75);
}
#root .left-menu-scroll .sp-s-l-h-title-content .sp-s-l-h-title-bc:first-child:not(:last-child) {
  color: rgba(var(--b-sc), 0.6);
  font-size: 11px;
}
#root .left-menu-scroll .sp-s-l-h-title-content .sp-s-l-h-title-bc:last-child:not(:first-child) {
  color: rgb(var(--b-sc));
  font-weight: 500;
}
#root .left-menu-scroll .sp-sub-list-bc:is(.selected, .a-color):not(.active) > .sp-s-l-head-bc {
  background: rgba(var(--hero), 0.14);
  box-shadow: inset 3px 0 0 rgb(var(--hero)), inset 0 -1px 0 var(--by-line);
}
#root .left-menu-scroll .sp-sub-list-bc:is(.selected, .a-color):not(.active) > .sp-s-l-head-bc :is(.sp-s-l-h-title-bc, .sp-s-l-h-arrow-icon-bc) {
  color: rgb(var(--b-sc));
}
#root .left-menu-scroll .sp-s-l-b-c-i-g-league-c-bc {
  color: rgba(var(--b-sc), 0.6);
  font-variant-numeric: tabular-nums;
}
/* the platform colours this arrow per sport inline, so only !important reaches it */
#root .left-menu-scroll .sp-s-l-h-arrow-icon-bc {
  width: 20px;
  color: rgba(var(--b-sc), 0.45) !important;
  background: transparent !important;
}
#root .left-menu-scroll .sp-sub-list-bc .form-control-bc {
  height: auto;
  margin: 0;
  padding: 8px 12px;
  border-top: 0;
  box-shadow: inset 0 -1px 0 var(--by-line);
}
#root .left-menu-scroll .market-game-section {
  margin: 0;
  padding: 10px 12px 12px 14px;
  border-radius: 0;
  background: transparent;
  box-shadow: inset 0 -1px 0 var(--by-line);
}
#root .left-menu-scroll .market-game-section:hover {
  background: rgba(var(--b-sc), 0.03);
}
#root .left-menu-scroll .market-game-section.active {
  background: rgba(var(--hero), 0.12);
}
#root .left-menu-scroll .market-game-section .selected-game-indicator {
  width: 3px;
  background: transparent !important;
}
#root .left-menu-scroll .market-game-section.active .selected-game-indicator {
  background: rgb(var(--hero)) !important;
}
#root .left-menu-scroll .market-game-team {
  font-size: 13px;
}
#root .left-menu-scroll .market-game-team-name {
  color: rgb(var(--b-sc));
  font-weight: 500;
}
#root .left-menu-scroll .market-game-odd {
  color: rgb(var(--b-sc));
  font-weight: 700;
  font-variant-numeric: tabular-nums;
}
#root .left-menu-scroll :is(.market-game-part-container, .market-game-additional-info-container) {
  color: rgba(var(--b-sc), 0.6);
}
#root .left-menu-scroll .market-game-part-container > b {
  color: rgba(var(--b-sc), 0.7);
  background: rgba(var(--b-sc), 0.06);
}
#root .left-menu-scroll .left-menu-market .market-group-item-bc + .market-group-item-bc {
  margin-inline-start: 2px;
}
#root .left-menu-scroll .left-menu-market .market-bc {
  padding: 4px 8px;
  border-radius: 8px;
}

/* Match list */
#root .multi-column-resize-block {
  background: transparent;
}
#root .comp-name-fav-row-bc {
  height: 48px;
  margin: 0;
  padding: 0 12px;
  border-radius: 0;
  background: transparent;
  box-shadow: inset 0 -1px 0 var(--by-line);
}
#root .comp-name-fav-row-bc .comp-title-w-bc {
  color: rgb(var(--b-sc));
  font-size: 15px;
  font-weight: 700;
}
#root .multi-column-header {
  margin: 0;
  border-radius: 0;
  background: transparent;
  box-shadow: inset 0 -1px 0 var(--by-line);
  padding-inline: 12px 5px;
}
#root .multi-column-header :is(p, b) {
  color: rgba(var(--b-sc), 0.6);
  font-size: 11px;
  font-weight: 600;
}
#root .c-segment-holder-bc {
  margin: 0;
}
#root .c-head-bc {
  height: 34px;
  padding: 0 12px;
  border-radius: 0;
  background: rgba(var(--b-sc), 0.025);
  box-shadow: inset 0 -1px 0 var(--by-line);
}
#root .c-head-bc .c-title-bc {
  color: rgba(var(--b-sc), 0.6);
  font-size: 12px;
  font-weight: 600;
}
#root .multi-column-content {
  margin: 0;
  border-radius: 0;
  background: transparent;
  box-shadow: inset 0 -1px 0 var(--by-line);
  padding-inline: 12px 5px;
}
#root .multi-column-content:hover {
  background: rgba(var(--b-sc), 0.025);
}
#root .multi-column-content.active {
  background: rgba(var(--hero), 0.1);
  box-shadow: inset 3px 0 0 rgb(var(--hero)), inset 0 -1px 0 var(--by-line);
}
#root .multi-column-content .multi-column-single-team p {
  font-size: 13px;
  font-weight: 500;
}
#root .multi-column-content :is(.market-odd-bc, .multi-column-base) {
  font-size: 13px;
}
#root .multi-column-content > li .market-bc + .market-bc {
  margin-inline-start: 4px;
}
/* the e-sports centre column is a flex column that shrank this bar to 28px */
#root .market-filter-bc {
  height: 44px;
  flex-shrink: 0;
  margin: 0;
  padding-inline-start: 12px;
  border-radius: 0;
  background: transparent;
  box-shadow: inset 0 -1px 0 var(--by-line);
}
#root .page-view-more {
  margin: 0;
  padding: 14px 12px 6px;
}
#root .competition-wrapper-bc {
  box-shadow: none;
}
#root .e-sports-match-header {
  margin: 0;
  border-radius: 0;
  background: rgba(var(--b-sc), 0.025);
  box-shadow: inset 0 -1px 0 var(--by-line);
}
#root .e-sports-match-container {
  border-radius: 0;
  box-shadow: inset 0 -1px 0 var(--by-line);
}
#root :is(.e-sports-match-team, .e-sports-match-vs, .e-sports-match-icons) {
  background: transparent;
}
#root .e-sports-match-team-img {
  background: rgba(var(--b-sc), 0.04);
}

/* Match page */
/* inside the live scoreboard the accent colours go back to the brand yellow */
#root .game-details-container-inner-bc {
  --oc-1: 255, 204, 51;
  --oc-1-sc: 17, 19, 24;
  --oc-2: 255, 204, 51;
  --accent: 255, 204, 51;
  --accent-sc: 17, 19, 24;
  border-radius: 12px 12px 0 0;
}
#root .stats-section-bc {
  margin: 0;
  border-radius: 0;
  background: rgba(var(--b-sc), 0.03);
  box-shadow: inset 0 -1px 0 var(--by-line);
}
#root :is(.competition-header-bc, .sgm-markets-head-bc) {
  height: 40px;
  border-radius: 0;
  background: transparent;
  box-shadow: inset 0 -1px 0 var(--by-line);
}
#root .competition-header-bc .competition-title-bc {
  color: rgb(var(--b-sc));
  font-size: 13px;
  font-weight: 600;
}
#root .competition-header-bc .competition-icon-arrow-bc {
  background: transparent;
}
#root .sgm-markets-head-bc {
  color: rgba(var(--b-sc), 0.6);
  font-size: 12px;
  font-weight: 600;
  letter-spacing: 0.03em;
  text-transform: uppercase;
}
#root .sgm-market-search {
  border-radius: 0;
  box-shadow: inset 0 -1px 0 var(--by-line);
}
#root .sgm-market-search .horizontal-sl-tab {
  height: 44px;
  background: transparent;
}
#root .sgm-market-search .sport-search-bc .ss-icon-holder-bc {
  height: 44px;
  border-radius: 0;
  background: transparent;
}
#root .horizontal-sl-tab-bc {
  color: rgba(var(--b-sc), 0.6);
  font-size: 13px;
  font-weight: 600;
  line-height: 44px;
}
#root .horizontal-sl-tab {
  height: 44px;
  background: rgb(var(--by-surface));
  box-shadow: inset 0 -1px 0 var(--by-line);
}
#root .sgm-market-g-head-bc {
  margin: 0;
  padding: 12px 12px 8px;
  border-top: 0;
  border-radius: 0;
  background: transparent;
  box-shadow: inset 0 1px 0 var(--by-line);
}
#root .sgm-market-g-h-title-bc {
  color: rgb(var(--b-sc));
  font-size: 13px;
  font-weight: 600;
  text-wrap: balance;
}
#root .sgm-market-g-item-bc {
  padding: 0 6px 12px;
  background: transparent;
}
#root .sgm-market-g-item-bc > .market-bc:not(.m-g-header) {
  padding: 0 8px;
}
#root .sgm-market-g-item-bc > .market-bc.m-g-header {
  min-height: 22px;
  color: rgba(var(--b-sc), 0.6);
  background: transparent;
  font-size: 11px;
}
#root .sgm-market-g-item-bc .market-base {
  color: rgba(var(--b-sc), 0.6);
  background: transparent;
}
#root .sgm-market-g-item-bc > .market-bc .market-name-bc {
  color: rgba(var(--b-sc), 0.65);
}
#root .filter-form-w-bc {
  background: rgba(var(--b-sc), 0.04);
}
.favouriteTeamsWidget {
  display: none;
}

/* Bet slip */
#root .betslip-bc .bs-f-header-bc .second-tabs-bc {
  height: 48px;
  margin: 0;
}
#root .betslip-bc .bs-f-header-bc .tab-bc {
  height: 48px;
  border-radius: 0;
  background: transparent;
  font-size: 13px;
  font-weight: 700;
  letter-spacing: 0.03em;
}
#root .betslip-bc :is(.settings-r-b-row-bc, .bs-f-header-sub-navigation-bc) {
  height: 40px;
  margin: 0;
  padding: 0 12px;
  border-radius: 0;
  background: transparent;
  box-shadow: inset 0 -1px 0 var(--by-line);
}
#root .betslip-bc .bs-bet-item-bc {
  margin: 0;
  border-radius: 0;
  background: transparent;
  box-shadow: inset 0 -1px 0 var(--by-line);
}
#root .bs-bet-i-b-s-i-holder-bc:not(.active) {
  border-color: rgba(var(--b-sc), 0.16);
  background: rgb(var(--by-surface));
}
#root .betslip-bc :is(.bs-numbers-bc, .bet-button-wrapper-bc) {
  border-radius: 0;
  background: transparent;
}
#root .betslip-bc .bs-number-button-bc {
  border-radius: 8px;
  background: rgba(var(--b-sc), 0.05);
}
#root .betslip-bc .bs-number-button-bc:hover {
  background: rgba(var(--b-sc), 0.1);
}
#root .bet-button-wrapper-bc .btn {
  height: 44px;
  border-radius: 10px;
  font-size: 13px;
  font-weight: 700;
}
#root .bs-f-b-content-bc :is(.bs-bet-i-b-coefficient-bc, .BBEventHeaderPriceBlock, .BBEventHeaderPriceBlock > span) {
  color: rgb(var(--b-sc));
  font-size: 14px;
  font-weight: 700;
}
#root .quickBetMsgWrapper-bc.betslip-warning-message {
  margin: 8px 12px 0;
  border-radius: 10px;
  background: rgba(var(--hero), 0.16);
}

/* Buttons */
#root .btn.a-color:not(:disabled):not(.header-icon-text) {
  color: rgb(var(--hero-sc));
  background: rgb(var(--hero));
  font-weight: 600;
}
#root .btn.a-color:not(:disabled):not(.header-icon-text):hover {
  background: rgb(var(--hero-hover));
}
#root .ds-btn.ds-btn-variant--transparent:not(.ds-btn-appearance--text) {
  background: rgb(var(--by-surface));
  box-shadow: inset 0 0 0 1px rgba(var(--b-sc), 0.12);
}
#root .nav-floating-btn {
  width: 44px;
  height: 44px;
  color: rgb(17, 19, 24);
  background: rgb(var(--by-surface));
  box-shadow: 0 6px 20px rgba(17, 19, 24, 0.18);
}

/* Forms */
#root :is(.form-control-input-bc, .form-control-textarea-bc),
#root .react-datepicker__input-container .form-control-input-bc:read-only,
#root .form-control-bc:not(.compact-mode):not(.s-small) .form-control-select-bc {
  border: 1px solid rgba(var(--b-sc), 0.16);
  background: rgb(var(--by-surface));
}
#root .form-control-bc.focused:not(.invalid) :is(.form-control-input-bc, .form-control-textarea-bc, .form-control-select-bc) {
  border-color: rgb(var(--hero));
  box-shadow: 0 0 0 3px rgba(var(--hero), 0.28);
}
#root .form-control-input-stroke-bc {
  display: none;
}
#root .form-control-title-bc {
  color: rgba(var(--b-sc), 0.6);
}
#root .checkbox-control-icon-bc {
  border-radius: 4px;
}
#root .ds-textfield.ds-textfield-layout--fill:not(.ds-textfield--focused):not(.ds-textfield--error):not(.ds-textfield--disabled) .ds-textfield__field,
#root .ds-select.ds-select-layout--fill:not(.ds-select--disabled) .ds-select__field {
  background: rgb(var(--by-surface));
  box-shadow: inset 0 0 0 1px rgba(var(--b-sc), 0.12);
}

/* Popups */
#root .popup-holder-bc {
  background: rgba(17, 19, 24, 0.64);
}
#root .popup-inner-bc {
  overflow: hidden;
  border-radius: 16px;
  box-shadow: var(--by-shadow-pop);
}
.popup-t-logo-w-bc:before {
  width: 110px !important;
  height: 27px !important;
}
#root .entrance-popup-bc.sign-in {
  height: min(480px, 77vh);
}
#root .entrance-popup-bc.register:not(:has(.slider-bc)) {
  height: min(680px, 77vh);
}
#root .reg-form-footer-bc {
  background: rgb(var(--by-surface));
  box-shadow: inset 0 1px 0 var(--by-line);
}
#root .reg-form-footer-bc .step-indicator-active {
  background: rgb(var(--hero));
}
#root .e-p-header-bc .btn.register {
  height: 34px;
  border-radius: 8px;
}
.turnstile-captcha-wrapper.active {
  z-index: 9999999999;
}

/* Written content: promotion details and help pages */
#root :is(.promotion-details-info, .footerInfoContent .content, .expandable-info-body, .expandableContentData) a {
  color: rgb(var(--b-sc));
  text-decoration: underline;
  text-decoration-color: rgb(var(--hero));
  text-decoration-thickness: 2px;
  text-underline-offset: 3px;
}
.promotion-details-info table {
  width: 100% !important;
  overflow: visible !important;
  border-collapse: collapse;
}
#root .footerInfoPage .footerInfoContent {
  background: rgb(var(--by-surface));
  border-radius: 12px;
}
#root .footerInfoContent .content {
  color: rgba(var(--b-sc), 0.75);
}

/* Promotions */
#root .promotionsList-bc {
  grid-template-columns: repeat(auto-fill, minmax(320px, 1fr));
}
#root .promotions-article-title {
  display: none;
}
#root .promotionsListEl-bc {
  overflow: hidden;
  border-radius: 12px;
  transition: box-shadow 0.2s;
}
#root .promotionsListEl-bc:hover {
  box-shadow: 0 0 0 2px rgb(var(--hero));
}
#root .horizontal-sl-item-bc:not(:empty) {
  color: rgb(var(--b-sc));
  font-weight: 700;
}
#root .horizontal-sl-item-bc:not(:empty):not(.active) {
  background: rgb(var(--by-surface));
}
#root .promotion-horizontal-sl-list-bc .horizontal-sl-item-bc:not(.active):hover {
  background: rgb(var(--by-surface));
  box-shadow: inset 0 0 0 1px rgba(var(--b-sc), 0.4);
}

/* Casino */
#root .ds-chip {
  color: rgba(var(--b-sc), 0.8);
  background: rgb(var(--by-surface));
  box-shadow: inset 0 0 0 1px rgba(var(--b-sc), 0.12);
}
#root .ds-chip:hover {
  box-shadow: inset 0 0 0 1px rgba(var(--b-sc), 0.3);
}
#root .ds-chip.ds-chip--selected {
  color: rgb(var(--by-inverse-sc));
  background: rgb(var(--by-inverse));
  box-shadow: none;
}
#root :is(.casinoGameImageV2Holder, .casinoGameImageV2) {
  border-radius: 10px;
}
#root :is(.casino-info-content, .casino-info-content-winners) {
  padding: 4px 16px 12px;
}
#root :is(.casino-info-content, .casino-info-content-winners) > li {
  margin: 0;
  padding: 10px 0;
  border-radius: 0;
  background: transparent;
  box-shadow: inset 0 -1px 0 var(--by-line);
}
#root :is(.casino-info-content, .casino-info-content-winners) > li:last-child {
  box-shadow: none;
}
#root .casino-winners-block .main-tabs-bc .tab-bc {
  flex: 1 1 auto;
  width: auto;
  padding-inline: 4px;
  color: rgba(var(--b-sc), 0.6);
  background: transparent;
  font-size: 11px;
  font-weight: 700;
  white-space: nowrap;
}
#root .casino-winners-block .main-tabs-bc .tab-bc.active {
  color: rgb(var(--b-sc));
  background: transparent;
  box-shadow: inset 0 -2px 0 rgb(var(--hero));
}
#root .casinoTournamentInfoRowWrp .casinoTournamentInfoRow {
  border-radius: 0;
  background-color: transparent;
  box-shadow: inset 0 -1px 0 var(--by-line);
}
#root .casinoTournamentInfoRowWrp.active .casinoTournamentInfoRow {
  background-color: rgba(var(--hero), 0.12);
}
#root .horizontalSliderElem {
  width: 130px;
  padding: 0;
  background: none;
}
#root .horizontalSliderElem .horizontalSliderImg {
  opacity: 1;
  filter: none;
}
.providerItemsInner:not(.active) {
  background: #fff !important;
}
[class*="is-web"] .providerItemsInner:hover svg :is(path, rect, polygon) {
  fill: #000 !important;
}
.slider-market-coefficient-container .market-bc {
  min-width: 105px !important;
  height: 45px !important;
  border-radius: 30px;
  background: none !important;
  box-shadow: none !important;
  backdrop-filter: none;
}
.slider-market-coefficient-container .market-odd-bc {
  color: #fff !important;
  font-size: 23px !important;
}
.YoPhoneApp,
.YoPhoneAppContent {
  display: none;
}

/* Account pages */
.u-i-profile-page-content,
.my-profile-info-block {
  background: #fff !important;
}
.user-profile-nav-item {
  text-transform: uppercase;
}
.user-not-verified {
  text-shadow: none !important;
}
[class*="is-web"] .loyaltySliderCardInfo {
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  height: 34px !important;
  line-height: 34px !important;
}
.dep-w-info-bc .m-nav-items-list-item-bc {
  padding: 0;
}
.withdraw_masterpaynewpapara {
  display: none !important;
}

/* Footer: the same grey band as the announcement strip */
#root .layout-footer-holder-bc {
  margin-top: 40px;
  padding: 0;
  background: rgb(var(--by-band));
  box-shadow: inset 0 1px 0 var(--by-line);
}
#root .footerWrapper {
  padding-top: 0;
  box-shadow: none;
}
#root .footerContainer {
  max-width: 1380px;
  margin: 0 auto;
  padding: 0 10px;
}
#root .footerHeader {
  box-shadow: inset 0 -1px 0 var(--by-line);
}
#root .footerSocialLink {
  border-radius: 8px;
  background-color: rgb(var(--by-surface));
  box-shadow: inset 0 0 0 1px var(--by-line);
}
#root .footerSocialLink:hover {
  background-color: rgb(var(--by-surface));
  box-shadow: inset 0 0 0 1px rgba(var(--b-sc), 0.24);
}
#root .footerInfoColumn .infoTime {
  color: rgba(var(--b-sc), 0.7);
  background-color: rgb(var(--by-surface));
  box-shadow: inset 0 0 0 1px var(--by-line);
}
#root .footerLinksSection {
  width: 100%;
  margin-bottom: 24px;
}
#root .footerLinkCols {
  justify-content: space-between;
}
#root .footerLinkCol {
  flex: 0 1 220px;
}
#root .footerLinkColTitle {
  margin-bottom: 16px;
  color: rgb(var(--b-sc));
  font-size: 12px;
  letter-spacing: 0.06em;
}
#root .footerLinkColEl .footerLinkColText {
  color: rgba(var(--b-sc), 0.62);
  font-size: 13px;
}
#root .footerLinkColEl a:hover .footerLinkColText {
  color: rgb(var(--b-sc));
}
#root .sliderTitle {
  color: rgba(var(--b-sc), 0.62);
  letter-spacing: 0.08em;
}
#root .ftr-copy-rights-bc {
  margin-bottom: 20px;
  border-color: var(--by-line);
  color: rgba(var(--b-sc), 0.62);
  line-height: 1.6;
}
#root .ftr-copy-rights-bc a {
  color: rgba(var(--b-sc), 0.85);
  text-decoration: none;
}
#root .ftr-copy-rights-bc a:hover {
  color: rgb(var(--b-sc));
  text-decoration: underline;
}
#root .copyRightBlock {
  box-shadow: inset 0 1px 0 var(--by-line);
}
#root .footerCopyrights {
  color: rgba(var(--b-sc), 0.62);
}
#root .footerWarningAge {
  border-color: rgba(var(--b-sc), 0.35);
  color: rgba(var(--b-sc), 0.7);
}

/* Dropdown lists */
#root .multi-select-label-bc {
  padding: 4px;
  border-radius: 10px;
  background: rgb(var(--by-surface));
  box-shadow: var(--by-shadow-menu), 0 0 0 1px var(--by-line);
}
#root .multi-select-label-bc .checkbox-control-content-bc {
  border-radius: 8px;
  background: transparent;
}
#root .multi-select-label-bc .checkbox-control-content-bc:hover {
  background: rgba(var(--b-sc), 0.05);
}
#root .multi-select-label-bc .checkbox-control-content-bc.active {
  background: rgba(var(--hero), 0.2);
}
#root .multi-select-label-bc .checkbox-control-text-bc {
  color: rgba(var(--b-sc), 0.8);
}
#root .multi-select-label-bc .checkbox-control-content-bc.active .checkbox-control-text-bc {
  color: rgb(var(--b-sc));
  font-weight: 600;
}

/* Date picker */
#root .react-datepicker__tab-loop .react-datepicker {
  overflow: hidden;
  border: 0;
  border-radius: 12px;
  box-shadow: var(--by-shadow-menu), 0 0 0 1px var(--by-line);
  font-family: var(--font-family);
}
#root .react-datepicker__tab-loop .react-datepicker__triangle {
  display: none;
}
#root .react-datepicker__tab-loop .react-datepicker__header {
  border-bottom: 1px solid var(--by-line);
  border-radius: 0;
  background: rgb(var(--by-surface));
}
#root .react-datepicker__tab-loop select {
  background: rgba(var(--b-sc), 0.05);
  color: rgb(var(--b-sc));
}
#root .react-datepicker__day-names .react-datepicker__day-name,
#root .react-datepicker__month .react-datepicker__day {
  width: 2.1rem;
  line-height: 2.1rem;
}
#root .react-datepicker__day-names .react-datepicker__day-name {
  overflow: hidden;
  color: rgba(var(--b-sc), 0.5);
  font-size: 10px;
  font-weight: 600;
  text-transform: uppercase;
}
#root .react-datepicker__month .react-datepicker__day {
  border-radius: 8px;
}

/* Sports search results */
#root .sport-search-result-bc {
  padding-top: 4px;
}
#root .sport-search-result-header-bc {
  height: 34px;
  margin-bottom: 4px;
  border: 0;
  border-radius: 8px;
  color: rgb(var(--b-sc));
  background: rgba(var(--b-sc), 0.05);
}
#root .sport-search-result-title-bc {
  font-weight: 600;
  line-height: 34px;
}
#root .sport-search-result-header-bc .search-close-btn {
  color: rgba(var(--b-sc), 0.6);
}
/* the platform tints each sport inline, so only !important reaches it */
#root .sport-search-result-bc .sg-head-bc {
  height: 32px;
  margin: 0;
  border-radius: 0;
  color: rgb(var(--b-sc)) !important;
  background: transparent !important;
  box-shadow: inset 0 -1px 0 var(--by-line);
}
#root .sport-search-result-bc .sg-title-bc {
  font-weight: 700;
}
#root .sport-search-result-item-bc {
  margin: 0;
  padding: 9px 10px;
  border-radius: 0;
  color: rgba(var(--b-sc), 0.6);
  background: transparent;
  box-shadow: inset 0 -1px 0 var(--by-line);
}
#root .sport-search-result-item-bc:hover {
  background: rgba(var(--b-sc), 0.035);
}
#root .sport-search-result-item-bc .s-g-competition-n-bc {
  color: rgba(var(--b-sc), 0.55);
  font-weight: 600;
}
#root .sport-search-result-item-bc .s-g-competition-n-bc + p {
  color: rgb(var(--b-sc));
  font-size: 13px;
  font-weight: 500;
  line-height: 18px;
}

/* Live calendar */
#root .live-calendar-filters-wrapper .time-filters-bc {
  border-radius: 12px;
  background: rgb(var(--by-surface));
}
#root .time-filter-button-bc.btn.a-outline {
  border: 0;
  border-radius: 8px;
  color: rgba(var(--b-sc), 0.7);
  background: rgba(var(--b-sc), 0.05);
}
#root .time-filter-button-bc.btn.a-outline:hover {
  color: rgb(var(--b-sc));
  background: rgba(var(--b-sc), 0.1);
}
#root .time-filter-button-bc.btn.a-outline:is(.a-white, .active) {
  color: rgb(var(--by-inverse-sc));
  background: rgb(var(--by-inverse));
}
#root .live-calendar-market-bc {
  overflow: hidden;
  border-radius: 12px;
  background: rgb(var(--by-surface));
}
#root .market-filter-cell-bc > .market-filter-info-bc {
  color: rgba(var(--b-sc), 0.6);
  background: transparent;
  box-shadow: none;
  font-weight: 600;
}
#root .c-row-bc {
  border-radius: 0;
  box-shadow: inset 0 -1px 0 var(--by-line);
}
#root :is(.c-info-content-bc, .c-teams-bc, .c-info-more-bc) {
  background: transparent;
}
#root .c-info-content-bc:after {
  background: var(--by-line);
}
#root .c-info-content-bc .c-info-time-bc {
  color: rgba(var(--b-sc), 0.7);
  font-variant-numeric: tabular-nums;
}
#root .c-segment-holder-bc:not(.competition-title) .c-row-bc:is(:hover, .selected) {
  background: rgba(var(--b-sc), 0.03);
}

/* Results */
#root :is(.results-info-bc, .results-footer-bc) {
  background: rgba(var(--b-sc), 0.035);
}
#root .results-info-bc {
  border: 1px solid var(--by-line);
  border-bottom: 0;
}
#root .results-footer-bc {
  border: 1px solid var(--by-line);
  border-top: 0;
}
#root .result-roundId {
  color: rgba(var(--b-sc), 0.7);
  background: rgba(var(--b-sc), 0.06);
}
#root .c-segment-holder-bc .c-odd-bc {
  padding: 8px 2px;
}
#root .c-segment-holder-bc .c-odd-bc > .market-bc {
  border-radius: 8px;
}
#root .results-block-bc {
  background: transparent;
}
#root .results-teams-name-bc {
  color: rgb(var(--b-sc));
  font-size: 13px;
  font-weight: 500;
  line-height: 16px;
}
#root .results-container-bc .second-tabs-bc .tab-bc {
  font-size: 12px;
  text-transform: uppercase;
}
#root :is(.results-details-bc, .results-footer-date-bc) {
  color: rgba(var(--b-sc), 0.62);
  font-size: 11px;
  font-variant-numeric: tabular-nums;
}

/* Side tool panel */
#root .hdr-smart-panel-holder-bc {
  overflow: hidden;
  border-radius: 12px;
  background: rgb(var(--by-surface));
  box-shadow: var(--by-shadow-menu), 0 0 0 1px var(--by-line);
}
#root .sp-button-bc {
  color: rgba(var(--b-sc), 0.7);
  background: transparent;
}
#root .sp-button-bc:is(:hover, .active) {
  color: rgb(var(--b-sc));
  background: rgba(var(--b-sc), 0.06);
}

/* Field errors: red outline and a plain red line, no tinted box */
#root .form-control-bc.invalid :is(.form-control-input-bc, .form-control-textarea-bc, .form-control-select-bc) {
  border-color: rgb(var(--oc-3));
  color: rgb(var(--b-sc));
}
#root .form-control-bc.invalid.focused :is(.form-control-input-bc, .form-control-textarea-bc, .form-control-select-bc) {
  box-shadow: 0 0 0 3px rgba(var(--oc-3), 0.18);
}
#root .form-control-message-bc,
#root .entrance-form-bc .entrance-f-item-bc:not(.license-message):not(.authPopupInfoText):not(.recaptcha-field) .entrance-f-error-message-bc {
  padding: 6px 2px 0;
  border-radius: 0;
  color: rgb(var(--error));
  background: transparent;
  font-size: 12px;
}
#root .validation-content {
  border: 1px solid var(--by-line);
  border-radius: 10px;
  background: rgba(var(--b-sc), 0.03);
}

/* Tabs that sit on top of a list */
#root .main-tabs-bc:not(.casinoTopWinnersWidgetTab) {
  height: 44px;
  background: transparent;
  box-shadow: inset 0 -1px 0 var(--by-line);
}
#root .main-tabs-bc .tab-bc {
  color: rgba(var(--b-sc), 0.55);
  font-size: 13px;
  font-weight: 600;
}
#root .main-tabs-bc .tab-bc.active {
  color: rgb(var(--b-sc));
  box-shadow: inset 0 -2px 0 rgb(var(--hero));
}
#root .back-nav-bc {
  background: transparent;
  box-shadow: inset 0 -1px 0 var(--by-line);
}

/* Filter pills (tournaments) follow the casino chips */
#root .casinoTournamentTabItem {
  border-radius: 999px;
  color: rgba(var(--b-sc), 0.8);
  background-color: rgb(var(--by-surface));
  box-shadow: inset 0 0 0 1px rgba(var(--b-sc), 0.12);
  font-size: 13px;
  font-weight: 600;
  letter-spacing: 0.02em;
  text-transform: uppercase;
}
#root .casinoTournamentTabItem:not(.active):hover {
  color: rgb(var(--b-sc));
  background-color: rgb(var(--by-surface));
  box-shadow: inset 0 0 0 1px rgba(var(--b-sc), 0.3);
}
#root .casinoTournamentTabItem.active {
  color: rgb(var(--by-inverse-sc));
  background-color: rgb(var(--by-inverse));
  box-shadow: none;
}

/* Casino placeholders and jackpot widgets */
#root .casinoGameItem {
  border-radius: 10px;
  background-color: rgba(var(--b-sc), 0.05);
}
#root .casino-jackpot-widget.casino-jackpot-widget--widget {
  border-color: var(--by-line);
  border-radius: 12px;
  background: rgb(var(--by-surface));
}
#root .jackpot-pool {
  border-radius: 12px;
  background: rgb(var(--by-surface));
  box-shadow: inset 0 0 0 1px var(--by-line);
}
#root .bbAiRecBetsItem {
  background-image: none;
  backdrop-filter: none;
}
#root .ds-textfield.ds-textfield--focused .ds-textfield__field {
  background: rgb(var(--by-surface));
  box-shadow: inset 0 0 0 1px rgb(var(--hero)), 0 0 0 3px rgba(var(--hero), 0.28);
}
#root .casinoTournamentInnerDateInner {
  border: 0;
  border-radius: 12px;
  background: rgb(var(--by-surface));
  backdrop-filter: none;
  box-shadow: 0 0 0 1px var(--by-line);
}
#root .casino-tournament-header-title {
  font-size: 13px;
  font-weight: 700;
}
#root .e-sports-match-header .form-control-select-bc {
  border-radius: 8px;
  background: rgba(var(--b-sc), 0.05);
}
#root .btn.width-auto:not(.a-color) {
  color: rgb(var(--b-sc));
  background: rgb(var(--by-surface));
  box-shadow: inset 0 0 0 1px rgba(var(--b-sc), 0.16);
}
#root .btn.width-auto:not(.a-color):hover {
  box-shadow: inset 0 0 0 1px rgba(var(--b-sc), 0.4);
}
#root .checkbox-control-input-bc:not(:checked) ~ .checkbox-control-icon-bc {
  background: rgb(var(--by-surface));
  box-shadow: inset 0 0 0 1.5px rgba(var(--b-sc), 0.3);
}
#root .form-control-bc.s-small:not(.compact-mode) .form-control-select-bc {
  border-radius: 8px;
  background: rgba(var(--b-sc), 0.05);
}

/* Account panel: sidebar */
#root .u-i-profile-page-container {
  background: rgb(var(--by-surface));
  box-shadow: inset -1px 0 0 var(--by-line);
}
#root .u-i-p-a-content-bc {
  box-shadow: none;
}
#root .u-i-p-a-content-bc:before {
  display: none;
}
#root .u-i-p-amounts-bc.withdrawable .u-i-p-a-content-bc {
  background: rgb(17, 19, 24);
}
#root .u-i-p-a-content-bc .u-i-p-a-title-bc {
  color: rgba(255, 255, 255, 0.6);
  font-size: 12px;
  font-weight: 600;
  letter-spacing: 0.04em;
}
#root .u-i-p-a-amount-bc {
  font-size: 22px;
  font-variant-numeric: tabular-nums;
}
#root .u-i-p-a-deposit-bc {
  background: rgb(var(--by-green));
}
#root .u-i-p-a-deposit-bc:hover {
  background: rgb(var(--by-green-hover));
}
#root .u-i-p-a-withdraw-bc {
  background: rgba(255, 255, 255, 0.12);
}
#root .u-i-p-a-withdraw-bc:hover {
  background: rgba(255, 255, 255, 0.2);
}
#root .u-i-p-amounts-bc.bonuses .u-i-p-a-content-bc {
  border: 1px solid var(--by-line);
  color: rgb(var(--b-sc));
  background: rgb(var(--by-surface));
}
#root .u-i-p-amounts-bc.bonuses .u-i-p-a-title-bc,
#root .u-i-p-amounts-bc.bonuses .bonus-info-section span {
  color: rgba(var(--b-sc), 0.6);
}
#root .u-i-p-amounts-bc.bonuses :is(.u-i-p-a-amount-bc, .bonus-info-section b) {
  color: rgb(var(--b-sc));
}
#root .u-i-p-amounts-bc.bonuses .bonus-info-section {
  border-color: var(--by-line);
}
#root .u-i-p-a-loyaltyPoint-bc {
  border: 1px solid var(--by-line);
  background: #fff !important;
}
#root .u-i-p-a-loyaltyPoint-bc .u-i-p-a-loyaltyPointText-bc {
  color: rgb(var(--b-sc));
  font-weight: 600;
}
#root .user-profile-nav {
  margin-top: 0;
  border-radius: 0;
  box-shadow: inset 0 -1px 0 var(--by-line);
}
#root .user-profile-nav-header {
  border-radius: 0;
  background: transparent;
}
#root .user-profile-nav-header:hover {
  background: rgba(var(--b-sc), 0.035);
}
#root .user-profile-nav-title {
  color: rgb(var(--b-sc));
  font-size: 13px;
  font-weight: 700;
}
#root .user-profile-nav-list {
  border-top: 0;
  background: transparent;
}
#root .user-profile-nav-item {
  color: rgba(var(--b-sc), 0.65);
}
#root .user-profile-nav-item.active {
  color: rgb(var(--b-sc));
  font-weight: 600;
}
#root .user-profile-nav-item-cursor.user-profile-cursor-visible:after {
  border-inline-start-color: rgb(var(--hero));
  background: rgba(var(--hero), 0.16);
}
#root .promoCodeWrapper-bc > form {
  padding: 0;
  border: 0;
  background: transparent;
}
#root .u-i-profile-page-content .userLogoutBtn {
  border: 1px solid var(--by-line);
  background: transparent;
}
#root .u-i-profile-page-content .userLogoutBtn:hover {
  background: rgba(var(--b-sc), 0.04);
}

/* Account panel: content */
#root .my-profile-info-block > .overlay-header {
  border-bottom: 1px solid var(--by-line);
  background: rgb(var(--by-surface));
  font-size: 15px;
  font-weight: 700;
}
#root .dep-w-info-bc .horizontal-sl-item-bc:not(:empty) {
  box-shadow: inset 0 0 0 1px rgba(var(--b-sc), 0.12);
}
#root .dep-w-info-bc .horizontal-sl-item-bc.active {
  color: rgb(var(--by-inverse-sc));
  background: rgb(var(--by-inverse));
  box-shadow: none;
}
#root .dep-w-info-bc .horizontal-sl-item-bc.active :is(p, i) {
  color: #fff;
}
#root .dep-w-info-bc .horizontal-sl-item-bc.active:before {
  display: none;
}
#root .dep-w-info-bc .m-nav-items-list-item-bc {
  border: 1px solid var(--by-line);
  border-radius: 10px;
  background: rgb(var(--by-surface));
}
#root .dep-w-info-bc .m-nav-items-list-item-bc:hover {
  border-color: rgba(var(--b-sc), 0.3);
  background: rgb(var(--by-surface));
}
#root .dep-w-info-bc .m-nav-items-list-item-bc.active {
  border-color: rgb(var(--hero));
  background: rgba(var(--hero), 0.1);
  box-shadow: inset 0 0 0 1px rgb(var(--hero));
}
#root .payment-info-bc {
  border: 1px solid var(--by-line);
  border-radius: 12px;
  background: rgb(var(--by-surface));
}
#root .description-c-row-bc {
  background: rgba(var(--b-sc), 0.035);
}
#root .description-c-row-bc .description-title {
  color: rgba(var(--b-sc), 0.6);
  font-size: 11px;
  font-weight: 600;
  text-transform: uppercase;
}
#root .description-c-row-bc .description-value {
  color: rgb(var(--b-sc));
  font-weight: 600;
}
#root .expandableContentWrapper {
  background: transparent;
}
#root .WithdrawAmount-Row:nth-child(odd) {
  background: rgba(var(--b-sc), 0.035);
}
#root .WithdrawAmount-Row:nth-child(2n) {
  background: transparent;
}
#root :is(.WithdrawAmount-Row-Value, .WithdrawAmount-Row-ValueBalance) {
  font-weight: 600;
  font-variant-numeric: tabular-nums;
}
#root .u-i-common-content .entrance-f-error-message-bc {
  padding: 8px 12px;
  border-radius: 8px;
  color: rgb(var(--b-sc));
  background: rgba(var(--hero), 0.14);
  text-align: start;
  justify-content: flex-start;
  font-size: 13px;
  font-weight: 600;
}
#root .radio-control-input-holder-bc {
  border-color: rgba(var(--b-sc), 0.3);
  background: rgb(var(--by-surface));
}
#root .radio-control-input-bc:checked ~ .radio-control-input-holder-bc {
  border-color: rgb(var(--hero));
}
#root .radio-control-text-bc {
  font-weight: 500;
}
#root .form-control-label-file-bc {
  border: 1px solid rgba(var(--b-sc), 0.16);
  background: rgb(var(--by-surface));
}
#root .u-i-e-v-a-t-title-bc {
  padding: 0 0 8px;
  border-top: 0;
  border-bottom: 1px solid var(--by-line);
  color: rgb(var(--b-sc));
  font-size: 13px;
  font-weight: 700;
}
#root .historyList-thead .historyListEl-list-item {
  color: rgba(var(--b-sc), 0.55);
  background: rgba(var(--b-sc), 0.035);
  font-size: 11px;
  font-weight: 600;
  text-transform: uppercase;
}
#root .historyList-tbody > .historyListEl .historyListEl-list-item {
  background: transparent;
  box-shadow: inset 0 -1px 0 var(--by-line);
}
#root .verify-icons-content > .verify-icons {
  background: rgba(var(--b-sc), 0.05);
}

/* Loyalty page */
/* the level colours arrive inline from the loyalty settings, so only !important reaches them */
#root .loyaltyProgramSection {
  overflow: hidden;
  border: 1px solid var(--by-line);
  border-radius: 16px;
  background: #fff !important;
}
#root :is(.loyaltyProgramImg, .loyaltyProgramInfoRight) {
  border-color: rgba(255, 255, 255, 0.1);
  border-radius: 12px;
  background: rgba(255, 255, 255, 0.06);
}
#root .loyaltyProgressBar {
  border: 0;
  background: rgba(255, 255, 255, 0.16);
}
#root .loyalProgressBarStick {
  background: rgb(var(--hero)) !important;
}
#root .loyalProgressBarStick:after {
  display: none;
}
#root :is(.loyaltyCardItem, .loyaltyLevelTable, .loyaltyLevelContent) {
  border-color: var(--by-line);
  border-radius: 12px;
  background: rgb(var(--by-surface));
}
#root .loyaltyLevelTableHeader {
  background: rgba(var(--b-sc), 0.035);
}
#root .loyaltyLevelTableBody {
  background: transparent;
}
#root .loyaltyCurrentRowBorder {
  background: rgb(var(--hero)) !important;
}
#root .loyaltyHorizontalList {
  border-color: var(--by-line);
  background: rgb(var(--by-surface));
}
#root .loyaltySliderCard.active {
  background: rgba(var(--hero), 0.18) !important;
}
#root .loyaltySliderCard.active:after {
  display: none;
}
#root .loyaltySliderCardInfo {
  border-color: var(--by-line) !important;
  color: rgb(var(--b-sc));
  background: #fff !important;
  box-shadow: none !important;
}
#root .loyaltySliderCardTitle::after {
  -webkit-text-fill-color: rgb(var(--b-sc));
  -webkit-text-stroke-color: transparent;
  background: none;
}

/* Logged-in header: balance, avatar and their menus */
#root .header-user-nav > .nav-menu-other > li > a {
  border-top-color: transparent !important;
}
#root .header-user-nav > .nav-menu-other > li:hover > a {
  border-radius: 8px;
  background: rgba(var(--b-sc), 0.05);
}
#root .hdr-user-info-texts-bc.ext-1 {
  font-size: 13px;
  font-weight: 700;
  font-variant-numeric: tabular-nums;
}
#root .avatarHolderImg.user-verified {
  box-shadow: 0 0 0 2px rgb(var(--by-green));
}
#root .hdr-user-avatar-icon-bc.user-verified {
  color: rgb(var(--by-green));
  text-shadow: none;
}
#root .header-user-nav .nav-menu-sub {
  padding: 6px;
  border-radius: 12px;
  background: rgb(var(--by-surface));
  box-shadow: var(--by-shadow-menu), 0 0 0 1px var(--by-line);
}
#root .header-user-nav .nav-menu-sub .nav-menu-item {
  border-radius: 8px;
  color: rgba(var(--b-sc), 0.8);
  background: transparent;
  font-size: 13px;
  font-weight: 600;
}
#root .header-user-nav .nav-menu-sub .nav-menu-item:hover {
  color: rgb(var(--b-sc));
  background: rgba(var(--b-sc), 0.05);
}
#root .header-user-nav .nav-menu-sub .userLogoutBtn,
#root .header-user-nav .nav-menu-sub .btn {
  border: 1px solid var(--by-line);
  border-radius: 8px;
  background: transparent;
}

/* Side panel (notifications, favourites, settings) */
#root .sidePanel-holder .overlay-header {
  border-bottom: 1px solid var(--by-line);
  font-size: 15px;
  font-weight: 700;
}
#root .notification-new-item {
  margin: 0;
  border-radius: 0;
  background: transparent;
  box-shadow: inset 0 -1px 0 var(--by-line);
}
#root .notification-new-item:hover {
  background: rgba(var(--b-sc), 0.035);
}
#root .notification-new-item-info {
  color: rgb(var(--b-sc));
  font-weight: 500;
}
#root .notification-new-header {
  color: rgba(var(--b-sc), 0.55);
  font-size: 12px;
  font-weight: 600;
}

/* The platform's own green (success, won, live status) becomes the theme green */
/* the platform marks this status colour !important */
#root [data-status="1"] {
  color: rgb(var(--by-green)) !important;
}
#root :is(.validation-content .bc-i-checked, .betslip-success-message .bs-notification-icon-bc, .account-verified-icon, .betStatus-search-cashOut) {
  color: rgb(var(--by-green));
}
#root :is(.validation-content .valid, .status-completed),
#root .betHistoryBBEventBetsRowBefore > i[class*="won"]:before {
  background: rgb(var(--by-green));
}
#root .betslip-success-message {
  background: rgba(var(--by-green), 0.14);
}

/* ===== From the file-by-file review of every platform stylesheet ===== */

/* Bet slip: extra functions, lucky boost, suggested bets, express of the day, low balance */
/* the blurred copy of the shirt behind each kit glows in the team colour */
#root .bbAiRecBetsItem__kitBg {
  display: none;
}
#root :is(.bbAiRecBetsItem__header, .bbAiRecBetsItem__footer) {
  border-color: var(--by-line);
}
/* the platform sets the market lines in italic */
#root :is(.bbAiRecBetsItem__marketLabel, .bbAiRecBetsItem__marketValue) {
  font-style: normal;
}
#root .bbAiRecBetsItem__scrollThumb {
  background: rgba(var(--b-sc), 0.2);
}
#root :is(.bbAiRecBetsItem__marketsValue, .bbAiRecBetsItem__oddsValue) {
  font-variant-numeric: tabular-nums;
}
#root .multipleSystemOptions {
  border-radius: 10px;
  background: rgba(var(--b-sc), 0.04);
}
#root .multipleSystemTotals {
  border-bottom-color: var(--by-line);
}
#root .multipleSystemTotalsValue {
  font-variant-numeric: tabular-nums;
}
#root .error-page-info {
  color: rgba(var(--b-sc), 0.6);
}
#root .betslip-full-content-bc .bet-slip-switcher-row-bc {
  background: rgba(var(--b-sc), 0.04);
}
/* active rows were lit by a purple gradient layer; an ink row keeps the platform's white text */
#root .bet-slip-switcher-row-bc:before {
  display: none;
}
#root .betslip-full-content-bc .bet-slip-switcher-row-bc.active:not(.quickBet) {
  background: rgb(var(--by-inverse));
}
#root .betslip-full-content-bc .bet-slip-switcher-row-bc.quickBet.active {
  background: rgb(var(--hero));
}
#root .bet-slip-switcher-row-bc.active:not(.quickBet) .bet-slip-s-r-i-c-info-icon-bc {
  color: rgba(255, 255, 255, 0.7);
}
#root .bet-slip-switcher-row-bc.active:not(.quickBet) .bet-slip-s-r-i-c-info-icon-bc:is(:hover, .active) {
  color: #fff;
}
#root .betslip-full-content-bc .betslip-power-bank-switcher {
  background-color: rgba(var(--b-sc), 0.04);
}
#root .betslip-power-bank-switcher--active {
  background-image: none;
}
#root .betslip-full-content-bc .betslip-power-bank-switcher--active {
  background-color: rgba(var(--hero), 0.14);
  box-shadow: inset 3px 0 0 rgb(var(--hero));
}
/* the logo is drawn white for dark panels; on the light betslip it is turned dark */
#root .betslip-full-content-bc .betslip-power-bank-switcher__logo {
  filter: invert(1) hue-rotate(180deg);
}
#root .betslip-lucky-boost {
  background-image: none;
}
#root .betslip-lucky-boost__visual:before {
  display: none;
}
/* these sit on the dark animation, where the theme's ink text vanishes */
#root :is(.betslip-lucky-boost__bubble, .betslip-lucky-boost__tap, .betslip-lucky-boost__multiplier, .betslip-lucky-boost__odds-face) {
  color: #fff;
  background: rgba(17, 19, 24, 0.64);
  backdrop-filter: none;
}
#root .betslip-lucky-boost__odds-value {
  color: rgb(var(--hero));
}
#root :is(.betslip-lucky-boost__odds-title, .betslip-lucky-boost__odds-value--initial) {
  color: rgba(255, 255, 255, 0.7);
}
#root .betslip-lucky-boost__amount--after {
  background: rgba(var(--hero), 0.14);
}
#root :is(.betslip-lucky-boost__amount-value--before, .betslip-lucky-boost__amount-value--boosted) {
  font-variant-numeric: tabular-nums;
}
#root .betslip-suggested {
  border-bottom-color: var(--by-line);
}
#root .betslip-suggested-icon {
  color: rgb(var(--oc-3));
}
/* the platform writes live scores in the brand yellow, which vanishes on white */
#root .betslip-team-score {
  color: rgb(var(--b-sc));
  font-variant-numeric: tabular-nums;
}
#root .expressWidgetTitle {
  color: rgb(var(--b-sc));
  font-weight: 600;
}
#root .expressWidgetMarketOdd {
  color: rgb(var(--b-sc));
  font-weight: 600;
  font-variant-numeric: tabular-nums;
}
#root .expressWidgetAddToBetslip button {
  border-top: 0;
  box-shadow: inset 0 0 0 1px rgba(var(--b-sc), 0.16);
  font-weight: 600;
}
#root .expressWidgetAddToBetslip button:before {
  background: transparent;
}
#root .expressOfTheDayBetslip .bs-bet-i-h-c-icon-holder-bc {
  background: rgba(var(--b-sc), 0.06);
}
#root .expressWidgetAddToBetslip button:not(:disabled):hover {
  box-shadow: inset 0 0 0 1px rgba(var(--b-sc), 0.4);
}
#root .multi-column-content .multi-column-base {
  border-color: rgba(var(--b-sc), 0.12);
  font-variant-numeric: tabular-nums;
}
/* the popup's only action is a deposit, which the theme paints green */
#root .lowBalancePopupContent .btn.a-color:not(:disabled) {
  color: #fff;
  background: rgb(var(--by-green));
}
#root .lowBalancePopupContent .btn.a-color:not(:disabled):hover {
  background: rgb(var(--by-green-hover));
}
#root .left-menu-scroll .v-checkbox .sp-s-l-h-title-content:before {
  border-radius: 4px;
  background: rgb(var(--by-surface));
  box-shadow: inset 0 0 0 1.5px rgba(var(--b-sc), 0.3);
}
#root .left-menu-scroll .v-checkbox.checked .sp-s-l-h-title-content:before {
  background: rgb(var(--hero));
  box-shadow: none;
}
#root .popular-bets-table-row {
  margin-bottom: 0;
  border-radius: 0;
  box-shadow: inset 0 -1px 0 var(--by-line);
}
#root .popular-bets-table-row:not(.popular-bets-table-header):hover {
  background: rgba(var(--b-sc), 0.025);
}
#root .popular-bets-table-head-cell {
  color: rgba(var(--b-sc), 0.55);
  background: rgba(var(--b-sc), 0.035);
  font-size: 11px;
  font-weight: 600;
  text-transform: uppercase;
}
#root .popular-bets-table-body-cell {
  background: transparent;
}
#root .popular-bets-bet {
  font-weight: 600;
  font-variant-numeric: tabular-nums;
}

/* Bet history, open bets and the account panel bundle */
/* Lucky boost in bet history: flat panel, the yellow badge carries the accent; no 3D ball, no glow */
#root :is(.bet-history-possible-win-block.lucky-boosted, .bet-history-lucky-boost-widget, .bet-history-lucky-boost-row) {
  border: 1px solid var(--by-line);
  border-radius: 10px;
  background: rgba(var(--b-sc), 0.03);
}
#root :is(.bet-history-lucky-boost-row__cell, .betHistoryListEl-lucky-boost-cell .bet-history-possible-win-block:not(.lucky-boosted)) {
  background: transparent;
}
#root .bet-history-lucky-boost-row__cell + .bet-history-lucky-boost-row__cell {
  box-shadow: inset 1px 0 0 var(--by-line);
}
#root .bet-history-lucky-boost-widget__badge {
  border-radius: 6px;
  color: rgb(var(--hero-sc));
  background: rgb(var(--hero));
}
#root .bet-history-lucky-boost-widget__badge:after,
#root .bet-history-lucky-boost-ball :is(.bet-history-lucky-boost-ball__sphere, .bet-history-lucky-boost-ball__glow) {
  display: none;
}
#root .bet-history-lucky-boost-ball__value {
  padding: 2px 0;
  border-radius: 999px;
  color: rgb(var(--hero-sc));
  background: rgb(var(--hero));
  text-shadow: none;
  font-variant-numeric: tabular-nums;
}
#root :is(.bet-history-lucky-boost-win__value, .bet-history-lucky-boost-widget__odds-value, .bet-history-lucky-boost-row__new) {
  font-weight: 700;
  font-variant-numeric: tabular-nums;
}
/* Account: deposit/withdraw notice and KYC upload */
#root .payment-method-info-wrapper {
  border: 1px solid var(--by-line);
  border-radius: 12px;
  background: rgb(var(--by-surface));
}
#root .payment-method-info-header {
  box-shadow: inset 0 -1px 0 var(--by-line);
}
#root .KYCVerifyPopupFieldsItem {
  border-radius: 10px;
}
#root .fileUploadWrapper {
  border-radius: 10px;
  background: rgba(var(--b-sc), 0.05);
}
#root .KYCVerifyUploadFile {
  border-color: rgba(var(--b-sc), 0.24);
  border-radius: 12px;
}
#root .fileUploadTextUpload {
  color: rgb(var(--b-sc));
  text-decoration: underline;
  text-decoration-color: rgb(var(--hero));
  text-decoration-thickness: 2px;
  text-underline-offset: 3px;
}
#root .documentIcon svg {
  fill: rgba(var(--b-sc), 0.55);
}
#root .CheckCircleIcon {
  color: rgb(var(--by-green));
}

/* Bonuses: white cards, progress in brand yellow (track and fill were both ink), statuses in the palette */
#root .sportBonusListEl-bc {
  border: 1px solid var(--by-line);
  border-radius: 12px;
  background: rgb(var(--by-surface));
}
#root :is(.sportBonusWagerBonusProgressBar-bc, .bonus-achievement-progressBar) {
  background: rgba(var(--b-sc), 0.08);
}
#root :is(.sportBonusWagerBonusProgressBarPassed-bc, .bonus-achievement-progressBar-passed) {
  background: rgb(var(--hero));
}
/* the fund bar shows two shares, not progress: the bar is the withdrawable share, its inner part the bonus share */
#root .sportBonusFundProgressBar-bc {
  background: rgb(var(--hero));
}
#root .sportBonusFundProgressBarPassed-bc {
  background: rgb(var(--by-inverse));
}
#root .bonus-achievement-single-step .radio-control-bc:not(.is-passed) + .bonus-achievement-progressBar .bonus-achievement-progressBar-passed {
  background: rgba(var(--hero), 0.4);
}
#root .sportBonus-value.Pending {
  color: rgba(var(--b-sc), 0.55);
}
#root .sportBonus-value.Approved {
  color: rgb(var(--by-green));
}
#root .sportBonus-value.Rejected {
  color: rgb(var(--oc-3));
}
#root .separately-bonuses .sport-casino-bonus-container {
  border-radius: 12px;
  background: rgba(var(--b-sc), 0.04);
}

/* Bonus, free-spin and bonus-request tables: light header band and hairline rows instead of grey cells */
#root :is(.bonusList-thead .bonusListEl-list-item, .freeSpinsList-thead .freeSpinsListEl-list-item, .bonusRequest-thead .bonusRequestListEl-list-item) {
  color: rgba(var(--b-sc), 0.55);
  background: rgba(var(--b-sc), 0.035);
  font-size: 11px;
  font-weight: 600;
  text-transform: uppercase;
}
#root .bonusRequest-thead .bonusRequesEl,
#root :is(.bonusList-tbody .bonusListEl-list-item, .bonusListEl-list-item[data-status], .freeSpins-tbody .freeSpinsListEl-list-item, .bonus-request .sportBonusListTable-bc ul) {
  background: transparent;
}
#root :is(.bonusList-tbody .bonusListEl, .freeSpins-tbody .freeSpinsListEl, .bonus-request .sportBonusListTable-bc) {
  border-radius: 0;
  box-shadow: inset 0 -1px 0 var(--by-line);
}
#root .sportBonusDetailsItemWrapper-bc {
  border-radius: 0 0 12px 12px;
  background: rgba(var(--b-sc), 0.03);
}
#root :is(.bonusEligibleGames, .loyaltyPointsCurrentPlanBlock-bc) {
  border-radius: 12px;
  background: rgba(var(--b-sc), 0.03);
}
#root :is(.sportBonusDetailsTablesItem-bc, .client_bonus_expiration_date) .countdown-banner-content {
  border-color: var(--by-line);
  background: rgba(var(--b-sc), 0.04);
  backdrop-filter: none;
  box-shadow: none;
}

/* Balance details inside a transaction */
#root .balance-thead-item {
  color: rgba(var(--b-sc), 0.55);
  background: rgba(var(--b-sc), 0.035);
  font-weight: 600;
}
#root .balance-tbody-item {
  background: transparent;
  box-shadow: inset 0 -1px 0 var(--by-line);
}
#root .balanceHistoryDetails {
  background: rgba(var(--b-sc), 0.03);
}
#root .balanceHistoryItem-expand-button {
  background: transparent;
}

/* Loyalty: progress in brand yellow whatever the level, flat cards (the old points page too) */
#root .loyaltyPointsCurrentPlanProgressBar-bc:after {
  background: rgba(var(--b-sc), 0.08);
}
#root .loyalProgressBarStick-bc:after {
  background: rgb(var(--hero));
}
#root .loyalProgressBarNumPar-bc span {
  border-radius: 999px;
  color: rgb(var(--by-inverse-sc));
  background: rgb(var(--by-inverse));
  font-variant-numeric: tabular-nums;
}
#root :is(.loyaltyMedalSliderElBody-bc, .loyaltyExchangeShopItem) {
  border: 1px solid var(--by-line);
  border-radius: 12px;
  background: rgb(var(--by-surface));
}
#root .loyaltyMedalSliderElBody-bc:after {
  display: none;
}
#root .cashbackVaultBoxesInLoyalty {
  border: 1px solid var(--by-line);
  border-radius: 12px;
}
#root .isActivated {
  color: rgb(var(--by-green));
}
#root .loyaltyUserBenefits .horizontalSliderNav:before {
  border-color: var(--by-line);
  background: rgb(var(--by-surface));
  box-shadow: 0 1px 3px rgba(17, 19, 24, 0.12);
}

/* Exchange-shop collections and the sports reel banner: no glow, no gradient, no blur */
#root .ortakCollectionTitle {
  text-shadow: none;
}
#root :is(.ortakCollectionItem, .sports-reel-info-widget) {
  border: 1px solid var(--by-line);
  border-radius: 12px;
  background: rgb(var(--by-surface));
}
#root .ortakCollectionItemInner {
  background: none;
}
#root :is(.sports-reel-info-widget__glow-start, .sports-reel-info-widget__glow-center, .sports-reel-info-widget__glow-end, .sports-reel-achievement-card__glow) {
  display: none;
}
#root .sports-reel-achievement-card {
  border-color: var(--by-line);
  background: rgba(var(--b-sc), 0.03);
  backdrop-filter: none;
}
#root .sports-reel-achievement-card__progress-fill {
  background: rgb(var(--hero));
}
/* Transaction and payment history: the platform paints every amount #fdbc0c */
#root .historyListEl-info[data-cur] {
  color: rgb(var(--b-sc));
  font-weight: 600;
  font-variant-numeric: tabular-nums;
}
#root .ReferralItem-El .historyListEl-list-item {
  background: transparent;
  box-shadow: inset 0 -1px 0 var(--by-line);
}

/* Power Bank offer inside a bet: flat panel instead of the green and pink gradients */
#root :is(.casino-borrow-possible-win-widget, .casino-borrow-possible-win-widget-wide) {
  border: 1px solid var(--by-line);
  border-radius: 10px;
  background: rgb(var(--by-surface));
}
#root .power-bank-bets-details-row {
  border-color: var(--by-line);
  background: rgb(var(--by-surface));
}
#root .power-bank-bets-details-row:hover {
  background: rgba(var(--b-sc), 0.03);
}
#root .power-bank-borrowed-bet {
  border: 1px solid var(--by-line);
  border-radius: 12px;
  background: rgb(var(--by-surface));
}
#root :is(.power-bank-borrowed-bet__row, .power-bank-borrowed-bet-ticket__section) {
  border-bottom-color: rgba(var(--b-sc), 0.12);
}
#root .power-bank-borrowed-bet-ticket {
  border-radius: 10px;
  background: rgba(var(--b-sc), 0.04);
}
#root .alreadyEarnedJetPointPopup__status {
  background: rgba(var(--by-green), 0.14);
}
#root .alreadyEarnedJetPointPopup__status-icon {
  color: rgb(var(--by-green));
}
#root .alreadyEarnedJetPointPopup__banner {
  background: rgba(var(--b-sc), 0.04);
}
/* Open bets in the bet slip (and bet status): white cards on hairlines instead of grey boxes */
#root :is(.open-bets, .betstatus-content) .bet-history-t-holder-hk-bc {
  margin-bottom: 8px;
  padding: 12px;
  border: 1px solid var(--by-line);
  border-radius: 12px;
  background: rgb(var(--by-surface));
}
#root :is(.open-bets, .betstatus-content) .bet-history-t-holder-hk-bc > div + div {
  border-top-color: var(--by-line);
}
#root :is(.open-bets, .betstatus-content) .bet-history-t-holder-hk-bc .bet-history-t-holder-hk-bc {
  margin: 0;
  padding: 10px 0;
  border: 0;
  border-radius: 0;
  background: transparent;
  box-shadow: inset 0 -1px 0 var(--by-line);
}
#root :is(.open-bets, .betstatus-content) .bet-history-t-holder-hk-bc .bet-history-t-holder-hk-bc:last-child,
#root :is(.open-bets, .betstatus-content) .bet-history-t-holder-hk-bc .competition-header-bc[aria-expanded="false"] {
  box-shadow: none;
}
#root :is(.open-bets, .betstatus-content) .bet-history-t-holder-hk-bc .competition-header-bc {
  padding: 0;
}

/* Bet history and profit tables: light header band, rows on hairlines instead of grey cells */
#root .betHistoryList-thead .betHistoryListEl-list-item {
  color: rgba(var(--b-sc), 0.55);
  background: rgba(var(--b-sc), 0.035);
  font-size: 11px;
  font-weight: 600;
  text-transform: uppercase;
}
/* the stake column is too narrow for its uppercase title, so titles wrap instead of being cut */
#root .betHistoryList-thead .betHistoryListEl-list-item > p {
  white-space: normal;
}
#root .betHistoryList-tbody .betHistoryListEl {
  border-bottom: 0;
  border-radius: 0;
  box-shadow: inset 0 -1px 0 var(--by-line);
}
#root .betHistoryList-tbody .betHistoryListEl:hover {
  background: rgba(var(--b-sc), 0.025);
}
#root :is(.betHistoryList-tbody .betHistoryListEl-list-item, .betHistoryList-tbody .betHistoryListEl-borrow-cell, .casinoProfit-row .bet-history-stake-odds) {
  background: transparent;
}
#root :is(.bet-history-odds-coeff, .bet-history-possible-win, .bet-history-stake-money) {
  font-weight: 600;
  font-variant-numeric: tabular-nums;
}
#root .dataListEl-open {
  margin-bottom: 8px;
  border-radius: 10px;
  background: rgba(var(--b-sc), 0.03);
  box-shadow: none;
}
#root .dataListEl-open .bet-history-match-result {
  border-radius: 8px;
  background: rgb(var(--by-surface));
  box-shadow: inset 0 0 0 1px var(--by-line);
}
#root .details-table-thead {
  border-radius: 8px;
  color: rgba(var(--b-sc), 0.55);
  background: rgba(var(--b-sc), 0.035);
  font-size: 11px;
  font-weight: 600;
  text-transform: uppercase;
}
#root .details-table-tbody-info {
  border-radius: 0;
  background: transparent;
  box-shadow: inset 0 -1px 0 var(--by-line);
}

/* Bet statuses: pending and returned in muted ink (the platform's gold is outside the palette) */
#root :is(.bet-history-status, .bethistoryListEl-item-status, .betHistoryListElId, .bet-history-warning-block) [data-status="2"],
#root :is(.bet-history-status, .historyListEl-info, .bonusListEl-list-item, .freeSpinsListEl-list-item)[data-status="2"] {
  color: rgba(var(--b-sc), 0.55);
}
#root .betHistoryBBEventBetsRowBefore > i[class*="returned"]:before {
  background: rgba(var(--b-sc), 0.45);
}
#root :is(.open-bets .bet-history-info-title-block.betbuilder, .betBuilderHistoryItemHolder .bet-history-info-title-block, .betBuilderHistoryItemHolder .bet-history-type) {
  color: rgb(var(--b-sc));
}

/* Bet-builder legs: light panels instead of grey boxes inside grey boxes */
#root .betHistoryBBIconWrapper {
  background: rgba(var(--b-sc), 0.06);
}
#root .betHistoryBBEventsContainer.isCompactView {
  padding: 4px 0;
  border-radius: 0;
  background: transparent;
}
#root :is(.betHistoryBBEventsItem, .betHistoryBBEventRow) {
  border-radius: 10px;
  background: rgba(var(--b-sc), 0.04);
}
#root .betHistoryBBEventsSectionCompact + .betHistoryBBEventsSectionCompact {
  border-top-color: var(--by-line);
}

/* Bet actions (repeat, edit, print, share) and the auto cash-out info button */
#root :is(.bet-history-actions i, .bet-history-social .bet-history-action-icon) {
  background: rgba(var(--b-sc), 0.05);
}
#root .bet-history-info-icon {
  color: rgba(var(--b-sc), 0.55);
}
#root .enableBetExplanationBtn {
  color: rgb(var(--b-sc));
  background: rgb(var(--by-surface));
  box-shadow: inset 0 0 0 1px rgba(var(--b-sc), 0.16);
}
#root :is(.bet-history-actions i, .bet-history-social .bet-history-action-icon):hover {
  background: rgba(var(--b-sc), 0.1);
}
#root .enableBetExplanationBtn:hover {
  box-shadow: inset 0 0 0 1px rgba(var(--b-sc), 0.4);
}

/* Account: payment methods, notifications, loyalty widgets, shared popups */
/* Design-system buttons stay flat: no light bevel along the top edge */
#root .ds-btn:after {
  border-top-color: transparent;
}

/* Sign-in / register popups: the header "Sign in" link becomes the same white button as the header one */
#root .e-p-header-bc .e-p-section-title-bc {
  height: 34px;
  padding: 0 16px;
  border-radius: 8px;
  color: rgb(var(--b-sc));
  background: rgb(var(--by-surface));
  box-shadow: inset 0 0 0 1px rgba(var(--b-sc), 0.2);
  font-size: 12px;
  font-weight: 700;
  line-height: 34px;
  letter-spacing: 0.02em;
  text-decoration: none;
}
#root .e-p-header-bc .e-p-section-title-bc:hover {
  box-shadow: inset 0 0 0 1px rgba(var(--b-sc), 0.5);
}
#root .sg-n-text-row-2-bc {
  font-weight: 700;
}
#root .reg-step-title-v-bc {
  color: rgba(var(--b-sc), 0.55);
  font-size: 12px;
  font-weight: 600;
  letter-spacing: 0.04em;
}

/* Two-factor code sheet: no frosted blur; the platform empties the box, so it gets the white surface back */
#root .popup-holder-bc.blocked {
  backdrop-filter: none;
}
#root .popup-holder-bc.blocked:not(.homework-popup) .popup-inner-bc {
  background: rgb(var(--by-surface));
}

/* Status popup icons: amber becomes the brand yellow, the platform green (set inside the SVG) becomes the theme green */
#root .popup-holder-bc:is(.warning, .pending) svg path {
  fill: rgb(var(--hero));
}
#root .popup-holder-bc.success .casino-popup-icon-wrapper svg path {
  fill: rgb(var(--by-green));
}
/* Loyalty page: exchange button, rewards dropdown and benefit cards */
#root .loyaltyPointsLevelBtn {
  height: 34px;
  padding: 0 16px;
  border-color: rgba(var(--b-sc), 0.16);
  border-radius: 8px;
  color: rgb(var(--b-sc));
  background: rgb(var(--by-surface));
  backdrop-filter: none;
  font-size: 13px;
  font-weight: 600;
}
#root :is(.loyaltyPointsNumbers, .loyaltyPointsLevelPoints) {
  font-variant-numeric: tabular-nums;
}
#root .loyaltyLevelCardsUserSelect .multi-select-label-bc {
  border: 0;
  backdrop-filter: none;
}
#root .loyaltyLevelCardsUserSelect .checkbox-control-content-bc {
  border-color: transparent;
  background: transparent;
}
#root .loyaltyCardItem.benefit-card-new .count-odd-animation:before {
  display: none;
}
#root .loyaltyCardItem.benefit-card-new .count-odd-animation:after {
  border-radius: 6px;
  font-weight: 700;
}
#root .loyaltyLevelCardsItem .horizontalList:is(.scroll-start, .scroll-end):before,
#root .loyaltyLevelCardsItem .horizontalList:is(.scroll-start, .scroll-end):after {
  background: none;
}
#root .loyaltyPointsLevelBtn:hover {
  border-color: rgba(var(--b-sc), 0.4);
}
#root .loyaltyCardItem:hover {
  border-color: rgba(var(--b-sc), 0.2);
}
/* "View more" rows on web read like the v1.2 section titles */
#root .page-view-more .view-title-more {
  color: rgb(var(--b-sc));
  font-size: 16px;
  font-weight: 700;
  letter-spacing: 0.01em;
}
#root .page-view-more .view-see-more {
  color: rgba(var(--b-sc), 0.64);
  font-weight: 600;
}
#root .page-view-more .view-see-more:hover {
  color: rgb(var(--b-sc));
}
/* Payment methods: one ink tag instead of coloured corner ribbons, wallet address states in the palette */
#root .paymentBadgeBlock:before {
  display: none;
}
#root .paymentBadgeBlock:after {
  border-radius: 6px;
  color: rgb(var(--by-inverse-sc));
  background: rgb(var(--by-inverse));
  box-shadow: none;
  font-weight: 600;
}
#root .deposit-wallet-field .bc-i-copy-icon.bc-i-checked {
  color: rgb(var(--by-green));
}
#root .expired-address-title {
  padding-inline-start: 0;
  color: rgb(var(--error));
  background: transparent;
  font-weight: 600;
}
#root .expired-address i {
  color: rgb(var(--oc-3));
}
#root :is(.amount-value-item, .depositInfoAmount) {
  font-variant-numeric: tabular-nums;
}
#root .description-c-row-column-bc.pay-logo:after {
  background: var(--by-line);
}
/* What's new list: a quiet bell, unread rows in ink and bold, the opened text on a light fill */
#root .notification-new-item-icon {
  color: rgba(var(--b-sc), 0.45);
}
#root .notification-new-item[data-status="unread"] .notification-new-item-icon {
  color: rgb(var(--b-sc));
}
#root .notification-new-item[data-status="unread"] .notification-new-item-info {
  font-weight: 600;
}
#root .notification-item-body > .entrance-f-item-bc .entrance-f-error-message-bc {
  padding: 10px 12px;
  border-radius: 10px;
  color: rgba(var(--b-sc), 0.8);
  background: rgba(var(--b-sc), 0.04);
  font-size: 13px;
  line-height: 1.45;
}

/* Account: profile, verification, two-step login, exchange shop */
/* Account panel: count badges sit before the chevron as a flat pill, no ribbon fold */
#root .user-profile-nav-header .count-odd-animation {
  position: static;
  margin-inline: 8px;
}
#root .user-profile-nav-header .count-odd-animation:before {
  display: none;
}
#root .user-profile-nav .count-odd-animation:after {
  inset: auto;
  width: auto;
  min-width: 18px;
  height: 18px;
  padding: 0 6px;
  border-radius: 999px;
  box-shadow: none;
  font-size: 11px;
  font-weight: 700;
  line-height: 18px;
  font-variant-numeric: tabular-nums;
}

/* Account panel: profile header, verification and two-step login */
#root .u-i-p-p-u-i-avatar-holder-bc {
  color: rgb(var(--b-sc));
  background: rgba(var(--b-sc), 0.06);
  box-shadow: inset 0 0 0 1px var(--by-line);
  font-weight: 700;
}
#root .u-i-p-p-u-i-d-user-id-bc .bc-i-checked,
#root .account-verified-edit-icon.bc-i-verified,
#root .eligible-bonus-status.green,
#root .authentication-key-code-button i.bc-i-checked:before {
  color: rgb(var(--by-green));
}
/* "Verify now" under an unverified account: a secondary button instead of the platform's red glow */
#root .account-verified-info .btn.account-verified-button {
  color: rgb(var(--b-sc));
  background: rgb(var(--by-surface));
  box-shadow: inset 0 0 0 1px rgba(var(--b-sc), 0.16);
  font-weight: 600;
}
#root .account-verified-info .btn.account-verified-button:hover {
  box-shadow: inset 0 0 0 1px rgba(var(--b-sc), 0.4);
}
#root .u-i-p-info-light-text-bc {
  font-size: 12px;
}
#root .bonus-request form {
  border: 1px solid var(--by-line);
  border-radius: 12px;
  background: rgb(var(--by-surface));
}
#root .authentication-block {
  border: 1px solid var(--by-line);
  border-radius: 12px;
  background: rgb(var(--by-surface));
}
#root .authentication-popup .form-control-label-bc input {
  border: 1px solid rgba(var(--b-sc), 0.16);
  background: rgb(var(--by-surface));
  font-weight: 600;
  font-variant-numeric: tabular-nums;
}
#root .authentication-popup .form-control-label-bc input:focus {
  border-color: rgb(var(--hero));
  background: rgb(var(--by-surface));
  box-shadow: 0 0 0 3px rgba(var(--hero), 0.28);
}
#root .authentication-qr-corners svg:not(.authentication-qr) g {
  fill: rgb(var(--b-sc));
}
#root .authentication-no-scan {
  color: rgb(var(--b-sc));
  text-decoration: underline;
  text-decoration-color: rgb(var(--hero));
  text-decoration-thickness: 2px;
  text-underline-offset: 3px;
  text-transform: none;
  font-weight: 600;
}
#root .btn.get-code-btn:not(:disabled) {
  color: rgb(var(--b-sc));
  background: rgb(var(--by-surface));
  box-shadow: inset 0 0 0 1px rgba(var(--b-sc), 0.16);
}
#root .btn.get-code-btn:not(:disabled):hover {
  box-shadow: inset 0 0 0 1px rgba(var(--b-sc), 0.4);
}

/* Avatar picker: hairline divider, light tiles, the chosen one ringed in yellow */
#root .avatarChooseWrapper:before {
  height: 1px;
  background: var(--by-line);
}
#root .avatarChooseWrapperImage {
  background: transparent;
}
#root .avatarChooseWrapperImage:not(.active):hover {
  background: rgba(var(--b-sc), 0.16);
}
#root .avatarChooseWrapperImage.active {
  background: rgb(var(--hero));
}
#root .avatarChooseImg {
  background: rgba(var(--b-sc), 0.05);
}
#root .avatarChooseImgDefault {
  border-color: rgba(var(--b-sc), 0.25);
  color: rgba(var(--b-sc), 0.7);
}
/* Bonus challenge steps: a finished step ticks in the theme green */
#root .bonus-achievement-body .is-passed .radio-control-input-holder-bc {
  border-color: rgb(var(--by-green));
}
#root .bonus-achievement-body .radio-control-input-holder-bc:after {
  color: rgb(var(--by-green));
}
/* Exchange shop: offers are white cards on a hairline, the shortfall note is a tinted notice */
#root .exchangeListEl {
  border: 1px solid var(--by-line);
  border-radius: 12px;
  background: rgb(var(--by-surface));
}
#root .exchangeListElInfo {
  background: transparent;
}
#root :is(.exchangeListElPts, .bonusExchangeInnerPts, .bonusExchangeInnerPts-bc) {
  font-variant-numeric: tabular-nums;
}
#root .bonusExchangeInnerPts-bc {
  font-weight: 700;
}
#root .bonusExchangeInnerThumbnailWrapper-bc {
  border-radius: 12px;
}
#root .bonusExchangeInnerAlertBox-bc {
  justify-content: flex-start;
  padding: 8px 12px;
  border-radius: 8px;
  color: rgb(var(--b-sc));
  background: rgba(var(--hero), 0.14);
  font-size: 13px;
  font-weight: 600;
}

/* Lists, match rows, buttons and radios */
/* Category chips (jackpot providers, tournament info boxes): white chips on hairlines, the chosen one ink */
#root .horizontalCategoryItemWrp {
  background: transparent;
}
#root .horizontalCategoryItem {
  border-radius: 12px;
  background-color: rgb(var(--by-surface));
  box-shadow: inset 0 0 0 1px var(--by-line);
}
#root .horizontalCategoryItem:before {
  background: transparent;
  backdrop-filter: none;
}
#root .horizontalCategoryItem > i {
  color: rgba(var(--b-sc), 0.7);
}
#root .horCatItemTitle {
  color: rgba(var(--b-sc), 0.8);
  font-weight: 600;
}
#root .horizontalCategoryItemWrp.active .horizontalCategoryItem {
  background-color: rgb(var(--by-inverse));
  box-shadow: none;
}
#root .horizontalCategoryItemWrp.active .horizontalCategoryItem :is(i, svg),
#root .horizontalCategoryItemWrp.active :is(.horCatItemTitle, .horCatItemCount) {
  color: #fff;
}
#root .horizontalCategoryItemWrp:not(.active):hover .horizontalCategoryItem {
  box-shadow: inset 0 0 0 1px rgba(var(--b-sc), 0.3);
}
/* Loyalty sliders: the arrows become plain white buttons instead of grey gradient discs */
#root :is(.loyaltyHorizontalList, .loyaltyUserBenefits, .loyaltyExchangeList) .horizontalSliderNav {
  color: rgb(var(--b-sc));
  box-shadow: 0 0 0 1px var(--by-line), 0 2px 8px rgba(17, 19, 24, 0.12);
  filter: none;
}
#root :is(.loyaltyHorizontalList, .loyaltyUserBenefits, .loyaltyExchangeList) .horizontalSliderNav:before {
  background: rgb(var(--by-surface));
  box-shadow: none;
}
#root :is(.loyaltyHorizontalList, .loyaltyUserBenefits, .loyaltyExchangeList) .horizontalSliderNav:hover:before {
  background: rgba(var(--b-sc), 0.05);
}
/* Match rows: bet builder marker in ink, odds arrows and boost icon in the theme green, suspended odds faded */
#root .c-info-icon-bc.bc-i-bet-builder,
#root .c-info-icon-bc :is(.internalBetBuilderIcon, .betBuilderIconColor) {
  color: rgb(var(--b-sc));
}
#root .market-bc:not(.active) .market-arrow-up-down-bc.is-up {
  border-color: transparent rgb(var(--by-green)) transparent transparent;
}
#root .market-bc:not(.active) .market-icon-bc {
  color: rgb(var(--by-green));
}
#root .market-bc.disabled-market-bc {
  background: rgba(var(--b-sc), 0.035);
}
#root .market-lock-icon {
  color: rgba(var(--b-sc), 0.4);
}
#root .internalBetBuilderContent {
  border: 0;
  border-radius: 10px;
  color: rgba(var(--b-sc), 0.7);
  background: rgba(var(--b-sc), 0.04);
}
#root .horizontal-sl-tab-bc.selected-underline:before {
  height: 2px;
}
#root .promotion-horizontal-sl-list-bc .horizontal-sl-item-bc {
  border-radius: 12px;
  box-shadow: inset 0 0 0 1px var(--by-line);
}
#root .promotion-horizontal-sl-list-bc .horizontal-sl-item-bc.active {
  box-shadow: none;
}
#root .promotion-horizontal-sl-list-bc .horizontal-sl-item-bc.active:before {
  display: none;
}
/* Plain and outline buttons: white with an ink hairline; no #root on purpose so every variant and page rule still wins */
html[class*="is-web"] .btn:where(:not(.a-color, .a-outline, .a-accept, .register, .sign-in, .btn-color, .go-ftn-btn, .openFileButton, .lossLimitStepper, .generic-search-menu-item, .address-btn, .bet-builder-btn, .tournament-details-reset, :disabled)) {
  color: rgb(var(--b-sc));
  background: rgb(var(--b));
  box-shadow: inset 0 0 0 1px rgba(var(--b-sc), 0.16);
  font-weight: 600;
}
html[class*="is-web"] .btn:where(:not(.a-color, .a-outline, .a-accept, .register, .sign-in, .btn-color, .go-ftn-btn, .openFileButton, .lossLimitStepper, .generic-search-menu-item, .address-btn, .bet-builder-btn, .tournament-details-reset, :disabled)):hover {
  box-shadow: inset 0 0 0 1px rgba(var(--b-sc), 0.4);
}
html[class*="is-web"] .btn.a-outline:where(:not(.a-white, .active, .cut-btn, :disabled, .reg-form-close-popup *)) {
  border-color: rgba(var(--b-sc), 0.16);
  color: rgb(var(--b-sc));
  background: rgb(var(--b));
  font-weight: 600;
}
html[class*="is-web"] .btn.a-outline:where(:not(.a-white, .active, .cut-btn, :disabled, .reg-form-close-popup *)):hover {
  border-color: rgba(var(--b-sc), 0.4);
  background: rgb(var(--b));
}
#root .toast-notification-message-wrapper {
  border: 0;
  box-shadow: var(--by-shadow-menu), 0 0 0 1px var(--by-line);
}
#root .radio-control-input-bc:disabled ~ .radio-control-input-holder-bc {
  border-color: rgba(var(--b-sc), 0.15);
  background: rgba(var(--b-sc), 0.06);
}

/* Header user area, date picker, status popups, tabs, toggles, loader */
/* Logged-in header: picture avatar, bonus line, balance breakdown, session timer */
#root .hdr-user-bc .avatarHolderImg {
  background: rgba(var(--b-sc), 0.06);
}
#root .avatarHolderImg.user-not-verified {
  box-shadow: none;
}
#root .hdr-user-info-texts-bc.ext-2 {
  color: rgba(var(--b-sc), 0.6);
  font-variant-numeric: tabular-nums;
}
#root .user-balance-item {
  font-variant-numeric: tabular-nums;
}
#root .sessionTimerWrapper {
  background: transparent;
}
#root .cashbackVaultBoxesHeader {
  box-shadow: none;
}

/* Main menu dropdowns: hovered row and the current page */
#root .nav-content-bc .nav-menu-container .nav-menu-sub .nav-menu-item:hover {
  background: rgba(var(--menu-sc), 0.05);
}
#root .nav-content-bc .nav-menu-container .nav-menu-sub .nav-menu-item.active {
  background: rgba(var(--hero), 0.14);
}
/* Date picker: light day hover, readable month arrows */
#root .react-datepicker__month .react-datepicker__day:not(.react-datepicker__day--selected):not(.react-datepicker__day--keyboard-selected):not(.react-datepicker__day--disabled):hover {
  background-color: rgba(var(--b-sc), 0.06);
}
#root .react-datepicker-web > i {
  color: rgba(var(--b-sc), 0.55);
}
#root .react-datepicker-web > i:hover {
  color: rgb(var(--b-sc));
}
/* Status popups and tooltips */
#root .casino-popup-icon-wrapper path[fill="#16C72E"] {
  fill: rgb(var(--by-green));
}
#root .tooltipTextDesc + .tooltipTextDesc {
  border-top-color: rgba(255, 255, 255, 0.16);
}
#root .express-bonus-popup-items {
  font-variant-numeric: tabular-nums;
}
#root .forcePopupContent .radio-v-bc .radio-control-bc {
  border-radius: 12px;
  background: rgb(var(--by-surface));
  box-shadow: inset 0 0 0 1px var(--by-line);
}
#root .forcePopupContent .radio-v-bc .radio-control-bc:hover {
  background: rgba(var(--b-sc), 0.03);
}
#root .forcePopupContent .radio-v-bc .radio-control-bc:has(.radio-control-input-bc:checked) {
  background: rgba(var(--hero), 0.12);
  box-shadow: inset 0 0 0 1px rgb(var(--hero));
}
#root .preferred-bonus-item:before {
  -webkit-backdrop-filter: none;
  backdrop-filter: none;
}
/* Bet slip header tabs: an underline marks the open one */
#root .betslip-bc .bs-f-header-bc .tab-bc:hover {
  color: rgb(var(--b-sc));
}
#root .betslip-bc .bs-f-header-bc .tab-bc.selected-underline:before {
  content: none;
}
#root .betslip-bc .bs-f-header-bc .tab-bc:is(.active, :hover) .count-odd-animation:after {
  color: rgb(var(--hero-sc));
  background: rgb(var(--hero));
  box-shadow: none;
}

/* Toggle switch; the bet slip keeps its own */
#root :is(.layout-content-holder-bc, .popup-holder-bc, .sidePanel-holder) .ui-kit-toggle {
  background: rgba(var(--b-sc), 0.16);
}
#root :is(.layout-content-holder-bc, .popup-holder-bc, .sidePanel-holder) .ui-kit-toggle:before {
  background: rgb(var(--by-surface));
  box-shadow: 0 1px 2px rgba(17, 19, 24, 0.24);
}
#root :is(.layout-content-holder-bc, .popup-holder-bc, .sidePanel-holder) .ui-kit-toggle.active {
  background: rgb(var(--by-inverse));
}
/* the BB mark sits under the toggle track, so our opaque ink track hid it once the toggle was on */
#root .switcherModeEnable .internalBetBuilderIcon {
  z-index: 1;
  pointer-events: none;
}
#root .switcherModeEnable:has(.ui-kit-toggle.active) .internalBetBuilderIcon svg {
  fill: #fff;
}

/* Badges */
#root .count-odd-animation.BB-badge-new:after {
  color: rgb(var(--by-inverse-sc));
  background: rgb(var(--by-inverse));
}
#root .competition-description {
  background: rgb(var(--hero));
}
/* Loader: a plain ring in the text colour, no gold and magenta cycling */
#root .bc-loader-animation .path {
  fill: none;
  stroke: currentColor;
  animation: 2s ease-in-out infinite dash;
}

/* Match page: scoreboard, statistics, line and score pickers, other live matches */
/* Live scoreboard: grey and lilac literals become white on ink, like the other dark panels */
#root .game-details-c-body-bc {
  background: rgba(17, 19, 24, 0.3);
  box-shadow: -10px 0 rgba(17, 19, 24, 0.3), 10px 0 rgba(17, 19, 24, 0.3);
}
#root :is(.game-d-c-h-c-r-sport-league-bc, .game-details-c-head-c-row-data-bc) {
  color: rgba(255, 255, 255, 0.75);
}
#root .game-d-c-head-c-icon-bc {
  color: rgba(255, 255, 255, 0.7);
}
#root .game-d-c-b-r-c-team-name-bc {
  color: #fff;
  font-weight: 500;
}
#root .game-d-c-position-point-bc {
  color: rgba(255, 255, 255, 0.55);
}
#root .game-details-c-b-r-c-score-item-bc.title {
  color: rgba(255, 255, 255, 0.6);
}
#root :is(.game-details-c-head-time-bc, .game-details-c-b-r-c-score-item-bc.point, .game-details-penalties-number-bc) {
  font-variant-numeric: tabular-nums;
}
/* the current-period column was set off by a lilac line and a white glow */
#root .game-details-c-body-count-bc > .game-details-c-body-numbers-bc:nth-child(2) {
  box-shadow: inset 1px 0 rgba(255, 255, 255, 0.16);
}
#root :is(.game-d-c-b-r-c-statistics-item-bc, .game-details-penalties-number-bc) {
  background: rgba(17, 19, 24, 0.5);
}
#root .game-d-c-b-r-c-statistics-item-bc.W,
#root .game-details-penalties-info-bc .bc-i-checked {
  color: #fff;
  background: rgb(var(--by-green));
}
#root .game-d-c-b-r-c-statistics-item-bc.L,
#root .game-details-penalties-info-bc .bc-i-close-remove {
  color: #fff;
  background: rgb(var(--oc-3));
}
#root .game-d-c-b-r-c-statistics-item-bc.D {
  color: #fff;
  background: rgba(255, 255, 255, 0.2);
}
#root .game-details-container-inner-bc .game-details-c-live-icons-row-bc {
  border-top-color: rgba(255, 255, 255, 0.16);
}
#root .game-details-container-inner-bc .game-details-c-live-i-item-bc:not(.active) {
  color: rgba(255, 255, 255, 0.8);
  background: rgba(255, 255, 255, 0.1);
}
#root .game-details-container-inner-bc .game-details-c-live-i-item-bc.active {
  color: rgb(17, 19, 24);
  background: rgb(var(--by-surface));
}
#root .game-details-container-inner-bc .game-details-c-live-i-item-bc:not(.active):hover {
  color: #fff;
  background: rgba(255, 255, 255, 0.2);
}

/* Match page: market group header icons, the "New" label and the market search field */
#root .sgm-market-head-icons > i {
  color: rgba(var(--b-sc), 0.5);
}
#root .sgm-market-g-h-statistics-icon-bc.active {
  color: rgb(var(--b-sc));
}
#root .sgm-market-g-h-title-label > span {
  padding: 2px 6px;
  border-radius: 6px;
  font-size: 10px;
  font-weight: 700;
  letter-spacing: 0.02em;
}
#root .sgm-market-search .sport-search-bc .ss-input-bc {
  border-color: rgba(var(--b-sc), 0.16);
  border-radius: 8px;
}
#root .sgm-market-search .sport-search-bc .ss-input-bc:focus {
  border-color: rgb(var(--hero));
  box-shadow: 0 0 0 3px rgba(var(--hero), 0.28);
}

/* Line list (list icon in a handicap market header): white chips, the chosen line ink */
#root .scoreListMode {
  padding: 0 6px 12px;
  background: transparent;
}
#root .scoreListItem {
  border-radius: 8px;
  color: rgba(var(--b-sc), 0.8);
  background: rgb(var(--by-surface));
  box-shadow: inset 0 0 0 1px rgba(var(--b-sc), 0.12);
  font-weight: 600;
  font-variant-numeric: tabular-nums;
}
#root .scoreListItem.active {
  color: rgb(var(--by-inverse-sc));
  background: rgb(var(--by-inverse));
  box-shadow: none;
}
#root .scoreListItem:not(.active):hover {
  box-shadow: inset 0 0 0 1px rgba(var(--b-sc), 0.3);
}
#root .games-markets-columns-switcher {
  color: rgba(var(--b-sc), 0.6);
  background: transparent;
  box-shadow: inset 1px 0 0 var(--by-line);
}
#root .games-markets-columns-switcher:hover {
  color: rgb(var(--b-sc));
}

/* Live match page: the arrow beside the league name and the list of other live matches it opens */
#root .live-page-sections-bc .back-nav-bc > .competition-icon-arrow-bc {
  border-radius: 8px;
  color: rgba(var(--b-sc), 0.7);
  background: rgb(var(--by-surface));
  box-shadow: inset 0 0 0 1px rgba(var(--b-sc), 0.16);
}
#root .game-details-list-scroll {
  padding: 4px 0;
  border-radius: 12px;
  box-shadow: var(--by-shadow-menu), 0 0 0 1px var(--by-line);
}
#root .game-details-list .sp-sub-list-bc {
  border-radius: 0;
  background: transparent;
  box-shadow: inset 0 -1px 0 var(--by-line);
}
#root .game-details-list-scroll .sp-sub-list-bc + .sp-sub-list-bc {
  margin-top: 0;
}
#root .game-details-list .sp-s-l-head-bc {
  height: 34px;
  padding: 0 12px;
  border-radius: 0;
  background: transparent;
}
#root .game-details-list-scroll .sp-s-l-h-title-bc {
  color: rgb(var(--b-sc));
  font-weight: 600;
}
#root .game-details-list .sp-s-l-b-content-bc {
  padding: 0;
  border-radius: 0;
  background: transparent;
}

/* The same live controls in the right column sit on white, not on the scoreboard picture */
#root .betslip-game-animation-block .game-details-c-live-i-item-bc:not(.active) {
  color: rgba(var(--b-sc), 0.6);
  background: transparent;
}
#root .betslip-game-animation-block .game-details-c-live-i-item-bc:not(.active):hover {
  color: rgb(var(--b-sc));
  background: rgba(var(--b-sc), 0.06);
}
#root .betslip-game-animation-block .game-details-c-live-i-item-bc.active {
  color: rgb(var(--by-inverse-sc));
  background: rgb(var(--by-inverse));
}
/* the platform's bar rule for this row has a broken selector, so the animation toggle sat on the column's top edge */
#root .betslip-game-animation-block > .game-details-container-bc {
  padding: 8px 12px;
  box-shadow: inset 0 -1px 0 var(--by-line);
}
#root .betslip-game-animation-block .game-details-c-live-icons-row-bc .tooltipIconWrapper {
  height: 26px;
}
#root .betslip-game-animation-block .game-details-c-live-icons-row-bc .game-details-c-live-i-item-bc {
  padding-inline: 10px;
}
/* without an animation or a stream the block holds two empty rows, a blank band above the slip */
#root .betslip-game-animation-block:not(:has(.game-details-c-live-i-item-bc)) {
  display: none;
}

/* Watching a stream (signed in): mode bar and the bet-during-stream block */
#root .streamingMode {
  border-radius: 8px;
  background: rgba(var(--b-sc), 0.05);
}
#root .betDuringStreamWrapper {
  overflow: hidden;
  border-color: var(--by-line);
  border-radius: 12px;
  background: rgb(var(--by-surface));
}
#root .betDuringStreamWrapper .sp-s-l-head-bc {
  padding: 0 12px;
  border-radius: 0;
  color: rgb(var(--b-sc));
  background: transparent;
  box-shadow: inset 0 -1px 0 var(--by-line);
  font-weight: 600;
}
#root .betDuringStreamWrapper .sp-s-l-b-content-bc {
  background: transparent;
}

/* Mixed matches block on a match page: hairline rows instead of grey boxes */
#root .mixed-matches-container {
  padding: 0;
  background: transparent;
}
#root .mixed-matches-header {
  border-radius: 0;
  background: transparent;
  box-shadow: inset 0 -1px 0 var(--by-line);
}
#root .mixed-matches-title {
  color: rgba(var(--b-sc), 0.55);
  font-weight: 600;
}
#root .mixed-matches-team {
  margin-top: 0;
  border-radius: 0;
  color: rgb(var(--b-sc));
  background: transparent;
  box-shadow: inset 0 -1px 0 var(--by-line);
}
/* Scoreboard extras (Rainbow Six maps, basketball shots, shooting and archery): tinted literals become white on ink */
#root .rainbowSixScoreSet {
  border-radius: 4px;
  color: rgba(255, 255, 255, 0.7);
  background: rgba(255, 255, 255, 0.12);
}
#root .game-details-basketballshots-shadow-bc:after {
  box-shadow: inset 1px 0 rgba(255, 255, 255, 0.16);
}
#root [class="game-details-info-icon-bc"] {
  background: rgba(255, 255, 255, 0.3);
}
#root :is(.shooting-total-info, .shooting-set-wrapper) {
  background: rgba(17, 19, 24, 0.5);
}
#root .shooting-game-set {
  color: rgba(255, 255, 255, 0.7);
}
#root .shooting-point:empty:not(.shooting-point-miss) {
  background: rgba(255, 255, 255, 0.12);
}
#root .shooting-point-total {
  color: rgb(17, 19, 24);
  background: rgb(var(--hero));
}
/* Competition rows in the sports menu (popular competitions, favourites panel): hairline rows like the rest of the menu */
#root .sp-s-l-b-c-item-bc:not(.isHomepageWidgetItem) {
  height: 40px;
  margin: 0;
  padding: 0 12px;
  border-radius: 0;
  background: transparent;
  box-shadow: inset 0 -1px 0 var(--by-line);
}
#root .sp-s-l-b-c-item-bc:not(.isHomepageWidgetItem):hover {
  background: rgba(var(--b-sc), 0.035);
}
#root .sp-s-l-b-c-item-bc:not(.isHomepageWidgetItem).active {
  background: rgba(var(--hero), 0.14);
  box-shadow: inset 3px 0 0 rgb(var(--hero)), inset 0 -1px 0 var(--by-line);
}
#root .sp-s-l-b-c-i-title-bc {
  color: rgba(var(--b-sc), 0.85);
}
#root .sp-s-l-b-c-i-g-count-bc {
  color: rgba(var(--b-sc), 0.6);
  font-variant-numeric: tabular-nums;
}
#root .competition-ico-arr-bc {
  color: rgba(var(--b-sc), 0.35);
}
#root .sp-s-l-b-c-i-fav-icon-bc {
  border: 0;
  color: rgba(var(--b-sc), 0.35);
}
/* a favourite is marked by swapping the icon to bc-i-star, never by an .active class */
#root .sp-s-l-b-c-i-fav-icon-bc.bc-i-star {
  color: rgb(var(--hero));
}
/* Market statistics (chart icon in a market group header): light band, results in the palette */
#root .sgm-market-statistics-block-bc {
  padding: 12px 8px;
  background: rgba(var(--b-sc), 0.03);
}
#root .sgm-market-statistics-set-betting-bc + .sgm-market-statistics-set-betting-bc:before {
  background: var(--by-line);
}
#root .sgm-market-statistics-s-w-content-bc + .sgm-market-statistics-s-w-content-bc {
  border-top-color: var(--by-line);
}
#root .sgm-market-s-s-b-count-bc {
  color: rgb(var(--b-sc));
  font-weight: 700;
  font-variant-numeric: tabular-nums;
}
#root .sgm-market-s-s-w-count-bc {
  border-radius: 6px;
  color: rgb(var(--b-sc));
  background: rgba(var(--b-sc), 0.08);
  box-shadow: none;
  font-weight: 600;
  font-variant-numeric: tabular-nums;
}
#root .sgm-market-s-h-f-t-bc:first-child {
  border-radius: 6px 0 0 6px;
}
#root .sgm-market-s-h-f-t-bc:nth-child(2) {
  border-radius: 0 6px 6px 0;
}
#root :is(.sgm-market-s-s-w-count-bc, .sgm-market-s-h-f-t-bc):is(.W, .Y) {
  color: #fff;
  background: rgb(var(--by-green));
}
#root :is(.sgm-market-s-s-w-count-bc, .sgm-market-s-h-f-t-bc).D {
  color: rgb(var(--b-sc));
  background: rgba(var(--b-sc), 0.08);
}
#root :is(.sgm-market-s-s-w-count-bc, .sgm-market-s-h-f-t-bc).L {
  color: #fff;
  background: rgb(var(--oc-3));
}
#root .sgm-market-statistics-all-bc {
  height: 40px;
  margin-top: 0;
  padding: 0 12px;
  color: rgba(var(--b-sc), 0.6);
  background: transparent;
  box-shadow: inset 0 -1px 0 var(--by-line);
}
#root .sgm-market-statistics-all-arrow-bc:before {
  line-height: 40px;
}
#root .sgm-market-statistics-all-bc:hover {
  color: rgb(var(--b-sc));
  background: rgba(var(--b-sc), 0.03);
}
/* Desktop single-column match list (Multi-column switched off) and favourite games: one row per match on hairlines */
#root .competition-details-section {
  padding: 4px 0;
  border-radius: 0;
  background: transparent;
  box-shadow: inset 0 -1px 0 var(--by-line);
}
#root .competition-details-section + .competition-details-section {
  margin-top: 0;
}
#root .competition-details-header {
  min-height: 34px;
  margin-bottom: 0;
  padding: 6px 12px;
  background: transparent;
}
#root .competition-details-header:hover {
  background: rgba(var(--b-sc), 0.035);
}
#root .competition-details-header.active {
  background: rgba(var(--hero), 0.14);
  box-shadow: inset 3px 0 0 rgb(var(--hero));
}
#root .competition-details-header p {
  font-size: 13px;
  font-weight: 600;
}
#root .competition-details-section > .market-group-holder-bc {
  padding: 2px 12px;
}
#root .competition-details-info-container {
  margin-top: 0;
  padding: 0 12px;
  color: rgba(var(--b-sc), 0.55);
  background: transparent;
  font-variant-numeric: tabular-nums;
}
#root .competition-details-info-container i {
  color: rgba(var(--b-sc), 0.55);
}
#root .multi-column-toggle-title {
  color: rgba(var(--b-sc), 0.6);
  font-weight: 600;
}
/* "Live n" link beside the league name: the live red badge rather than an accent chip */
#root .comp-live-title-bc {
  border-radius: 999px;
  color: #fff;
  background: rgb(var(--oc-3));
  box-shadow: none;
  font-weight: 600;
  font-variant-numeric: tabular-nums;
}
#root .comp-live-title-bc:hover {
  background: rgba(var(--oc-3), 0.85);
}
#root .comp-fav-icon-bc {
  color: rgba(var(--b-sc), 0.45);
}
/* a favourite is marked by swapping the icon to bc-i-star, never by an .active class */
#root .comp-fav-icon-bc.bc-i-star {
  color: rgb(var(--hero));
}
/* Correct score picker (list icon in a Correct Score header): no grey slab, minus and plus as secondary buttons */
#root .scoreSelectorWidget {
  padding: 0 12px 12px;
  background: transparent;
}
#root .scoreSelectorTeamName {
  color: rgba(var(--b-sc), 0.6);
  font-weight: 600;
}
#root .scoreSelectorActions > .btn:not(:disabled) {
  color: rgb(var(--b-sc));
  background: rgb(var(--by-surface));
  box-shadow: inset 0 0 0 1px rgba(var(--b-sc), 0.16);
}
#root .scoreSelectorCurrentValue {
  color: rgb(var(--b-sc));
  font-size: 14px;
  font-weight: 700;
  font-variant-numeric: tabular-nums;
}
#root .scoreSelectorActions > .btn:not(:disabled):hover {
  box-shadow: inset 0 0 0 1px rgba(var(--b-sc), 0.4);
}

/* E-sports, featured matches, match statistics popup */
#root .e-sports-game-details-container {
  border-radius: 12px;
}
#root .outright-sgm-market {
  background: transparent;
  box-shadow: inset 0 1px 0 var(--by-line);
}
#root .e-sports-outright:hover:before {
  display: none;
}
/* Match timeline events (timeline view of a live match): one white card with hairline rows */
#root .game-events-list-block-bc {
  border: 1px solid var(--by-line);
  border-radius: 12px;
  background: rgb(var(--by-surface));
}
#root .game-events-list-title-bc {
  height: 40px;
  padding: 0 12px;
  color: rgb(var(--b-sc));
  background: transparent;
  box-shadow: inset 0 -1px 0 var(--by-line);
}
#root .game-events-list-text-bc {
  font-size: 13px;
  font-weight: 600;
}
#root .game-events-list-bc {
  margin-top: 0;
  padding: 0 12px;
  background: transparent;
}
#root .game-events-list-info-bc + .game-events-list-info-bc {
  box-shadow: inset 0 1px 0 var(--by-line);
}
#root .game-events-list-block-bc .empty-b-text-v-bc {
  background: transparent;
}
/* H2H bars take the teams' kit colours inline, so a white kit vanished on the grey box; they use the basketball statistics colours */
#root .head-to-head-section-bc {
  border-radius: 0;
  background: transparent;
  box-shadow: inset 0 -1px 0 var(--by-line);
}
#root .hth-graph-info-container-bc {
  padding: 0 28px;
}
#root .hth-graph-holder.has-changes {
  background: rgb(var(--b-sc)) !important;
}
#root .hth-graph-holder.has-changes > .hth-graph-bc {
  background: rgb(var(--by-green)) !important;
}
#root .hth-graph-score-bc {
  width: 28px;
  color: rgba(var(--b-sc), 0.75);
  font-size: 11px;
  font-weight: 600;
  font-variant-numeric: tabular-nums;
}

/* E-sports match panel: the platform builds it for a dark surface (white title, light icons, team side colours), so it gets the scoreboard ink */
#root .e-sports-game-details {
  --b: 17, 19, 24;
  --b-sc: 255, 255, 255;
  --by-inverse: 255, 255, 255;
  --by-inverse-sc: 17, 19, 24;
  --oc-1: 255, 204, 51;
  --oc-1-sc: 17, 19, 24;
  --oc-2: 255, 204, 51;
  --accent: 255, 204, 51;
  --accent-sc: 17, 19, 24;
  border-radius: 12px 12px 0 0;
  color: #fff;
  background: rgb(17, 19, 24);
}
#root .e-sports-game-details .game-details-additional-info-bc {
  background: rgba(255, 255, 255, 0.06);
}
#root .e-sports-score {
  font-weight: 700;
  font-variant-numeric: tabular-nums;
}
#root .e-sports-time-start:before {
  background: rgba(255, 255, 255, 0.12);
}
#root .e-sports-time-start .countdown-banner-content {
  color: rgb(var(--hero));
}
/* each e-sports game repaints the active tab line in its own gradient; the theme keeps it yellow */
#root :is(.main-tabs-bc .tab-bc, .horizontal-sl-tab-bc).selected-underline:before {
  background: rgb(var(--hero));
}
#root .e-sports img.sp-s-l-h-flag-bc {
  border-radius: 2px;
}
/* each e-sports game repaints its picked odds in its own colour with a glow; the theme keeps them yellow */
#root .e-sports-match-container .market-bc.active:not(.disabled-market-bc) {
  color: rgb(var(--hero-sc));
  background: rgb(var(--hero));
  box-shadow: none;
}

/* Counter-Strike round timeline and LoL/Dota statistics */
#root .statistics-timeline-teams {
  box-shadow: inset -1px 0 0 var(--by-line);
}
#root .statistics-timeline-teams:after {
  background: transparent;
}
#root .statistics-timeline-empty-content {
  background: rgba(255, 255, 255, 0.92);
  backdrop-filter: none;
}
#root .time-score-container {
  border-bottom-color: var(--by-line);
}
/* Featured matches: plain hairline under the header, palette red for live */
#root :is(.featuredGameItemHeaderVersion1, .featuredGameItemBodyVersion1) {
  background: transparent;
}
#root .featuredGameItemHeaderVersion1:before {
  border-bottom: 1px solid var(--by-line);
}
#root .featuredGameItemIsLiveVersion1 {
  background: rgb(var(--oc-3));
  font-weight: 600;
}
#root .featuredGameItemTimeVersion1 {
  font-variant-numeric: tabular-nums;
}
/* the carousel edges were faded with a white gradient; a round white arrow stays readable over the cards instead */
#root .featuredGamesContentVersion1 .carouselWrapper :is(.swiper-button-prev, .swiper-button-next) {
  justify-content: center;
  background: none;
}
#root .featuredGamesContentVersion1 .carouselWrapper :is(.swiper-button-prev, .swiper-button-next):after {
  width: 32px;
  height: 32px;
  border-radius: 999px;
  color: rgb(var(--b-sc));
  background: rgb(var(--by-surface));
  box-shadow: var(--by-shadow-menu), 0 0 0 1px var(--by-line);
}
/* Round timeline and MOBA statistics: a white card instead of the grey 4px slab */
#root .statistics-timeline-wrapper {
  border: 1px solid var(--by-line);
  border-radius: 12px;
  background: rgb(var(--by-surface));
}
#root .e-sports-match-icons:before {
  background: var(--by-line);
}
/* Match statistics popup (stats icon of a match row): a floating card with hairline rows and results in the theme colours */
#root .statistic-popup {
  border-radius: 12px;
  box-shadow: var(--by-shadow-menu), 0 0 0 1px var(--by-line);
}
#root .statistics-content {
  font-variant-numeric: tabular-nums;
}
#root .statistics-content tr:not(.first-level-header-p) td {
  background: transparent;
}
#root .statistics-content tbody tr:not(.first-level-header-p):not(.last-level) {
  border-bottom-color: var(--by-line);
}
#root .first-level-header-p :is(th, td) {
  background: rgba(var(--b-sc), 0.035);
}
#root .statistics-border-p {
  border-left-color: var(--by-line);
}
#root .statistics-content .green {
  box-shadow: inset 0 -2px rgb(var(--by-green));
}
#root .statistics-content .red {
  box-shadow: inset 0 -2px rgb(var(--oc-3));
}
#root .statistics-content .yellow {
  box-shadow: inset 0 -2px rgba(var(--b-sc), 0.55);
}
#root .statistics-content .green:hover {
  box-shadow: inset 0 -80px rgb(var(--by-green));
}
#root .statistics-content .red:hover {
  box-shadow: inset 0 -80px rgb(var(--oc-3));
}
#root .statistics-content .yellow:hover {
  box-shadow: inset 0 -80px rgba(var(--b-sc), 0.55);
}

/* Casino: game tiles, providers, jackpots, tournaments, promotions */
#root .casino-full-game-panel {
  border-radius: 0 10px 10px 0;
  background: rgb(var(--by-surface));
  box-shadow: 0 0 0 1px var(--by-line);
}
#root .casino-full-game-panel-element {
  color: rgba(var(--b-sc), 0.7);
  background: transparent;
}
#root .casino-full-game-panel-element + .casino-full-game-panel-element {
  box-shadow: inset 0 1px 0 var(--by-line);
}
#root .casino-full-game-panel-element:hover {
  color: rgb(var(--b-sc));
  background: rgba(var(--b-sc), 0.06);
}
#root .casino-full-game-switcher:before {
  background: rgba(var(--b-sc), 0.3);
}
#root .casino-full-game-switcher.active:before {
  background: rgb(var(--by-inverse));
}
#root .casino-full-game-empty {
  background: rgba(var(--b-sc), 0.04);
  box-shadow: inset 0 0 0 1px var(--by-line);
}
#root .casino-full-game-add-icon {
  border-radius: 12px;
  color: rgb(var(--b-sc));
  background: rgb(var(--by-surface));
  box-shadow: 0 0 0 1px rgba(var(--b-sc), 0.16);
}
#root .casino-full-game-add-icon:hover {
  background: rgba(var(--b-sc), 0.06);
}
#root .casinoFullGamesIcons > .tooltipIconWrapper {
  border-radius: 10px;
  background: rgb(var(--by-surface));
  box-shadow: 0 0 0 1px var(--by-line);
}
#root :is(.casinoGameItemContent, .casinoGameItemBlock) {
  border-radius: 10px;
}
/* the hover layer gets its blur and thin scrim from the platform's fade-in animation, which only !important outranks */
#root .casinoGameItemBlock {
  background: rgba(17, 19, 24, 0.72) !important;
  backdrop-filter: none !important;
}
#root .cgdInfoPanel {
  border-radius: 12px;
  background: rgba(17, 19, 24, 0.48);
}
#root .cgdThumbnail {
  border-radius: 10px;
}
#root .casino-jackpot-widget__inner {
  padding-bottom: 16px;
  border-radius: 12px;
  background: rgb(var(--by-surface));
}
#root .casino-jackpot-widget__inner:before {
  display: none;
}
#root .casino-jackpot-widget__title {
  font-weight: 700;
}
#root .casino-jackpot-widget__providers .horizontalSliderNav:before {
  background: rgb(var(--by-surface));
  backdrop-filter: none;
  box-shadow: 0 0 0 1px var(--by-line), 0 2px 8px rgba(17, 19, 24, 0.12);
}
#root .casino-jackpot-widget__providers .horizontalSliderNav:after {
  display: none;
}
#root .casino-jackpot-widget__providers .horizontalCategoryItem {
  border-radius: 10px;
  background: rgb(var(--by-surface));
  box-shadow: inset 0 0 0 1px var(--by-line);
}
#root .casino-jackpot-widget__providers .horizontalCategoryItem:before {
  border-radius: 10px;
  background: transparent;
  backdrop-filter: none;
}
#root .casino-jackpot-widget__providers .horizontalCategoryItemWrp.active .horizontalCategoryItem:before {
  background: rgb(var(--by-inverse));
}
#root .casino-jackpot-widget__providers .horizontalCategoryItemWrp:not(.active):hover .horizontalCategoryItem {
  box-shadow: inset 0 0 0 1px rgba(var(--b-sc), 0.3);
}
#root .casino-jackpot-widget__providers .horizontalCategoryItemWrp:not(.active):hover i {
  color: rgb(var(--b-sc));
}
#root .casinoRecentSearches {
  border: 0;
  background: rgb(var(--by-surface));
  backdrop-filter: none;
  box-shadow: var(--by-shadow-menu), 0 0 0 1px var(--by-line);
}
#root .casinoRecentSearches__title {
  color: rgb(var(--b-sc));
  font-weight: 600;
}
#root .casinoRecentSearches__clearAll {
  color: rgba(var(--b-sc), 0.6);
}
#root .randomGameContainer {
  border-radius: 10px;
}
#root .providerItemsInner {
  border-color: var(--by-line);
  border-radius: 10px;
}
#root .providerItemsInner.active {
  border-color: rgb(var(--hero));
}
#root .casinoProvidersPopupContent__grid--list {
  gap: 0;
}
#root .casinoProvidersPopupContent__providerListViewItem {
  border-radius: 0;
  background-color: transparent;
  box-shadow: inset 0 -1px 0 var(--by-line);
}
#root .casinoProvidersPopupContent__providerListViewItem--selected {
  background-color: rgba(var(--hero), 0.12);
  box-shadow: inset 3px 0 0 rgb(var(--hero)), inset 0 -1px 0 var(--by-line);
}
#root .casinoProvidersPopupContent__providerListViewItem--text {
  color: rgba(var(--b-sc), 0.85);
}
#root .casinoProvidersPopupContent__footer {
  box-shadow: inset 0 1px 0 var(--by-line);
}
#root .casinoProvidersPopupContent__providerListViewItem:not(.casinoProvidersPopupContent__providerListViewItem--selected):hover {
  background-color: rgba(var(--b-sc), 0.03);
}
#root .casinoWinnerWidgetItem {
  border-radius: 10px;
  background: rgb(var(--by-surface));
  box-shadow: inset 0 0 0 1px var(--by-line);
}
#root .casinoWinnerWidgetItem:hover {
  box-shadow: inset 0 0 0 1px rgba(var(--b-sc), 0.3);
}
#root .casinoWinnerWidgetAmount {
  color: rgb(var(--by-green));
  font-weight: 700;
  font-variant-numeric: tabular-nums;
}
#root .casino-winners-amount {
  color: rgb(var(--by-green));
  font-weight: 700;
  font-variant-numeric: tabular-nums;
}
#root :is(.casino-info-content, .casino-info-content-winners) > li:hover {
  background: rgba(var(--b-sc), 0.03);
}
#root :is(.jackpot-pool__price, .jackpot-pool__currency-symbol) {
  font-weight: 700;
  font-variant-numeric: tabular-nums;
}
#root .jackpot-pool:has(.jackpot-pool__item--hot):after {
  background: rgb(var(--hero));
  animation: none;
}
#root .jackpot-pool__hot:before {
  display: none;
}
#root .jackpot-pool__details.tooltip:not(:empty) {
  border-radius: 12px;
  box-shadow: var(--by-shadow-menu), 0 0 0 1px var(--by-line);
}
#root .jackpot-pool__details-container--blur {
  border: 0;
  border-radius: 12px;
  background: rgb(var(--by-surface));
  backdrop-filter: none;
}
#root .jackpot-pool__details-block + .jackpot-pool__details-block {
  border-top-color: var(--by-line);
}
#root .jackpot-pool__details-price {
  color: rgb(var(--by-green));
  font-weight: 700;
  font-variant-numeric: tabular-nums;
}
#root .jackpot-pool-card__wrapper {
  border-top: 0;
  border-radius: 12px;
  background: rgb(var(--by-surface));
  box-shadow: 0 0 0 1px var(--by-line);
}
#root .jackpot-pool-card__wrapper:before,
#root .jackpot-pool-card:after {
  display: none;
}
#root :is(.jackpot-pool-card__betslip-odometer, .jackpot-pool-card__betslip-currency) {
  font-weight: 700;
  font-variant-numeric: tabular-nums;
}
/* the platform mounts this drawer on body, outside #root */
body .jackpot-pools-drawer .jackpot-pool {
  border-radius: 12px;
  background: rgba(var(--b-sc), 0.04);
}
body .jackpot-pools-drawer .jackpot-pool__details-container {
  border-radius: 12px;
  background: rgba(var(--b-sc), 0.04);
}
#root .jackpot-pools-widget__carousel .jackpot-pools-widget__nav {
  background: rgb(var(--by-surface));
  backdrop-filter: none;
  box-shadow: var(--by-shadow-menu), 0 0 0 1px var(--by-line);
}
#root .promotion-details-header .btn.promotions-opt-button {
  border-radius: 10px;
  box-shadow: none;
  font-size: 13px;
  font-weight: 700;
}
#root .promotion-details-header .btn.promotions-opt-button.a-white {
  border-color: rgba(var(--b-sc), 0.16);
  color: rgb(var(--b-sc));
  background: rgb(var(--by-surface));
}
#root .promotion-details-img {
  border-radius: 12px;
}
#root .promotion-details-info {
  color: rgba(var(--b-sc), 0.75);
  line-height: 1.5;
}
#root .promotion-details-info h3 {
  color: rgb(var(--b-sc));
  font-weight: 700;
  letter-spacing: 0;
}
#root .promotion-details-info p {
  line-height: 1.5;
}
#root .promotion-details-info tr {
  background: transparent;
}
#root .promotion-details-info td {
  border-bottom: 1px solid var(--by-line);
}
#root .tournamentSectionCircle {
  display: none;
}
#root .tournamentSectionImg {
  border-radius: 10px;
}
#root .tournamentGameStatus {
  top: 8px;
  left: 8px;
  border-radius: 6px;
  box-shadow: none;
}
#root .tournamentGameStatus:before {
  display: none;
}
#root .tournamentGameStatus span {
  font-weight: 700;
}
#root .tournamentGameStatus.upcoming span {
  color: #fff;
}
#root .tournamentSectionInfoTitle {
  text-shadow: none;
  font-weight: 700;
}
#root .tournamentSectionDataButtonWrp {
  border-color: var(--by-line);
  border-radius: 12px;
  background-color: rgb(var(--by-surface));
}
#root .tournamentSectionMoney {
  text-shadow: none;
  font-weight: 800;
  font-variant-numeric: tabular-nums;
}
#root .countdownBannerDate {
  font-weight: 600;
  font-variant-numeric: tabular-nums;
}
#root .countdownBannerNames {
  color: rgba(var(--b-sc), 0.6);
  font-size: 9px;
  font-weight: 600;
}
/* the platform colours these status words red and green with !important, so only !important reaches them */
#root :is(.dataStatusTxt, .tourDateDuration) {
  color: rgba(var(--b-sc), 0.6) !important;
}
#root .casinoTournamentSectionElStatusBc {
  color: rgb(var(--b-sc)) !important;
  font-weight: 600;
  font-variant-numeric: tabular-nums;
}
#root .tournamentJoinButton .button {
  border-radius: 8px;
  font-weight: 700;
}
#root .tournamentJoinButton .button.joined {
  color: #fff;
  background: rgb(var(--by-green));
}
#root .tournamentJoinButton .button.joined time {
  border-inline-start-color: rgba(255, 255, 255, 0.4);
  color: rgba(255, 255, 255, 0.8);
}
#root .tournamentsGameItemShowAllInner {
  border-radius: 10px;
  background: rgba(17, 19, 24, 0.56);
  backdrop-filter: none;
}
#root .tournamentsShowAllCount {
  color: #fff;
  font-weight: 700;
  font-variant-numeric: tabular-nums;
}
#root .casinoTournamentSwitchWrp .ui-kit-toggle {
  background: rgba(var(--b-sc), 0.16);
}
#root .casinoTournamentSwitchWrp .ui-kit-toggle.active {
  background: rgb(var(--by-inverse));
}
#root .casinoTournamentInfoSectionBc {
  border-radius: 12px;
  background: rgb(var(--by-surface));
}
#root .casinoTournamentInfoItem {
  padding-inline: 12px;
  border-color: var(--by-line);
  border-radius: 12px;
}
#root .casinoTournamentInfoItem:before {
  display: none;
}
#root .casinoTournamentInfoSectionTitleBc {
  color: rgba(var(--b-sc), 0.6);
  font-weight: 600;
}
#root .casinoTournamentInfoColumn {
  border-radius: 12px;
  background: rgb(var(--by-surface));
}
#root .casinoTournamentRulesContent {
  padding: 12px 16px;
}
#root .casinoTournamentInfoRowWrp {
  border-radius: 0;
}
#root .casinoTournamentInfoRowWrp:not(:last-child) {
  margin-bottom: 0;
}
#root .casinoTournamentInfoRowWrp.active .casinoTournamentInfoRowClm.center {
  text-shadow: none;
}
/* the signed-in player's rows, including the pinned "Me" row, carry data-status 4 */
#root .casinoTournamentInfoRow[data-status="4"] {
  background-color: rgba(var(--hero), 0.14);
  box-shadow: inset 3px 0 0 rgb(var(--hero)), inset 0 -1px 0 var(--by-line);
}
#root .casinoTournamentInfoRow[data-status="4"] .casinoTournamentInfoRowClm {
  color: rgb(var(--b-sc));
  font-weight: 600;
}
#root .casinoTournamentInfoRowClm.type-2 {
  color: rgb(var(--b-sc));
  font-variant-numeric: tabular-nums;
}
#root .casinoTournamentInfoRowClm > .casinoTournamentInfoRowClm + .casinoTournamentInfoRowClm {
  border-inline-start: 1px solid var(--by-line);
}
#root .tournamentDetailsHeaderItem {
  border-radius: 12px;
  background: rgb(var(--by-surface));
}
#root .tournamentDetailsHeaderItem i {
  text-shadow: none;
}
#root .tournamentDetailsHeaderTitle {
  text-shadow: none;
  font-weight: 700;
}
/* these fades are painted with --b, so pointing --b at the canvas makes them melt into the page */
#root .tournamentSectionInfoTxt:after,
#root .tournamentCardDetailsInfo .tournamentSectionImgBlock:after {
  --b: var(--by-canvas);
}
#root .tournamentsWidgetInfo {
  background: rgb(var(--by-surface));
  box-shadow: 0 0 0 1px var(--by-line);
}
#root .tournamentsWidgetInfo:before {
  display: none;
}
#root .tournamentsWidgetCounter {
  background: rgb(var(--by-inverse));
}
#root .tournamentsWidgetCounterLabel {
  border-inline-end-color: rgba(255, 255, 255, 0.16);
  color: rgba(255, 255, 255, 0.64);
}
#root .tournamentsWidgetCounterValue {
  color: #fff;
  font-weight: 600;
  font-variant-numeric: tabular-nums;
}
#root .tournamentsWidgetPrice {
  text-shadow: none;
  font-variant-numeric: tabular-nums;
  font-size: 28px;
  font-weight: 800;
  line-height: 34px;
}
#root .casino-tournament-header {
  border-bottom-color: var(--by-line);
}
#root .casino-tournament-amount {
  font-weight: 700;
  font-variant-numeric: tabular-nums;
}

/* Design-system parts: popups, drawers, selects, toasts, cash-out, messages, results */
#root .loader-popup {
  backdrop-filter: none;
}
#root .badge.badge--odds.badge--subtle {
  background: rgba(var(--b-sc), 0.06);
  box-shadow: none;
}
#root .badge.badge--odds.badge--subtle :is(.ds-label, .ds-caption) {
  font-weight: 600;
  font-variant-numeric: tabular-nums;
}
#root .ds-popup-backdrop {
  background: rgba(17, 19, 24, 0.64);
  backdrop-filter: none;
}
#root .ds-popup {
  border-color: var(--by-line);
  border-radius: 16px;
  box-shadow: var(--by-shadow-pop);
}
#root .ds-popup.ds-popup--success {
  border-color: rgb(var(--by-green));
}
#root .ds-popup.ds-popup--warning {
  border-color: rgb(var(--hero));
}
#root .ds-popup.ds-popup--error {
  border-color: rgb(var(--oc-3));
}
#root .ds-popup.ds-popup--full-screen {
  border: 0;
  border-radius: 0;
  box-shadow: none;
}
#root .basketballPlayersTeams.basketballPlayersTeams--tabs .basketballPlayersTeamItem {
  border-bottom-color: var(--by-line);
}
#root .basketballPlayersPlayerTableRow {
  border: 0;
  border-radius: 0;
  background: transparent;
  box-shadow: inset 0 -1px 0 var(--by-line);
}
#root .basketballPlayersPlayerTableRow + .basketballPlayersPlayerTableRow {
  margin-top: 0;
}
#root .basketballPlayersPlayerTableRow.active {
  background: rgba(var(--hero), 0.12);
}
#root .basketballPlayerNumber {
  background: rgba(var(--b-sc), 0.06);
  font-variant-numeric: tabular-nums;
}
#root .basketballPlayerGamesInfoItem {
  border-color: rgba(var(--b-sc), 0.12);
  font-weight: 600;
  font-variant-numeric: tabular-nums;
}
#root .basketballQuarterStats {
  border-radius: 0;
  background: transparent;
}
#root .basketballQuarterStatsHeader {
  border-radius: 0;
  background: rgba(var(--b-sc), 0.03);
  box-shadow: inset 0 -1px 0 var(--by-line);
}
#root .basketballQuarterStatsBody {
  grid-template-columns: repeat(auto-fit, minmax(max(186px, 33.333% - 22px), 1fr));
  column-gap: 32px;
  border-radius: 0;
  background: transparent;
  box-shadow: inset 0 -1px 0 var(--by-line);
}
#root .basketballQuarterStatsBarFill.team1 {
  background: rgb(var(--by-green));
}
#root .basketballQuarterStatsScore {
  color: rgba(var(--b-sc), 0.75);
  font-size: 11px;
  font-variant-numeric: tabular-nums;
}
#root .button:is(.hero, .outlined, .success, .accept, .whiteBg):not(.supportButton) {
  border-radius: 8px;
  font-weight: 700;
}
#root .button.outlined:not(.supportButton) {
  box-shadow: inset 0 0 0 1px rgba(var(--b-sc), 0.16);
}
#root .button.outlined:not(.supportButton):hover {
  box-shadow: inset 0 0 0 1px rgba(var(--b-sc), 0.4);
}
#root .cash-p-tabs-w-bc {
  box-shadow: inset 0 -1px 0 var(--by-line);
}
#root .cash-t-item-bc {
  color: rgba(var(--b-sc), 0.55);
  font-weight: 600;
}
#root .cash-t-item-bc.active {
  color: rgb(var(--b-sc));
  box-shadow: inset 0 -2px 0 rgb(var(--hero));
}
#root .curr-am-cashout-bc {
  font-weight: 700;
  font-variant-numeric: tabular-nums;
}
#root .slider-pr-circle-color-bc > span {
  background: rgba(var(--b-sc), 0.06);
  font-variant-numeric: tabular-nums;
}
#root .cash-t-item-bc:hover {
  color: rgb(var(--b-sc));
}
#root .jetExchangeShop__banner {
  border-radius: 12px;
  background: rgba(var(--b-sc), 0.04);
}
#root .jetExchangeItem__info {
  border-color: var(--by-line);
  background: rgb(var(--by-surface));
}
#root .jetExchangeItem__points {
  color: rgb(var(--b-sc));
}
#root .jetClubUpgrade {
  border-radius: 12px;
  background: rgba(var(--b-sc), 0.04);
  backdrop-filter: none;
}
#root .jetClubSubscription__plans-banner {
  border-radius: 12px;
  background: rgba(var(--b-sc), 0.04);
}
#root .jetClubSubscription__plan {
  border-radius: 12px;
  background: rgb(var(--by-surface));
  box-shadow: inset 0 0 0 1px var(--by-line);
}
#root .expandableContentData .column:not(:last-child):after {
  background-color: var(--by-line);
}
#root .footerInfoContent .content table {
  border-collapse: collapse;
}
#root .footerInfoContent .content table tbody tr {
  border-bottom: 1px solid var(--by-line);
  background: transparent;
}
#root .footerInfoContent .content table tbody tr:first-child {
  background: rgba(var(--b-sc), 0.035);
}
#root .footerInfoContent .content table :is(th, td) {
  font-variant-numeric: tabular-nums;
}
#root .message-block-bc[data-status="unread"] .message-title-block {
  color: rgb(var(--b-sc));
  font-weight: 700;
}
#root .message-more-time-bc {
  background: transparent;
  box-shadow: inset 0 1px 0 var(--by-line);
}
#root .message-more-icon {
  color: rgba(var(--b-sc), 0.55);
  background: rgba(var(--b-sc), 0.05);
}
#root .message-time-bc {
  color: rgba(var(--b-sc), 0.55);
  font-variant-numeric: tabular-nums;
}
#root .ds-maintenance__blob {
  display: none;
}
#root .ds-maintenance__title {
  color: rgb(var(--b-sc));
}
/* the edge fades are painted in the surface colour, but this ticker sits on the grey canvas */
#root .casinoTopWinnersWidget .runningLineWrapper.withShadows:before,
#root .casinoTopWinnersWidget .runningLineWrapper.withShadows:after {
  --b: var(--by-canvas);
}
#root .ds-select.ds-select--focused .ds-select__field {
  box-shadow: inset 0 0 0 1px rgb(var(--hero)), 0 0 0 3px rgba(var(--hero), 0.28);
}
#root .ds-select.ds-select--error .ds-select__field {
  box-shadow: inset 0 0 0 1px rgb(var(--oc-3));
}
#root .ds-select__dropdown {
  border: 0;
  border-radius: 12px;
  box-shadow: var(--by-shadow-menu), 0 0 0 1px var(--by-line);
}
#root .ds-select.ds-select-layout--fill:not(.ds-select--focused):not(.ds-select--error):hover .ds-select__field {
  box-shadow: inset 0 0 0 1px rgba(var(--b-sc), 0.3);
}
#root .ds-select-option:not(.ds-select-option--disabled) > .ds-label {
  color: rgba(var(--b-sc), 0.8);
}
#root .ds-select-option.ds-select-option--selected {
  background: rgba(var(--hero), 0.2);
}
#root .ds-select-option.ds-select-option--selected :is(.ds-label, .ds-select-option__icon, .ds-select-option__check) {
  color: rgb(var(--b-sc));
}
#root .selfExclusionLockedScreen__box {
  border-radius: 10px;
  background: rgba(var(--b-sc), 0.05);
  box-shadow: inset 0 0 0 1px var(--by-line);
}
#root .selfExclusionLockedScreen__boxValue {
  font-variant-numeric: tabular-nums;
}
#root .sportMiniGame .sportMiniGameBanner {
  border-color: var(--by-line);
  border-radius: 12px;
  background-color: rgb(var(--by-surface));
  background-image: none;
}
#root .sportMiniGame .sportMiniGameBackdrop {
  display: none;
}
/* the platform paints this select purple with white text; our shared select rules already replace the purple fill */
#root .tournament-select .form-control-select-bc {
  color: rgb(var(--b-sc));
}
#root .tournament-select :is(.select-icon-bc, .form-control-icon-bc) {
  color: rgba(var(--b-sc), 0.55);
}
#root .results-teams-score-bc {
  font-weight: 700;
  font-variant-numeric: tabular-nums;
}
#root .results-game-details-header-bc {
  border: 1px solid var(--by-line);
  background: rgba(var(--b-sc), 0.035);
}
#root .results-game-details-title-bc {
  font-weight: 600;
}
#root .results-game-details-events-bc {
  margin-top: 0;
  border: 1px solid var(--by-line);
  border-top: 0;
  color: rgba(var(--b-sc), 0.7);
  background: transparent;
}
#root .subscription-buttons .btn.subscription-link {
  border-color: rgba(var(--b-sc), 0.16);
  color: rgb(var(--b-sc));
  background: rgb(var(--by-surface));
}
#root .subscription-buttons .btn.subscription-link:hover {
  border-color: rgba(var(--b-sc), 0.4);
  color: rgb(var(--b-sc));
  background: rgb(var(--by-surface));
}
#root .swipe-fav-container-bc {
  border: 0;
  border-radius: 8px;
  background: rgba(var(--b-sc), 0.05);
}
#root .swipe-fav-container-bc > .c-info-icon-bc {
  color: rgba(var(--b-sc), 0.6);
}
#root .swipe-fav-container-bc > .bc-i-star {
  color: rgb(var(--hero));
}
#root .ds-tag:not(.ds-tag--disabled) {
  background: rgb(var(--by-surface));
  box-shadow: inset 0 0 0 1px rgba(var(--b-sc), 0.12);
}
#root .ds-textfield.ds-textfield--error .ds-textfield__field {
  background: rgb(var(--by-surface));
  box-shadow: inset 0 0 0 1px rgb(var(--oc-3));
}
#root .ds-textfield.ds-textfield--error.ds-textfield--focused .ds-textfield__field {
  box-shadow: inset 0 0 0 1px rgb(var(--oc-3)), 0 0 0 3px rgba(var(--oc-3), 0.18);
}
#root .large-market-button-bc {
  margin: 8px;
  border-radius: 10px;
  color: rgb(var(--b-sc));
  background: rgb(var(--by-surface));
  box-shadow: inset 0 0 0 1px rgba(var(--b-sc), 0.12);
  font-weight: 600;
}
#root .large-market-button-bc:hover {
  box-shadow: inset 0 0 0 1px rgba(var(--b-sc), 0.3);
}

/* Main stylesheet: menu badges, toasts, statuses, inbox, form errors, e-mail suggestions */
/* Menu badges set in the CMS (BETYAP TV): an ink chip instead of the platform's per-type colours */
#root .nav-menu-item[class*="badge-"]:after {
  color: rgb(var(--by-inverse-sc));
  background: rgb(var(--by-inverse));
  font-weight: 700;
}
/* a chosen special row (popular, upcoming, live...) gets a white icon meant for the platform's gradient; on our light row it vanishes */
#root .left-menu-scroll .sp-sub-list-bc:is(.selected, .a-color) > .sp-s-l-head-bc .sp-s-l-h-flag-bc {
  color: rgb(var(--b-sc));
}
/* Toasts after an action (bet placed, cash-out, bonus request): card shape and theme colours */
#root .Toastify .Toastify__toast {
  border-radius: 12px;
  box-shadow: var(--by-shadow-menu);
}
#root .Toastify .Toastify__toast-theme--colored.Toastify__toast--success:not(.new-message-toast-notification):not(.new-message-toast-notification-bonus):not(.cashback-notification) {
  background: rgb(var(--by-green));
}
#root .Toastify .Toastify__toast-theme--colored.Toastify__toast--error {
  background: rgb(var(--error));
}
#root .Toastify .Toastify__toast-theme--colored:is(.Toastify__toast--info, .Toastify__toast--warning) {
  background: rgb(17, 19, 24);
}
#root .Toastify .Toastify__toast--warning .Toastify__toast-icon {
  color: rgb(var(--hero));
}
/* cashback and loyalty notices: the platform draws them as blurred glass; here a white card */
#root .Toastify .Toastify__toast.cashback-notification,
#root .Toastify .toast-notification-message.Toastify__toast {
  color: rgb(var(--b-sc));
  background: rgb(var(--by-surface));
  backdrop-filter: none;
  box-shadow: var(--by-shadow-menu), 0 0 0 1px var(--by-line);
}
#root .toast-notification-message.Toastify__toast:before {
  display: none;
}
#root .toast-notification-icon {
  color: rgb(var(--b-sc));
}
#root .toast-close-all-button {
  color: #fff;
  background: rgb(17, 19, 24);
}

/* Status colours: pending, placed and returned read as muted ink; warning icons stay yellow */
#root [data-status="2"] {
  color: rgba(var(--b-sc), 0.55);
}
#root .bc-i-attention[data-status="2"] {
  color: rgb(var(--hero));
}
/* the platform marks this status colour !important (documents waiting for review) */
#root [data-status="10"] {
  color: rgba(var(--b-sc), 0.55) !important;
}

/* Inbox: white message cards instead of grey slabs; unread ones carry the yellow edge */
#root .message-block-bc {
  border-radius: 12px;
  background: rgb(var(--by-surface));
  box-shadow: inset 0 0 0 1px var(--by-line);
}
#root .message-block-bc[data-status="unread"] {
  box-shadow: inset 3px 0 0 rgb(var(--hero)), inset 0 0 0 1px var(--by-line);
}
#root .message-block-bc[data-status="unread"]:before {
  display: none;
}
#root .message-block-bc[data-status="unread"] .message-title-bc {
  color: rgb(var(--b-sc));
}

/* Form-level errors (registration, password reset, SMS login): a plain red line like the field errors */
#root .e-p-form-error-message-holder-bc .entrance-f-error-message-bc {
  padding: 6px 2px 0;
  border-radius: 0;
  color: rgb(var(--error));
  background: transparent;
  font-size: 12px;
}
/* "verified" after the captcha is a success message that the platform paints green */
#root .entrance-f-item-bc.recaptcha-field .entrance-f-error-message-bc {
  padding: 6px 2px 0;
  border-radius: 0;
  color: rgb(var(--by-green));
  background: transparent;
  font-size: 12px;
  font-weight: 600;
}
#root .checkbox-control-bc .form-control-message-bc {
  padding-inline-start: 28px;
}
/* locked fields (verified profile details) keep a light fill so they do not look editable */
#root .form-control-input-bc:is(:read-only, :disabled),
#root .form-control-bc:not(.compact-mode):not(.s-small) .form-control-select-bc:disabled {
  background: rgba(var(--b-sc), 0.04);
}

/* E-mail domain suggestions under the e-mail field: a white menu like the other dropdowns */
#root .form-control-email-suggested {
  padding: 4px;
  border-radius: 10px;
  background: rgb(var(--by-surface));
  box-shadow: var(--by-shadow-menu), 0 0 0 1px var(--by-line);
}
#root .form-control-email-suggested:before {
  display: none;
}
#root .form-control-email-list li {
  border-radius: 8px;
  color: rgba(var(--b-sc), 0.8);
  background: transparent;
  font-size: 13px;
}
#root .form-control-email-list li:is(.isActive, :hover) {
  color: rgb(var(--b-sc));
  background: rgba(var(--b-sc), 0.05);
}

/* Tab underline: 2px like the other active tabs, none under the segmented pills */
#root .selected-underline:before {
  height: 2px;
}
#root .layout-content-holder-bc .second-tabs-bc .tab-bc.selected-underline:before {
  display: none;
}

/* Main stylesheet: bet slip states, insurance, power bank, favourites tabs */
/* Bet slip states seen after login or a bet: header tabs, messages, stake field, express bonus */
#root .betslip-bc .bs-f-header-bc .tab-bc:not(.active) {
  color: rgba(var(--b-sc), 0.6);
  box-shadow: inset 0 -1px 0 var(--by-line);
}
#root .betslip-bc .bs-f-header-bc .tab-bc:not(.active):hover {
  color: rgb(var(--b-sc));
}
#root .betslip-bc .bs-f-header-bc .tab-bc.active {
  color: rgb(var(--b-sc));
  box-shadow: inset 0 -2px 0 rgb(var(--hero));
}
#root .quickBetMsgWrapper-bc:is(.betslip-success-message, .betslip-error-message, .betslip-info-message):not(:has(.bonusInfoCard)) {
  margin: 8px 12px 0;
  border-radius: 10px;
}
#root .quickBetMsgWrapper-bc.betslip-error-message {
  background: rgba(var(--oc-3), 0.1);
}
#root .quickBetMsgWrapper-bc.betslip-info-message:not(:has(.bonusInfoCard)) {
  background: rgba(var(--b-sc), 0.05);
}
#root .quickBetMsgWrapper-bc:is(.betslip-warning-message, .betslip-info-message) .bs-notification-icon-bc {
  color: rgba(var(--b-sc), 0.7);
}
/* the insufficient-balance line sits inside another warning, so it stays a plain line */
#root .bs-info-massages.for-betslip .quickBetMsgWrapper-bc.betslip-warning-message {
  margin: 0;
  background: transparent;
}
#root :is(.betslip-bc:not(.first-bet), .expressWidgetBetslip) .bs-bet-i-b-s-i-holder-bc ~ .bs-bet-i-b-s-i-block-bc:not(.active) {
  flex-shrink: 0;
  color: rgb(var(--b-sc));
  background: rgb(var(--by-surface));
  box-shadow: inset 0 0 0 1px rgba(var(--b-sc), 0.16);
  font-weight: 600;
  white-space: nowrap;
}
#root :is(.betslip-bc:not(.first-bet), .expressWidgetBetslip) .bs-bet-i-b-s-i-holder-bc ~ .bs-bet-i-b-s-i-block-bc:not(.active):hover {
  box-shadow: inset 0 0 0 1px rgba(var(--b-sc), 0.4);
}
#root .bs-bet-i-b-s-i-holder-bc:focus-within {
  border-color: rgb(var(--hero));
  box-shadow: 0 0 0 3px rgba(var(--hero), 0.28);
}
#root .bs-bet-i-b-prev-coefficient-bc {
  color: rgba(var(--b-sc), 0.45);
  font-weight: 500;
}
#root .bs-bet-i-body-bc.bordered {
  border-bottom-color: var(--by-line);
}
#root .bonusInfoCard {
  border: 1px solid var(--by-line);
  border-radius: 12px;
  background: rgb(var(--by-surface));
}
#root .bonusInfoLabel {
  border-radius: 6px;
  color: rgb(var(--hero-sc));
  background: rgb(var(--hero));
}
#root .bonusInfoLabel:before {
  display: none;
}
#root .bonusInfoIcon {
  background: rgba(var(--b-sc), 0.05);
}
#root .bonusTierCheck {
  color: rgb(var(--b-sc));
}
#root .bonusInfoValue {
  color: rgb(var(--b-sc));
  font-weight: 600;
  font-variant-numeric: tabular-nums;
}
/* System bet extras that appear only when the operator turns them on (bet insurance cuts, full cover) */
#root .bet-insurance {
  border-radius: 6px;
  background: rgba(var(--b-sc), 0.06);
}
#root .bet-insurance:before,
#root .bet-insurance:after {
  display: none;
}
#root .bet-insurance-content {
  color: rgb(var(--b-sc));
  font-weight: 600;
}
#root .betslip-multiples-bc .bs-bet-i-b-section-bc {
  margin: 0;
  background: transparent;
  box-shadow: inset 0 -1px 0 var(--by-line);
}
#root .betslip-multiples-input-bc {
  background: transparent;
}
/* Tool panel: the toggle shows the panel is open, its pointer stays white */
#root.smart-panel-is-visible .hdr-main-content-bc .hdr-toggle-button-bc {
  color: rgb(var(--by-inverse-sc));
  background: rgb(var(--by-inverse));
}
#root .hdr-smart-panel-holder-arrow-bc:after {
  border-bottom-color: transparent;
}
/* Bet slip links (log in, register, deposit) underline once, like content links */
#root .bet-slip-info-link {
  box-shadow: none;
  font-weight: 600;
  text-decoration-color: rgb(var(--hero));
  text-decoration-thickness: 2px;
  text-underline-offset: 3px;
}
#root .edit-bet-header-top {
  border-radius: 10px 10px 0 0;
  color: rgb(var(--b-sc));
  background: rgba(var(--hero), 0.16);
}
#root .edit-bet-header-bottom {
  margin-top: 0;
  border-radius: 0 0 10px 10px;
  color: rgba(var(--b-sc), 0.7);
  background: rgba(var(--hero), 0.08);
}
#root .bankerEventBadge {
  color: rgb(var(--b-sc));
  background: rgba(var(--hero), 0.16);
}
/* Floating bet slip (opened from the tool panel where the slip column is hidden) */
#root .betslip-bc.full.Full {
  border-color: var(--by-line);
  border-radius: 16px 16px 0 0;
  box-shadow: var(--by-shadow-pop);
}
#root .betslip-bc.full.Full #betslip_container {
  background: transparent;
}
#root.betslip-Full .sp-button-bc[data-component="Betslip"] {
  color: rgb(var(--b-sc));
  background: rgba(var(--b-sc), 0.06);
}
#root.betslip-Full .sp-button-icon-bc.bc-i-betslip {
  color: inherit;
}
#root .form-control-email-list li:hover {
  background: rgba(var(--b-sc), 0.05);
}
#root.has-sub-navigation .layout-header-holder-bc {
  border-bottom-color: var(--by-line);
}
/* Power Bank (borrowing) pop-ups: flat header and plain white cards */
#root .power-bank-header {
  background-image: none;
  background-color: rgba(var(--b-sc), 0.03);
  box-shadow: inset 0 -1px 0 var(--by-line);
}
#root .power-bank-header:after {
  display: none;
}
#root .power-bank-header__close {
  -webkit-backdrop-filter: none;
  backdrop-filter: none;
}
#root .power-bank-how-it-works {
  border-color: var(--by-line);
  border-radius: 12px;
  background: rgb(var(--by-surface));
  box-shadow: none;
}
#root .power-bank-product-modal__option {
  border-color: var(--by-line);
  border-radius: 12px;
  background: rgb(var(--by-surface));
}
#root .power-bank-product-modal__option:not(.power-bank-product-modal__option--selected):hover {
  border-color: rgba(var(--b-sc), 0.3);
}
#root .power-bank-product-modal__option--selected {
  border-color: rgb(var(--hero));
  background: rgba(var(--hero), 0.1);
  box-shadow: inset 0 0 0 1px rgb(var(--hero));
}
/* Favourites panel: Sport / Casino tabs are segmented like the page tabs */
#root .smart-panel-tabs-bc .second-tabs-bc {
  height: 38px;
  padding: 3px;
  border-radius: 10px;
  background: rgba(var(--b-sc), 0.05);
}
#root .smart-panel-tabs-bc .second-tabs-bc .tab-bc {
  margin: 0;
  border-radius: 8px;
  color: rgba(var(--b-sc), 0.6);
  background: transparent;
  font-weight: 600;
  box-shadow: none;
}
#root .smart-panel-tabs-bc .second-tabs-bc .tab-bc:hover {
  color: rgb(var(--b-sc));
}
#root .smart-panel-tabs-bc .second-tabs-bc .tab-bc.active {
  color: rgb(var(--b-sc));
  background: rgb(var(--by-surface));
  box-shadow: 0 1px 3px rgba(17, 19, 24, 0.12);
}
/* Side panel (notifications, favourites, settings) */
#root .sidePanel-holder-bc:before {
  background: rgba(17, 19, 24, 0.64);
}
#root .sidePanel-holder {
  border-top-color: var(--by-line);
}
/* Bet slip: the typed stake reads as a number, the hint stays muted */
#root .bs-bet-i-b-s-i-bc {
  color: rgb(var(--b-sc));
  font-weight: 600;
  font-variant-numeric: tabular-nums;
}
#root .bs-bet-i-b-s-i-bc::placeholder {
  color: rgba(var(--b-sc), 0.45);
  font-weight: 400;
}
/* pop-ups opened inside the bet slip fill it, so they take its corners and no shadow */
#root #betslip_container .popup-inner-bc {
  border-radius: 12px;
  box-shadow: none;
}
#root .banner-a-lot > * {
  overflow: hidden;
  border-radius: 12px;
}

/* Live stream (signed in) */
/* Full-screen live stream: a dark layer over the video, so inside it the variables go dark and the accents back to yellow; its bet slip is a white card */
#root .streamFullScreen {
  --b: 17, 19, 24;
  --b-sc: 255, 255, 255;
  --by-inverse: 255, 255, 255;
  --by-inverse-sc: 17, 19, 24;
  --oc-1: 255, 204, 51;
  --oc-1-sc: 17, 19, 24;
  --oc-2: 255, 204, 51;
  --accent: 255, 204, 51;
  --accent-sc: 17, 19, 24;
}
#root .streamFullScreen .streamFullScreenExit {
  border-radius: 8px;
  background: rgba(17, 19, 24, 0.72);
}
#root .streamFullScreen :is(.streamFullScreenExit, .sp-sub-list-bc, .sp-s-l-head-bc, .sp-s-l-h-arrow-icon-bc):after,
#root .streamFullScreen .sp-s-l-b-content-bc:before {
  display: none;
}
#root .streamFullScreen .left-menu-scroll > .sp-sub-list-bc.active > .sp-s-l-head-bc {
  background: transparent;
}
/* the sports menu rule paints this arrow with !important because the platform tints it inline, so only !important reaches it */
#root .streamFullScreen .left-menu-scroll .sp-s-l-h-arrow-icon-bc {
  color: rgba(255, 255, 255, 0.9) !important;
}
#root .streamFullScreen.portrait-primary .streamCarousel .left-menu-scroll .sp-sub-list-bc.active {
  border-radius: 12px;
  background: rgba(17, 19, 24, 0.72);
}
#root .streamFullScreen.portrait-primary .streamFullScreenCashoutContent .left-menu-scroll > .sp-sub-list-bc > .sp-s-l-head-bc,
#root .streamFullScreen.portrait-primary .streamCarousel .left-menu-scroll > .sp-sub-list-bc:not(.active) > .sp-s-l-head-bc {
  border-radius: 10px;
  background: rgba(17, 19, 24, 0.72);
  box-shadow: none;
}
#root .streamFullScreen.portrait-primary .streamFullScreenCashoutContent .horizontal-sl-item-bc:not(:empty) {
  border-radius: 12px;
  background: rgba(17, 19, 24, 0.72);
  backdrop-filter: none;
}
#root .streamFullScreen.landscape-primary .streamCarousel .left-menu-scroll .sp-sub-list-bc.active {
  margin-bottom: -50px;
}
#root .streamFullScreen.landscape-primary .streamCarousel .left-menu-scroll .sp-s-l-head-bc {
  height: 100%;
  padding: 0;
  box-shadow: none;
}
#root .streamFullScreen.landscape-primary .streamCarousel .left-menu-scroll .sp-s-l-b-content-bc {
  margin-top: 4px;
  border-radius: 12px;
  background: rgba(17, 19, 24, 0.8);
}
#root .streamFullScreen.landscape-primary .marketSliderHeader {
  background: transparent;
}
#root .streamFullScreen.landscape-primary .streamFullScreenCashoutContent .left-menu-scroll .sp-sub-list-bc {
  max-height: none;
  margin-top: 16px;
  margin-inline-start: auto;
  padding: 8px;
  border-start-start-radius: 12px;
  border-end-start-radius: 12px;
  background: rgba(17, 19, 24, 0.72);
}
#root .streamFullScreen.landscape-primary .streamFullScreenCashoutContent .left-menu-scroll .sp-sub-list-bc.active {
  padding: 16px;
}
#root .streamFullScreen.landscape-primary .streamFullScreenCashoutContent .left-menu-scroll .sp-s-l-head-bc {
  height: auto;
  padding: 0;
  box-shadow: none;
}
#root .streamFullScreen.landscape-primary :is(.streamingBetHistoryContent, .streamingRequestPopup) {
  padding: 8px 0;
  border: 0;
  border-radius: 0;
  background: transparent;
}
#root .streamFullScreen.landscape-primary .streamingBetHistoryContent + .streamingBetHistoryContent {
  margin-top: 0;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.1);
}
#root .streamFullScreenCashoutContent :is(.bet-history-stake-odds, .bet-history-possible-win-block) {
  border-radius: 8px;
}
#root .streamFullScreen .streamBetslip {
  color: rgb(17, 19, 24);
  background: rgb(var(--by-surface));
}
#root .streamFullScreen.portrait-primary .streamBetslip {
  border-radius: 16px 16px 0 0;
}
#root .streamFullScreen.landscape-primary .streamBetslip {
  border-radius: 12px;
}
#root .streamFullScreen .streamBetslip:before {
  display: none;
}
#root .streamFullScreen .streamBetslip .betslip-first-bet-content-bc {
  backdrop-filter: none;
  box-shadow: none;
}
#root .streamBetslip .quickBetWrapper-bc .bs-bet-i-b-s-i-holder-bc:not(.active) {
  border: 1px solid rgba(17, 19, 24, 0.16);
  border-radius: 8px;
  background: rgb(var(--by-surface));
}
#root .streamBetslip .quickBetWrapper-bc :is(.bs-bet-i-b-s-i-block-bc + .bs-bet-i-b-s-i-block-bc:not(.active), .bs-number-button-bc) {
  border-radius: 8px;
  background: rgba(17, 19, 24, 0.06);
}
#root .streamBetslip .quickBetWrapper-bc :is(.bs-bet-i-b-s-i-block-bc + .bs-bet-i-b-s-i-block-bc:not(.active), .bs-number-button-bc):hover {
  background: rgba(17, 19, 24, 0.1);
}
#root .streamBetslip :is(.bs-bet-i-b-amount-bc, .bs-bet-i-b-coefficient-bc.c-2) {
  border-radius: 8px;
  background: rgb(17, 19, 24);
}
#root .streamBetslip .bs-bet-i-body-bc {
  border-bottom-color: var(--by-line);
}
#root .streamBetslip :is(.betslip-power-bank, .bet-slip-switcher-row-bc) {
  background: rgba(17, 19, 24, 0.05);
}
#root .streamFullScreen .bs-info-massages-w-bc {
  border-radius: 8px;
}
#root .streamFullScreen .quickBetMsgIcon-bc {
  color: rgb(17, 19, 24);
}
#root .expressWidgetWrapper > .page-view-more {
  padding-inline: 0;
}
#root .power-bank-leaderboard-banner__title {
  color: rgb(var(--b-sc));
  font-size: 16px;
  font-weight: 700;
  letter-spacing: 0.01em;
  text-transform: uppercase;
}
#root .loyaltyLevelInfoTitle {
  color: rgb(var(--b-sc));
  font-size: 16px;
  font-weight: 700;
  letter-spacing: 0.01em;
  text-transform: uppercase;
}
#root :is(.sgm-markets-head-bc > .sgm-m-h-title-bc, .gameSuggestedEvent .competition-title-bc) {
  color: rgb(var(--b-sc));
  font-size: 12px;
  font-weight: 700;
  letter-spacing: 0.03em;
  text-transform: uppercase;
}
#root .left-menu-scroll .sp-sub-list-bc:is(.upcoming-matches, .popular-matches, .popular-competitions) > .sp-s-l-head-bc .sp-s-l-h-title-bc,
#root.e-sports .left-menu-scroll .sp-sub-list-bc:is(.all, .upcoming, .live, .results) > .sp-s-l-head-bc .sp-s-l-h-title-bc {
  text-transform: uppercase;
}
/* the platform hovers odds in the selection yellow; an ink tint and hairline keep yellow for picked odds only */
#root .market-bc:not(.active):not(.disabled-market-bc):not(.m-g-header):not(.market-base):hover {
  color: rgb(var(--b-sc));
  background: rgba(var(--b-sc), 0.1);
  box-shadow: inset 0 0 0 1px rgba(var(--b-sc), 0.24);
}
/* the platform turns the falling-odds arrow ink on hover, which only made sense on its yellow */
#root .market-bc:not(.active):not(.disabled-market-bc):not(.m-g-header):hover > .market-coefficient-bc > .market-arrow-up-down-bc.is-down {
  border-color: transparent transparent rgb(var(--oc-3)) transparent;
}
#root .featuredGameItemPlayerNameVersion1 {
  font-weight: 600;
}
#root .featuredGameItemTimeVersion1 time + time {
  color: rgba(var(--b-sc), 0.6);
}
#root .featuredGameItemVersion1 .market-bc .market-name-bc {
  color: rgba(var(--b-sc), 0.6);
  font-size: 11px;
}
#root .featuredGameItemVersion1 .market-odd-bc {
  font-size: 15px;
  font-weight: 700;
}
#root .multi-column-time-icon time,
#root .multi-column-content > li:last-child {
  color: rgba(var(--b-sc), 0.6);
  font-variant-numeric: tabular-nums;
}
#root .multi-column-content > li:last-child:hover {
  color: rgb(var(--b-sc));
}
#root .horizontal-sl-tab-bc.active {
  color: rgb(var(--b-sc));
}
/* the platform pulses a yellow glow ring around the early-payout info icon without end */
#root :is(.sgm-market-info, .betslipInfoAnimation) .tooltipIconWrapper,
#root :is(.sgm-market-info, .betslipInfoAnimation) .tooltipIconWrapper:after {
  animation: none;
}
/* the empty-slip ticket is drawn white for dark themes; on the white slip it is turned dark */
#root .betslipQuickBetContent img {
  filter: invert(1);
}
#root .betslipQuickBetContent > span {
  color: rgba(var(--b-sc), 0.6);
  font-size: 13px;
}
#root .betslipQuickBetContent > span:first-of-type {
  color: rgb(var(--b-sc));
  font-size: 15px;
  font-weight: 700;
}
#root .betslip-bc:has(.betslipQuickBetContent) .bet-button-wrapper-bc {
  display: none;
}
#root .left-menu-scroll .market-game-part {
  color: rgb(var(--error));
  font-weight: 600;
}
#root .left-menu-scroll .market-game-part:before {
  content: "";
  display: inline-block;
  width: 6px;
  height: 6px;
  margin-inline-end: 6px;
  border-radius: 50%;
  background: rgb(var(--oc-3));
  vertical-align: 1px;
}
#root .left-menu-scroll .market-game-additional-info {
  color: rgba(var(--b-sc), 0.75);
  font-variant-numeric: tabular-nums;
}
@keyframes by-live-pulse {
  50% {
    opacity: 0.55;
  }
}
@media (prefers-reduced-motion: no-preference) {
  #root .left-menu-scroll .market-game-part:before,
  #root .e-sports-time-info.live:before {
    animation: by-live-pulse 2s ease-in-out infinite;
  }
}
#root .e-sports-time-info.live {
  display: inline-flex;
  align-items: center;
  font-weight: 600;
}
#root .e-sports-time-info.live:before {
  content: "";
  width: 6px;
  height: 6px;
  margin-inline-end: 6px;
  border-radius: 50%;
  background: rgb(var(--by-surface));
}
#root .e-sports-match-title {
  color: rgb(var(--b-sc));
  font-size: 13px;
  font-weight: 700;
  font-variant-numeric: tabular-nums;
}
#root .game-details-c-head-time-bc {
  font-weight: 600;
}
/* the kit icon's layout ships with the e-sports styles, which load only once the timeline opens; until then shirt and shorts sat side by side against the team name */
#root .game-details-container-inner-bc .game-events-list-icons {
  display: flex;
  flex-direction: column;
  align-items: center;
  margin-inline-end: 6px;
}
#root .game-details-container-inner-bc .game-events-list-icons svg + svg {
  margin-top: -1px;
}
/* kit colours are inline: a hairline edge keeps a dark kit visible on the scoreboard */
#root .game-details-container-inner-bc .game-events-list-icons path {
  stroke: rgba(255, 255, 255, 0.7);
  stroke-width: 80px;
  paint-order: stroke;
}
/* the period chip was half yellow over the photo, which reads olive; white on ink like the rest of the panel */
#root .game-details-c-head-time-bc:nth-child(2):not(:last-child) {
  color: #fff;
  background: rgba(255, 255, 255, 0.16);
}
#root .game-details-c-head-time-bc + .game-details-c-head-time-bc:not(.stoppage-time) {
  font-weight: 700;
}
#root .game-details-c-body-bc > .game-details-c-body-numbers-bc > .game-details-c-b-r-c-score-item-bc.point {
  font-weight: 700;
}
/* the platform's dark film is square, so its corners showed past our rounded top */
#root .game-details-container-inner-bc:before {
  border-radius: inherit;
}
#root .c-country-bc-text .c-title-bc:first-child:not(:last-child) {
  color: rgba(var(--b-sc), 0.6);
  font-size: 11px;
  font-weight: 500;
}
#root .c-country-bc-text .c-title-bc:last-child:not(:first-child) {
  color: rgb(var(--b-sc));
  font-size: 13px;
  font-weight: 600;
}
#root .e-sports-match-container .market-odd-bc {
  font-size: 15px;
  font-weight: 700;
}
/* team logos arrive white for dark screens and kits can be white; a hairline ink edge keeps them visible on white */
#root :is(.e-sports-match-team-img img, .statistics-timeline-team-img, .e-sports-team-logo img, .game-events-list-icon-bc.bc-i-players) {
  filter: drop-shadow(0 0 1px rgba(17, 19, 24, 0.6));
}
/* the platform writes TÜMÜ (and MAÇLAR) in capitals next to sentence-case tab names */
#root .horizontal-sl-tab-bc[data-id="-1"],
#root.e-sports .horizontal-sl-tab-bc:first-child {
  text-transform: lowercase;
}
#root .horizontal-sl-tab-bc[data-id="-1"]::first-letter,
#root.e-sports .horizontal-sl-tab-bc:first-child::first-letter {
  text-transform: uppercase;
}
#root.e-sports .main-tabs-bc .tab-bc {
  text-transform: uppercase;
}
/* the platform ships this as an extra-small transparent button with a fixed 24px height */
#root .bbAiRecBetsItem__footer .ds-btn.bbAiRecBetsItem__addBtn {
  height: 36px;
  min-height: 36px;
  max-height: 36px;
  padding: 0 18px;
  border-radius: 8px;
}
#root .bbAiRecBetsItem__footer .ds-btn.bbAiRecBetsItem__addBtn:not(:disabled) {
  color: rgb(var(--hero-sc));
  background: rgb(var(--hero));
  box-shadow: none;
}
#root .bbAiRecBetsItem__addBtn .btn__label {
  color: inherit;
  font-size: 13px;
  font-weight: 700;
}
#root .bbAiRecBetsItem__oddsValue {
  font-size: 16px;
  font-weight: 800;
}
#root :is(.bbAiRecBetsItem__marketLabel, .bbAiRecBetsItem__totalLabel, .bbAiRecBetsItem__meta, .bbAiRecBetsItem__meta time, .expressWidgetDayTime, .expressWidgetBetslipEventText span) {
  color: rgba(var(--b-sc), 0.62);
}
#root .power-bank-leaderboard-row .badge.badge--odds.badge--subtle {
  background: rgba(var(--by-green), 0.1);
}
#root .power-bank-leaderboard-row .badge :is(.ds-label, .ds-caption) {
  color: rgb(var(--by-green));
}
/* the top jackpot is the casino's prize moment: a local ink card with the amount in brand yellow */
#root .casino-jackpot-widget__pool-first .jackpot-pool {
  background: rgb(var(--by-inverse));
  box-shadow: none;
}
#root .casino-jackpot-widget__pool-first .jackpot-pool__title {
  color: rgba(255, 255, 255, 0.64);
}
#root .casino-jackpot-widget :is(.jackpot-pool__price, .jackpot-pool__currency-symbol) {
  font-size: 18px;
}
#root .casino-jackpot-widget__pool-first :is(.jackpot-pool__price, .jackpot-pool__currency-symbol) {
  color: rgb(var(--hero));
  font-size: 26px;
  font-weight: 800;
}
#root .casino-jackpot-widget__pool-first .jackpot-pool__money-inner {
  height: 32px;
}
#root .tournamentsWidgetAmountTitle {
  color: rgba(var(--b-sc), 0.6);
  font-size: 11px;
  font-weight: 600;
  letter-spacing: 0.06em;
  text-transform: uppercase;
}
#root .tournamentsWidgetButtons .btn__label {
  font-weight: 600;
}
/* the platform only disables the join button once the player has joined */
#root .tournamentsWidgetButtons .ds-btn.ds-btn--disabled {
  color: #fff;
  background: rgb(var(--by-green));
}
#root .casinoGameItemLabelBc {
  font-weight: 600;
}
#root .casinoGameButtons .ds-btn-variant--transparent-static-light {
  background: transparent;
  box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.5);
}
#root .casinoGameButtons .btn__label {
  font-weight: 600;
}
/* the platform pins the xs button with height, min-height and max-height, so all three move together */
#root .casinoGameButtons .ds-btn {
  height: 32px;
  min-height: 32px;
  max-height: 32px;
  border-radius: 8px;
}
/* only the lobby grid lifts: carousel slides clip their tiles, so a lift there would crop the top edge */
#root .casinoGamesList .casinoGameItemContent:hover {
  transform: translateY(-3px);
  box-shadow: 0 10px 24px rgba(17, 19, 24, 0.18);
}
@media (prefers-reduced-motion: no-preference) {
  #root .casinoGamesList .casinoGameItemContent {
    transition: transform 0.18s ease, box-shadow 0.18s ease;
  }
}
#root .casino-winners-info > span {
  color: rgba(var(--b-sc), 0.6);
}
#root .casino-info-block {
  position: relative;
}
#root .casino-tournament-all {
  position: absolute;
  top: 14px;
  inset-inline-end: 0;
  margin-top: 0;
  color: rgba(var(--b-sc), 0.6);
  font-weight: 600;
}
#root :is(.casinoGameProviderFilters, .casino-jackpot-games__search) :is(.ds-textfield__label, .ds-select__label) {
  color: rgba(var(--b-sc), 0.6);
}
#root .casinoTournamentSectionContentElBc {
  gap: 8px;
}
/* the podium medals get their own column beside the place number instead of sitting on the row's corner */
#root .Prize .casinoTournamentInfoRowWrp:nth-child(-n+3) .casinoTournamentInfoRow:before {
  top: 8px;
  inset-inline-start: 12px;
}
#root .Prize .casinoTournamentInfoRowClm.center {
  padding-inline-start: 24px;
}
#root .Prize .casinoTournamentInfoRowWrp:nth-child(-n+3) .casinoTournamentInfoRowClm {
  color: rgb(var(--b-sc));
  font-weight: 600;
}
/* the category row's edge fade is painted with --b, so pointing --b at the canvas makes it melt into the page */
#root .casinoCategories {
  --b: var(--by-canvas);
}
/* the platform's coin and puzzle watermarks turn into grey slabs on our balance cards */
#root .u-i-p-a-content-bc:after {
  display: none;
}
/* without their icons both labels fit their half of the card instead of ending in an ellipsis */
#root :is(.u-i-p-a-deposit-bc, .u-i-p-a-withdraw-bc) {
  padding: 0 6px;
  font-weight: 600;
}
#root :is(.u-i-p-a-deposit-bc, .u-i-p-a-withdraw-bc) i {
  display: none;
}
#root .loyaltyProgramInfo {
  background: rgb(17, 19, 24);
}
/* the medal's glow arrives inline in the level colour */
#root .loyaltyProgramImg img {
  filter: none !important;
}
#root .loyaltyProgramInfo :is(.loyaltyPointsLevelValue, .loyaltyPointsNumbersNext, .loyaltyPointsLevelPoints) {
  color: #fff;
}
#root .loyaltyProgramInfo :is(.loyaltyPointsLevelInfo, .loyaltyPointsNumbersPrev, .loyaltyPointsLevelPointsItem, .loyaltyProgressPoints) {
  color: rgba(255, 255, 255, 0.6);
}
#root :is(.casino-borrow-possible-win-widget__text, .casino-borrow-possible-win-widget__amount-label) {
  color: rgba(var(--b-sc), 0.7);
}
#root .casino-borrow-possible-win-widget__info-icon {
  color: rgba(var(--b-sc), 0.45);
}
#root .casino-borrow-possible-win-widget__amount-value {
  color: rgb(var(--b-sc));
  font-weight: 700;
  font-variant-numeric: tabular-nums;
}
#root .betHistoryListEl:has(.bethistoryListEl-item-status [data-status="1"]) .bet-history-possible-win {
  color: rgb(var(--by-green));
}
#root :is(.sportBonusFundTitle-bc, .sportBonusFundResult-title) {
  color: rgba(var(--b-sc), 0.6);
  font-size: 11px;
  font-weight: 600;
  letter-spacing: 0.04em;
  text-transform: uppercase;
}
#root .sportBonusFundPrice-bc {
  color: rgb(var(--b-sc));
  font-size: 15px;
  font-weight: 700;
  font-variant-numeric: tabular-nums;
}
#root .sportBonusFundResult-total {
  color: rgb(var(--b-sc));
  font-size: 20px;
  font-weight: 700;
  font-variant-numeric: tabular-nums;
}
#root .sportBonus-value {
  font-weight: 600;
  font-variant-numeric: tabular-nums;
}
/* the details column is too narrow for BONUSU AKTİF ET with the platform's 20px padding */
#root .sportBonusDetails-buttons .btn {
  padding: 0 12px;
}
#root .btn.a-color.deposit:not(:disabled) {
  color: #fff;
  background: rgb(var(--by-green));
}
#root .btn.a-color.deposit:not(:disabled):hover {
  background: rgb(var(--by-green-hover));
}
#root .promotion-details-popup .overlay-header {
  border-bottom: 1px solid var(--by-line);
}
#root .promotion-details-popup .overlay-header .back-nav-title-bc-h1 {
  color: rgb(var(--b-sc));
  font-size: 15px;
  font-weight: 700;
}
#root .promotion-details-info :is(ul, ol) {
  padding-inline-start: 20px;
}
#root .promotion-details-info li {
  list-style-position: outside;
}
#root .promotion-details-info li::marker {
  color: rgba(var(--b-sc), 0.4);
}
#root :is(.description-c-row-bc .description-instant, .payment-info-content .expandableContentData p, .u-i-p-p-u-i-d-user-id-bc) {
  color: rgba(var(--b-sc), 0.65);
}
/* the scroll arrow is transparent, so the next tab name showed through it */
#root .sgm-market-search .horizontal-sl-arrow {
  background: rgb(var(--by-surface));
}
/* the third-party insights carousel lines up with its section title */
#root .gameSuggestedEvent .betinsights-iframe-container {
  padding-inline-start: 7px;
}
/* the insights frame ignores our stylesheet and paints yellow prices on grey cards; the filter turns them into ink prices on light cells */
#root .gameSuggestedEvent .betinsights-iframe-container iframe {
  filter: hue-rotate(270deg) saturate(8) grayscale(1) contrast(1.27);
}
/* with a mouse the frame also fills the hovered button with that yellow under dark text; a mid grey keeps prices, hovered and picked buttons readable */
@media (hover: hover) and (pointer: fine) {
  #root .gameSuggestedEvent .betinsights-iframe-container iframe {
    filter: hue-rotate(270deg) saturate(10) sepia(0.6) grayscale(1) brightness(0.94) contrast(1.15);
  }
  /* once the skin's Odds colour is ink the price no longer shares the hover yellow; a lighter grey keeps the hovered name and price and the picked button readable (the frame always writes picked text white, so a yellow fill would hide it) */
  html[style*="--oc-2: 17, 19, 24"] #root .gameSuggestedEvent .betinsights-iframe-container iframe {
    filter: hue-rotate(270deg) saturate(5) sepia(0.4) grayscale(1) brightness(0.98) contrast(1.08);
  }
}
/* the default Counter-Strike logo is a dark silhouette that vanished on the ink panel; a white tile reads with any logo colour */
#root .e-sports-game-details .e-sports-team-logo {
  padding: 4px;
  border-radius: 10px;
  background: rgb(var(--by-surface));
}
/* the PowerBank wordmark is drawn white, so on the light row it keeps a small ink plate */
#root .casino-borrow-possible-win-widget-wide__logo {
  box-sizing: content-box;
  padding: 5px 10px;
  border-radius: 6px;
  background: rgb(17, 19, 24);
}
/* the platform darkens this button with a 12% ink layer on hover; the house primary hover is the deeper brand amber */
#root .bbAiRecBetsItem__footer .ds-btn.bbAiRecBetsItem__addBtn:not(:disabled):hover {
  background: rgb(var(--hero-hover));
}
#root .bbAiRecBetsItem__footer .ds-btn.bbAiRecBetsItem__addBtn:not(:disabled):hover:before {
  background: transparent;
}
/* the jackpot page widget spans the page, so the grand pool keeps one tier's width and stays a card, not a band */
#root .casino-jackpot-widget:not(.casino-jackpot-widget--widget) .casino-jackpot-widget__pool-first {
  width: 100%;
  max-width: calc((100% - 24px) / 3);
  margin-inline: auto;
}
/* the place numbers sit right of the medal column, so their header moves with them */
#root .tournamentDetailsHeaderItem:has(> .bc-i-prizes) .tourDetHeaderBottomRowItem.center {
  padding-inline-start: 24px;
}
/* ===== Casino: a warm gold salon; the sportsbook stays in plain daylight ===== */
/* inside the casino pages selections turn gold instead of ink and hairlines take a gold tint; no dark surfaces */
#root:is(.casino-slots, .live-casino-games, .tournament, .jackpot, .tv-games, .virtual-sports) :is(.layout-header-holder-bc, .layout-content-holder-bc, .layout-footer-holder-bc, .layout-navigation-holder-bc) {
  --accent: 255, 204, 51;
  --accent-sc: 17, 19, 24;
  --oc-1: 255, 204, 51;
  --oc-1-sc: 17, 19, 24;
  --by-inverse: 255, 204, 51;
  --by-inverse-sc: 17, 19, 24;
  --by-line: rgba(176, 132, 30, 0.16);
  --by-gold-deep: 156, 110, 0;
}
/* a thin gold line under the header marks the casino */
#root:is(.casino-slots, .live-casino-games, .tournament, .jackpot, .tv-games, .virtual-sports) .header-bc {
  box-shadow: inset 0 -2px 0 rgba(255, 204, 51, 0.7);
}
/* the platform writes the idle links of the second header row at half ink, too faint on white */
#root:is(.casino-slots, .live-casino-games, .tournament, .jackpot, .tv-games, .virtual-sports) .nav-menu-container.header-navigation:nth-child(2) .nav-menu-item:not(.active) {
  color: rgba(var(--b-sc), 0.6);
}

/* Section titles: ink signage led by a gold karo, the suit the jackpot tiers already speak */
#root:is(.casino-slots, .live-casino-games, .tournament, .jackpot, .tv-games, .virtual-sports) .sectionTitleText,
#root:is(.casino-slots, .live-casino-games, .tournament, .jackpot, .tv-games, .virtual-sports) .tournamentSectionInfoTitle,
#root:is(.casino-slots, .live-casino-games, .tournament, .jackpot, .tv-games, .virtual-sports) .page-view-more .view-title-more {
  letter-spacing: 0.06em;
}
#root:is(.casino-slots, .live-casino-games, .tournament, .jackpot, .tv-games, .virtual-sports) :is(.sectionTitleText, .tournamentSectionInfoTitle)::before {
  content: "";
  display: inline-block;
  width: 7px;
  height: 7px;
  margin-inline: 2px 12px;
  border-radius: 1px;
  background: linear-gradient(135deg, rgb(255, 222, 120), rgb(226, 160, 0));
  transform: scaleY(1.25) rotate(45deg);
  vertical-align: 0.14em;
}

/* Hero banners sit in a soft gold light */
#root:is(.casino-slots, .live-casino-games, .tournament, .jackpot, .tv-games, .virtual-sports) .hm-row-bc.has-slider :is(.sdr-item-bc, .sdr-image-bc) {
  box-shadow: 0 0 0 1px rgba(226, 160, 0, 0.28), 0 16px 40px rgba(120, 90, 20, 0.16);
}

/* Category chips and the filter bar: white on a gold hairline; the chosen chip is gold */
#root:is(.casino-slots, .live-casino-games, .tournament, .jackpot, .tv-games, .virtual-sports) .ds-chip:not(.ds-chip--selected) {
  background: #fff;
  box-shadow: inset 0 0 0 1px rgba(176, 132, 30, 0.22), 0 1px 2px rgba(120, 90, 20, 0.06);
}
#root:is(.casino-slots, .live-casino-games, .tournament, .jackpot, .tv-games, .virtual-sports) .ds-chip:not(.ds-chip--selected) .chip__icon {
  color: rgb(var(--by-gold-deep));
}
#root:is(.casino-slots, .live-casino-games, .tournament, .jackpot, .tv-games, .virtual-sports) .casinoGameProviderFilters .ds-textfield.ds-textfield-layout--fill:not(.ds-textfield--focused):not(.ds-textfield--error) .ds-textfield__field,
#root:is(.casino-slots, .live-casino-games, .tournament, .jackpot, .tv-games, .virtual-sports) .casinoGameProviderFilters .ds-select.ds-select-layout--fill:not(.ds-select--focused):not(.ds-select--error) .ds-select__field,
#root:is(.casino-slots, .live-casino-games, .tournament, .jackpot, .tv-games, .virtual-sports) :is(.horizontal-scroll__arrow, .sectionTitleBtnWrapper .ds-btn) {
  box-shadow: inset 0 0 0 1px rgba(176, 132, 30, 0.22), 0 1px 2px rgba(120, 90, 20, 0.06);
}
#root:is(.casino-slots, .live-casino-games, .tournament, .jackpot, .tv-games, .virtual-sports) .ds-chip:not(.ds-chip--selected):hover,
#root:is(.casino-slots, .live-casino-games, .tournament, .jackpot, .tv-games, .virtual-sports) .casinoGameProviderFilters .ds-select.ds-select-layout--fill:not(.ds-select--focused):not(.ds-select--error):hover .ds-select__field,
#root:is(.casino-slots, .live-casino-games, .tournament, .jackpot, .tv-games, .virtual-sports) :is(.horizontal-scroll__arrow, .sectionTitleBtnWrapper .ds-btn:not(.ds-btn--disabled)):hover {
  box-shadow: inset 0 0 0 1px rgba(226, 160, 0, 0.7);
}

/* Gold calls to play: random game, play from the game info, join a tournament */
#root:is(.casino-slots, .live-casino-games, .tournament, .jackpot, .tv-games, .virtual-sports) .casinoRandomGameButtonWrapper .ds-btn,
#root:is(.casino-slots, .live-casino-games, .tournament, .jackpot, .tv-games, .virtual-sports) .cgdActionsWrp .ds-btn-variant--primary,
#root:is(.casino-slots, .live-casino-games, .tournament, .jackpot, .tv-games, .virtual-sports) .tournamentJoinButton .button:not(.joined),
#root:is(.casino-slots, .live-casino-games, .tournament, .jackpot, .tv-games, .virtual-sports) .tournamentsWidgetButtons .ds-btn-variant--primary:not(.ds-btn--disabled) {
  color: rgb(17, 19, 24);
  background: linear-gradient(180deg, rgb(255, 219, 107), rgb(255, 196, 30));
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.55), 0 4px 12px rgba(226, 160, 0, 0.25);
}
/* the label sets its own weight */
#root:is(.casino-slots, .live-casino-games, .tournament, .jackpot, .tv-games, .virtual-sports) .casinoRandomGameButtonWrapper .btn__label,
#root:is(.casino-slots, .live-casino-games, .tournament, .jackpot, .tv-games, .virtual-sports) .cgdActionsWrp .ds-btn-variant--primary .btn__label {
  font-weight: 600;
}
/* the platform's hover layer dulls the gold to olive; under the pointer it brightens and a glint passes */
#root:is(.casino-slots, .live-casino-games, .tournament, .jackpot, .tv-games, .virtual-sports) .casinoRandomGameButtonWrapper .ds-btn:hover:not(:disabled)::before {
  background: rgba(255, 255, 255, 0.18);
}
#root:is(.casino-slots, .live-casino-games, .tournament, .jackpot, .tv-games, .virtual-sports) .casinoRandomGameButtonWrapper .ds-btn::after {
  background: linear-gradient(115deg, transparent 38%, rgba(255, 255, 255, 0.5) 50%, transparent 62%) -160% 0 / 250% 100% no-repeat;
}
#root:is(.casino-slots, .live-casino-games, .tournament, .jackpot, .tv-games, .virtual-sports) .casinoRandomGameButtonWrapper .ds-btn:hover::after {
  background-position: 160% 0;
}
@media (prefers-reduced-motion: no-preference) {
  #root:is(.casino-slots, .live-casino-games, .tournament, .jackpot, .tv-games, .virtual-sports) .casinoRandomGameButtonWrapper .ds-btn::after {
    transition: background-position 0.9s ease;
  }
}
/* the join button's own hover colour hides under the gradient, so the gradient itself brightens */
#root:is(.casino-slots, .live-casino-games, .tournament, .jackpot, .tv-games, .virtual-sports) .tournamentJoinButton .button:not(.joined):hover {
  background: linear-gradient(180deg, rgb(255, 225, 134), rgb(255, 207, 70));
}

/* Game tiles: framed artwork in a gilt edge with a warm shadow */
#root:is(.casino-slots, .live-casino-games, .tournament, .jackpot, .tv-games, .virtual-sports) .casinoGameItemContent {
  border-radius: 12px;
  box-shadow: 0 0 0 1px rgba(176, 132, 30, 0.14), 0 8px 20px rgba(120, 90, 20, 0.12);
}
/* on hover the gilt edge becomes a gold rim and a glint passes over the artwork */
#root:is(.casino-slots, .live-casino-games, .tournament, .jackpot, .tv-games, .virtual-sports) .casinoGameItemContent::after {
  content: "";
  position: absolute;
  inset: 0;
  z-index: 3;
  border-radius: inherit;
  background: linear-gradient(115deg, transparent 38%, rgba(255, 255, 255, 0.32) 50%, transparent 62%) -160% 0 / 250% 100% no-repeat;
  box-shadow: inset 0 0 0 1px rgba(255, 214, 92, 0.55);
  pointer-events: none;
}
#root:is(.casino-slots, .live-casino-games, .tournament, .jackpot, .tv-games, .virtual-sports) .casinoGameItemContent:hover::after {
  background-position: 160% 0;
  box-shadow: inset 0 0 0 2px rgb(255, 204, 51);
}
@media (prefers-reduced-motion: no-preference) {
  #root:is(.casino-slots, .live-casino-games, .tournament, .jackpot, .tv-games, .virtual-sports) .casinoGameItemContent::after {
    transition: background-position 0.9s ease, box-shadow 0.2s ease;
  }
}
/* the grid's hover lift casts warm gold light, not the daylight grey shadow */
#root:is(.casino-slots, .live-casino-games, .tournament, .jackpot, .tv-games, .virtual-sports) .casinoGamesList .casinoGameItemContent:hover {
  box-shadow: 0 0 0 1px rgba(226, 160, 0, 0.45), 0 14px 30px rgba(120, 90, 20, 0.22);
}
/* the hover layer is a lighter veil so the artwork keeps glowing under the buttons */
#root:is(.casino-slots, .live-casino-games, .tournament, .jackpot, .tv-games, .virtual-sports) .casinoGameItemBlock {
  background: rgba(17, 19, 24, 0.5) !important;
}
/* provider cards light a gold rim under the pointer, like the tiles */
#root:is(.casino-slots, .live-casino-games, .tournament, .jackpot, .tv-games, .virtual-sports) .providerItemsInner:not(.active):hover {
  border-color: rgba(226, 160, 0, 0.75);
}
/* the CMS writes tag colours inline (purple, wine, olive); in the salon every tag is a pale gold label */
#root:is(.casino-slots, .live-casino-games, .tournament, .jackpot, .tv-games, .virtual-sports) :is(.providerBadge, .casinoGameItemBadgeContainer) .badge {
  color: rgb(17, 19, 24) !important;
  background: rgb(255, 241, 199) !important;
  box-shadow: inset 0 0 0 1px rgba(226, 160, 0, 0.5);
  font-weight: 600;
}

/* Money speaks one colour in the salon: winnings and prizes in deep gold */
#root:is(.casino-slots, .live-casino-games, .tournament, .jackpot, .tv-games, .virtual-sports) :is(.casino-winners-amount, .casinoWinnerWidgetAmount, .casino-tournament-amount, .tournamentsWidgetPrice, .tournamentSectionMoney) {
  color: rgb(var(--by-gold-deep));
}

/* Jackpot: the grand pool is a gold plaque; the tiers are white cards with gold figures */
#root:is(.casino-slots, .live-casino-games, .tournament, .jackpot, .tv-games, .virtual-sports) .casino-jackpot-widget {
  box-shadow: inset 0 0 0 1px rgba(176, 132, 30, 0.2), 0 10px 28px rgba(120, 90, 20, 0.08);
}
/* the chosen provider chip turns gold, so its logo and label turn ink */
#root:is(.casino-slots, .live-casino-games, .tournament, .jackpot, .tv-games, .virtual-sports) .horizontalCategoryItemWrp.active .horizontalCategoryItem :is(i, svg),
#root:is(.casino-slots, .live-casino-games, .tournament, .jackpot, .tv-games, .virtual-sports) .horizontalCategoryItemWrp.active :is(.horCatItemTitle, .horCatItemCount) {
  color: rgb(var(--by-inverse-sc));
}
#root:is(.casino-slots, .live-casino-games, .tournament, .jackpot, .tv-games, .virtual-sports) .jackpot-pool {
  background: #fff;
  box-shadow: inset 0 0 0 1px rgba(176, 132, 30, 0.22);
}
#root:is(.casino-slots, .live-casino-games, .tournament, .jackpot, .tv-games, .virtual-sports) .casino-jackpot-widget__pool-first .jackpot-pool {
  position: relative;
  overflow: hidden;
  background: linear-gradient(135deg, rgb(255, 232, 150) 0%, rgb(255, 204, 51) 48%, rgb(242, 176, 0) 100%);
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.6), 0 10px 26px rgba(226, 160, 0, 0.3);
}
/* an engraved fillet inside the edge */
#root:is(.casino-slots, .live-casino-games, .tournament, .jackpot, .tv-games, .virtual-sports) .casino-jackpot-widget__pool-first .jackpot-pool::before {
  content: "";
  position: absolute;
  inset: 5px;
  border: 1px solid rgba(255, 255, 255, 0.6);
  border-radius: 7px;
  box-shadow: 0 0 0 1px rgba(var(--by-gold-deep), 0.16);
  pointer-events: none;
}
/* a glint crosses the gold plate now and then */
#root:is(.casino-slots, .live-casino-games, .tournament, .jackpot, .tv-games, .virtual-sports) .casino-jackpot-widget__pool-first .jackpot-pool::after {
  content: "";
  position: absolute;
  inset: 0;
  background: linear-gradient(105deg, transparent 40%, rgba(255, 255, 255, 0.55) 50%, transparent 60%) -150% 0 / 250% 100% no-repeat;
  pointer-events: none;
}
@keyframes by-gold-glint {
  0%,
  62% {
    background-position: -150% 0;
  }
  100% {
    background-position: 150% 0;
  }
}
@media (prefers-reduced-motion: no-preference) {
  #root:is(.casino-slots, .live-casino-games, .tournament, .jackpot, .tv-games, .virtual-sports) .casino-jackpot-widget__pool-first .jackpot-pool::after {
    animation: by-gold-glint 5s ease-in-out infinite;
  }
}
#root:is(.casino-slots, .live-casino-games, .tournament, .jackpot, .tv-games, .virtual-sports) .casino-jackpot-widget__pool-first .jackpot-pool__title {
  color: rgba(17, 19, 24, 0.7);
  letter-spacing: 0.12em;
}
#root:is(.casino-slots, .live-casino-games, .tournament, .jackpot, .tv-games, .virtual-sports) .casino-jackpot-widget :is(.jackpot-pool__price, .jackpot-pool__currency-symbol) {
  color: rgb(var(--by-gold-deep));
}
#root:is(.casino-slots, .live-casino-games, .tournament, .jackpot, .tv-games, .virtual-sports) .casino-jackpot-widget__pool-first :is(.jackpot-pool__price, .jackpot-pool__currency-symbol) {
  color: rgb(17, 19, 24);
  text-shadow: 0 1px 0 rgba(255, 255, 255, 0.45);
}
/* the pool details open outside the salon holders, so their golds are written out */
html:has(#root:is(.casino-slots, .live-casino-games, .tournament, .jackpot, .tv-games, .virtual-sports)) .jackpot-pool__details-price {
  color: rgb(156, 110, 0);
}

/* Tournaments: a gold countdown, gold payouts and a podium */
#root:is(.casino-slots, .live-casino-games, .tournament, .jackpot, .tv-games, .virtual-sports) .tournamentsWidgetCounter {
  background: rgba(255, 204, 51, 0.18);
  box-shadow: inset 0 0 0 1px rgba(226, 160, 0, 0.45);
}
#root:is(.casino-slots, .live-casino-games, .tournament, .jackpot, .tv-games, .virtual-sports) .tournamentsWidgetCounterLabel {
  border-inline-end-color: rgba(176, 132, 30, 0.3);
  color: rgba(17, 19, 24, 0.65);
}
#root:is(.casino-slots, .live-casino-games, .tournament, .jackpot, .tv-games, .virtual-sports) .tournamentsWidgetCounterValue {
  color: rgb(17, 19, 24);
}
/* payouts are painted with --accent, gold here and unreadable on the white table */
#root:is(.casino-slots, .live-casino-games, .tournament, .jackpot, .tv-games, .virtual-sports) .Prize .casinoTournamentInfoRowClm.type-1 {
  color: rgb(var(--by-gold-deep));
  font-weight: 700;
  font-variant-numeric: tabular-nums;
}
/* the leaderboard's first three rows take the prize table's gold light */
#root:is(.casino-slots, .live-casino-games, .tournament, .jackpot, .tv-games, .virtual-sports) .Leaderboard .casinoTournamentInfoRowWrp:nth-child(-n + 3):not(.Me) .casinoTournamentInfoRow {
  background-color: rgba(255, 204, 51, 0.12);
}
#root:is(.casino-slots, .live-casino-games, .tournament, .jackpot, .tv-games, .virtual-sports) .Leaderboard .casinoTournamentInfoRowWrp:nth-child(-n + 3):not(.Me) .casinoTournamentInfoRowClm.left {
  color: rgb(var(--by-gold-deep));
  font-weight: 800;
}
/* joined is a quiet gold-edged pill; the green slab was the one off-key hue in the salon */
#root:is(.casino-slots, .live-casino-games, .tournament, .jackpot, .tv-games, .virtual-sports) .tournamentJoinButton .button.joined,
#root:is(.casino-slots, .live-casino-games, .tournament, .jackpot, .tv-games, .virtual-sports) .tournamentsWidgetButtons .ds-btn.ds-btn--disabled {
  color: rgb(var(--by-gold-deep));
  background: #fff;
  box-shadow: inset 0 0 0 1px rgba(226, 160, 0, 0.6);
}
#root:is(.casino-slots, .live-casino-games, .tournament, .jackpot, .tv-games, .virtual-sports) .tournamentJoinButton .button.joined time {
  border-inline-start-color: rgba(176, 132, 30, 0.3);
  color: rgba(17, 19, 24, 0.6);
}
/* the upcoming badge is painted with --oc-1, gold here like the live badge; white with a gold edge tells them apart */
#root:is(.casino-slots, .live-casino-games, .tournament, .jackpot, .tv-games, .virtual-sports) .tournamentGameStatus.upcoming {
  background: #fff;
  box-shadow: inset 0 0 0 1px rgba(226, 160, 0, 0.6);
}
#root:is(.casino-slots, .live-casino-games, .tournament, .jackpot, .tv-games, .virtual-sports) .tournamentGameStatus.upcoming span {
  color: rgb(17, 19, 24);
}
/* the platform writes these labels at half ink, too faint on white */
#root:is(.casino-slots, .live-casino-games, .tournament, .jackpot, .tv-games, .virtual-sports) .tourDetHeaderBottomRowItem {
  color: rgba(var(--b-sc), 0.6);
}
/* the "more games" tile drops its ink veil; the count is a gold token */
#root:is(.casino-slots, .live-casino-games, .tournament, .jackpot, .tv-games, .virtual-sports) .tournamentsGameItemShowAllInner {
  background: rgba(17, 19, 24, 0.16);
}
#root:is(.casino-slots, .live-casino-games, .tournament, .jackpot, .tv-games, .virtual-sports) .tournamentsShowAllCount {
  padding: 6px 16px;
  border-radius: 999px;
  color: rgb(17, 19, 24);
  background: linear-gradient(180deg, rgb(255, 219, 107), rgb(255, 196, 30));
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.55), 0 6px 16px rgba(120, 90, 20, 0.35);
  font-size: 20px;
  line-height: 24px;
}

/* Game info: a white placard over the art instead of a dark slab, a framed thumbnail and a calm champagne hero */
#root:is(.casino-slots, .live-casino-games, .tournament, .jackpot, .tv-games, .virtual-sports) .cgdInfoPanel {
  background: #fff;
  box-shadow: 0 0 0 1px rgba(176, 132, 30, 0.24), 0 12px 28px rgba(120, 90, 20, 0.16);
}
#root:is(.casino-slots, .live-casino-games, .tournament, .jackpot, .tv-games, .virtual-sports) .cgdThumbnail {
  box-shadow: 0 0 0 1px rgba(176, 132, 30, 0.24), 0 12px 28px rgba(120, 90, 20, 0.16);
}
#root:is(.casino-slots, .live-casino-games, .tournament, .jackpot, .tv-games, .virtual-sports) .cgdProvidedBy {
  color: rgba(17, 19, 24, 0.55);
}
#root:is(.casino-slots, .live-casino-games, .tournament, .jackpot, .tv-games, .virtual-sports) .cgdProviderTitle {
  color: rgb(17, 19, 24);
}
#root:is(.casino-slots, .live-casino-games, .tournament, .jackpot, .tv-games, .virtual-sports) .cgdProviderIcon svg :is(path, rect, polygon) {
  fill: rgba(17, 19, 24, 0.82);
}
#root:is(.casino-slots, .live-casino-games, .tournament, .jackpot, .tv-games, .virtual-sports) .cgdFavoriteBtn .ds-btn {
  color: rgb(var(--by-gold-deep));
  background: rgba(255, 204, 51, 0.16);
}
#root:is(.casino-slots, .live-casino-games, .tournament, .jackpot, .tv-games, .virtual-sports) .cgdActionsWrp .ds-link {
  color: rgba(17, 19, 24, 0.7);
}
/* a blurred copy of the art smeared letters over the hero */
#root:is(.casino-slots, .live-casino-games, .tournament, .jackpot, .tv-games, .virtual-sports) .cgdBlurBg {
  background: radial-gradient(ellipse 70% 90% at 50% 0, rgba(255, 204, 51, 0.24), transparent 72%) rgb(250, 246, 236);
  filter: none;
}
#root:is(.casino-slots, .live-casino-games, .tournament, .jackpot, .tv-games, .virtual-sports) .cgdBlurBg .casinoGameImageV2 {
  display: none;
}
/* the platform writes the first tab in capitals and the others in title case */
#root:is(.casino-slots, .live-casino-games, .tournament, .jackpot, .tv-games, .virtual-sports) .cgdTabsSection .tab-item__label {
  font-size: 13px;
  font-weight: 600;
  letter-spacing: 0.05em;
  text-transform: uppercase;
}

/* Popups */
/* the providers popup opens outside the page holders, so it takes the salon's gold selection and hairlines itself */
#root:is(.casino-slots, .live-casino-games, .tournament, .jackpot, .tv-games, .virtual-sports) .casinoProvidersPopupContent {
  --oc-1: 255, 204, 51;
  --oc-1-sc: 17, 19, 24;
  --by-line: rgba(176, 132, 30, 0.16);
}
/* behind casino popups and drawers the salon dims to a warm shade instead of going dark */
#root:is(.casino-slots, .live-casino-games, .tournament, .jackpot, .tv-games, .virtual-sports) .ds-popup-backdrop,
html:has(#root:is(.casino-slots, .live-casino-games, .tournament, .jackpot, .tv-games, .virtual-sports)) .ds-drawer-wrapper {
  background: rgba(58, 44, 12, 0.4);
}

/* Bet slip (v1.3.6): one 12px edge, the remove button beside the odds instead of on a row of its own, the pick reads first */
#root .betslip-bc.full .bs-f-b-content-bc:not(.betstatus-content) {
  padding: 0;
}
#root .betslip-bc.full .bs-bet-item-bc > .bs-bet-item-bg-c-bc {
  position: relative;
  padding: 10px 12px;
}
/* the platform listens on the icon itself, so the icon grows into the button */
#root .betslip-bc.full .bs-bet-item-bg-c-bc > .bs-bet-i-h-c-icon-holder-bc {
  position: absolute;
  top: 6px;
  right: 6px;
  z-index: 1;
  width: 28px;
  height: 28px;
  margin: 0;
  font-size: 11px;
}
#root .betslip-bc.full .BBEventBodyRow > .bs-bet-i-h-c-icon-holder-bc {
  flex-shrink: 0;
  width: 28px;
  height: 24px;
  margin: -3px -6px -3px auto;
  font-size: 10px;
}
#root .betslip-bc.full :is(.bs-bet-item-bg-c-bc, .BBEventBodyRow) > .bs-bet-i-h-c-icon-holder-bc > .bs-bet-i-h-c-icon-bc.remove {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 100%;
  height: 100%;
  border-radius: 50%;
  color: rgba(var(--b-sc), 0.5);
  transition: color 0.15s, background-color 0.15s;
}
#root .betslip-bc.full :is(.bs-bet-item-bg-c-bc, .BBEventBodyRow) > .bs-bet-i-h-c-icon-holder-bc > .bs-bet-i-h-c-icon-bc.remove:hover {
  color: rgb(var(--b-sc));
  background: rgba(var(--b-sc), 0.06);
}
#root .betslip-bc.full .bs-bet-i-head-bc {
  margin: 0;
  padding-inline-end: 26px;
}
#root .betslip-bc.full .bs-bet-i-head-bc .bs-bet-i-b-row-bc {
  min-height: 20px;
  line-height: 20px;
}
#root .betslip-bc.full .bs-bet-i-head-bc .bs-bet-i-b-row-bc + .bs-bet-i-b-row-bc {
  min-height: 18px;
  margin-top: 1px;
  line-height: 18px;
}
#root .betslip-bc.full .bs-bet-i-head-bc .bs-bet-i-b-title-bc.t-2 {
  color: rgb(var(--b-sc));
  font-size: 13px;
  font-weight: 600;
  line-height: 20px;
}
#root .betslip-bc.full .bs-bet-i-head-bc .bs-bet-i-b-coefficient-bc {
  color: rgb(var(--b-sc));
  font-size: 14px;
  font-weight: 800;
  line-height: 20px;
}
#root .betslip-bc.full .bs-bet-i-head-bc .bs-bet-i-b-title-bc.t-1 {
  color: rgba(var(--b-sc), 0.66);
  font-size: 12px;
  line-height: 18px;
}
#root .betslip-bc.full .bs-bet-i-head-bc .betslipInfoAnimation {
  margin-bottom: 0;
}
#root .betslip-bc.full .betslipInfoAnimation .bc-i-player-info {
  color: rgba(var(--b-sc), 0.4);
}
#root .betslip-bc.full .bs-bet-i-b-prev-coefficient-bc {
  font-size: 12px;
}
#root .betslip-bc.full .bs-bet-item-bc:not(.BBEventItem) .bs-bet-i-body-bc {
  margin-top: 4px;
}
/* match and kick-off share a line when they fit; not .t-1, which an unlinked match loses (the platform writes "t-1disabled") */
#root .betslip-bc.full .bs-bet-i-h-title-bc {
  column-gap: 8px;
}
#root .betslip-bc.full .bs-bet-i-h-title-bc-text {
  width: auto;
  color: rgba(var(--b-sc), 0.7);
  font-size: 12px;
  line-height: 16px;
}
#root .betslip-bc.full :is(.bs-bet-i-h-title-bc.t-1, .BBEventTeamsWrapper:not(.disabled)):hover :is(.bs-bet-i-h-title-bc-text, .BBEventTeams) {
  text-decoration: underline;
  text-decoration-color: rgba(var(--b-sc), 0.3);
  text-underline-offset: 2px;
}
#root .betslip-bc.full .bs-item-date-v-bc {
  width: auto;
  margin-top: 0;
  color: rgba(var(--b-sc), 0.6);
  font-size: 11px;
  line-height: 16px;
  font-variant-numeric: tabular-nums;
}
#root .betslip-bc.full .bs-bet-i-h-cell-bc.icon .bs-bet-i-h-c-icon-holder-bc {
  justify-content: center;
  width: 16px;
  margin: 0;
}
#root .betslip-bc.full .bs-bet-i-h-c-icon-bc.attention {
  font-size: 13px;
}
/* two picks from one match cannot ride in one multiple; the platform marks them with a 10px triangle only */
#root .betslip-bc.full .bs-bet-item-bc:has(.bs-bet-i-h-c-icon-bc.attention) {
  background: rgba(var(--oc-3), 0.05);
  box-shadow: inset 3px 0 0 rgb(var(--oc-3)), inset 0 -1px 0 var(--by-line);
}

/* Bet builder picks: the match is the title, the price lines up with the other odds */
#root .betslip-bc.full .BBEventHeader {
  min-height: 20px;
  margin-bottom: 6px;
  padding-inline-end: 26px;
}
#root .betslip-bc.full :is(.BBEventCompetitionRegion, .BBEventCompetitionName) {
  color: rgba(var(--b-sc), 0.6);
}
#root .betslip-bc.full .BBEventCompetitionRegion + .BBEventCompetitionName:before {
  background: rgba(var(--b-sc), 0.4);
}
#root .betslip-bc.full .BBEventMatchInfoBlock {
  gap: 10px;
}
#root .betslip-bc.full .BBEventSportAliasIcon {
  width: 16px;
  height: 20px;
  color: rgba(var(--b-sc), 0.45);
}
#root .betslip-bc.full .BBEventTeamsWrapper {
  gap: 2px;
}
#root .betslip-bc.full .BBEventTeams {
  color: rgb(var(--b-sc));
  font-size: 13px;
  font-weight: 600;
  line-height: 20px;
  letter-spacing: 0;
}
#root .betslip-bc.full .BBEventTime {
  color: rgba(var(--b-sc), 0.6);
  font-size: 11px;
  line-height: 14px;
  letter-spacing: 0;
  font-variant-numeric: tabular-nums;
}
#root .betslip-bc.full .BBEventMatchInfoBlock > .BBEventHeaderPriceBlock {
  padding-inline-end: 26px;
  line-height: 20px;
}
#root .betslip-bc.full .BBEventMatchInfoBlock > .BBEventHeaderPriceBlock > span:not(.bs-bet-i-b-prev-coefficient-bc) {
  font-size: 14px;
  font-weight: 800;
}
#root .betslip-bc.full .betBuilderEventContainer .bs-bet-i-h-cell-bc.checkbox {
  left: 12px;
  margin-top: 47px;
}
#root .betslip-bc.full .betBuilderEventContainer .bankerBetTypeInfoContainer {
  left: 12px;
  margin-top: 43px;
}
#root .betslip-bc.full .BBEventBody {
  margin-top: 8px;
}
#root .betslip-bc.full .BBEventSingle .BBEventBodyRow {
  align-items: center;
}
/* a single leg has no connector; the platform's last-row line only stays hidden while the row is shorter than its offset */
#root .betslip-bc.full .BBEventSingle .BBEventBodyRow:last-child::before,
#root .betslip-bc.full .BBEventSingle .BBEventBodyRow:last-child::after {
  content: none;
}
#root .betslip-bc.full :is(.BBEventBodyRowLabel, .BBEventBodyRowValue) {
  font-size: 12px;
  line-height: 18px;
}
#root .betslip-bc.full .BBEventBodyRowLabel {
  color: rgba(var(--b-sc), 0.66);
}
#root .betslip-bc.full .BBEventBodyRowValue {
  color: rgb(var(--b-sc));
  font-weight: 600;
}
#root .betslip-bc.full .BBEventBodyRowMoreBB {
  gap: 6px;
  margin-top: 6px;
  color: rgba(var(--b-sc), 0.66);
  font-size: 12px;
  font-weight: 600;
  cursor: pointer;
}
#root .betslip-bc.full .BBEventBodyRowMoreBB span {
  text-decoration: none;
}
#root .betslip-bc.full .BBEventBodyRowMoreBB:hover {
  color: rgb(var(--b-sc));
}
/* the platform has no Turkish text for this link and shows the English one */
#root .betslip-bc.full .BBEventBodyRowMoreBB span:lang(tr) {
  font-size: 0;
}
#root .betslip-bc.full .BBEventBodyRowMoreBB span:lang(tr)::after {
  content: "Bu maçtan seçim ekle";
  font-size: 12px;
}

/* Bet slip totals: the last line is what the slip pays (total odds, or the possible win after any bonus) */
#root .betslip-bc.full .bs-actions-bc .bs-inputs-bc {
  padding: 12px;
}
#root .betslip-bc.full .bs-inputs-bc > .bs-bet-i-b-section-bc:first-child {
  margin-top: 0;
}
#root .betslip-bc.full .bs-bet-i-b-section-bc .bs-bet-i-b-row-bc {
  min-height: 20px;
  line-height: 20px;
}
#root .betslip-bc.full .bs-bet-i-b-section-bc .bs-bet-i-b-row-bc + .bs-bet-i-b-row-bc {
  margin-top: 2px;
}
#root .betslip-bc.full .bs-bet-i-b-section-bc .bs-bet-i-b-title-bc {
  color: rgba(var(--b-sc), 0.7);
  font-size: 12px;
}
#root .betslip-bc.full .bs-bet-i-b-section-bc :is(.bs-bet-i-b-coefficient-bc, .bs-bet-i-b-amount-bc) {
  color: rgb(var(--b-sc));
  font-size: 13px;
  font-weight: 700;
}
#root .betslip-bc.full .bs-bet-i-b-section-bc .bs-bet-i-b-row-bc:last-child .bs-bet-i-b-title-bc {
  color: rgb(var(--b-sc));
  font-size: 13px;
  font-weight: 600;
}
#root .betslip-bc.full .bs-bet-i-b-section-bc .bs-bet-i-b-row-bc:last-child :is(.bs-bet-i-b-coefficient-bc, .bs-bet-i-b-amount-bc) {
  font-size: 15px;
  font-weight: 800;
}
#root .betslip-bc.full .bs-bet-i-b-stake-bc {
  height: 40px;
}
#root .betslip-bc.full .bs-bet-i-b-stake-bc > .bs-bet-i-b-s-i-block-bc {
  border-radius: 10px;
  line-height: 38px;
}
#root .betslip-bc.full .bs-bet-i-b-stake-bc > .bs-bet-i-b-s-i-holder-bc ~ .bs-bet-i-b-s-i-block-bc {
  line-height: 40px;
}
#root .betslip-bc.full .bs-bet-i-b-stake-bc > .bs-bet-i-b-stake-to-all-bc {
  width: 40px;
  padding: 0;
}
#root .betslip-bc.full .bs-bet-i-b-s-i-bc {
  font-size: 14px;
}
#root .betslip-bc.full .bs-numbers-bc {
  padding: 8px 12px 0;
}

/* Bet slip header: the odds-change setting is a quiet settings line, the bet type a compact chip */
#root .betslip-bc.full .settings-r-b-row-bc .form-control-bc.select {
  flex: 1 1 auto;
  height: 40px;
}
#root .betslip-bc.full .settings-r-b-row-bc .select.s-small.has-icon .select-icon-bc {
  color: rgba(var(--b-sc), 0.55);
  font-size: 15px;
  line-height: 40px;
}
#root .betslip-bc.full .settings-r-b-row-bc .select.s-small.has-icon .form-control-select-bc {
  height: 40px;
  border-radius: 0;
  background: transparent;
  color: rgba(var(--b-sc), 0.8);
  font-size: 13px;
  font-weight: 500;
}
#root .betslip-bc.full .settings-r-b-row-bc .select.s-small.has-icon .form-control-select-bc > span {
  color: inherit;
  font-size: 13px;
}
#root .betslip-bc.full .settings-r-b-row-bc .select.s-small.has-icon .form-control-select-bc:hover {
  color: rgb(var(--b-sc));
}
#root .betslip-bc.full .bs-f-header-sub-navigation-bc .form-control-bc.select {
  height: 30px;
}
/* the type and system chips share the 288px row with "remove all", so they stay at the platform's 12px */
#root .betslip-bc.full .bs-f-header-sub-navigation-bc .form-control-select-bc {
  height: 30px;
  padding-inline: 12px 30px;
  color: rgb(var(--b-sc));
  font-size: 12px;
  font-weight: 600;
}
#root .betslip-bc.full .bs-f-header-sub-navigation-bc .form-control-select-bc > span {
  color: inherit;
  font-size: 12px;
}
#root .betslip-bc.full .bs-f-header-sub-navigation-bc .form-control-bc.select + .form-control-bc.select {
  margin-inline-start: 4px;
}
#root .betslip-bc.full .bs-f-header-sub-navigation-bc .form-control-icon-bc {
  right: 10px;
}
/* the ellipsis box clips anything under the text, so the line gets room for its underline */
#root .betslip-bc.full .bs-f-header-sub-navigation-bc .betslip-remove-all {
  color: rgba(var(--b-sc), 0.62);
  font-size: 12px;
  font-weight: 500;
  line-height: 20px;
  text-decoration-color: rgba(var(--b-sc), 0.3);
  text-underline-offset: 3px;
  cursor: pointer;
}
#root .betslip-bc.full .bs-f-header-sub-navigation-bc .betslip-remove-all:hover {
  color: rgb(var(--b-sc));
  text-decoration-color: currentColor;
}

/* Bet slip footer */
#root .betslip-bc.full .bet-button-wrapper-bc {
  padding: 8px 12px 12px;
}
/* the first-pick panel already pads its messages, so the slip's 12px side margin pushed them past its edge */
#root .quickBetWrapper-bc .quickBetMsgWrapper-bc:is(.betslip-warning-message, .betslip-success-message, .betslip-error-message, .betslip-info-message) {
  margin-inline: 0;
}
