:root {
    --primary-accent-color: #FFFF61;
    --primary-gradient: linear-gradient(180deg, var(--primary-accent-color) 0%, #FFC800 100%);
    --secondary-accent-color: #D7E4FF;
    --secondary-gradient: linear-gradient(180deg, var(--secondary-accent-color) 0%, #7C92C4 100%);
    --color-body-text: white;
    --primary-button-font-color: #0D182F;
    --secondary-button-font-color: #0D182F;
    --bg-tier-1: #0D182F;
    --bg-tier-1-gradient: linear-gradient(180deg, var(--bg-tier-1) 0%, var(--bg-tier-1) 100%);
    --bg-tier-2: #152549;
    --bg-tier-2-gradient: linear-gradient(180deg, var(--bg-tier-2) 0%, var(--bg-tier-2) 100%);
    --bg-tier-3: #1C3468;
    --bg-tier-3-gradient: linear-gradient(180deg, var(--bg-tier-3) 0%, var(--bg-tier-3) 100%);
    --footer-text-color: var(--color-body-text);
    --footer-background-color: #000;
    --error-gradient: linear-gradient(180deg, #F1416C 0%, #F1416C 100%);
    --link-color: #29FF08;
    /* No real color codes (i.e. #FFFFFF) should be used beyond this point. Only refer to variables. */

    --color-primary-button-bg: var(--primary-gradient);
    --color-secondary-button-bg: var(--secondary-gradient);
    --color-primary-colour-3: #c9c9c9;
    --color-buttons-border-color: var(--color-body-text);
    --color-buttons-text-color: #363636;
    --color-primary-button-text: #000;
    --color-button-border: var(--color-body-text);
    --color-signup-input-bg: var(--bg-tier-2-gradient); /* Updated */
    --color-signup-input-border: #fff;
    --signup-input-border-width: 2px;
    --heading-font: "Degular", sans-serif; /* Updated */
    --body-font: "Roboto", sans-serif; /* Updated */
    --font-numbers: "Roboto", sans-serif; /* Updated */
    --shadow-primary-top-sm: 0px 4px 4px 0px rgba(0, 0, 0, 0.25) inset;
    --shadow-primary-bottom-sm: 0px 4px 4px 0px rgba(0, 0, 0, 0.25);
    --shadow-primary-footer-sm: 0px -4px 4px 0px rgba(0, 0, 0, 0.25);
    --shadow-primary-right-sm: 4px 4px 4px 0px rgba(0, 0, 0, 0.25);
    --shadow-info-image: drop-shadow(0px 4px 4px rgba(0, 0, 0, 0.25)) drop-shadow(0px 4px 4px rgba(0, 0, 0, 0.25));
    --shadow-signUp-text: 0px 2.662px 2.662px rgba(0, 0, 0, 0.25), 0px 2.662px 2.662px rgba(0, 0, 0, 0.25);
    --color-bg: #081021; /* Updated */
    --color-header-bg: #0E1930; /* Updated */
    --color-app-header-bg: #152549; /* Updated */
    --color-header-items-bg: #0D182F; /* Updated */
    --color-login-bg: linear-gradient(180deg, #0D182F 0%, #111F3D 100%); /* Updated */
    --color-login-block-bg: #000F1B;
    --color-main-lobby-categories-bg: transparent;
    --color-main-lobby-categories-text: #20BBD2;
    --color-landing-nopurchase-bg: linear-gradient(180deg, #010509 0%, #012B38 25%, #012B38 75%, #010509 100%);
    --color-landing-providers-bg: #152549 /* Updated */;
    --color-landing-why-bg: linear-gradient(180deg, #010509 0%, #012B38 100%);
    --color-landing-top-pick-bg: #152549; /* Updated */
    --color-landing-testimonials-bg: linear-gradient(360deg, #010509 0%, #012B38 100%), linear-gradient(180deg, #010509 0%, #011D26 100%), #010206;
    --color-login-border: #58A3FF; /* Updated */
    --color-level-progress-bg-start: #FF6B35;
    --color-level-progress-bg-end: #E55A2B;
    --claim-coins-bg: var(--bg-tier-2-gradient); /* Updated */
    --color-info-button-border: var(--color-body-text) /* Updated */;
    --color-info-button-bg: var(--primary-gradient); /* Updated */
    --color-company-card-bg: #1C3468; /* Updated */
    --color-footer-border: rgba(255, 255, 255, 0.5);
    --color-promotions-card-gc-bg: #0D182F;
    --promotions-card-gc-bd-color: linear-gradient(180deg, #D7E4FF 0%, #7C92C4 100%);
    --color-safety-hub-card-bg: #1C3468; /* Updated */
    --color-table-row-even-bg: #1C3468; /* Updated */
    --color-profile-verification-status-bg: var(--primary-gradient); /* Updated */
    --color-profile-redeem-button-bg: var(--primary-gradient); /* Updated */
    --color-get-code-button-bg: linear-gradient(180deg, #D7E4FF 0%, #7C92C4 100%);
    --color-altlogin-verif-button-bg: var(--primary-gradient);
    --color-header-login-button-bg: var(--color-persian-blue);
    --color-icon: #FFC800; /* Updated */
    /* --redeem-holdings-title-fs: 20px; */
    --redeem-holdings-title-color: var(--color-body-text);
    /* Category backgrounds */
    --color-category-main-lobby-bg: transparent;
    --color-category-for-you-bg: transparent;
    --color-category-trending-bg: transparent;
    --color-category-new-bg: transparent;
    --color-category-category-bg: transparent;
    --color-category-all-games-bg: var(--primary-gradient); /* Updated */
    --color-profile-input-bg: #152549; /* Updated */
    --color-category-border: #20BBD2;
    --color-login-input: var(--bg-tier-2-gradient); /* Updated */
    --color-date-input: #152549; /* Updated */
    --color-loyalty-card-bg: #191A36;
    --color-category-selected-bg: var(--color-secondary-button-bg); /* Updated */
    --color-category-selected-text: #010206;
    --color-sidebar-bg: #152549; /* Updated */
    --color-menu-body-bg: #0D182F; /* Updated */
    --color-header-button-text: #0D182F; /* Updated */
    --color-category-font-weight: 600;
    --coin-store-small-card-gc-fs: 33px;
    --coin-store-small-card-gc-fw: 900;
    --color-toggle-switch-bg: #152549; /* Updated */
    --color-header-switcher-bg: var(--primary-gradient); /* Updated */
    --color-reached-loyalty-text: var(--color-body-text);
    --color-current-loyalty-level-bg: #B0D9E5;
    --font-main-buttons-fw: 800;
    --no-purchases-before-bg: transparent;
    --pagination-bg: #20BBD2;
    --pagination-active-border: transparent;
    --pagination-active-bg: #A1F3FF;
    --promo-banner-before-bg: transparent;
    --coin-card-letter-spacing: 1px;
    --redeem-barrier-bg: linear-gradient(180deg, rgba(255, 255, 97, 0.50) 0%, rgba(255, 200, 0, 0.50) 100%);
    --color-change-password-button-bg: var(--color-secondary-button-bg); /* Updated */
    --color-view-transaction-history-button-bg: #F8CB46;
    --color-icon-arrow: var(--primary-gradient);
    --color-social-icon-bg: var(--color-body-text);
    --color-social-icon-fg: #000;
    --color-footer-nav-balance-bg: #0D182F /* Updated */;
    --color-footer-nav-balance-text: #F8CB46;
    --kt-accordion-body-bg-color: #1C3468;
    --kt-input-border-color: #0D182F;
    /* ===== FONTS ===== */
    --font-primary: "Degular", sans-serif;
    --font-secondary: "Roboto", serif;
    --font-numbers-font: inherit;
    --text-font-family: var(--font-secondary);
    --lending-page-text-ff: "Roboto", sans-serif;
    --text-promotion-font-family: "Roboto", serif;
    --font-family-nexa: var(--font-primary);
    --mobile-nav-font-family: var(--font-primary);
    --body-font-weight: 400;
    /* ===== OTHERS ===== */
    --testimonials-bg: none;
    /* Coin Store additions */
    --coin-store-card-free-gc-bg-color: #F8CB46;
    --coin-store-card-free-gc-bd-color: transparent;
    --coin-store-card-free-gc-color: #010206;
    --coin-store-card-free-gc-fs: 18px;
    --coin-store-small-card-free-gc-fs: 18px;
    --coin-store-card-free-gc-fw: 700;
    --coin-store-large-card-free-gc-fs: 18px;
    --coin-store-large-card-free-gc-mobile-fs: 16px;
    --coin-store-small-card-free-gc-mobile-fs: 16px;
    /* Promotions card */
    --promotions-card-gc-color: linear-gradient(180deg, #D7E4FF 0%, #7C92C4 100%);
    --promotions-card-gc-fw: 700;
    /* Buttons – Unverified */
    --unverified-button-text-fw: 700;
    --unverified-button-color: #F8CB46;
    --unverified-button-bd-color: #F8CB46;
    --unverified-button-bg: transparent;
    /* Buttons – Verified */
    --verified-button-text-fw: 700;
    --verified-button-color: #010206;
    --verified-button-bg: linear-gradient(180deg, #FFFF61 0%, #FFC800 100%);
    /* Branding */
    --section-title-color: linear-gradient(180deg, #D7E4FF 0%, #7C92C4 100%); /*Updated*/
    --section-bg-color: transparent;
    --footer-button-border-color: var(--color-body-text); /* Updated */
    --subtitle-font: "Degular Black", sans-serif;
    --password-strength-bar-color: #20BBD2;
    --redeem-holdings-bg-color: linear-gradient(180deg, #FFFF61 0%, #FFC800 100%);
    --color-yellow-grad: linear-gradient(180deg, #FFFF61 0%, #FFC800 100%);
    --color-footer-nav-bg: var(--color-bg);
    --mobile-nav-font-size: var(--text-xs);
    --form-switch-bg-color: #1C3468;
    --form-switch-border-color: #FFFF61;
    --arrow-color: #FFFF61;
    --tab-border-color: #FFFF61;
    --checkbox-bg-color: var(--color-primary-colour-3);
    --checked-checkbox-bg-color: linear-gradient(180deg, #58A3FF 0%, #0061D8 100%);
    --checkbox-bg-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='17' height='12' viewBox='0 0 17 12' fill='none'%3E%3Cpath d='M1.5 5.5L6.5 10.5L15.5 1.5' stroke='white' stroke-width='3' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
    --signup-strength-bar-color: linear-gradient(180deg, #D7E4FF 0%, #7C92C4 100%);
    --signup-filled-strength-bar-color: linear-gradient(180deg, #58A3FF 0%, #0061D8 100%);
    --landing-top-pick-title-color: linear-gradient(to bottom, #ffffff 0%, #ffffff 45%,#FFC800 55%, #FFC800 100%);
    --modal-verification-input-bg-color: #0D182F;
    --file-wrapper-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='37' height='33' viewBox='0 0 37 33' fill='none'%3E%3Cpath d='M31 32.4762C33.8535 32.4762 36.1667 30.0528 36.1667 27.0635V18.9444C36.1667 15.9551 33.8535 13.5317 31 13.5317H5.16667C2.3132 13.5317 0 15.9551 0 18.9444V27.0635C0 30.0528 2.3132 32.4762 5.16667 32.4762H31Z' fill='%23FFFF61'/%3E%3Cpath d='M0 12.8928V5.4127C0 2.42335 2.3132 0 5.16667 0H14.4299C15.4577 0 16.4433 0.427698 17.17 1.18901L20.8234 5.01636C21.0656 5.27013 21.3941 5.4127 21.7367 5.4127H31C33.8535 5.4127 36.1667 7.83605 36.1667 10.8254V12.8928C34.7955 11.6071 32.9849 10.8254 31 10.8254H5.16667C3.18175 10.8254 1.37112 11.6071 0 12.8928Z' fill='%23FFFF61'/%3E%3C/svg%3E");
    --color-promotions-card-gc-border: #D7E4FF;
    --color-promotions-card-gc: #D7E4FF;
    --category-link-padding: 4px 10px;
    --side-menu-user-profile-border-radius: 10px;
}

.landing-header__nav-list {
    display: none;
}

.landing-hero__title,
.landing-hero__title-line-2,
.landing-games__title,
.landing-usp__title,
.landing-feedback__title,
.landing-coins__title,
.landing-games__no-purchases-title,
.sign-up__title--desktop,
.sign-up__title--mobile,
.landing-providers__title,
.forgot-password-page__title,
.set-new-password__title,
.profile__title,
.profile__info-text,
.text-success,
.main-lobby__title-count,
.main-lobby__promo-banner-title,
.side-menu__nav-link:active,
.alt-login__step-title,
.refer-a-friend__heading,
.safety-hub-self-exclusion__subtitle,
.redeem-accordion__state,
.mobile-number-verification-title,
.email-verification-modal-title,
.email-verification__input,
.side-menu__nav-link:hover,
.landing-feedback__review-location,
.landing-feedback__review-favorite-games,
.select2-container--bootstrap5 .select2-dropdown .select2-results__option.select2-results__option--highlighted,
.select2-container--bootstrap5 .select2-dropdown .select2-results__option.select2-results__option--selected > * {
    background: var(--primary-gradient);
    background-clip: text;
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent !important;
    text-shadow: none !important;
}

.landing-header,
.landing-usp {
    background-image: var(--background-pattern);
    background-position: left;
    background-repeat: no-repeat;
    background-size: cover;
}

.landing-games,
.landing-feedback,
.login-container {
    background-image: var(--background-pattern);
    background-position: right;
    background-repeat: no-repeat;
    background-size: cover;
}

@media screen and (max-width: 1025px) {
    .landing-provider,
    .landing-header,
    .landing-games,
    .landing-usp,
    .landing-feedback {
        background-image: var(--background-pattern-mobile);
        background-position: center;
    }

    .login-container,
    .sign-up,
    .forgot-password-page__container,
    .set-new-password {
        background-image: var(--background-pattern-mobile) !important;
        background-position: right !important;
        background-repeat: no-repeat !important;
        background-size: cover !important;
    }
}

@media screen and (min-width: 1026px) {
    .lobby-menu {
        background-image: var(--background-pattern);
        background-position: center;
        background-repeat: no-repeat;
        background-size: cover;
    }
}

.side-menu__nav-link:active svg {
    fill: #FFFF61 !important;
}

.sign-up__link {
    -webkit-text-fill-color: transparent;
    text-decoration-line: underline;
    background: var(--link-color);
    background-clip: text;
    -webkit-background-clip: text;
    text-underline-offset: auto;
}

.side-menu__nav-link:hover svg {
    fill: #FFE431;
}

@media screen and (max-width: 1025px) {
    .app-header__shop {
        display: block;
    }
}

.lending-hero {
    width: 100%;
    aspect-ratio: 384 / 85;
}

@media screen and (min-width: 1921px) {
    .lending-hero__container {
        align-items: center;
    }
}

.landing-feedback__star {
    color: var(--secondary-accent-color)
}

.main-lobby__category-link {
    background: var(--primary-gradient);
}