:root {
    /* IMAGES */

    --top-images: url(/wp-content/themes/casinotheme-child-uusimmat/assets/images/top-left-side.svg), url(/wp-content/themes/casinotheme-child-uusimmat/assets/images/top-right-side.svg);
    --deal-bg: #d4d4d4 url(/wp-content/themes/casinotheme-child-uusimmat/assets/images/deal-background.png) no-repeat top center/cover;

    --stars-rated: url(/wp-content/themes/casinotheme-child-uusimmat/assets/icons/stars-rated.svg) no-repeat top left/cover;
    --stars-empty: url(/wp-content/themes/casinotheme-child-uusimmat/assets/icons/stars-empty.svg);

    --review-list-star: url(/wp-content/themes/casinotheme-child-uusimmat/assets/icons/star-single.svg) no-repeat center center;

    /* GENERAL COLORS */

    --color-primary-lightest: white;
    --color-primary-light: hsl(0, 0%, 97%);
    --color-primary: hsl(0, 0%, 93%);
    --color-primary-dark: hsla(0, 0%, 83%);
    --color-primary-darker: hsl(0, 0%, 33%);

    --color-secondary-lightest: hsl(241, 6%, 84%);
    --color-secondary-lighter: hsl(241, 38%, 71%);
    --color-secondary-light: hsl(241, 58%, 55%);
    --color-secondary: hsl(241, 58%, 55%);
    --color-secondary-dark: hsl(223, 54%, 25%);
    --color-secondary-darker: hsl(237, 73%, 12%);

    --color-cta: hsl(204, 88%, 56%);
    --color-cta-dark: hsl(241, 52%, 40%);
    --color-cta-darker: var(--color-secondary-dark);
    --color-cta-lighter: #def2e1;

    --color-tooltip: hsl(348, 100%, 59%);

    /* BG COLOR */

    --bg-color: var(--color-secondary-darker);
    --bg-color-alternate: var(--color-secondary-darker);
    --bg-color-frontpage: var(--color-secondary-darker);

    --bg-color-readmore: var(--bg-color-alternate);
    --bg-color-readmore-alternate: var(--bg-color-alternate);
    --bg-color-transparent: rgb(8 10 53 / 0%);

    /* MOBILE NAV COLOR */

    --mobile-nav-bg-color: var(--footer-bg-main);

    --mobile-nav-border-color: #1d3162;
    --mobile-nav-text-color: var(--color-primary-lightest);
    --mobile-nav-notification-color: var(--color-secondary-darker);

    /* NAV COLOR */

    --nav-bg-color: var(--color-cta);
    --nav-bg-accent-color: var(--color-secondary-dark);

    --nav-border-color: var(--color-secondary-dark);
    --nav-text-color: var(--text-color-lightest);
    --nav-link-color: var(--color-primary-lightest);
    --nav-icon-color: var(--color-secondary-dark);

    /* MOBILE SEARCH COLOR */

    --mobile-search-bg-color: var(--color-primary-lightest);
    --mobile-search-bg-accent-color: var(--color-primary-lightest);

    --mobile-search-text-color: var(--color-secondary-darker);
    --mobile-search-placeholder-color: var(--color-secondary-dark);

    /* SEARCH COLOR */

    --search-bg-color: var(--color-secondary-darker);
    --search-bg-accent-color: var(--color-secondary-darker);

    --search-text-color: var(--color-primary-lightest);
    --search-placeholder-color: var(--color-cta);

    /* REVIEW COLOR */

    --review-top-color: var(--gray-50);
    --review-top-text-color: var(--text-color-card);
    --review-support-text-disabled-color: var(--color-primary-dark);
    --review-scorewheel-color: var(--color-tooltip);

    /* BONUS STRUCTURES COLORS */
    --bonus-tab-color: var(--color-primary);
    --bonus-accent-color: #f7f7f7;

    /* LIST COLOR */

    --list-circle-color: var(--color-tooltip);
    --list-pay-n-play-color: var(--color-tooltip);
    --list-rank-color: var(--colofr-primary-lightest);

    /* CARD COLOR */

    --card-bg-color: var(--color-primary-lightest);
    --card-bg-color-accent: var(--color-primary-light);
    --card-bg-color-accent-dark: var(--color-primary);
    --card-bg-color-dark: var(--color-secondary);
    --card-bg-color-darker: var(--color-secondary-darker);

    /* DEAL COLOR */

    --deal-bg-color: var(--color-secondary-darker);
    --deal-bg-accent-color: var(--color-secondary-darker);

    --deal-circle-color: var(--color-secondary-lightest);

    --deal-temporary-color: #4b48cf;
    --deal-daily-color: var(--color-tooltip);
    --deal-exclusive-color: #76ecff;

    --deal-wave-color: var(--color-secondary-darker);
    --deal-wave-accent-color: var(--color-secondary-dark);

    --deal-text-color: white;
    --deal-text-frontpage-color: white;

    /* PROS AND CONS */

    --proscons-pros-color: #E3FDF3;
    --proscons-cons-color: #FDEDEF;

    /* INLINE MAIL COLOR */

    --mail-bg-color: var(--color-secondary-dark);

    /* CAROUSEL COLOR */

    --carousel-circle-color: var(--color-cta);
    --carousel-arrow-color: var(--color-primary-lightest);

    /* HOW TO COLOR */

    --howto-bg-color: var(--color-secondary-dark);

    /* FOOTER COLOR */

    --footer-bg-color: var(--color-secondary-light);
    --footer-bg-main: var(--color-secondary-light);
    --footer-text-color: var(--color-primary-lightest);

    /* FOOTER */
    --footer-top-image: url(/wp-content/themes/casinotheme-child-uusimmat/assets/images/uusimmat-footer.png);
    --footer-before-bg-color: transparent;
    --footer-bg-height: 67px;
    --footer-before-size: 290px;
    --footer-image-padding: 40px;
    --footer-image-padding-desktop: 80px;
    --footer-image-padding-xl: calc(var(--footer-image-padding-desktop) / 1.3);
    --footer-margin-top: 0;
    --footer-margin-top-xl: 0;
    --illustration-bg-size: contain;
    --footerjoke-margin: 0 auto;

    /* FOOTER JOKE COLOR */
    --color-primary-light: var(--color-secondary-darker);
    --footer-joke-bg-color: var(--color-secondary-darker);
    --footer-joke-text-color: var(--color-primary-lightest);

    /* BOX SHADOW COLOR */

    --box-shadow-color-dark: var(--color-primary-dark);
    --box-shadow-color-darker: var(--color-primary-darker);

    /* TEXT COLORS */

    --text-color-lightest: var(--color-primary-lightest);
    --text-color-lighter: var(--color-primary-dark);
    --text-color-light: var(--color-secondary-ligther);
    --text-color-dark: var(--color-secondary-lightest);

    --text-color-tooltip: var(--color-primary-lightest);
    --text-color-cta: var(--color-primary-lightest);
    --text-color-card: var(--color-secondary-darker);
    --text-color-quote: var(--color-cta);

    /* LINK COLORS */

    --link-color: white;
    --link-color-hover: var(--color-cta);

    /* BOX SHADOWS */

    --box-shadow: none;
    --box-shadow-hover: none;

    --box-shadow-list: none;

    --box-shadow-button: none;
    --box-shadow-button-hover: none;

    --box-shadow-carousel: none;

    --box-shadow-tabs: none;

    /* BORDER RADIUS */

    --border-radius: 1.5rem;
    --border-radius-largest: 50%;

    --border-color-light: var(--color-primary-light);
    --border-color-dark: var(--color-primary-darker);

    /* PADDING */

    --padding-card: 1rem;
    --padding-card-larger: 2rem;

    --padding-button-narrow: 0.5rem 0.75rem;
    --padding-button: 0.5rem 1.25rem;
    --padding-button-tall: .75rem 1.75rem;

    /* SIZES */
    --base-width: 1040px;
    --article-min-height: var(--base-width);

    /* COLORS FOR ICONS */
    --default-icon-color: var(--color-tooltip);
    --heart-pros-icon-color: var(--color-cta);
    --broken-heart-cons-color: var(--color-secondary-lighter);

    /* STATUS */
    --status-nodeal: #ff2d58;

    /* BOXES COLORS */
    --box-bg-color: var(--footer-bg-main);
}