html,
:root{
/* Mobile2 theme palette override. Runtime height variables stay JS-controlled2. * */
--hero: 215, 10, 45!important;
--hero-hover: 255, 45, 85!important;
--hero-sc: 255, 255, 255!important;
--brand: 180, 12, 35!important;
--brand-hover: 255, 60, 95!important;
--brand-sc: 255, 255, 255!important;
--secondary: 18, 18, 22!important;
--secondary-hover: 35, 35, 40!important;
--secondary-sc: 255, 255, 255!important;
--accent: 255, 35, 65!important;
--accent-hover: 255, 85, 115!important;
--accent-sc: 255, 255, 255!important;
--oc-1: 220, 20, 55!important;
--oc-1-hover: 255, 70, 100!important;
--oc-1-sc: 255, 255, 255!important;
--oc-2: 255, 190, 0!important;
--oc-2-hover: 255, 220, 70!important;
--oc-2-sc: 0, 0, 0!important;
--oc-3: 255, 45, 75!important;
--oc-3-hover: 255, 90, 120!important;
--oc-3-sc: 255, 255, 255!important;
--odd-up: 0, 210, 90!important;
--odd-up-hover: 40, 255, 100!important;
--odd-up-sc: 0, 0, 0!important;
--odd-down: 255, 50, 70!important;
--odd-down-hover: 255, 90, 110!important;
--odd-down-sc: 255, 255, 255!important;
--neutral: 255, 255, 255!important;
--neutral-sc: 0, 0, 0!important;
--b: 8, 8, 12!important;
--b-hover: 28, 28, 34!important;
--b-sc: 255, 255, 255!important;
--header: 10, 10, 14!important;
--header-hover: 22, 22, 28!important;
--header-sc: 255, 255, 255!important;
--menu: 12, 12, 16!important;
--menu-hover: 26, 26, 32!important;
--menu-sc: 255, 255, 255!important;
--tab-navigation: 14, 14, 18!important;
--tab-navigation-hover: 32, 32, 38!important;
--tab-navigation-sc: 255, 255, 255!important;
--static-black: 0, 0, 0!important;
--static-black-hover: 18, 18, 20!important;
--static-black-sc: 255, 255, 255!important;
--static-white: 255, 255, 255!important;
--static-white-hover: 235, 235, 235!important;
--static-white-sc: 0, 0, 0!important;
--warning: 255, 175, 0!important;
--warning-hover: 255, 205, 60!important;
--warning-sc: 0, 0, 0!important;
--error: 220, 25, 55!important;
--error-hover: 255, 75, 100!important;
--error-sc: 255, 255, 255!important;
--success: 0, 180, 90!important;
--success-hover: 0, 255, 140!important;
--success-sc: 255, 255, 255!important;
--info: 0, 140, 255!important;
--info-hover: 60, 180, 255!important;
--info-sc: 255, 255, 255!important;
}
.woot-widget-bubble{
display:none!important;
}
.overlay-sliding-wrapper-bc .payment-info-bc .WithdrawAmount-All ul.WithdrawAmount-Row:nth-child(4),
.overlay-sliding-wrapper-bc .payment-info-bc .WithdrawAmount-All ul.WithdrawAmount-Row:nth-child(5){
display: none;
}
.footerSliderGroup > .footerSlider:nth-child(2) img{pointer-events:none}
.popup-holder-bc .congrats-block .congrats-block-image{
display:none;
}
/* .bc-i-egt:before {
content: " "!important;
width: 100%;
height: 100%;
background-image: url(https://static.springbuilder.site/fs/userFiles-v2/vbetampromo/media/amusnetlogo-1683184740491.svg?1683184742893);
background-size: 65px;
background-position: center;
background-repeat: no-repeat;
opacity: .45;
} */
.bc-i-egt.active:before{
opacity: 1;
}
.live-casino-block .casino-category-chooser-container .horizontal-sl-item-bc.turkishTables,
.live-casino-block .casino-category-chooser-container .horizontal-sl-item-bc.asianGames,
.live-casino-block .casino-category-chooser-container .horizontal-sl-item-bc.indianTables{
display: none !important;
}
.header-icon>img {
margin-left: 4px !important;
}
.popup-holder-bc .popup-middleware-bc .popup-inner-bc .congrats-parent-block .congrats-block img.congrats-block-image{
display: none!important;
}
.popup-holder-bc .popup-middleware-bc .popup-inner-bc .congrats-parent-block .congrats-reg-step-buttons .btn.a-outline:first-child{
background: #109121!important;
}
.popup-holder-bc .popup-middleware-bc .popup-inner-bc .congrats-parent-block .congrats-reg-step-buttons .btn.a-outline:first-child:hover{
background: #13AC27!important;
}
.popup-holder-bc:not(.success) .popup-inner-bc .status-popup-content-w-bc .casino-popup-icon-wrapper {
display:none !important;
}
.special-games-button .btn.coupons.a-color {
background: #338af3!important;
background: linear-gradient(to right, #338af3 0%, #ffda44 100%)!important;
}
.special-games-button .btn.coupons:not(.a-color)>i {
color: #338af3!important;
}
.printAndDownload {
display:none!important;
}
.casino-game-item.badge-vpn:after {
content: ""!important;
width: 54px;
display: block;
background-image: url(https://cmsbetconstruct.com/storage/medias/vbet/media_4_0b27f275a5a02b3963e6274afe2a3737.svg)!important;
background-size: contain!important;
top: 5px!important;
right: 5px!important;
background-repeat: no-repeat!important;
transform:initial!important;
background-color:initial!important;
box-shadow:initial!important;
}
.nav-menu-item.badge-spinCount::after,
.hdr-navigation-link-bc.badge-spinCount::after {
background:rgba(var(--hero),1)!important;
}
.promo-btn {
display: inline-block;
position: relative;
text-decoration: none !important;
color: white !important;
background: linear-gradient(45deg, #8f1828, #c6283a, #8f1828);
padding: 8px 25px;
font-weight: 600;
text-transform: uppercase;
border-radius: 10px;
font-size: 14px;
border: none;
margin-block: 10px;
}
.withdrawLayout .historyList-bc .historyListEl>:nth-last-child(4):not(.withdrawLayout .historyList-bc .historyListEl>:nth-child(3)),
.withdrawLayout .historyList-bc .historyListEl>span:nth-of-type(3){
display:none!important;
}
.u-i-p-links-lists-holder-bc > .u-i-p-l-head-bc:nth-last-child(1),
.rewardWrapper .exchangeWrapperContent .exchangeWrapperText,
.rewardWrapper .exchangeWrapperContent .descriptionContainer,
.rewardWrapper .exchangeWrapperContent .exchangeWrapper,
.rewardWrapper .exchangeWrapperContent .exchangeWrapperBtn .tooltipIconWrapper{
display:none!important
}
.rewardWrapper,
.rewardWrapper .exchangeWrapperContent{
height:100%;
}
.rewardWrapper .exchangeWrapperBtn{
margin:auto!important;
height:100%;
}
.exchangeWrapperBtn .btn{
margin-inline-start:0!important
}
.favouriteTeamsPage .need-to-login.empty-b-text-v-bc{ display:none }
.favouriteTeamsWidget{
display: none
}
.favouriteTeamsPage .need-to-login.empty-b-text-v-bc{
display:none
}
/* Runtime registration fields: T.C. Kimlik No / dogum tarihi * */
.entrance-form-bc.registration .registration-extra-field,
.registration-extra-field {
width: 100% !important;
height: 52px !important;
min-height: 52px !important;
margin: 0 0 15px !important;
padding: 0 18px !important;
position: relative !important;
display: flex !important;
align-items: stretch !important;
flex: 0 0 100% !important;
box-sizing: border-box !important;
overflow: visible !important;
border: 0 !important;
border-radius: 5px !important;
background: rgba(255,255,255,.12) !important;
box-shadow: none !important;
}
.entrance-form-bc.registration .registration-extra-field .form-control-title-bc,
.registration-extra-field .form-control-title-bc {
position: absolute !important;
left: 18px !important;
top: 7px !important;
right: 18px !important;
z-index: 2 !important;
width: auto !important;
max-width: calc(100% - 36px) !important;
height: 16px !important;
margin: 0 !important;
padding: 0 !important;
transform: none !important;
color: rgba(255,255,255,.58) !important;
font-size: 13px !important;
font-weight: 600 !important;
line-height: 16px !important;
pointer-events: none !important;
opacity: 1 !important;
}
.entrance-form-bc.registration .registration-extra-field .registration-extra-field-input,
.registration-extra-field .registration-extra-field-input {
position: relative !important;
z-index: 1 !important;
display: block !important;
width: 100% !important;
height: 52px !important;
min-height: 52px !important;
margin: 0 !important;
padding: 21px 0 5px !important;
box-sizing: border-box !important;
border: 0 !important;
border-radius: 0 !important;
outline: 0 !important;
background: transparent !important;
box-shadow: none !important;
color: #fff !important;
font-size: 15px !important;
font-weight: 600 !important;
line-height: 22px !important;
}
.registration-extra-field .registration-extra-field-input::placeholder {
color: rgba(255,255,255,.42) !important;
font-weight: 600 !important;
}
.registration-extra-field:not(.has-value):not(:focus-within) .form-control-title-bc {
top: 50% !important;
transform: translateY(-50%) !important;
font-size: 14px !important;
color: rgba(255,255,255,.50) !important;
}
.registration-extra-field:not(.has-value):not(:focus-within) .registration-extra-field-input::placeholder {
color: transparent !important;
}
.registration-extra-field .form-control-input-stroke-bc {
display: none !important;
}
.registration-extra-field-error {
display: none;
position: absolute !important;
left: 0 !important;
right: 0 !important;
bottom: -19px !important;
z-index: 3 !important;
margin: 0 !important;
padding: 0 2px !important;
background: transparent !important;
color: #ff7777 !important;
font-size: 12px !important;
font-weight: 700 !important;
line-height: 16px !important;
}
.registration-extra-field.has-error {
margin-bottom: 32px !important;
border: 1px solid rgba(255,100,100,.55) !important;
box-shadow: 0 0 0 1px rgba(255,100,100,.18) inset !important;
}
.registration-extra-field.has-error .registration-extra-field-error {
display: block !important;
}
.is-identityCheckPopup .popup-holder-bc.windowed.info {
backdrop-filter: blur(20px)!important;
}
.sliderContent [id='17247_CascadCardNew'] ,
.sliderContent [id='17369_CascadApplePayNew'],
.sliderContent [id='17370_CascadGooglePayNew'],
.sliderContent [id="19441_CascadMTB"] {
pointer-events: none!important;
}
.popup-holder-bc.windowed.deposit .casino-popup-button-block button:first-child {
display:none!important;
}
.u-i-edit-verify-account-page-bc .verification-buttons-block [title="ЗАПОВНИТИ АНКЕТУ"] ,
.u-i-edit-verify-account-page-bc .verification-buttons-block [title="FILL IN THE FORM"] {
display: none!important;
}
.popup-holder-bc.windowed.email-exists-popup .btn.reset-password-btn {
display: none!important;
}
.casinoGenericPageTemplate .indianTables,
.casinoGenericPageTemplate .brazilianTables {
display:none!important;
}
.slider-market-coefficient-container .countdown-banner-content {
top: 50%!important;
transform: translate(-50%, -30%)!important;
bottom: initial!important;
max-width:400px;
background: transparent!important;
}
.slider-market-coefficient-container .market-bc .market-odd-bc,
.slider-market-coefficient-container .market-bc:not(.active).market-odd-bc {
font-size: 20px!important;
line-height: 1.2!important;
font-weight: 700!important;
}
.slider-market-coefficient-container .market-bc .market-odd-bc:not(:where(.layout-bc:is(.sportsbook,.prematch,.live) *)),
.slider-market-coefficient-container .market-bc:not(.active).market-odd-bc:not(:where(.layout-bc:is(.sportsbook,.prematch,.live) *)) {
color: #ffffff!important;
}
.slider-market-coefficient-container .market-bc:not(:last-child):not(:where(.layout-bc:is(.sportsbook,.prematch,.live) *)) {
border-right: 1px solid rgba(255, 255, 255, .4)!important;
}
.slider-market-coefficient-container .market-bc.active .market-odd-bc:not(:where(.layout-bc:is(.sportsbook,.prematch,.live) *)) {
color: #ffffff!important;
}
.slider-market-coefficient-container .market-bc+.market-bc {
margin-inline-start:initial!important;
}
.slider-market-coefficient-container .market-bc {
padding: 12px 24px!important;
width: 100px!important;
}
.slider-market-coefficient-container .market-bc:not(:where(.layout-bc:is(.sportsbook,.prematch,.live) *)) {
color: #ffffff!important;
background: transparent!important;
box-shadow: initial!important;
}
.slider-market-coefficient-container .market-bc i{
display: none!important;
}
@media only screen and (max-width:600px) {
.slider-market-coefficient-container .countdown-banner-content{
max-width:100px!important;
height:32px!important;
}
.slider-market-coefficient-container .market-bc{
height:22px!important;
border-radius: 5px !important;
padding: 8px 8px!important;
}
.slider-market-coefficient-container .countdown-banner-content {
transform: translate(-50%, -40%)!important;
}
}
@media only screen and (max-width:415px) {
.slider-market-coefficient-container .countdown-banner-content{
max-width:60px!important;
height:20px!important;
}
.slider-market-coefficient-container .market-bc{
height:20px!important;
padding: 6px 6px!important;
}
.slider-market-coefficient-container .market-bc .market-odd-bc{
font-size: 16px!important;
}
}
.layout-content-holder-bc .hm-row-bc:first-child .sdr-item-bc:not(:only-child) {
height: 100%!important;
}
.hdr-user-bc .bc-i-wallet {background:#2A8038!important}
.popup-holder-bc.windowed.email-exists-popup {
display:none !important;
}
.slider-market-coefficient-container .countdown-banner-content {
top: 50%!important;
transform: translate(-50%, -50%)!important;
bottom: initial!important;
max-width:400px;
background: transparent!important;
gap: 5px;
}
.slider-market-coefficient-container .market-bc .market-odd-bc,
.slider-market-coefficient-container .market-bc:not(.active).market-odd-bc {
font-size: 20px;
line-height: 1.2!important;
font-weight: 700!important;
}
.slider-market-coefficient-container .market-bc .market-odd-bc:not(:where(.layout-bc:is(.sportsbook,.prematch,.live) *)),
.slider-market-coefficient-container .market-bc:not(.active).market-odd-bc:not(:where(.layout-bc:is(.sportsbook,.prematch,.live) *)) {
color: #ffffff!important;
}
.slider-market-coefficient-container .market-bc.active .market-odd-bc:not(:where(.layout-bc:is(.sportsbook,.prematch,.live) *)) {
color: #ffffff!important;
}
.slider-market-coefficient-container .market-bc+.market-bc {
margin-inline-start:initial!important;
}
.slider-market-coefficient-container .market-bc {
padding: 15px 15px!important;
border-radius: 15px !important;
width: 100px!important;
height: 60px!important;
}
.slider-market-coefficient-container .market-bc:not(:where(.layout-bc:is(.sportsbook,.prematch,.live) *)) {
color: #ffffff!important;
background: #1a253b!important;
border: none!important;
box-shadow: inset 3px 3px 6px 0px rgba(255,255,255, .5), inset -3px -3px 3px 0 #1a253b!important;
}
@media only screen and (max-width:600px) {
.slider-market-coefficient-container .countdown-banner-content{
max-width:250px!important;
height:32px!important;
}
.slider-market-coefficient-container .market-bc{
height:22px!important;
border-radius: 5px !important;
width: 50px!important;
}
}
@media only screen and (max-width:415px) {
.slider-market-coefficient-container .countdown-banner-content{
max-width:200px!important;
height:28px!important;
}
.slider-market-coefficient-container .market-bc{
height:20px!important;
}
}
.layout-content-holder-bc .jackpot-banner .casinoJackpotWrapper-bc::before{
background-image: initial!important;
}
.layout-content-holder-bc .jackpot-banner .casinoJackpotWrapper-bc{
background-image: url(https://cmsbetconstruct.com/storage/medias/uawl-18746530/media_18746530_d9420dc211e267a62a82d4d01d5d39b9.png) !important;
background-repeat: no-repeat !important;
background-size: cover !important;
background-position: center center !important;
background-color: #1C2539;
}
.is-home-page .layout-content-holder-bc .hm-row-bc.has-slider:nth-child(5) .sdr-item-holder-bc{
aspect-ratio: initial!important;
}
.v-care-fund-jackpot .sdr-item-bc{background-color: #410d41!important;
display: flex;
align-items: center;}
.loyaltyLevelBonus{display: none!important}
.loyaltyProgramItems p a{color:#c6283a}
/* .layout-header-holder-bc .loyaltyBonusHeader {
display:none!important;
} /*
/*
[class*=is-mobile] .header-bc .loyaltyBonusHeader+.hdr-user-bc:not(.hasLoyaltyLevel) {
margin-inline-start: 0!important;
} */
/* .user-profile-container .u-i-p-links-lists-holder-bc .u-i-p-l-body-bc > a:last-child,
.hdr-navigation-scrollable-bc.user-tab-navigation .hdr-navigation-link-bc:last-child {
display:none!important
}
.user-profile-container .u-i-p-links-lists-holder-bc .u-i-p-l-body-bc > a:nth-last-child(2),
.user-profile-container .u-i-p-links-lists-holder-bc .u-i-p-l-body-bc > a:last-child,
.hdr-navigation-scrollable-bc.user-tab-navigation .hdr-navigation-link-bc:nth-last-child(2),
.hdr-navigation-scrollable-bc.user-tab-navigation .hdr-navigation-link-bc:last-child {
display:none!important
} */
.layout-header-holder-bc > .hdr-dynamic-content .hm-row-bc:first-child {
margin-top: 0;
}
.layout-header-holder-bc > .hdr-dynamic-content .swiper-slide > .informative-widget{
background: #c6283a!important;
margin: 0!important;
border-radius: 0!important;
}
.layout-header-holder-bc > .hdr-dynamic-content .swiper-slide > .informative-widget > .informative-widget-link{
border: 0!important;
border-radius: 0!important;
}
.layout-header-holder-bc > .hdr-dynamic-content .swiper-slide{
border-radius: 0!important;
}
.informative-widget-container > span{
color: rgba(252, 252, 253, 1)!important;
font-size: 14px !important;
}
.informative-widget-container button{
border: 1px solid white!important;
border-radius: 8px!important;
background: rgba(0, 12, 36, 0.20)!important;
}
.informative-widget-container button span{
font-size: 12px!important;
text-transform: capitalize !important;
}
@media screen and (max-width:470px){
.layout-header-holder-bc > .hdr-dynamic-content .swiper-slide > .informative-widget > .informative-widget-link > .informative-widget-container{
flex-wrap: wrap;
}
}
.hdr-main-content-bc .hdr-user-bc .user-balance-dropdown .nav-menu-item {
display: flex;
align-items: center;
min-height: 30px;
border-radius: 50px;
padding: 2px 10px;
background: rgba(var(--header-sc), 0.08);
}
.hdr-main-content-bc .hdr-user-bc .user-balance-dropdown .hdr-user-info-content-bc {
margin: 0 !important;
}
.hdr-main-content-bc .hdr-user-bc .user-balance-dropdown .nav-menu-item::after {
content: "";
display: flex;
width: 20px;
height: 20px;
margin-left: 6px;
background-image: none;
background-position: center;
background-size: contain;
background-repeat: no-repeat;
}
.hdr-main-content-bc .hdr-user-bc .hdr-user-avatar-icon-bc {
margin-inline-start: 6px;
}
.liveCasinoWrapper > .casinoGenericPageTemplate .casinoCategoryChooserContainer .horizontalSliderWrapper .horizontalSliderRow .asianGames{
display: none!important;
}
.woot-widget-bubble.woot-elements--right {
bottom:59px!important;
}
.jackpot-banner .casinoJackpotWrapper-bc{display:none!important}
@media screen and (max-width:390px) {
.user-profile-container .overlay-sliding-wrapper-bc .pay-logo {
min-width: 80px!important;
max-width: 120px;
}
}
.countdown-banner-content .market-bc .market-coefficient-bc .market-odds-container .not-boosted-odd{
display: none!important;
}
.live-casino-games .horizontalSliderRow .turkishTables{
display: none!important;
}
.casino-popup-content p:nth-child(2) {
display: none !important;
}
html,
body,
#root,
.layout-bc {
max-width: 100%;
overflow-x: hidden;
}
.layout-bc {
width: 100%;
}
.languageDropdown,
.turkish-only-language {
display: none !important;
}
.is-mobile .storiesWidgetWrapper:not(.portraitView) {
min-height: 105px !important;
height: 105px !important;
}
.is-mobile .storiesWidgetWrapper .horizontalSliderRow {
padding: 4px !important;
align-items: flex-start !important;
justify-content: flex-start !important;
}
.is-mobile .storiesWidgetWrapper .storiesWidgetListItem.horizontal-sl-item-bc,
.is-mobile .storiesWidgetWrapper .storiesWidgetListItem.horizontal-sl-item-bc:not(:empty) {
background: transparent !important;
box-shadow: none !important;
}
.is-mobile .storiesWidgetListItem + .storiesWidgetListItem {
margin-inline-start: 10px !important;
}
.is-mobile .viewModeStories {
align-items: stretch !important;
padding: 0 !important;
background: rgba(0, 0, 0, 0.92) !important;
-webkit-backdrop-filter: none !important;
backdrop-filter: none !important;
}
.is-mobile .viewModeStoriesContent {
width: 100vw !important;
height: 100dvh !important;
max-width: 100vw !important;
}
.is-mobile .viewModeStoriesContent > .swiper {
width: 100vw !important;
height: 100dvh !important;
overflow: hidden !important;
}
.is-mobile .singleStoryImgWrapper,
.is-mobile .singleStoryImg,
.is-mobile .singleStoryImg > img {
border-radius: 0 !important;
}
.is-mobile .singleStoryImg {
width: 100vw !important;
height: 100dvh !important;
max-width: 100vw !important;
max-height: 100dvh !important;
}
.is-mobile .storyGroupInfo {
top: 0 !important;
padding-top: calc(env(safe-area-inset-top, 0px) + 12px) !important;
}
.is-mobile .singleStorySeeMore {
bottom: calc(env(safe-area-inset-bottom, 0px) + 20px) !important;
}
.is-mobile .storiesWidgetWrapper:not(.portraitView) .storiesWidgetListItem {
position: relative !important;
display: flex !important;
flex-direction: column !important;
align-items: center !important;
justify-content: flex-start !important;
flex: 0 0 68px !important;
min-width: 68px !important;
max-width: 68px !important;
width: 68px !important;
overflow: visible !important;
}
.is-mobile .storiesWidgetWrapper:not(.portraitView) .storiesWidgetListItem > img,
.is-mobile .storiesWidgetWrapper:not(.portraitView) .storiesWidgetListItem > i,
.is-mobile .storiesWidgetWrapper:not(.portraitView) .storiesWidgetListItem > .storiesItemImgSkeleton {
width: 68px !important;
height: 68px !important;
min-width: 68px !important;
min-height: 68px !important;
display: block !important;
flex: 0 0 68px !important;
object-fit: cover !important;
object-position: center center !important;
-webkit-transform: translateZ(0) !important;
transform: translateZ(0) !important;
}
.is-mobile .storiesWidgetWrapper:not(.portraitView) .storiesWidgetListItem:not(.storiesItemSkeleton):after {
width: 68px !important;
height: 68px !important;
}
.is-mobile .storiesWidgetWrapper:not(.portraitView) .storiesWidgetListItem:not(.storiesItemSkeleton):before {
width: 72px !important;
height: 72px !important;
}
.is-mobile .storiesWidgetWrapper:not(.portraitView) .horizontalSliderWrapper,
.is-mobile .storiesWidgetWrapper:not(.portraitView) .horizontalSliderRow.storiesWidgetList {
min-height: 97px !important;
height: 97px !important;
padding-inline: 6px !important;
}
.is-mobile .storiesWidgetWrapper:not(.portraitView) .storiesWidgetListItem {
min-height: 97px !important;
height: 97px !important;
max-height: none !important;
}
.is-mobile .storiesWidgetWrapper:not(.portraitView) .storiesWidgetListItem .horizontal-sl-title-bc {
display: block !important;
height: 20px !important;
min-height: 20px !important;
max-height: 20px !important;
margin-top: 5px !important;
line-height: 20px !important;
flex: 0 0 20px !important;
}
/* Keep the selected story tile in normal flow while the overlay opens/closes. * */
.is-mobile .storiesWidgetWrapper .horizontalSliderRow.storiesWidgetList > .storiesWidgetListItem.active {
position: relative !important;
display: flex !important;
flex-direction: column !important;
align-items: center !important;
justify-content: flex-start !important;
flex: 0 0 68px !important;
min-width: 68px !important;
max-width: 68px !important;
width: 68px !important;
min-height: 97px !important;
height: 97px !important;
max-height: none !important;
left: 0 !important;
right: 0 !important;
top: auto !important;
bottom: auto !important;
z-index: 1 !important;
background: transparent !important;
overflow: visible !important;
}
.is-mobile .storiesWidgetWrapper .horizontalSliderRow.storiesWidgetList > .storiesWidgetListItem.active > .horizontal-sl-icon-bc {
position: relative !important;
left: 0 !important;
right: 0 !important;
top: 0 !important;
bottom: 0 !important;
margin: 0 auto !important;
transform: none !important;
}
.hdr-user-bc .deposit-btn.user-nav-icon {
display: inline-flex !important;
align-items: center !important;
justify-content: center !important;
}
.hdr-user-bc .deposit-btn.user-nav-icon::before {
content: "\eaac";
font-family: BetConstruct-Icons !important;
font-size: 15px !important;
line-height: 1 !important;
color: #fff !important;
}
.hdr-main-content-bc .hdr-user-bc .user-balance-dropdown .nav-menu-item::after {
content: "\e918" !important;
font-family: BetConstruct-Icons !important;
display: inline-flex !important;
align-items: center !important;
justify-content: center !important;
width: 18px !important;
height: 18px !important;
margin-left: 6px !important;
background: none !important;
color: rgba(var(--header-sc), 0.78) !important;
font-size: 14px !important;
line-height: 1 !important;
flex-shrink: 0 !important;
}
.referral-bonus-journey-active .journey-content,
.referral-bonus-journey-active .my-profile-info-block.null-page {
width: 100%;
min-width: 0;
}
.referral-bonus-journey-panel {
width: 100%;
box-sizing: border-box;
padding: 16px;
border: 1px solid rgba(255, 255, 255, 0.08);
border-radius: 8px;
background: #141419;
color: #f4f4f6;
}
.referral-bonus-journey-head {
display: flex;
align-items: flex-start;
justify-content: space-between;
gap: 10px;
margin-bottom: 14px;
}
.referral-bonus-journey-eyebrow {
display: block;
margin-bottom: 4px;
color: #e41146;
font-size: 11px;
font-weight: 800;
letter-spacing: 0;
text-transform: uppercase;
}
.referral-bonus-journey-head h2 {
margin: 0;
font-size: 22px;
line-height: 28px;
font-weight: 800;
}
.referral-bonus-journey-badge {
flex: 0 0 auto;
min-width: 64px;
padding: 6px 8px;
border-radius: 8px;
background: rgba(35, 180, 84, 0.14);
color: #3ee477;
font-size: 12px;
font-weight: 800;
text-align: center;
}
.referral-bonus-journey-desc {
margin: 0 0 14px;
color: rgba(244, 244, 246, 0.72);
font-size: 14px;
line-height: 20px;
}
.referral-bonus-journey-links,
.referral-bonus-journey-stats,
.referral-bonus-journey-table {
display: grid;
grid-template-columns: 1fr;
gap: 10px;
}
.referral-bonus-journey-links {
margin-bottom: 14px;
}
.referral-bonus-journey-link {
display: grid;
grid-template-columns: minmax(0, 1fr) auto;
gap: 8px;
align-items: end;
min-width: 0;
}
.referral-bonus-journey-link span {
grid-column: 1 / -1;
color: rgba(244, 244, 246, 0.58);
font-size: 12px;
font-weight: 800;
}
.referral-bonus-journey-link input {
min-width: 0;
width: 100%;
height: 42px;
box-sizing: border-box;
padding: 0 10px;
border: 1px solid rgba(255, 255, 255, 0.1);
border-radius: 8px;
outline: 0;
background: #0d0d11;
color: #ffffff;
font-size: 13px;
font-weight: 700;
}
.referral-bonus-journey-link button {
height: 42px;
padding: 0 12px;
border: 0;
border-radius: 8px;
background: #e41146;
color: #ffffff;
cursor: pointer;
font-size: 13px;
font-weight: 800;
}
.referral-bonus-journey-stats {
margin: 14px 0;
}
.referral-bonus-journey-stats > div,
.referral-bonus-journey-table > div {
min-width: 0;
padding: 12px;
border-radius: 8px;
background: #1f2026;
}
.referral-bonus-journey-stats span,
.referral-bonus-journey-table span {
display: block;
margin-bottom: 6px;
color: rgba(244, 244, 246, 0.58);
font-size: 12px;
font-weight: 800;
}
.referral-bonus-journey-stats strong,
.referral-bonus-journey-table b {
display: block;
overflow-wrap: anywhere;
color: #ffffff;
font-size: 20px;
line-height: 24px;
font-weight: 900;
}
.referral-bonus-journey-message {
min-height: 18px;
margin-top: 12px;
color: rgba(244, 244, 246, 0.62);
font-size: 12px;
line-height: 18px;
}
.referral-bonus-journey-message.success {
color: #4fd37b;
}
.referral-bonus-journey-message.warning {
color: #ffc95a;
}
.referral-bonus-journey-message.error {
color: #ff7f98;
}
body.referral-bonus-journey-active #chat-widget-container,
body.referral-bonus-journey-active iframe[src*="livechat"],
body.referral-bonus-journey-active iframe[title*="chat"],
body.referral-bonus-journey-active [class*="woot-widget"] {
display: none !important;
visibility: hidden !important;
pointer-events: none !important;
}
html,
body,
#root {
min-height: 100% !important;
background-color: #101010 !important;
background-image: url(https://backoffice.aventoriax.com/images/uploads/2026/08/e0b32b36-d51a-44ab-b30d-f7052ad76c42.png) !important;
background-repeat: no-repeat !important;
background-position: center top !important;
background-size: cover !important;
background-attachment: fixed !important;
}
.layout-bc {
background-color: transparent !important;
background-image: url(https://backoffice.aventoriax.com/images/uploads/2026/08/e0b32b36-d51a-44ab-b30d-f7052ad76c42.png) !important;
background-repeat: no-repeat !important;
background-position: center top !important;
background-size: cover !important;
background-attachment: fixed !important;
}
.header-bc,
.layout-header-holder-bc > .header-bc > .hdr-main-content-bc,
.layout-header-holder-bc .hm-row-bc,
.layout-header-holder-bc .hm-row-bc:nth-child(2) {
background: #00000095 !important;
-webkit-backdrop-filter: none !important;
backdrop-filter: none !important;
}
/* ================================
OLDENBET GOLD / BRONZE THEME
Mevcut CSS'in EN ALTINA ekle
================================ */
html,
:root {
--ob-gold-rgb: 190, 138, 30 !important;
--ob-gold-hover-rgb: 234, 188, 70 !important;
--ob-gold-soft-rgb: 214, 165, 50 !important;
--ob-gold-light-rgb: 246, 220, 118 !important;
--ob-bronze-rgb: 122, 78, 12 !important;
--ob-bronze-dark-rgb: 68, 42, 5 !important;
--ob-dark-rgb: 8, 7, 5 !important;
--ob-panel-rgb: 15, 13, 9 !important;
--hero: 190, 138, 30 !important;
--hero-hover: 234, 188, 70 !important;
--hero-sc: 10, 8, 3 !important;
--brand: 174, 122, 24 !important;
--brand-hover: 226, 178, 62 !important;
--brand-sc: 10, 8, 3 !important;
--accent: 204, 150, 34 !important;
--accent-hover: 246, 211, 102 !important;
--accent-sc: 10, 8, 3 !important;
--oc-1: 183, 129, 27 !important;
--oc-1-hover: 236, 188, 72 !important;
--oc-1-sc: 10, 8, 3 !important;
--oc-2: 218, 165, 45 !important;
--oc-2-hover: 246, 220, 118 !important;
--oc-2-sc: 10, 8, 3 !important;
--oc-3: 153, 96, 16 !important;
--oc-3-hover: 218, 165, 45 !important;
--oc-3-sc: 255, 245, 210 !important;
--warning: 218, 165, 45 !important;
--warning-hover: 246, 220, 118 !important;
--warning-sc: 10, 8, 3 !important;
--error: 150, 88, 20 !important;
--error-hover: 210, 148, 38 !important;
--error-sc: 255, 245, 210 !important;
--odd-down: 148, 84, 18 !important;
--odd-down-hover: 210, 148, 38 !important;
--odd-down-sc: 255, 245, 210 !important;
}
/* Kırmızı badge / etiketler * */
.nav-menu-item.badge-spinCount::after,
.hdr-navigation-link-bc.badge-spinCount::after {
background: linear-gradient(
135deg,
rgba(var(--ob-bronze-rgb), 1) 0%,
rgba(var(--ob-gold-rgb), 1) 45%,
rgba(var(--ob-gold-light-rgb), 1) 100%
) !important;
color: #100b02 !important;
box-shadow: 0 3px 10px rgba(190, 138, 30, .35) !important;
}
/* Promo button kırmızıdan gold/bronze * */
.promo-btn {
color: #120d03 !important;
background:
linear-gradient(
135deg,
#5b3907 0%,
#9f6a13 22%,
#d6a532 50%,
#f1d675 72%,
#8b590d 100%
) !important;
border: 1px solid rgba(246, 220, 118, .45) !important;
box-shadow:
inset 0 1px 0 rgba(255, 246, 190, .65),
inset 0 -2px 6px rgba(75, 43, 4, .65),
0 8px 18px rgba(0, 0, 0, .32) !important;
text-shadow: 0 1px 0 rgba(255, 245, 190, .35) !important;
}
.promo-btn:hover {
background:
linear-gradient(
135deg,
#6b4308 0%,
#b9851d 30%,
#f0cf68 58%,
#fff0a6 76%,
#9a650d 100%
) !important;
}
/* Bilgilendirme widget kırmızı alan * */
.layout-header-holder-bc > .hdr-dynamic-content .swiper-slide > .informative-widget {
background:
linear-gradient(
135deg,
rgba(15, 12, 6, .96) 0%,
rgba(87, 55, 8, .95) 35%,
rgba(178, 126, 27, .95) 100%
) !important;
box-shadow:
inset 0 1px 0 rgba(246, 220, 118, .28),
0 6px 18px rgba(0, 0, 0, .28) !important;
}
.layout-header-holder-bc > .hdr-dynamic-content .swiper-slide > .informative-widget > .informative-widget-link {
border: 0 !important;
border-radius: 0 !important;
}
.informative-widget-container > span {
color: #fff4c7 !important;
}
.informative-widget-container button {
border: 1px solid rgba(246, 220, 118, .65) !important;
background: rgba(8, 7, 5, .38) !important;
color: #fff1b8 !important;
box-shadow: inset 0 1px 0 rgba(255, 255, 255, .12) !important;
}
.informative-widget-container button span {
color: #fff1b8 !important;
}
/* Davet Et Kazan kırmızı başlık / buton * */
.referral-bonus-journey-panel {
border: 1px solid rgba(214, 165, 50, .18) !important;
background:
radial-gradient(circle at top left, rgba(190, 138, 30, .16), transparent 34%),
linear-gradient(180deg, #14110a 0%, #0d0c09 100%) !important;
color: #f6f0dc !important;
}
.referral-bonus-journey-eyebrow {
color: #e3b34a !important;
}
.referral-bonus-journey-badge {
background: rgba(190, 138, 30, .16) !important;
color: #f1d675 !important;
border: 1px solid rgba(246, 220, 118, .20) !important;
}
.referral-bonus-journey-desc {
color: rgba(246, 240, 220, .72) !important;
}
.referral-bonus-journey-link span,
.referral-bonus-journey-stats span,
.referral-bonus-journey-table span {
color: rgba(246, 240, 220, .58) !important;
}
.referral-bonus-journey-link input {
border: 1px solid rgba(214, 165, 50, .20) !important;
background: rgba(8, 7, 5, .88) !important;
color: #fff6d8 !important;
}
.referral-bonus-journey-link input:focus {
border-color: rgba(246, 220, 118, .55) !important;
box-shadow: 0 0 0 2px rgba(190, 138, 30, .18) !important;
}
.referral-bonus-journey-link button {
background:
linear-gradient(
135deg,
#6b4308 0%,
#b9851d 38%,
#f0cf68 100%
) !important;
color: #100b02 !important;
border: 1px solid rgba(246, 220, 118, .40) !important;
box-shadow:
inset 0 1px 0 rgba(255, 246, 190, .55),
0 8px 16px rgba(0, 0, 0, .25) !important;
}
.referral-bonus-journey-link button:hover {
background:
linear-gradient(
135deg,
#7a4e0d 0%,
#d19a2c 45%,
#fff0a6 100%
) !important;
}
.referral-bonus-journey-stats > div,
.referral-bonus-journey-table > div {
background:
linear-gradient(
180deg,
rgba(36, 29, 14, .96) 0%,
rgba(18, 16, 11, .96) 100%
) !important;
border: 1px solid rgba(214, 165, 50, .13) !important;
}
.referral-bonus-journey-stats strong,
.referral-bonus-journey-table b {
color: #fff2bd !important;
}
.referral-bonus-journey-message {
color: rgba(246, 240, 220, .62) !important;
}
.referral-bonus-journey-message.success {
color: #f1d675 !important;
}
.referral-bonus-journey-message.warning {
color: #f5c85d !important;
}
.referral-bonus-journey-message.error {
color: #d6a532 !important;
}
/* Loyalty kırmızı link * */
.loyaltyProgramItems p a {
color: #e3b34a !important;
}
.loyaltyProgramItems p a:hover {
color: #fff0a6 !important;
}
/* Registration hata alanları kırmızı/pembe yerine gold uyarı tonu * */
.registration-extra-field-error {
color: #f1c85c !important;
}
.registration-extra-field.has-error {
border: 1px solid rgba(214, 165, 50, .55) !important;
box-shadow:
0 0 0 1px rgba(214, 165, 50, .18) inset,
0 0 12px rgba(190, 138, 30, .15) !important;
}
/* Başlık / header koyu altın cam hissi * */
.header-bc,
.layout-header-holder-bc > .header-bc > .hdr-main-content-bc,
.layout-header-holder-bc .hm-row-bc,
.layout-header-holder-bc .hm-row-bc:nth-child(2) {
background:
linear-gradient(
180deg,
rgba(8, 7, 5, .88) 0%,
rgba(16, 13, 7, .78) 100%
) !important;
border-bottom: 1px solid rgba(214, 165, 50, .12) !important;
}
/* Header içi küçük aktif alanlar * */
.hdr-main-content-bc .hdr-user-bc .user-balance-dropdown .nav-menu-item {
background: rgba(190, 138, 30, .12) !important;
border: 1px solid rgba(246, 220, 118, .13) !important;
color: #fff4c7 !important;
}
.hdr-main-content-bc .hdr-user-bc .user-balance-dropdown .nav-menu-item::after {
color: rgba(246, 220, 118, .82) !important;
}
/* Para yatır butonu / ikon havası * */
.hdr-user-bc .deposit-btn.user-nav-icon {
background:
linear-gradient(
135deg,
#694107 0%,
#b9851d 45%,
#e8bf58 100%
) !important;
color: #100b02 !important;
box-shadow:
inset 0 1px 0 rgba(255, 246, 190, .45),
0 5px 12px rgba(0, 0, 0, .28) !important;
}
.hdr-user-bc .deposit-btn.user-nav-icon::before {
color: #100b02 !important;
}
/* Cüzdan yeşilini de logo tonuna yaklaştırmak istersen * */
.hdr-user-bc .bc-i-wallet {
background:
linear-gradient(
135deg,
#6b4308 0%,
#b9851d 50%,
#e6bd55 100%
) !important;
color: #120d03 !important;
}
/* Popup butonlarda kırmızı/yeşil yerine gold * */
.popup-holder-bc .popup-middleware-bc .popup-inner-bc .congrats-parent-block .congrats-reg-step-buttons .btn.a-outline:first-child {
background:
linear-gradient(
135deg,
#6b4308 0%,
#b9851d 45%,
#e6bd55 100%
) !important;
color: #120d03 !important;
border: 1px solid rgba(246, 220, 118, .35) !important;
}
.popup-holder-bc .popup-middleware-bc .popup-inner-bc .congrats-parent-block .congrats-reg-step-buttons .btn.a-outline:first-child:hover {
background:
linear-gradient(
135deg,
#7a4e0d 0%,
#d19a2c 48%,
#fff0a6 100%
) !important;
}
/* Genel kırmızı buton sınıfları varsa ezsin * */
.btn.a-color,
.btn.a-color:hover,
button.a-color,
button.a-color:hover,
.a-color,
.a-color:hover {
background:
linear-gradient(
135deg,
#6b4308 0%,
#b9851d 45%,
#e6bd55 100%
) !important;
color: #120d03 !important;
border-color: rgba(246, 220, 118, .35) !important;
}
/* Seçili tab / aktif alanlar * */
.hdr-navigation-link-bc.active,
.nav-menu-item.active,
.horizontal-sl-item-bc.active {
color: #fff0a6 !important;
}
.hdr-navigation-link-bc.active::after,
.nav-menu-item.active::after,
.horizontal-sl-item-bc.active::after {
background: #d6a532 !important;
}
/* Mobil story / aktif çerçeve tonları * */
.is-mobile .storiesWidgetWrapper:not(.portraitView) .storiesWidgetListItem:not(.storiesItemSkeleton):before {
background:
linear-gradient(
135deg,
#5b3907 0%,
#d6a532 48%,
#fff0a6 100%
) !important;
}
.is-mobile .storiesWidgetWrapper:not(.portraitView) .storiesWidgetListItem:not(.storiesItemSkeleton):after {
border-color: rgba(246, 220, 118, .55) !important;
}
/* Seçim / focus renkleri * */
input:focus,
textarea:focus,
select:focus {
border-color: rgba(246, 220, 118, .55) !important;
box-shadow: 0 0 0 2px rgba(190, 138, 30, .16) !important;
}
/* Text selection 2* */
::selection {
background: rgba(214, 165, 50, .42) !important;
color: #fff6d8 !important;
}
.logo-container .header-icon {
width: auto !important;
height: 36px !important;
}
.logo-container .header-icon img {
width: auto !important;
}
/* ==========================================================================
VOOVBET KIRMIZI / BEYAZ — GÜVENLİ RENK OVERRIDE
Yalnızca renkleri değiştirir. Menü açılma yapısına, ölçülere, konumlara,
display / position / transform / z-index / pointer-events değerlerine dokunmaz.
Mevcut O995200s.webp arka planı aynen korunur.
========================================================================== */
html,
:root {
--voov-red-rgb: 246, 2, 12 !important;
--voov-red-hover-rgb: 255, 38, 49 !important;
--voov-red-dark-rgb: 152, 0, 7 !important;
--voov-white-rgb: 255, 255, 255 !important;
--voov-silver-rgb: 242, 242, 244 !important;
--voov-black-rgb: 9, 9, 11 !important;
--voov-panel-rgb: 18, 18, 21 !important;
/* Eski gold değişken adları bazı kurallarda kullanıldığı için kırmızıya çevrildi. * */
--ob-gold-rgb: 246, 2, 12 !important;
--ob-gold-hover-rgb: 255, 38, 49 !important;
--ob-gold-soft-rgb: 255, 255, 255 !important;
--ob-gold-light-rgb: 255, 255, 255 !important;
--ob-bronze-rgb: 152, 0, 7 !important;
--ob-bronze-dark-rgb: 72, 0, 4 !important;
--ob-dark-rgb: 9, 9, 11 !important;
--ob-panel-rgb: 18, 18, 21 !important;
--hero: 246, 2, 12 !important;
--hero-hover: 255, 38, 49 !important;
--hero-sc: 255, 255, 255 !important;
--brand: 188, 0, 9 !important;
--brand-hover: 246, 2, 12 !important;
--brand-sc: 255, 255, 255 !important;
--secondary: 18, 18, 21 !important;
--secondary-hover: 32, 32, 37 !important;
--secondary-sc: 255, 255, 255 !important;
--accent: 246, 2, 12 !important;
--accent-hover: 255, 38, 49 !important;
--accent-sc: 255, 255, 255 !important;
--oc-1: 246, 2, 12 !important;
--oc-1-hover: 255, 38, 49 !important;
--oc-1-sc: 255, 255, 255 !important;
--oc-2: 245, 245, 247 !important;
--oc-2-hover: 255, 255, 255 !important;
--oc-2-sc: 10, 10, 12 !important;
--oc-3: 152, 0, 7 !important;
--oc-3-hover: 210, 0, 10 !important;
--oc-3-sc: 255, 255, 255 !important;
--odd-up: 245, 245, 247 !important;
--odd-up-hover: 255, 255, 255 !important;
--odd-up-sc: 10, 10, 12 !important;
--odd-down: 246, 2, 12 !important;
--odd-down-hover: 255, 38, 49 !important;
--odd-down-sc: 255, 255, 255 !important;
--neutral: 255, 255, 255 !important;
--neutral-sc: 10, 10, 12 !important;
--b: 9, 9, 11 !important;
--b-hover: 27, 27, 31 !important;
--b-sc: 255, 255, 255 !important;
--header: 10, 10, 12 !important;
--header-hover: 27, 27, 31 !important;
--header-sc: 255, 255, 255 !important;
--menu: 12, 12, 15 !important;
--menu-hover: 29, 29, 34 !important;
--menu-sc: 255, 255, 255 !important;
--tab-navigation: 13, 13, 16 !important;
--tab-navigation-hover: 31, 31, 36 !important;
--tab-navigation-sc: 255, 255, 255 !important;
/* Sarı, yeşil ve mavi sistem renkleri kırmızı/beyaz palete çekildi. * */
--warning: 255, 100, 110 !important;
--warning-hover: 255, 135, 143 !important;
--warning-sc: 255, 255, 255 !important;
--error: 246, 2, 12 !important;
--error-hover: 255, 55, 65 !important;
--error-sc: 255, 255, 255 !important;
--success: 245, 245, 247 !important;
--success-hover: 255, 255, 255 !important;
--success-sc: 10, 10, 12 !important;
--info: 225, 225, 229 !important;
--info-hover: 255, 255, 255 !important;
--info-sc: 10, 10, 12 !important;
}
/* Rozetler * */
.nav-menu-item.badge-spinCount::after,
.hdr-navigation-link-bc.badge-spinCount::after {
background: linear-gradient(135deg, #850007 0%, #F6020C 56%, #FF3943 100%) !important;
color: #FFFFFF !important;
box-shadow: 0 3px 10px rgba(246, 2, 12, .30) !important;
}
/* Promosyon ve genel kırmızı aksiyonlar * */
.promo-btn {
color: #FFFFFF !important;
background: linear-gradient(135deg, #780006 0%, #C9000A 38%, #F6020C 68%, #A00008 100%) !important;
border: 1px solid rgba(255, 255, 255, .25) !important;
box-shadow:
inset 0 1px 0 rgba(255, 255, 255, .30),
inset 0 -2px 6px rgba(70, 0, 4, .55),
0 8px 18px rgba(0, 0, 0, .32) !important;
text-shadow: 0 1px 1px rgba(0, 0, 0, .45) !important;
}
.promo-btn:hover {
background: linear-gradient(135deg, #930008 0%, #F6020C 52%, #FF3943 100%) !important;
}
.special-games-button .btn.coupons.a-color {
color: #FFFFFF !important;
background: linear-gradient(90deg, #820007 0%, #F6020C 58%, #FF3943 100%) !important;
border-color: rgba(255, 255, 255, .28) !important;
}
.special-games-button .btn.coupons:not(.a-color) > i {
color: #F6020C !important;
}
/* Üst bilgilendirme alanı * */
.layout-header-holder-bc > .hdr-dynamic-content .swiper-slide > .informative-widget {
background: linear-gradient(135deg, rgba(22, 9, 11, .97) 0%, rgba(112, 0, 7, .96) 46%, rgba(226, 0, 11, .96) 100%) !important;
box-shadow:
inset 0 1px 0 rgba(255, 255, 255, .16),
0 6px 18px rgba(0, 0, 0, .28) !important;
}
.informative-widget-container > span,
.informative-widget-container button span {
color: #FFFFFF !important;
}
.informative-widget-container button {
border-color: rgba(255, 255, 255, .72) !important;
background: rgba(25, 0, 2, .34) !important;
color: #FFFFFF !important;
box-shadow: inset 0 1px 0 rgba(255, 255, 255, .12) !important;
}
/* Davet Et Kazan * */
.referral-bonus-journey-panel {
border-color: rgba(246, 2, 12, .24) !important;
background:
radial-gradient(circle at top left, rgba(246, 2, 12, .16), transparent 36%),
linear-gradient(180deg, #151518 0%, #0D0D10 100%) !important;
color: #F5F5F7 !important;
}
.referral-bonus-journey-eyebrow {
color: #FF3943 !important;
}
.referral-bonus-journey-badge {
background: rgba(246, 2, 12, .18) !important;
color: #FFFFFF !important;
border-color: rgba(255, 255, 255, .18) !important;
}
.referral-bonus-journey-desc {
color: rgba(245, 245, 247, .74) !important;
}
.referral-bonus-journey-link span,
.referral-bonus-journey-stats span,
.referral-bonus-journey-table span {
color: rgba(245, 245, 247, .60) !important;
}
.referral-bonus-journey-link input {
border-color: rgba(246, 2, 12, .28) !important;
background: rgba(9, 9, 11, .90) !important;
color: #FFFFFF !important;
}
.referral-bonus-journey-link input:focus {
border-color: rgba(255, 38, 49, .76) !important;
box-shadow: 0 0 0 2px rgba(246, 2, 12, .18) !important;
}
.referral-bonus-journey-link button {
background: linear-gradient(135deg, #870007 0%, #D7000B 44%, #F6020C 100%) !important;
color: #FFFFFF !important;
border-color: rgba(255, 255, 255, .24) !important;
box-shadow:
inset 0 1px 0 rgba(255, 255, 255, .25),
0 8px 16px rgba(0, 0, 0, .25) !important;
}
.referral-bonus-journey-link button:hover {
background: linear-gradient(135deg, #A40008 0%, #F6020C 56%, #FF3943 100%) !important;
}
.referral-bonus-journey-stats > div,
.referral-bonus-journey-table > div {
background: linear-gradient(180deg, rgba(31, 31, 35, .96) 0%, rgba(17, 17, 20, .96) 100%) !important;
border-color: rgba(246, 2, 12, .16) !important;
}
.referral-bonus-journey-stats strong,
.referral-bonus-journey-table b {
color: #FFFFFF !important;
}
.referral-bonus-journey-message {
color: rgba(245, 245, 247, .64) !important;
}
.referral-bonus-journey-message.success {
color: #F2F2F4 !important;
}
.referral-bonus-journey-message.warning {
color: #FF9AA1 !important;
}
.referral-bonus-journey-message.error {
color: #FF3943 !important;
}
/* Link, hata ve focus renkleri * */
.loyaltyProgramItems p a {
color: #FF3943 !important;
}
.loyaltyProgramItems p a:hover {
color: #FFFFFF !important;
}
.registration-extra-field-error {
color: #FF747D !important;
}
.registration-extra-field.has-error {
border-color: rgba(246, 2, 12, .62) !important;
box-shadow:
0 0 0 1px rgba(246, 2, 12, .20) inset,
0 0 12px rgba(246, 2, 12, .16) !important;
}
input:focus,
textarea:focus,
select:focus {
border-color: rgba(255, 38, 49, .72) !important;
box-shadow: 0 0 0 2px rgba(246, 2, 12, .16) !important;
}
/* Header yalnızca görsel olarak kırmızı/siyah; menü davranışına dokunulmaz. * */
.header-bc,
.layout-header-holder-bc > .header-bc > .hdr-main-content-bc,
.layout-header-holder-bc .hm-row-bc,
.layout-header-holder-bc .hm-row-bc:nth-child(2) {
background: linear-gradient(180deg, rgba(9, 9, 11, .90) 0%, rgba(18, 10, 12, .82) 100%) !important;
border-bottom-color: rgba(246, 2, 12, .18) !important;
}
.hdr-main-content-bc .hdr-user-bc .user-balance-dropdown .nav-menu-item {
background: rgba(246, 2, 12, .11) !important;
border-color: rgba(255, 255, 255, .14) !important;
color: #FFFFFF !important;
}
.hdr-main-content-bc .hdr-user-bc .user-balance-dropdown .nav-menu-item::after {
color: rgba(255, 255, 255, .84) !important;
}
/* Para yatır, cüzdan ve popup butonları * */
.hdr-user-bc .deposit-btn.user-nav-icon,
.hdr-user-bc .bc-i-wallet,
.popup-holder-bc .popup-middleware-bc .popup-inner-bc .congrats-parent-block .congrats-reg-step-buttons .btn.a-outline:first-child {
background: linear-gradient(135deg, #830007 0%, #D7000B 48%, #F6020C 100%) !important;
color: #FFFFFF !important;
border-color: rgba(255, 255, 255, .24) !important;
box-shadow:
inset 0 1px 0 rgba(255, 255, 255, .24),
0 5px 12px rgba(0, 0, 0, .28) !important;
}
.hdr-user-bc .deposit-btn.user-nav-icon::before,
.hdr-user-bc .bc-i-wallet::before {
color: #FFFFFF !important;
}
.popup-holder-bc .popup-middleware-bc .popup-inner-bc .congrats-parent-block .congrats-reg-step-buttons .btn.a-outline:first-child:hover {
background: linear-gradient(135deg, #A40008 0%, #F6020C 54%, #FF3943 100%) !important;
}
/* Genel ana butonlar * */
.btn.a-color,
.btn.a-color:hover,
button.a-color,
button.a-color:hover,
.a-color,
.a-color:hover {
background: linear-gradient(135deg, #830007 0%, #D7000B 48%, #F6020C 100%) !important;
color: #FFFFFF !important;
border-color: rgba(255, 255, 255, .24) !important;
}
.btn.a-color:hover,
button.a-color:hover,
.a-color:hover {
background: linear-gradient(135deg, #A40008 0%, #F6020C 56%, #FF3943 100%) !important;
}
/* Aktif sekmeler ve story çerçeveleri * */
.hdr-navigation-link-bc.active,
.nav-menu-item.active,
.horizontal-sl-item-bc.active {
color: #FFFFFF !important;
}
.hdr-navigation-link-bc.active::after,
.nav-menu-item.active::after,
.horizontal-sl-item-bc.active::after {
background: #F6020C !important;
}
.is-mobile .storiesWidgetWrapper:not(.portraitView) .storiesWidgetListItem:not(.storiesItemSkeleton)::before {
background: linear-gradient(135deg, #780006 0%, #F6020C 52%, #FFFFFF 100%) !important;
}
.is-mobile .storiesWidgetWrapper:not(.portraitView) .storiesWidgetListItem:not(.storiesItemSkeleton)::after {
border-color: rgba(255, 255, 255, .64) !important;
}
/* Oran kutularındaki eski mavi/sarı tonlar * */
.slider-market-coefficient-container .market-bc:not(:where(.layout-bc:is(.sportsbook,.prematch,.live) *)) {
color: #FFFFFF !important;
background: rgba(18, 18, 21, .94) !important;
border-color: rgba(246, 2, 12, .24) !important;
box-shadow:
inset 2px 2px 5px rgba(255, 255, 255, .08),
inset -2px -2px 5px rgba(0, 0, 0, .42) !important;
}
.slider-market-coefficient-container .market-bc .market-odd-bc:not(:where(.layout-bc:is(.sportsbook,.prematch,.live) *)),
.slider-market-coefficient-container .market-bc:not(.active) .market-odd-bc:not(:where(.layout-bc:is(.sportsbook,.prematch,.live) *)) {
color: #FFFFFF !important;
}
.slider-market-coefficient-container .market-bc.active:not(:where(.layout-bc:is(.sportsbook,.prematch,.live) *)) {
background: linear-gradient(135deg, #A00008 0%, #F6020C 100%) !important;
border-color: rgba(255, 255, 255, .28) !important;
}
/* Diğer eski yeşil / mavi / mor yüzeyler * */
.layout-content-holder-bc .jackpot-banner .casinoJackpotWrapper-bc {
background-color: #151518 !important;
}
.v-care-fund-jackpot .sdr-item-bc {
background-color: #360006 !important;
}
/* Scrollbar ve seçili metin * */
::-webkit-scrollbar-thumb {
background: #F6020C !important;
}
::selection {
background: rgba(246, 2, 12, .50) !important;
color: #FFFFFF !important;
}
/* ==========================================================================
ORİJİNAL ÇALIŞAN ARKA PLAN — AYNEN KORUNDU
Yeni dosya, resim URL'sini veya katman yapısını değiştirmez.
========================================================================== */
html,
body,
#root {
min-height: 100% !important;
background-color: #101010 !important;
background-image: url(https://backoffice.aventoriax.com/images/uploads/2026/08/e0b32b36-d51a-44ab-b30d-f7052ad76c42.png) !important;
background-repeat: no-repeat !important;
background-position: center top !important;
background-size: cover !important;
background-attachment: fixed !important;
}
.layout-bc {
background-color: transparent !important;
background-image: url(https://backoffice.aventoriax.com/images/uploads/2026/08/e0b32b36-d51a-44ab-b30d-f7052ad76c42.png) !important;
background-repeat: no-repeat !important;
background-position: center top !important;
background-size: cover !important;
background-attachment: fixed !important;
}
/* AX footer licence badges: full colour without hover * */
#aventoriax-footer-licences,
#aventoriax-footer-licences .sliderGroup,
#aventoriax-footer-licences .horizontalSliderWrapper,
#aventoriax-footer-licences .sliderImage,
#aventoriax-footer-licences .sliderImage img,
#aventoriax-footer-licences .horizontalSliderItem,
#aventoriax-footer-licences .horizontalSliderItem img {
filter: none !important;
-webkit-filter: none !important;
opacity: 1 !important;
}
/* AX RESPONSIVE BACKGROUND FIT MOBILE v1 * */
@media (max-width: 768px) {
html, body, #root, .layout-bc, #root.layout-bc {
background-size: 100% auto !important;
background-position: center top !important;
background-repeat: no-repeat !important;
background-attachment: scroll !important;
}
}
/* VOOVBET NAVY RUBY 20260909 — presentation only; original functional rules retained. * */
html:root {
--vb-ink: #07111c;
--vb-panel: #0e1b2a;
--vb-panel-raised: #142438;
--vb-line: rgba(158, 184, 211, .17);
--vb-text: #f4f7fc;
--vb-muted: #b6c4d7;
--vb-ruby: #ce1238;
--b: 7, 17, 28 !important;
--b-hover: 20, 36, 56 !important;
--b-sc: 244, 247, 252 !important;
--header: 11, 22, 35 !important;
--header-sc: 244, 247, 252 !important;
--menu: 14, 27, 42 !important;
--menu-sc: 244, 247, 252 !important;
--secondary: 20, 36, 56 !important;
--secondary-sc: 244, 247, 252 !important;
--tab-navigation: 11, 22, 35 !important;
--tab-navigation-sc: 244, 247, 252 !important;
--hero: 206, 18, 56 !important;
--hero-hover: 224, 29, 69 !important;
--hero-sc: 255, 255, 255 !important;
--brand: 206, 18, 56 !important;
--brand-sc: 255, 255, 255 !important;
--accent: 255, 91, 122 !important;
--oc-1: 206, 18, 56 !important;
--oc-1-sc: 255, 255, 255 !important;
--oc-2: 151, 23, 51 !important;
--oc-2-sc: 255, 255, 255 !important;
--success: 36, 193, 137 !important;
--warning: 245, 182, 69 !important;
--error: 255, 100, 123 !important;
--info: 103, 178, 255 !important;
color-scheme: dark;
scrollbar-color: #96334c #0b1623;
}
html:root, html body {
background: var(--vb-ink) !important;
}
html body #root.layout-bc {
background-color: var(--vb-ink) !important;
background-image:
linear-gradient(145deg, transparent 0 32%, rgba(35, 57, 80, .20) 32% 40%, transparent 40% 66%, rgba(35, 57, 80, .10) 66% 73%, transparent 73%),
linear-gradient(180deg, #0d1a29 0%, #07111c 820px) !important;
background-repeat: no-repeat !important;
background-position: center top !important;
background-size: 100% 1100px, 100% 1100px !important;
background-attachment: scroll !important;
color: var(--vb-text);
}
html body .layout-header-holder-bc,
html body .layout-header-holder-bc::before,
html body .header-bc,
html body .layout-header-holder-bc > .header-bc > .hdr-main-content-bc {
background: #0b1623 !important;
backdrop-filter: none !important;
-webkit-backdrop-filter: none !important;
box-shadow: none !important;
}
html body .layout-header-holder-bc {
border-bottom: 1px solid rgba(238, 50, 87, .24) !important;
box-shadow: 0 5px 18px rgba(0, 0, 0, .18) !important;
}
html body .nav-menu-item,
html body .asideMenuNavItem {
border-image: none !important;
border-color: var(--vb-line) !important;
background: #101e2e !important;
color: var(--vb-muted) !important;
box-shadow: none !important;
}
html body .nav-menu-item.active,
html body .asideMenuNavItem.active {
background: linear-gradient(135deg, #522137, #241c2d) !important;
border-color: rgba(241, 73, 109, .42) !important;
color: #fff !important;
}
html body .layout-content-holder-bc .promotion-horizontal-sl-list-bc {
background: #0e1b2a !important;
background-image: none !important;
height: auto !important;
min-height: 58px;
border: 1px solid var(--vb-line);
border-radius: 12px;
padding: 6px;
gap: 6px;
box-sizing: border-box;
}
html body .promotion-horizontal-sl-list-bc .horizontal-sl-item-bc {
min-height: 44px !important;
border-radius: 8px !important;
background: #142438 !important;
color: var(--vb-muted) !important;
box-shadow: none !important;
}
html body .promotion-horizontal-sl-list-bc .horizontal-sl-item-bc.active {
background: linear-gradient(135deg, #ce1238, #a00d2c) !important;
color: #fff !important;
}
html body .promotionsList-bc {
gap: 18px !important;
padding-top: 18px !important;
}
html body article.promotionsListEl-bc {
min-width: 0;
box-sizing: border-box;
background: var(--vb-panel) !important;
border: 1px solid var(--vb-line) !important;
border-radius: 13px !important;
overflow: hidden;
box-shadow: 0 8px 24px rgba(0, 0, 0, .16);
transition: border-color .18s ease, box-shadow .18s ease;
}
html body .promotionsArticleThumbnail-bc {
display: block;
width: 100% !important;
height: auto !important;
aspect-ratio: 16 / 9;
object-fit: contain !important;
border-radius: 0 !important;
}
html body .promotions-article-title.ellipsis {
min-height: 48px;
height: auto !important;
padding: 12px 14px !important;
margin: 0 !important;
color: var(--vb-text) !important;
background: #101e2e !important;
border-top: 1px solid rgba(158, 184, 211, .10);
font-size: 13px;
line-height: 1.5 !important;
font-weight: 650;
white-space: normal !important;
overflow-wrap: anywhere;
box-sizing: border-box;
}
html body .slider-bc > .carouselWrapper {
border-radius: 12px !important;
overflow: hidden;
box-shadow: 0 0 0 1px var(--vb-line), 0 8px 24px rgba(0, 0, 0, .16);
}
html body .product-banner-img-bc {
border-radius: 10px;
}
html body .casinoCategoryChooserContainer .horizontalSliderWrapper,
html body .searchInputWrp,
html body .providerSearchAndReset,
html body .providerItemsContainer {
background: #0e1b2a !important;
border-color: var(--vb-line) !important;
backdrop-filter: none !important;
-webkit-backdrop-filter: none !important;
}
html body .casinoProviderRow,
html body .casinoGameListBlockHeader {
background: #0b1826 !important;
backdrop-filter: none !important;
-webkit-backdrop-filter: none !important;
}
html body .casinoGameItemWrp {
border-radius: 10px;
}
html body .casino-info-block {
background: #0e1b2a !important;
border: 1px solid var(--vb-line);
border-radius: 10px;
box-sizing: border-box;
}
html body .casino-tournament-name,
html body .casino-winners-amount { color: #ff9ab1 !important; }
html body .casino-winners-info > span { color: #c4d0df !important; }
html body .popup-inner-bc {
background: #0e1b2a !important;
border-color: rgba(159, 185, 212, .22) !important;
backdrop-filter: none !important;
-webkit-backdrop-filter: none !important;
}
html body .promotion-details-img {
max-width: 100%;
height: auto !important;
object-fit: contain !important;
border-radius: 12px;
}
html body .promotion-details-info {
color: #c4d0df !important;
font-size: 14px;
line-height: 1.65;
}
html body .promotion-details-info :is(p, li, .summary-item) {
color: #c4d0df !important;
line-height: 1.65 !important;
}
html body .promotion-details-info :is(h1, h2, h3, strong) { color: #f4f7fc !important; }
html body .promotion-details-info h1 { font-size: 22px; line-height: 1.3; margin-block: 12px; }
html body .promotion-details-info h2 { font-size: 17px; line-height: 1.4; margin-block: 20px 10px; }
html body .promotion-details-info .summary-item { padding-block: 3px; }
html body .featuredGamesContent .market-bc:not(.active) .market-odd-bc:not(:where(.layout-bc:is(.sportsbook,.prematch,.live) *)) {
color: #f4f7fc !important;
}
html body .entrance-form-bc input:not([type="checkbox"]):not([type="radio"]),
html body .searchInputWrp input {
border-color: #40546b !important;
color: var(--vb-text) !important;
}
html body .entrance-form-bc input::placeholder,
html body .searchInputWrp input::placeholder {
color: #a5b6cb !important;
opacity: 1;
}
html body .e-p-close-icon-bc {
min-width: 40px;
min-height: 40px;
color: var(--vb-text) !important;
}
html body .layout-footer-holder-bc {
background: linear-gradient(180deg, rgba(14, 27, 42, .80), #07111c) !important;
border-top: 1px solid var(--vb-line) !important;
margin-top: 24px;
}
html body .footerLinkColTitle {
color: #e5edf7 !important;
font-size: 13px;
letter-spacing: .6px;
}
html body .footerLinkColEl,
html body .footerLinkColEl a,
html body .footerCopyrights {
color: var(--vb-muted) !important;
}
html body :is(button, a, input, select, textarea, [tabindex]):focus-visible {
outline: 2px solid #ff7895 !important;
outline-offset: 3px !important;
}
html body ::selection {
color: #fff;
background: #a31139;
}
@media (hover: hover) and (pointer: fine) {
html body article.promotionsListEl-bc:hover {
border-color: rgba(248, 90, 126, .58) !important;
box-shadow: 0 10px 26px rgba(0, 0, 0, .25);
}
html body .nav-menu-item:hover,
html body .asideMenuNavItem:hover {
background: #213349 !important;
color: #fff !important;
}
html body .footerLinkColEl a:hover { color: #ff7895 !important; }
}
@media (prefers-reduced-motion: reduce) {
html body article.promotionsListEl-bc,
html body .hdr-user-bc > .btn,
html body .nav-menu-item,
html body .asideMenuNavItem,
html body #voovbet-chat-launcher,
html body #voovbet-chat-launcher::before,
html body #voovbet-chat-launcher::after {
animation: none !important;
transition: none !important;
}
}
/* Actual mobile application at m.voovbet.com; safe-area and runtime heights remain intact. * */
html.is-mobile body .hdr-main-content-bc { gap: 6px; }
html.is-mobile body .hdr-main-content-bc .logo-container {
min-width: 0;
flex: 1 1 auto;
}
html.is-mobile body .hdr-toggle-button-bc {
min-width: 36px;
min-height: 40px;
display: flex;
align-items: center;
justify-content: center;
}
html.is-mobile body .layout-navigation-holder-bc,
html.is-mobile body .tab-navigation-w-bc {
background: #0b1623 !important;
border-top-color: rgba(157, 183, 210, .22) !important;
box-shadow: 0 -5px 18px rgba(0, 0, 0, .22) !important;
}
html.is-mobile body .tab-nav-item-bc {
color: #b8c7da !important;
min-height: 48px;
}
html.is-mobile body .tab-nav-item-bc.active { color: #ff7895 !important; }
html.is-mobile body .tab-nav-title-bc { font-size: 10px; letter-spacing: .15px; }
html.is-mobile body .genericMenuBurger {
background: linear-gradient(135deg, #d81740, #af0c30) !important;
color: #fff !important;
box-shadow: 0 0 0 4px #0b1623 !important;
}
html.is-mobile body #root.promotion-page .layout-content-holder-bc { padding-top: 10px; }
html.is-mobile body .promotion-horizontal-sl-list-bc {
border-radius: 10px;
min-height: 64px;
}
html.is-mobile body .promotion-horizontal-sl-list-bc .horizontal-sl-item-bc { min-width: 74px; }
html.is-mobile body .promotionsList-bc {
display: grid !important;
grid-template-columns: minmax(0, 1fr);
gap: 14px !important;
padding-top: 12px !important;
}
html.is-mobile body .promotionsList-bc > article { width: 100% !important; margin: 0 !important; }
html.is-mobile body .promotions-article-title.ellipsis { min-height: 46px; font-size: 13px; }
html.is-mobile body .slider-bc > .carouselWrapper { border-radius: 10px !important; }
html.is-mobile body .storiesWidgetWrapper.portraitView { margin-block: 8px; }
html.is-mobile body .entrance-form-bc input:not([type="checkbox"]):not([type="radio"]) {
font-size: 16px !important;
}
html.is-mobile body .footerLinkColEl a {
display: inline-flex;
align-items: center;
min-height: 36px;
}
html.is-mobile body #voovbet-chat-launcher {
bottom: calc(76px + env(safe-area-inset-bottom, 0px)) !important;
right: max(12px, env(safe-area-inset-right, 0px)) !important;
}
@media (min-width: 600px) {
html.is-mobile body .promotionsList-bc { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 360px) {
html.is-mobile body .hdr-main-content-bc .logo-container .logo,
html.is-mobile body .hdr-main-content-bc .hdr-logo-bc { width: 88px; }
html.is-mobile body .hdr-main-content-bc .header-icon { width: 30px; margin-inline: 3px; }
html.is-mobile body .hdr-main-content-bc .header-icon img { width: 28px; height: 28px; }
}
/* VOOVBET MOBILE CARDS 20260909 — actual mobile app, not desktop viewport simulation. * */
html.is-mobile body .casinoGameItemContent,
html.is-mobile body .casino-game-item-content {
border-radius: 12px !important;
background: #101e2c;
box-shadow: 0 0 0 1px rgba(157,183,210,.22), 0 4px 12px rgba(0,0,0,.18);
/* Preserve implicit carousel tracks when cards scroll out of view. * */
min-width: auto;
}
html.is-mobile body .casinoGameItem,
html.is-mobile body .casino-game-item {
border-radius: 12px !important;
overflow: hidden;
isolation: isolate;
background: #101e2c;
}
html.is-mobile body .casinoGameItemImage,
html.is-mobile body .casino-game-item-image-bc {
display: block;
border-radius: 12px !important;
}
html.is-mobile body .casinoGameItemContent:focus-within,
html.is-mobile body .casino-game-item-content:focus-within {
outline: 2px solid #ff7895;
outline-offset: 2px;
}
html.is-mobile body .casinoGameItemFavBc,
html.is-mobile body .casino-game-item-fav-bc {
width: 32px;
height: 32px;
display: flex;
align-items: center;
justify-content: center;
top: 5px;
right: 5px;
border-radius: 50%;
background: rgba(7,17,28,.78);
box-shadow: 0 0 0 1px rgba(157,183,210,.22);
color: #f4f7fc;
font-size: 17px;
}
html.is-mobile body .casinoGameItemFavBc.active,
html.is-mobile body .casino-game-item-fav-bc.active { color: #ff7895; }
html.is-mobile body .providerTxtBtnMob {
border-radius: 10px;
min-height: 40px;
background: #142538;
color: #f4f7fc;
box-shadow: inset 0 0 0 1px rgba(157,183,210,.22);
}
/* Only the newly redesigned mobile campaign images. The hidden strip contains
duplicate titles/admin placeholder descriptions, never promotion conditions.
Accessible link names and image alt text remain in place. */
html.is-mobile body .sdr-item-holder-bc:has(.sdr-image-bc[src*="/voovbet-mobile-"][src*="-20260909-v2.webp"]) {
padding: 0 !important;
}
html.is-mobile body .sdr-item-holder-bc:has(.sdr-image-bc[src*="/voovbet-mobile-"][src*="-20260909-v2.webp"]) > .sdr-item-holder-bc-text {
display: none !important;
}
html.is-mobile body .sdr-item-holder-bc:has(.sdr-image-bc[src*="/voovbet-mobile-"][src*="-20260909-v2.webp"]) > .sdr-item-bc {
height: 100% !important;
}
html.is-mobile body .sdr-image-bc[src*="/voovbet-mobile-"][src*="-20260909-v2.webp"] {
display: block;
width: 100%;
height: 100%;
object-fit: contain;
background: #07111c;
}
html.is-mobile body .slider-bc .swiper-pagination-fraction:not(.swiper-pagination-lock) {
top: 7px;
bottom: auto;
left: auto;
right: 7px;
width: auto;
min-width: 37px;
min-height: 22px;
padding: 3px 6px;
border-radius: 7px;
background: rgba(7,17,28,.82);
color: #f4f7fc;
font-size: 11px;
line-height: 16px;
pointer-events: none;
box-sizing: border-box;
}
@media (hover:hover) and (pointer:fine) {
html.is-mobile body .casinoGameItemContent:hover,
html.is-mobile body .casino-game-item-content:hover {
box-shadow: 0 0 0 1px rgba(255,120,149,.65), 0 6px 16px rgba(0,0,0,.22);
}
}
/* VOOVBET RESPONSIVE QA 20260909 — scoped form and overlay refinements. * */
/* At supported desktop widths, let the root use the available content width.
The old 1020px minimum ignored a 15px scrollbar in a 1024px window. */
@media (min-width: 1020px) {
html.is-web { min-width: 0 !important; }
}
/* Preserve the promo icon on narrow signed-out headers. The old fixed logo
width and doubled button margins pushed the icon under the login button. */
@media (max-width: 359px) {
html.is-mobile .header-bc:has(.hdr-user-bc .sign-in) .hdr-main-content-bc {
padding-inline: 7px !important;
gap: 4px !important;
}
html.is-mobile .header-bc:has(.hdr-user-bc .sign-in) .logo-container {
gap: 3px !important;
margin-right: 0 !important;
}
html.is-mobile .header-bc:has(.hdr-user-bc .sign-in) .logo {
width: auto !important;
min-width: 0 !important;
}
html.is-mobile .header-bc:has(.hdr-user-bc .sign-in) .header-icon {
width: 32px !important;
margin: 0 !important;
display: flex !important;
align-items: center;
justify-content: center;
}
html.is-mobile .header-bc:has(.hdr-user-bc .sign-in) .header-icon img {
width: 24px !important;
height: 24px !important;
margin: 0 !important;
}
html.is-mobile .header-bc:has(.hdr-user-bc .sign-in) .hdr-user-bc,
html.is-mobile .header-bc:has(.hdr-user-bc .sign-in) .hdr-toggle-button-bc {
margin-left: 0 !important;
}
}
/* A floating launcher must not cover a modal's inputs or primary action.
The form's own live-support action remains available. */
html body:has(.entrance-form-bc.popup) #voovbet-chat-launcher,
html body:has(.viewModeStories) #voovbet-chat-launcher,
html body:has(.promotion-details-popup:not(.hidden)) #voovbet-chat-launcher,
html.is-mobile body:has(.overlaySlidingWrapperBc) #voovbet-chat-launcher {
opacity: 0 !important;
visibility: hidden !important;
pointer-events: none !important;
}
/* The mobile feed inherited dark ruby text (#971733) on navy cells.
Keep selection styling and up/down indicators intact. */
html.is-mobile body .market-bc:not(.active) .market-odd-bc:not(:where(.layout-bc:is(.sportsbook,.prematch,.live) *)) {
color: #f4f7fc !important;
}
html.is-mobile body .c-team-info-scores-bc {
color: #ff94ad !important;
}
/* Keep floating labels readable, including unfocused empty fields. * */
html body .entrance-form-bc .form-control-title-bc {
color: #c0ccdc !important;
opacity: 1 !important;
}
html body .entrance-form-bc .form-control-bc.focused .form-control-title-bc {
color: #ff94ad !important;
}
html body .entrance-form-bc .form-control-bc.error .form-control-title-bc,
html body .entrance-form-bc .form-control-bc.invalid .form-control-title-bc {
color: #ff879e !important;
}
html.is-mobile body .saveFilterButtonBc > .button {
min-height: 44px !important;
border: 1px solid rgba(255, 113, 145, .38) !important;
border-radius: 10px !important;
background: linear-gradient(135deg, #d81740, #ac0e31) !important;
color: #fff !important;
box-shadow: inset 0 1px rgba(255, 255, 255, .12) !important;
font-weight: 700;
}
html body .popup-holder-bc:has(.entrance-form-bc.popup) .e-p-close-icon-bc,
html body .popup-holder-bc.promotion-details-popup .e-p-close-icon-bc {
min-width: 44px !important;
min-height: 44px !important;
display: flex;
align-items: center;
justify-content: center;
border-radius: 9px;
}
html body .entrance-form-bc .checkbox-control-content-bc {
min-height: 32px;
}
/* Mobile authentication has its own scrollable form content. Lock only the
background document and remove the library's redundant scrollbar gutter. */
html.is-mobile:has(.entrance-form-bc.popup, .promotion-details-popup, .overlaySlidingWrapperBc, .viewModeStories) {
overflow: hidden !important;
overscroll-behavior: none;
}
html.is-mobile body:has(.entrance-form-bc.popup, .promotion-details-popup, .overlaySlidingWrapperBc, .viewModeStories) {
overflow: hidden !important;
padding-right: 0 !important;
}
html.is-mobile body .entrance-popup-bc .e-p-content-bc {
height: 100dvh !important;
}
html.is-mobile body .entrance-popup-bc .entrance-form-content-bc {
overscroll-behavior: contain;
scrollbar-width: thin;
}
html.is-mobile body .overlay-sliding-w-c-content-slider-bc,
html.is-mobile body .overlaySlidingWCContentSliderBc,
html.is-mobile body .overlaySlidingWrapperBc .providerItemsContainer {
overscroll-behavior: contain;
scrollbar-width: thin;
}
html.is-mobile body .e-p-body-bc:has(.entrance-form-bc.login.popup) {
overflow-y: auto !important;
overscroll-behavior: contain;
}
html.is-mobile body .entrance-form-bc.login.popup {
height: auto !important;
min-height: 100% !important;
}
html.is-mobile body .searchInput,
html.is-mobile body .entrance-form-bc .form-control-select-bc {
font-size: 16px !important;
}
html.is-mobile body .saveFilterButtonBc {
background: #0b1623 !important;
border-top: 1px solid rgba(157, 183, 210, .22);
padding: 10px 14px calc(10px + env(safe-area-inset-bottom, 0px));
}
html.is-web body .entrance-popup-bc {
border: 1px solid rgba(157, 183, 210, .22);
border-radius: 14px;
overflow: hidden;
box-shadow: 0 20px 70px rgba(0, 0, 0, .40);
}
/* VOOVBET SPORTS CLARITY V8 - 2026-09-09
Color-only refinement: preserve market geometry, odds movement, and auth controls. */
html body .layout-content-holder-bc .market-bc:not(.active):not(.m-g-header):not(.disabled-market-bc):not(:where(.layout-bc:is(.sportsbook,.prematch,.live) *)) {
background: linear-gradient(180deg, #1b3047 0%, #152639 100%) !important;
border-color: #354c64 !important;
box-shadow: inset 0 1px 0 rgba(203, 220, 241, 0.04) !important;
color: #d2deeb !important;
}
html body .layout-content-holder-bc .market-bc:not(.active):not(.m-g-header) .market-odd-bc:not(:where(.layout-bc:is(.sportsbook,.prematch,.live) *)),
html body .layout-content-holder-bc .market-bc:not(.active):not(.m-g-header) .market-icon-bc:not(:where(.layout-bc:is(.sportsbook,.prematch,.live) *)) {
color: #f4f7fc !important;
}
html body .layout-content-holder-bc .market-bc:not(.active):not(.m-g-header) .market-name-bc:not(:where(.layout-bc:is(.sportsbook,.prematch,.live) *)) {
color: #d2deeb !important;
}
html body .layout-content-holder-bc .market-bc:not(.active):not(.m-g-header) .market-odd-bc.not-boosted-odd:not(:where(.layout-bc:is(.sportsbook,.prematch,.live) *)) {
color: #a8bad0 !important;
}
html body .layout-content-holder-bc .market-bc:not(.active):not(.disabled-market-bc):not(.m-g-header):hover:not(:where(.layout-bc:is(.sportsbook,.prematch,.live) *)),
html body .layout-content-holder-bc .market-bc:not(.active):not(.disabled-market-bc):not(.m-g-header):focus-visible:not(:where(.layout-bc:is(.sportsbook,.prematch,.live) *)) {
background: linear-gradient(180deg, #2a4663 0%, #203951 100%) !important;
border-color: #819bb5 !important;
box-shadow: inset 0 0 0 1px rgba(197, 218, 240, 0.12) !important;
}
html body .layout-content-holder-bc .market-bc.active:not(.m-g-header):not(:where(.layout-bc:is(.sportsbook,.prematch,.live) *)) {
background: linear-gradient(135deg, #bb123a 0%, #930d2e 100%) !important;
border-color: #ee6685 !important;
box-shadow: inset 0 1px 0 rgba(255, 225, 233, 0.14) !important;
color: #ffffff !important;
}
html body .layout-content-holder-bc .market-bc.active:not(.m-g-header) .market-odd-bc:not(:where(.layout-bc:is(.sportsbook,.prematch,.live) *)),
html body .layout-content-holder-bc .market-bc.active:not(.m-g-header) .market-name-bc:not(:where(.layout-bc:is(.sportsbook,.prematch,.live) *)),
html body .layout-content-holder-bc .market-bc.active:not(.m-g-header) .market-icon-bc:not(:where(.layout-bc:is(.sportsbook,.prematch,.live) *)) {
color: #ffffff !important;
}
html body .layout-content-holder-bc .market-bc.disabled-market-bc:not(.m-g-header):not(:where(.layout-bc:is(.sportsbook,.prematch,.live) *)),
html body .layout-content-holder-bc .market-bc.disabled-market-bc:not(.m-g-header):hover:not(:where(.layout-bc:is(.sportsbook,.prematch,.live) *)) {
background: #142131 !important;
border-color: #293b4e !important;
box-shadow: none !important;
color: #96aac0 !important;
}
html body .layout-content-holder-bc .market-bc.disabled-market-bc:not(.m-g-header) .market-odd-bc:not(:where(.layout-bc:is(.sportsbook,.prematch,.live) *)),
html body .layout-content-holder-bc .market-bc.disabled-market-bc:not(.m-g-header) .market-name-bc:not(:where(.layout-bc:is(.sportsbook,.prematch,.live) *)),
html body .layout-content-holder-bc .market-bc.disabled-market-bc:not(.m-g-header) .market-icon-bc:not(:where(.layout-bc:is(.sportsbook,.prematch,.live) *)) {
color: #96aac0 !important;
}
html body .layout-content-holder-bc .market-bc.m-g-header:not(:where(.layout-bc:is(.sportsbook,.prematch,.live) *)) {
background: #17283b !important;
border-color: #293d52 !important;
box-shadow: none !important;
color: #d2deeb !important;
}
html body .layout-content-holder-bc .sgm-market-g-head-bc:not(:where(.layout-bc:is(.sportsbook,.prematch,.live) *)) {
background: #1c3046 !important;
color: #e0e8f2 !important;
}
html body .layout-content-holder-bc .sgm-market-g-item-bc:not(:where(.layout-bc:is(.sportsbook,.prematch,.live) *)) {
background-color: #111f30 !important;
}
html body .layout-content-holder-bc .sportsbook-container .multi-column-content:not(:where(.layout-bc:is(.sportsbook,.prematch,.live) *)) {
background-color: #142336 !important;
}
html body .layout-content-holder-bc .sportsbook-container .multi-column-content:nth-child(even):not(:where(.layout-bc:is(.sportsbook,.prematch,.live) *)) {
background-color: #182a3e !important;
}
html body .layout-content-holder-bc .sportsbook-container .multi-column-content.active:not(:where(.layout-bc:is(.sportsbook,.prematch,.live) *)) {
background-color: #253d55 !important;
}
/* END VOOVBET SPORTS CLARITY V8 * */
/* VOOVBET BETSLIP CLARITY V9 - 2026-09-09
Shared desktop/mobile betslip values; preserve amounts, odds and state styling. */
html body .bs-bet-i-b-coefficient-bc.c-2,
html body .bs-bet-i-b-amount-bc {
color: #f4f7fc !important;
}
/* END VOOVBET BETSLIP CLARITY V9 * */
/* VOOVBET SPORTS NATIVE 20260912
Sports routes use the original provider component paint rules again.
Only odds text is kept light: the site-wide --oc-2 is dark ruby.
No dimensions, header, footer, casino, or home components are overridden. */
html body .layout-bc:is(.sportsbook,.prematch,.live) > .layout-content-holder-bc {
--oc-2: 244, 247, 252;
}
/* END VOOVBET SPORTS NATIVE 20260912 * */
/* VOOVBET HOME ODDS CHARCOAL 20260912
Match the native live market-slider's 6% translucent surface.
Home featured, boosted and upcoming sections only; no geometry changes. */
html body .is-home-page .layout-content-holder-bc :is(.featuredGames, .prematch-page-bc, .upcoming-games) .sgm-market-g-item-bc {
background: transparent !important;
}
html body .is-home-page .layout-content-holder-bc :is(.featuredGames, .prematch-page-bc, .upcoming-games) .market-bc:not(.active):not(.disabled-market-bc) {
background: rgba(var(--b-sc), .06) !important;
border-color: transparent !important;
box-shadow: none !important;
color: rgba(var(--b-sc), .7) !important;
}
html body .is-home-page .layout-content-holder-bc :is(.featuredGames, .prematch-page-bc, .upcoming-games) .market-bc:not(.active):not(.disabled-market-bc) .market-name-bc {
color: rgba(var(--b-sc), .7) !important;
}
html body .is-home-page .layout-content-holder-bc :is(.featuredGames, .prematch-page-bc, .upcoming-games) .market-bc:not(.active):not(.disabled-market-bc) .market-odd-bc:not(.not-boosted-odd) {
color: rgba(var(--b-sc), 1) !important;
}
html body .is-home-page .layout-content-holder-bc :is(.featuredGames, .prematch-page-bc, .upcoming-games) .market-bc:not(.active):not(.disabled-market-bc) .market-odd-bc.not-boosted-odd {
color: rgba(var(--b-sc), .6) !important;
}
html body .is-home-page .layout-content-holder-bc :is(.featuredGames, .prematch-page-bc, .upcoming-games) .market-bc.disabled-market-bc:not(.active) {
background: rgba(var(--b-sc), .04) !important;
border-color: transparent !important;
box-shadow: none !important;
}
html body .is-home-page .layout-content-holder-bc :is(.featuredGames, .prematch-page-bc, .upcoming-games) .market-bc.disabled-market-bc:not(.active) :is(.market-name-bc, .market-odd-bc, .market-icon-bc) {
color: rgba(var(--b-sc), .5) !important;
}
@media (hover: hover) and (pointer: fine) {
html body .is-home-page .layout-content-holder-bc :is(.featuredGames, .prematch-page-bc, .upcoming-games) .market-bc:not(.active):not(.disabled-market-bc):not(.m-g-header):hover {
background: rgba(var(--b-sc), .11) !important;
border-color: transparent !important;
box-shadow: none !important;
}
}
html body .is-home-page .layout-content-holder-bc :is(.featuredGames, .prematch-page-bc, .upcoming-games) .market-bc:not(.active):not(.disabled-market-bc):not(.m-g-header):focus-visible {
background: rgba(var(--b-sc), .11) !important;
border-color: transparent !important;
box-shadow: none !important;
}
/* END VOOVBET HOME ODDS CHARCOAL 20260912 * */
/* VOOVBET SPORTS SLATE V1 - 2026-09-12
Component-scoped paint only. Preserve market states, focus, spacing and sizing. */
html body .layout-bc:is(.sportsbook,.prematch,.live) .sportsbook-container .multi-column-resize-block,
html body .layout-bc:is(.sportsbook,.prematch,.live) .sportsbook-container .left-menu-container {
background: #17232e !important;
}
html body .layout-bc:is(.sportsbook,.prematch,.live) .sportsbook-container .multi-column-content {
background-color: #17232e !important;
}
html body .layout-bc:is(.sportsbook,.prematch,.live) .sportsbook-container .multi-column-content:nth-child(even) {
background-color: #1c2834 !important;
}
html body .layout-bc:is(.sportsbook,.prematch,.live) .sportsbook-container .multi-column-content.active {
background-color: #2a3744 !important;
}
html body .layout-bc:is(.sportsbook,.prematch,.live) .sgm-market-search,
html body .layout-bc:is(.sportsbook,.prematch,.live) .sport-search-bc .ss-input-bc,
html body .layout-bc:is(.sportsbook,.prematch,.live) .sport-search-bc .ss-icon-holder-bc {
background: #23303d !important;
box-shadow: none !important;
}
html body .betslip-bc .bs-inputs-bc {
background: #17232e !important;
}
html body .betslip-bc .betslip-bonus-info {
background: #23303d !important;
}
html body .betslip-bc .bs-bet-i-b-s-i-holder-bc {
background: #414b56 !important;
color: #f4f7fc !important;
}
html body .betslip-bc .bs-bet-i-b-s-i-holder-bc input.bs-bet-i-b-s-i-bc {
background: transparent !important;
color: #f4f7fc !important;
caret-color: #f4f7fc !important;
}
html body .betslip-bc .bs-bet-i-b-s-i-holder-bc input.bs-bet-i-b-s-i-bc::placeholder {
color: #d3d9e1 !important;
}
/* END VOOVBET SPORTS SLATE V1 * */