/* Default values go here (they will be overridden when qcssapp.Functions.setBrandingGlobals is called) */
:root {
    --primaryBackgroundColor: #ef4135;
    --primaryFontColor: #FFF;
    --secondaryBackgroundColor: #133d8d;
    --secondaryFontColor: #FFF;
    --tertiaryBackgroundColor: #2eb941;
    --tertiaryFontColor: #FFF;
    --accentColorOne: #ef4135;
    --accentColorTwo: #133d8d;
    --cartBackgroundColor: var(--primaryBackgroundColor);
    --cartFontColor: var(--primaryFontColor);
    --loginPrimaryButtonColor: var(--primaryBackgroundColor);
    --loginPrimaryFontColor: var(--primaryFontColor);
    --loginSecondaryButtonColor: var(--secondaryBackgroundColor);
    --loginSecondaryFontColor: var(--secondaryFontColor);
    --loginPageBackgroundColor: #FFF;
    --inputBorderColor: #CCC;
    --loginBackgroundImage: '';
    --primaryGradientColor: linear-gradient(#f44336, #c62828);
    --primaryBorderColor: #b71c1c;
    --secondaryGradientColor: linear-gradient(#133d8d, #133d8d);
    --secondaryBorderColor: #133d8d;
    --primaryGradientFontColor: #fbcfcc;
    --homePageBackgroundColor: #FFF;
    --greetingMessageFontSize: 18px;
    --greetingMessageFontName: 'Roboto';
    --homePageBackgroundImage: '';
    --homePageLogo: '';
    --storeBorderColor: #CCC;
    --storeBackgroundColor: var(--primaryBackgroundColor);
}

/* MAIN BRANDING COLORS */
.primary-background-color {
    background-color: var(--primaryBackgroundColor) !important;
}

.font-color-primary {
    color: var(--primaryFontColor) !important;
}

.secondary-background-color {
    background-color: var(--secondaryBackgroundColor) !important;
}

.font-color-secondary {
    color: var(--secondaryFontColor) !important;
}

.tertiary-background-color {
    background-color: var(--tertiaryBackgroundColor) !important;
}

.font-color-tertiary {
    color: var(--tertiaryFontColor) !important;
}

.accent-color-one {
    color: var(--accentColorOne) !important;
}

.accent-color-two {
    color: var(--accentColorTwo) !important;
}

.accent-color-one-background {
    background-color: var(--accentColorOne) !important;
}

.accent-color-two-background {
    background-color: var(--accentColorTwo) !important;
}

.accent-color-one-border {
    border-color: var(--accentColorOne) !important;
}

.primary-gradient-color {
    background-image: var(--primaryGradientColor) !important;
}

.primary-border-color {
    border-color: var(--primaryBorderColor) !important;
}

.secondary-gradient-color {
    background-image: var(--secondaryGradientColor) !important;
}

.secondary-border-color {
    border-color: var(--secondaryBorderColor) !important;
}

.primary-font-fill {
    fill: var(--primaryFontColor) !important;
}

.font-color-primary-gradient {
    color: var(--primaryGradientFontColor) !important;
}

.primary-font-background-color {
    color: var(--primaryBackgroundColor) !important;
}

.primary-border-background-color {
    color: var(--primaryBackgroundColor) !important;
}

.tertiary-font-background-color {
    color: var(--tertiaryBackgroundColor) !important;
}

.tertiary-border-color {
    border-color: var(--tertiaryBackgroundColor) !important;
}

/* LOGIN BRANDING */

.login-primary-background-color {
    background-color: var(--loginPrimaryButtonColor) !important;
}

.login-primary-text-color {
    color: var(--loginPrimaryFontColor) !important;
}

.login-secondary-background-color {
    background-color: var(--loginSecondaryButtonColor) !important;
}

.login-secondary-text-color {
    color: var(--loginSecondaryFontColor) !important;
}

.login-page-background-color {
    background-color: var(--loginPageBackgroundColor) !important;
}

.login-background-image {
    background-image: var(--loginBackgroundImage) !important;
}

/* CART BRANDING COLORS */

.store-cart-header, .store-cart-header > h1, .store-cart-color {
    background: var(--cartBackgroundColor) !important;
    color: var(--cartFontColor) !important;
}

.cart-button-primary {
    background: var(--cartBackgroundColor) !important;
    color: var(--cartFontColor) !important;
}

.cart-button-secondary {
    background: var(--cartFontColor) !important;
    color: var(--cartBackgroundColor) !important;
    border: solid 2px var(--cartBackgroundColor) !important;
}

.store-cart-font-color {
    color: var(--cartFontColor) !important;
}

.store-cart-secondary-font-color {
    color: var(--cartBackgroundColor) !important;
}

.store-cart-font-fill {
    color: var(--cartFontColor);
    fill: var(--cartFontColor);
}

.store-background-color {
    background-color: var(--storeBackgroundColor) !important;
}

.store-background-color-font {
    color: var(--storeBackgroundColor) !important;
}