:root {
  --color-10: hsl(227, 16%, 11%);
  --color-20: hsl(225, 18%, 9%);
  --color-30: linear-gradient(to right, hsla(222, 17%, 15%, 70%) 0%, hsla(226, 17%, 15%, 70%) 100%);
  --color-40: linear-gradient(to right, hsla(229, 16%, 33%, 70%) 0%, hsla(233, 15%, 23%, 70%) 100%);
  --color-50: hsl(225, 18%, 16%);
  --color-60: hsl(224, 18%, 16%);
  --color-70: hsl(222, 18%, 11%);
  --color-80: hsl(235, 20%, 60%);
  --color-90: hsl(41, 38%, 22%, 30%);

  --color-100: hsl(0, 0%, 0%);
  --color-200: hsl(0, 0%, 40%);
  --color-300: hsl(224, 9%, 49%);
  --color-400: hsl(224, 9%, 49%);
  --color-500: hsl(255, 6%, 87%);
  --color-600: hsl(260, 5%, 89%);
  --color-700: hsl(0, 0%, 90%);
  --color-800: hsl(0, 0%, 100%);

  --primary-color-10: hsl(43, 60%, 18%);
  --primary-color-20: hsl(43, 75%, 28%);
  --primary-color-30: hsl(43, 85%, 40%);
  --primary-color-40: hsl(43, 92%, 52%);
  --primary-color-50: hsl(43, 96%, 56%);
  --primary-color-60: hsl(43, 94%, 59%);
  --primary-color-70: hsl(43, 100%, 72%);

  --tertiary-color-10: hsl(41, 100%, 71%);
  --tertiary-color-20: hsl(41, 100%, 61%);
  --tertiary-color-30: hsl(80, 93%, 47%);

  --success-color: hsl(122, 56%, 44%);
  --success-color-20: hsl(159, 95%, 38%);
  --error-color: hsl(0, 59%, 40%);
  --error-color-20: hsl(348, 80%, 61%);
  --warning-color: hsl(38, 90%, 55%);

  --selection-background: var(--primary-color-60);
  --selection-color: var(--text-color);

  --focus-outline: 1px solid var(--primary-color-60);

  --root-bg: var(--color-10);
  --modal-bg: rgba(0, 0, 0, 0.8);
  --loading-bg: rgba(0, 0, 0, 0.6);

  --text-color: var(--color-800);
  --secondary-text-color: var(--color-10);
  --tertiary-text-color: var(--color-400);

  --font-size-10: 0.88rem; /* 14px */
  --font-size-20: 1rem; /* 16px */
  --font-size-30: 1.125rem; /* 18px */
  --font-size-40: 1.25rem; /* 20px */
  --font-size-50: 1.5rem; /* 28px */
  --font-size-60: 1.75rem; /* 36px */
  --font-size-70: 0.75rem; /* 12px */

  --side-padding: 0 0.94rem; /* 15px */
  --side-padding-desktop: 0 24px;
  --side-padding-mobile: 0.94rem;

  --transition-10: 0.1s cubic-bezier(0.29, 0.48, 0.43, 0.67);
  --transition-20: 0.1s cubic-bezier(0.5, 0.71, 0.37, 0.64);

  --utility-button-bg: var(--color-50);
  --utility-button-bg-hover: var(--color-60);
  --utility-button-icon-color: var(--color-300);
  --utility-button-icon-color-hover: var(--color-700);

  --logout-button-bg: hsl(298, 33%, 17%);
  --logout-button-bg-hover: hsl(308, 34%, 18%);
  --logout-button-color: var(--error-color-20);

  --input-bg: var(--color-30);
  --input-bg-hover: var(--color-60);
  --input-text-color: var(--text-color);
  --input-text-placeholder-color: var(--text-color);
  --input-datepicker-icon-color: var(--primary-color-50);
  --input-datepicker-icon-color-hover: var(--primary-color-70);

  /* Header */
  --header-bg: transparent;
  --account-buttons-login-bg: var(--color-40);
  --account-buttons-login-bg-hover: var(--color-30);
  --account-buttons-login-text-color: var(--text-color);
  --account-buttons-signin-bg: var(--tertiary-color-10);
  --account-buttons-signin-bg-hover: var(--tertiary-color-20);
  --account-buttons-signin-text-color: var(--secondary-text-color);
  --account-buttons-deposit-bg: var(--color-30);
  --account-buttons-deposit-button-bg: var(--account-buttons-signin-bg);
  --account-buttons-deposit-button-bg-hover: var(--account-buttons-signin-bg-hover);
  --account-buttons-deposit-button-text-color: var(--account-buttons-signin-text-color);
  --events-button-bg: var(--color-30);
  --events-button-bg-hover: var(--color-40);
  --events-button-icon-color: var(--color-300);
  --events-button-icon-color-hover: var(--color-700);

  /* AuthPage */
  --auth-page-form-window-bg: var(--color-20);
  --type-toggle-bg: var(--color-30);
  --type-toggle-button-bg: var(--color-50);
  --type-toggle-button-bg-active: linear-gradient(180deg, var(--primary-color-60) 0%, var(--primary-color-40) 100%);
  --type-toggle-button-icon-color: var(--text-color);
  --type-toggle-button-icon-color-active: var(--secondary-text-color);
  --type-toggle-button-text-color: var(--text-color);
  --type-toggle-button-text-color-active: var(--secondary-text-color);
  --forgot-password-color: var(--tertiary-color-10);
  --forgot-password-color-hover: var(--tertiary-color-20);
  --submit-bg: var(--tertiary-color-20);
  --submit-text-color: var(--secondary-text-color);
  --checkbox-bg: var(--color-30);
  --checkbox-bg-hover: var(--color-50);
  --checkbox-bg-checked: var(--tertiary-color-10);
  --checkbox-text-color: var(--tertiary-color-10);
  --checkbox-text-color-hover: var(--tertiary-color-20);

  /* ProfilePage */
  --profile-page-sticky-header-bg: var(--color-20);
  --profile-page-sticky-header-border-bottom: var(--color-50);
  --profile-page-tab-window-bg: var(--color-20);
  --profile-page-back-button-icon-color: var(--primary-color-50);
  --profile-page-back-button-icon-color-hover: var(--primary-color-70);
  --profile-page-input-bg: var(--color-30);
  --profile-page-input-bg-hover: var(--primary-color-10);
  --profile-page-input-label-color: var(--color-300);
  --profile-page-input-icon-color: var(--color-200);
  --profile-page-button-bg: var(--color-50);
  --profile-page-button-bg-hover: var(--color-60);
  --profile-page-secondary-info-color: var(--color-300);
  --profile-submit-bg: var(--primary-color-50);
  --profile-submit-bg-hover: var(--primary-color-70);
  --profile-submit-text-color: var(--secondary-text-color);
  --profile-tab-button-icon-color: var(--tertiary-text-color);
  --history-tab-top-bar-bg: var(--color-30);
  --history-tab-top-bar-tab-bg-hover: var(--primary-color-10);
  --history-tab-top-bar-tab-bg-active: var(--color-70);
  --history-pagination-arrow-bg: var(--color-30);
  --history-pagination-arrow-bg-hover: var(--color-40);
  --history-pagination-count-bg: var(--history-tab-top-bar-bg);
  --history-pagination-count-bg-hover: var(--primary-color-10);
  --history-pagination-count-bg-active: var(--color-70);

  /* SupportsPopup */
  --supports-popup-bg: var(--color-20);
  --supports-popup-button-bg: var(--color-50);
  --supports-popup-button-bg-hover: var(--color-60);
  --supports-popup-close-bg: var(--primary-color-50);
  --supports-popup-close-bg-hover: var(--primary-color-70);
  --supports-popup-close-text-color: var(--text-color);

  /* WalletPage */
  --wallet-page-tab-window-bg: var(--color-20);
  --wallet-page-button-bg: var(--color-50);
  --wallet-page-button-bg-hover: var(--color-60);
  --wallet-page-button-bg-active: var(--color-30);
  --wallet-page-back-button-icon-color: var(--primary-color-50);
  --wallet-page-back-button-icon-color-hover: var(--primary-color-70);
  --wallet-page-add-wallet-color: var(--primary-color-50);
  --wallet-page-add-wallet-color-hover: var(--primary-color-70);
  --wallet-page-add-currency-bg: var(--color-30);
  --wallet-page-add-currency-search-icon: var(--color-300);

  /* PaymentsPage */
  --payments-page-tab-window-bg: var(--color-800);
  --payments-page-header-color: var(--color-100);
  --payments-page-back-button-icon-color: var(--primary-color-50);
  --payments-page-back-button-icon-color-hover: var(--primary-color-70);
  --payments-page-payment-bg: var(--color-600);
  --payments-page-payment-bg-hover: var(--color-500);
  --payments-page-payment-color: var(--color-100);
  --payments-page-payment-warning-border: 1px solid var(--color-200);
  --payments-page-payment-warning-color: var(--color-200);
  --payments-page-payment-warning-icon-color: var(--warning-color);
  --payments-page-copy-button-bg: var(--primary-color-50);
  --payments-page-copy-button-bg-hover: var(--primary-color-70);
  --payments-page-copy-button-color: var(--text-color);
  --payments-page-input-bg: var(--color-600);
  --payments-page-input-bg-hover: var(--color-500);
  --payments-page-input-label-color: var(--color-100);
  --payments-page-submit-button-bg: var(--primary-color-50);
  --payments-page-submit-button-bg-hover: var(--primary-color-70);
  --payments-page-submit-button-color: var(--text-color);
  --patments-page-amount-limits-color: var(--color-200);

  /* Notification */
  --notification-bg: var(--color-30);
  --notification-bar-bg: var(--primary-color-60);
  --notification-text-color: var(--text-color);
  --notification-close-button-icon-color: var(--secondary-text-color);

  /* Menu */
  --menu-bg: var(--color-20);
  --menu-online-count-dot-bg: var(--success-color);
  --menu-border-color: var(--color-60);
  --menu-account-bg: var(--color-60);
  --menu-account-bg-hover: var(--color-80);
  --menu-account-icon-color: var(--color-90);
  --menu-account-icon-color-hover: var(--color-70);
  --menu-menu-item-text-color: var(--tertiary-text-color);
  --menu-menu-item-text-color-active: var(--tertiary-color-10);
  --menu-bonuses-count-bg: var(--tertiary-color-30);
  --menu-bonuses-count-text-color: var(--color-10);
  --language-button-bg: var(--color-50);
  --language-button-bg-hover: var(--color-60);
  --language-button-list-bg: var(--color-800);
  --language-button-list-bg-hover: var(--color-700);
  --language-button-list-text-color: var(--color-10);
  --socials-closed-trigger-button-bg: var(--color-50);
  --socials-closed-trigger-button-bg-hover: var(--color-60);
  --socials-closed-trigger-button-more-icon-bg: var(--color-60);
  --socials-closed-list-bg: var(--color-800);
  --socials-closed-list-bg-hover: var(--color-700);
  --socials-closed-list-text-color: var(--color-10);

  /* AccountButton */
  --account-bg: var(--color-50);
  --account-bg-hover: var(--color-60);
  --account-icon-color: var(--color-300);
  --account-copy-bg: var(--color-50);
  --account-copy-bg-hover: var(--color-60);
  --account-copy-icon-color: var(--color-700);

  /* Balance */
  --balance-info-title-color: var(--color-90);
  --balance-deposit-color: var(--secondary-text-color);
  --balance-deposit-bg: var(--tertiary-color-10);
  --balance-deposit-bg-hover: var(--tertiary-color-20);
  --balance-withdraw-color: var(--text-color);
  --balance-withdraw-bg: var(--color-50);
  --balance-withdraw-bg-hover: var(--color-60);

  /* NavigationBar */
  --navigation-bar-search-bg: var(--color-30);
  --navigation-bar-search-bg-hover: var(--color-40);
  --navigation-bar-search-text-color: var(--text-color);
  --navigation-bar-search-text-color-hover: var(--color-text-color);
  --navigation-bar-providers-bg: var(--color-30);
  --navigation-bar-providers-bg-hover: var(--color-40);
  --navigation-bar-providers-text-color: var(--text-color);

  /* FilterModal */
  --filter-modal-window-bg: var(--color-20);
  --filter-modal-type-toggle-bg: var(--color-30);
  --filter-modal-type-toggle-button-bg: var(--color-40);
  --filter-modal-type-toggle-button-bg-hover: var(--color-50);
  --filter-modal-type-toggle-button-bg-active: var(--color-60);
  --filter-modal-type-toggle-button-text-color: var(--text-color);
  --filter-modal-search-bg: var(--color-30);
  --filter-modal-search-bg-hover: var(--color-60);
  --filter-modal-search-text-color: var(--tertiary-text-color);
  --filter-modal-search-text-color-hover: var(--text-color);
  --filter-modal-provider-item-bg: var(--color-50);
  --filter-modal-provider-item-bg-hover: var(--color-60);
  --filter-modal-provider-item-text-color: var(--text-color);
  --filter-modal-provider-item-text-color-hover: var(--text-color);
  --filter-modal-window-border-bottom: var(--color-50);
  --filter-modal-window-shadow: 0 0px 20px 0 hsl(278deg 95% 8%); /* unique */

  /* Categories */
  --categories-category-bg: var(--color-30);
  --categories-category-bg-hover: var(--tertiary-color-10);
  --categories-category-bg-active: var(--tertiary-color-10);
  --categories-category-text-color: var(--text-color);
  --categories-category-text-color-active: var(--color-100);
  --categories-category-icon-color: var(--tertiary-color-10);
  --categories-category-icon-color-active: var(--color-100);
  --categories-arrow-bg: var(--color-30);
  --categories-arrow-bg-hover: var(--color-40);
  --categories-left-arrow-bg: linear-gradient(to right, var(--root-bg) 10%, transparent);
  --categories-right-arrow-bg: linear-gradient(to left, var(--root-bg) 10%, transparent);

  /* GamesRow */
  --games-row-top-bar-title-color: var(--text-color);
  --games-row-top-bar-title-color-hover: var(--text-color);
  --games-row-show-more-bg: var(--color-30);
  --games-row-show-more-bg-hover: var(--color-40);
  --games-row-show-more-text-color: var(--text-color);
  --games-row-show-more-text-color-hover: var(--text-color);
  --games-row-navigation-button-bg: var(--color-30);
  --games-row-navigation-button-bg-hover: var(--color-40);

  /* Footer */
  --footer-bg: var(--color-70);
  --footer-line-color: var(--color-50);
  --footer-scroll-to-top-bg: var(--color-50);
  --footer-scroll-to-top-bg-hover: var(--color-60);
  --footer-support-banner-bg: var(--color-80);
  --footer-support-banner-gradient: linear-gradient(129deg, transparent 0%, var(--primary-color-60) 170%);
  --footer-support-banner-full-time-bg: var(--color-80);
  --footer-support-banner-contact-button-bg: var(--tertiary-color-10);
  --footer-support-banner-contact-button-bg-hover: var(--tertiary-color-20);

  /* GamePage */
  --game-page-game-window-outline: 1px solid var(--color-50); /* unique */

  /* GameCard */
  --game-card-bg: var(--color-30);
  --favorite-color: hsl(39, 92%, 70%); /* unique */

  /* ScrollToTopButton */
  --scroll-to-top-button-bg: var(--color-30);
  --scroll-to-top-button-bg-hover: var(--color-40);
  --scroll-to-top-button-icon-color: var(--color-300);
  --scroll-to-top-button-icon-color-hover: var(--color-700);

  /* TotalJackpot */
  --total-jackpot-bg: linear-gradient(90deg, #44036A 0%, #C960FD 100%); /* unique */
  --total-jackpot-info-block-bg: var(--color-10);
  --total-jackpot-info-block-second-bg: unset,
    radial-gradient(73% 124% at -9% 110%, #e47341 0%, #c65efc00 100%), radial-gradient(23% 52% at 22% 100%, #fbac10 0%, #618fff00 100%); /* unique */
  --total-jackpot-info-block-show-all-bg: hsl(0, 0%, 100%); /* unique */
  --total-jackpot-info-block-show-all-bg-hover: hsl(0, 0%, 93%); /* unique */
  --total-jackpot-info-block-show-all-color: var(--color-10);
  --total-jackpot-swiper-shadow: linear-gradient(90deg, #982bcc 2%, transparent 31%, transparent 71%, #c45cfa 99%); /* unique */
  --total-jackpot-swiper-pointer-bg: var(--color-90);

  /* HighlightGame */
  --highlight-game-bg: url('/images/highlight-game/background.webp') center / cover no-repeat;
  --highlight-game-info-block-play-bg: var(--total-jackpot-info-block-show-all-bg);
  --highlight-game-info-block-play-bg-hover: var(--total-jackpot-info-block-show-all-bg-hover);
  --highlight-game-info-block-play-color: var(--total-jackpot-info-block-show-all-color);

  /* MobileBar */
  --mobile-bar-bg: var(--color-10);
  --mobile-bar-item-icon-bg: var(--color-20);
  --mobile-bar-item-icon-color: var(--tertiary-text-color);
  --mobile-bar-item-icon-color-active: var(--primary-color-60);
  --mobile-bar-item-title-color: var(--tertiary-text-color);
  --mobile-bar-item-title-color-active: var(--primary-color-60);

  /* Banners */
  --banners-button-bg: var(--color-90);

  /* GamesGrid */
  --games-grid-show-more-bg: var(--primary-color-40);
  --games-grid-show-more-bg-hover: var(--primary-color-70);
  --games-grid-show-more-text-color: var(--secondary-text-color);
  --games-grid-progress-bg: var(--color-30);
  --games-grid-progress-fill-bg: var(--color-800);

  /* Banners */
  --banners-pagination-bullet-bg: var(--color-400);
  --banners-pagination-bullet-bg-active: var(--color-800);
  --banners-navigation-button-bg: var(--color-30);
  --banners-navigation-button-bg-hover: var(--color-40);

  /* RandomGame */
  --random-game-bg: url('/images/random-game/background.webp') center / cover no-repeat;;
  --random-game-play-bg: var(--tertiary-color-10);
  --random-game-play-bg-hover: var(--tertiary-color-20);
  --random-game-play-color: var(--secondary-text-color);
  --random-game-winner-border-color: var(--color-800);

  /* InformationPage */
  --information-page-list-bg: var(--color-20);
  --information-page-list-bg-active: var(--color-50);
  --information-page-top-bar-icon-color: hsl(217, 99%, 68%); /* unique */

  /* BonusesPage */
  --bonuses-page-bonus-item-bg-0: linear-gradient(90deg, #131745, #3EA7FD); /* unique */
  --bonuses-page-bonus-item-bg-1: linear-gradient(189deg, #1C94F6, #131745); /* unique */
  --bonuses-page-bonus-item-bg-2: linear-gradient(260deg, #131745, #3EA7FD); /* unique */
  --bonuses-page-bonus-item-bg-3: linear-gradient(-30deg, #1C94F6, #131745); /* unique */
  --bonuses-page-show-more-bg: var(--total-jackpot-info-block-show-all-bg);
  --bonuses-page-show-more-bg-hover: var(--total-jackpot-info-block-show-all-bg-hover);
  --bonuses-page-show-more-color: var(--total-jackpot-info-block-show-all-color);
  --bonuses-description-bg: var(--profile-page-tab-window-bg);
  --bonuses-description-fields-group-bg: var(--profile-page-button-bg);
}

body .HighlightGame[data-mobile=false] .container .highlight-game-block .game-image-wrapper {
  right: 80px;
}

body .RandomGame .container .random-game-block .winner-card .graphic-2 {
  top: -39px;
}

body .RandomGame .container .random-game-block .winner-card .winner-border {
  outline: none;
}

body .RandomGame .container .random-game-block .winner-card .winner-pointer,
body .RandomGame .container .random-game-block .winner-card .winner-pointer-2 {
  display:none !important;
}

.RandomGame[data-mobile="false"] .container .random-game-block .games-block.is-visible .games-block-inner .game-card:nth-child(2) {
  transform: scale(1.1);
}

body .Menu .menu-content .top-part .sport-toggle .sport-toggle-content .toggle-button.active {
  background: var(--tertiary-color-10);
}

body .HighlightGame[data-mobile=false] .container .highlight-game-block .graphic-2 {
  height: 100%;
}

.Banners .container .banners-swiper .swiper-wrapper .swiper-slide .banner-button span {
  display: none;
}

.Banners .container .banners-swiper .swiper-wrapper .swiper-slide .banner-button::after {
  content: "Play";
}

body::before {
  content: '';
  top: 0;
  width: 100%;
  height: 100%;
  position: fixed;
  background: var(--color-10) url('/images/background.webp') no-repeat top center !important;
  background-size: 100% !important;
}

@media (max-width: 1024px) and (orientation: portrait) {
  body::before {
    background-size: 100% 100% !important;
  }
}

.Header {
  position: relative !important;
}

@media (max-width: 1024px) {
  .layout-container:has(.Menu[data-open=true]) .Header {
    background: var(--menu-bg) !important;
  }
}

.Menu {
  border: 1px solid #20232D;
}

.AccountButtons .signin {
  border: 1px solid #FFC03A;
}

.Banners .container .banners-swiper .swiper-wrapper .swiper-slide {
  border-radius: 32px !important;
  border: 1px solid hsla(41, 100%, 71%, 50%);
}

.Banners .container .banners-swiper .swiper-wrapper .swiper-slide .banner-button {
  backdrop-filter: blur(16.35px) !important;
}

.Banners .container .banners-swiper .swiper-wrapper .swiper-slide .banner-title {
  font-size: var(--font-size-40) !important;
}

@media (min-width: 1440px) {
  .Banners .container .banners-swiper .swiper-wrapper .swiper-slide {
    padding: 46px !important;
  }

  .Banners .container .banners-swiper .swiper-wrapper .swiper-slide .banner-title {
    font-size: var(--font-size-60) !important;
  }

  .Banners .container .banners-swiper .swiper-wrapper .swiper-slide .banner-button {
    font-size: var(--font-size-50) !important;
    padding: 14px 46px !important;
  }
}

.RandomGame .container .random-game-block .graphic-wrapper .graphic-1 {
  left: 15% !important;
}

.Footer .container .footer-content .content-wrapper .left-side .second-part .column .column-title,
.Footer .container .footer-content .content-wrapper .left-side .second-part .column a:hover,
.AuthPage .top-bar .title,
.FilterPage > .top-bar .title,
.FilterPage .content .no-results .search-result-title,
.GamesGrid .title,
.InformationPage .top-bar .top-bar-title .title,
.EventsButton .events-window-wrapper .events-window .top-bar .title,
.EventsButton .events-window-wrapper .events-window .no-notifications,
.ProfilePage .tab-window .top-bar .title,
.Balance .balance-info-amount,
.SettingsTab .setting-title,
.WalletPage .wallet-header-title,
.LatestWins .container .wins-list-wrapper .wins-list .win-item .info .game-title,
.GamePage .control-panel .game-title {
  color: var(--text-color) !important;
}

.Footer .container .footer-content .content-wrapper .right-side .support-banner .contact-button {
  color: var(--color-100) !important;
}

.RegistrationForm .registration-form .checkbox-container .checkbox-wrapper .checkbox {
  color: var(--secondary-text-color) !important;
}

.EventsButton .events-window-wrapper .events-window {
  background: var(--color-50) !important;
}

.EventsButton .events-window-wrapper .events-window .tip {
  color: var(--color-50) !important;
}

.Categories[data-mobile=true] {
  position: unset !important;
  transform: unset !important;
  background: unset !important;
}