:root{
  --Brand-Colors-Warning-Basic: #d18313;
  --UI-Tokkens-Navigation-menu-spacing-md-x: 10px;
  --UI-Tokkens-Buttons-X-small-x: 12px;
  --UI-Tokkens-Buttons-X-small-y: 4px;
  --UI-Tokkens-Buttons-Small-x: 14px;
  --UI-Tokkens-Buttons-Small-y: 8px;
  --UI-Tokkens-Buttons-Medium-x: 16px;
  --UI-Tokkens-Buttons-Medium-y: 12px;
  --UI-Tokkens-Buttons-Large-x: 18px;
  --UI-Tokkens-Buttons-Large-y: 14px;
  --UI-Tokkens-Buttons-X-Large-x: 20px;
  --UI-Tokkens-Buttons-X-Large-y: 16px;
  --UI-Tokkens-Navigation-menu-spacing-md-y: 10px;
  --UI-Tokkens-Navigation-menu-gap: 8px;
  --UI-Tokkens-Inputs-radius-lg: 8px;
  --UI-Tokkens-Inputs-spacing-md-y: 16px;
  --UI-Tokkens-Inputs-spacing-md-x: 20px;
  --UI-Tokkens-Inputs-border-width-sm: 0.5px;

  --Bronze: #DA9D46;
  --CTA_Primary-1: #B4FE2F;
  --CTA_Primary-2: #87C321;
  --CTA_Primary-3: #657E3A;
  --CTA_Secondary-1: #FFE202;
  --Color-01: #FFFFFF;
  --Color-2: #8D8D96;
  --Color-3: #2C2D34;
  --Color-4: #3E3D48;
  --Color-5: #202026;
  --Color-6: #282830;
  --Color-7: #060608;
  --Color-8: #14141C;
  --Color-9: #1B1A22;
  --Color-10: #8E9197;
  --Desctructive: #FF30A2;
  --Diamond: #9D5BFF;
  --Gold: #FFB800;
  --Legend: #3D6BFF;
  --Platinum: #FF3D9B;
  --Primary-1-1: #B4FE2F;
  --Primary-1-2: #87C321;
  --Primary-1-3: #657E3A;
  --Secondary-1: #FFE202;
  --Success: #B4FE2F;
  --Warning-01: #EFA719;
  --Warning-02: #E5621C;
  --silver: #47C9F8;
  --button-background-primary: #B4FE2F;
  --button-background-primary-hover: #87C321;
  --button-background-primary-pressed: #657E3A;
  --button-background-ghost: #3E3D48;
  --button-background-ghost-hover: #2C2D34;
  --button-background-disabled: #282830;
  --button-text-primary: #1B1A22;
  --button-text-default: #FFFFFF;
  --button-text-disabled: #3E3D48;

  /* Custom */
  --appbar-bg-color: rgba(26, 26, 26, 0.9);
}

.modal-wrapper {
  border: 1px solid var(--Color-4);
}

.banner-slider {
  border: 1px solid transparent;
  border-radius: 12px;
  background:
    linear-gradient(#171D50, #171D50) padding-box,
    linear-gradient(90deg, #3D1D6B 0%, #70598F 50%, #C81444 100%) border-box;
}

.banner-slider::before {
  position: absolute;
  content: '';
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  border: 1px solid #562A66;
  border-radius: 12px;
  opacity: 0.5;
  z-index: 1;
  box-shadow: 0 0 24px 0 rgba(224, 11, 196, 0.50) inset, 0 0 10px 1px rgba(136, 88, 153, 0.85);
  pointer-events: none;
}

.game-card-favorite svg {
  stroke: var(--Desctructive) !important;
}

.game-card-favorite--active svg path {
  fill: var(--Desctructive) !important;
}

.cashback-banner {
  background: linear-gradient(180deg, #FF2E78 0%, #7A0E37 100%) !important;
  border: 1px solid #D1185A !important;
  box-shadow: 0 0 12px 0 #FF2E78 inset !important;
}

.vip-club-banner {
  border: 1px solid var(--Color-4);
  background: #010104 !important;
}

.vip-club-banner::before {
  background: linear-gradient(180deg, rgba(1, 1, 1, 0) 31.06%, #010104 76.08%) !important;
}

.vip-club-level-card#loyalty_level_1 {
  background: linear-gradient(180deg, rgba(200, 132, 111, 0.50) 0%, rgba(200, 132, 111, 0.10) 100%) !important;
}

.vip-club-level-card#loyalty_level_2 {
  background: linear-gradient(180deg, rgba(71, 201, 248, 0.50) 0%, rgba(71, 201, 248, 0.10) 100%) !important;
}

.vip-club-level-card#loyalty_level_3 {
  background: linear-gradient(180deg, rgba(194, 146, 1, 0.50) 0%, rgba(194, 146, 1, 0.10) 100%) !important;
}

.vip-club-level-card#loyalty_level_4 {
  background: linear-gradient(180deg, rgba(255, 61, 155, 0.50) 0%, rgba(255, 61, 155, 0.10) 100%) !important;
}

.vip-club-level-card#loyalty_level_5 {
  background: linear-gradient(180deg, rgba(180, 59, 255, 0.50) 0%, rgba(180, 59, 255, 0.10) 100%) !important;
}

.vip-club-level-card#loyalty_level_6 {
  background: linear-gradient(180deg, rgba(61, 107, 255, 0.50) 0%, rgba(61, 107, 255, 0.10) 100%) !important;
}

.vip-club-progress-1 {
  border: 1px solid #735D3F !important;
  background: linear-gradient(180deg, rgba(200, 132, 111, 0.50) 0%, rgba(200, 132, 111, 0.10) 100%) !important;
  box-shadow: 0 0 12px 0 #DA9D46 inset !important;
}

.vip-club-progress-1 .vip-club-progress-badge {
  background-color: var(--Bronze) !important;
}

.vip-club-progress-2 {
  border: 1px solid #517BA3 !important;
  background: linear-gradient(180deg, rgba(71, 201, 248, 0.50) 0%, rgba(71, 201, 248, 0.10) 100%) !important;
  box-shadow: 0 0 12px 0 #47A8F8 inset !important;
}

.vip-club-progress-2 .vip-club-progress-badge {
  background-color: var(--silver) !important;
}

.vip-club-progress-3 {
  border: 1px solid #AD8B33 !important;
  background: linear-gradient(180deg, rgba(194, 146, 1, 0.50) 0%, rgba(194, 146, 1, 0.10) 100%) !important;
  box-shadow: 0 0 12px 0 #FFB801 inset !important;
}

.vip-club-progress-3 .vip-club-progress-badge {
  background-color: var(--Gold) !important;
}

.vip-club-progress-4 {
  border: 1px solid #E63289 !important;
  background: linear-gradient(180deg, rgba(255, 61, 155, 0.50) 0%, rgba(255, 61, 155, 0.10) 100%) !important;
  box-shadow: 0 0 12px 0 #FF3D9B inset !important;
}

.vip-club-progress-4 .vip-club-progress-badge {
  background-color: var(--Platinum) !important;
}

.vip-club-progress-5 {
  border: 1px solid #8E32D2 !important;
  background: linear-gradient(180deg, rgba(180, 59, 255, 0.50) 0%, rgba(180, 59, 255, 0.10) 100%) !important;
  box-shadow: 0 0 12px 0 #B43BFF inset !important;
}

.vip-club-progress-5 .vip-club-progress-badge {
  background-color: var(--Diamond) !important;
}

.vip-club-progress-6 {
  border: 1px solid #2E56D7 !important;
  background: linear-gradient(180deg, rgba(61, 107, 255, 0.50) 0%, rgba(61, 107, 255, 0.10) 100%) !important;
  box-shadow: 0 0 12px 0 #3D6BFF inset !important;
}

.vip-club-progress-6 .vip-club-progress-badge {
  background-color: var(--Legend) !important;
}

.activebonus-card-header,
.activefreespins-card-header {
  box-shadow: none !important;
}

.activebonus-card-header:after,
.activefreespins-card-header:after {
  display: none !important;
}

.activebonus-card-header.cashback {
  background: linear-gradient(270deg, #FF2E78 0%, #7A0E37 100%) !important;
}

.activebonus-card-header.freespins {
  background: linear-gradient(270deg, #5C6CFF 0%, #2C36B5 100%) !important;
}

.activebonus-card-header.bonus {
  background: linear-gradient(270deg, #B33BFE 0%, #3F0E78 100%) !important;
}

.activefreespins-card-header {
  background: linear-gradient(270deg, #5C6CFF 0%, #2C36B5 100%) !important;
}
