:root {
    --color-background-main: #e7e7e7; /* Light Grey Color */
    --color-background-main-hover: #e3310d; /* Light Green Color */
    --color-background-primary: #2E6F40;  /* Dark Red Color */
    --color-background-primary-hover: #e3310d; /* Light Green Color */
    --color-background-secondary: #ffffff;  /* White */
    --color-background-secondary-hover: #e3310d; /* Light Green Color, Allow Cookies Decline, Payment Button */
    --color-background-tertiary: #bf1919;  /* Dark Green Color */
    --color-background-tertiary-hover: #bf1919; /* Light Green Color, Sign In, Customize Item Add */
    --color-background-quarternary: #f0f0f0; /* Snowflake White Color, Locations Address Field */
    --color-background-quarternary-hover: #e1e1e1; /* Light Grey Color */
    --color-background-base-white: #ffffff; /* White Color */
    --colorActive: #bf1919; /* Light Green Color, Button Click Color */
    --color-error: #bf1919; /* Dynamite Red Color, Button Click Color */
    --color-border-default: #717171; /* Dull Grey Color, Promo Code, Fundraiser Code, Store Locator */
    --color-border-secondary: #717171; /* Dull Grey Color, For Secondary Buttons */

    /* Accent */
    --color-accent: var(--color-background-primary); /* Dark Red Color */
    --color-accent-hover: #d94444; /* Light Green Color, Order Type Store Locator Hover */

    /* Text */
    --color-text-primary: #000000; /* Black */
    --color-text-secondary: #717171; /* Dull Grey Color */
    --color-text-tertiary: #000000;  /* Black */
    --color-text-tertiary-hover: #db6666;  /* Light Pink Color */
    --color-text-quaternary: #FFFFFF; /* White, Selected Button Color */
    --color-text-quinary: #FFFFFF;  /* White */
    --color-text-senary: #bf1919;  /* Dark Green Color */
    --color-text-main-header: #FFFFFF; /* White, Text colors for Title's */

    /* Button */
    --color-button-text: #FFFFFF; /* White */
    --color-button-background: var(--color-background-primary); /* Dark Red Color */
    --color-button-background-hover: #bf1919; /*  Light Green Color, Allow Cookies Accept, Sign In, Customize Item Add */
    --color-button-border: #717171; /* Dull Grey Color */
    --color-button-border-secondary: #FFFFFF; /* White */

    /* Other */
    --color-deal-builder-bar: var(--color-accent);
    --color-deal-builder-bar-light: #4d4a48;

    --shadow:  0px 4px 2px rgba(0, 0, 0, 0.18);

    --hover-transition: all 0.1s ease;
    --hover-shadow: 0 4px 2px rgba(0, 0, 0, 0.5);
    --hover-transform: scale(1.02)
}

/* ------ Header ------ */
.header {
	--header-background-color: var(--color-background-primary);
    --header-text-color: var(--color-text-main-header);
	--header-icon-color: var(--color-text-quinary);
    --header-cart-items-background-color: var(--color-text-primary);
    --header-cart-items-color: var(--color-text-quinary);
}

/*------ Landing ------ */
.location-info-btn {
    color: var(--color-text-primary);
}

/* ------ Deliver To/Store Location Bar Color ------ */
#div_header_location_bar > .location-info-bar {
    color:White;
}

/* ------ Landing Page Dine In/Take Out Location ------ */
#div_landing_location > .location-info-bar {
    color:Black;
}

/* ------ Segmented Button, Order Type Selection ------ */
.segmented-button {
    --segmented-button-bg-color: var(--color-background-secondary);
    --segmented-button-active-text-color: var(--color-background-secondary);
    --segmented-button-border-color: var(--color-button-border);
}

    .segmented-button > button {
        color: var(--color-text-primary);
    }

    .segmented-button > button.active {
        color: var(--color-text-quaternary);
        background-color: var(--color-background-tertiary);
    }


/* ------ Locations ------ */
.locations-main-container {
    --border: 1px solid var(--color-border-default);
    --locations-card-bg-color: var(--color-background-secondary);
    --locations-card-bg-color-active: var(--color-background-quarternary);
}

.search-container {
    background-color: var(--color-background-secondary);
}

.store-address.active {
    background-color: var(--color-background-primary);
    color: #FFFFFF;
    --locations-card-secondary-text-color: var(--color-text-quinary);
}

.store-list-selector > div.active:hover {
    color: #f21414;
}

/* ------ Pill Bar (Menu) ------ */
.pill-bar-container {
    --pill-bar-background-color: var(--color-background-secondary);
    --pill-bar-text-color-active: var(--color-text-quaternary);
    --pill-bar-background-color-active: var(--color-background-tertiary);
}

/* ------ Menu (Items with effects) ------ */
.menu-item-card-small {
    --menu-item-card-bg-color: var(--color-background-secondary);
    --menu-item-card-bg-color-hover: var(--color-background-secondary-hover);
    box-shadow: var(--shadow);
    transition: var(--hover-transition);
}

.menu-item-cart-card-actions .item-quantity {
	background-color: #d5d5d5;
}

.menu-item-card-small:not(.selected):hover {
    box-shadow: var(--hover-shadow);
    transform: var(--hover-transform);
    background-color: var(--color-background-secondary);
}

.meal-deal-card {
    box-shadow: var(--shadow);
    transition: var(--hover-transition);
}

.meal-deal-card:hover {
    box-shadow: var(--hover-shadow);
    transform: var(--hover-transform);
    background-color: var(--color-background-secondary);
    --meal-deal-card-border-color: var(--color-button-border-secondary);
}

@media (max-width: 700px) {
    .menu-parent-wrapper .menu-item-card-parent {
        padding: 9px 15px;
    }
}

/* ------ Navbar ------ */
#nav_bottom {
    --navbar-background-color: var(--color-background-secondary);
    --navbar-icon-color: var(--color-text-primary);
    --navbar-icon-active-color: var(--color-background-secondary);
}

#nav_order {
    --order-type-navbar-background-color: var(--color-background-base-white);
}

/* ------ Fancy Title ------ */
.fancy-title {
    --fancy-title-first-color: var(--color-text-primary);
}

/* ------ Hamburger ------ */
#modal_hamburger {
    --hamburger-ellipse-bg-color: var(--color-background-main);
    background-color: var(--color-background-secondary);
}

#modal_hamburger .fancy-title {
    --fancy-title-first-color: var(--color-accent);
    --fancy-title-alt-color: Black;
}

#hamburger_signup {
    color: var(--color-accent);
}

#hamburger_ellipse {
    box-shadow: var(--shadow);
}

#hamburger_language select {
    background-color: var(--color-background-secondary);
}

/* ------ Loyalty -- Current Point Text ------ */
.loyalty-points-bar.loyalty-status-text {
  color: var(--color-text-quaternary);
}

/* ------ Customize Item ------ */
.customize-item-container {
    --customize-item-section-header-bg-color: var(--color-background-secondary);
    --customize-item-footer-bg-color: var(--color-background-secondary);
    --customize-item-footer-quantity-bg-color: var(--color-background-secondary);
    --customize-item-footer-quantity-border-color: var(--color-border-default);
    --customize-item-footer-quantity-bg-color-hover: var(--color-background-secondary-hover);
    box-shadow: var(--shadow);
}

.item-section-header {
    box-shadow: var(--shadow);
}

.quantity-selector button {
    color: var(--color-text-primary);
}

/* ------Favorite Icon Color ------ */
.icon-favorites {
    --modal-background-color: #191919;
}

.icon-heart-filled {
    --modal-background-color: #e50000;
}

/* ------ Check-Radio ------ */
.custom-radio {
    --rad-chk-bg-color: var(--color-background-secondary);
    --rad-chk-checked-bg-color: var(--color-background-tertiary);
}

/* ------ Quantity Buttons, Black Color ------ */
.quantity-btn > .icon-subtract {
    color:Black;
}

.quantity-btn > .icon-plus {
    color:Black;
}

/* ------ Buttons -- Sign In, Customize Item ------ */
button {
    --colorActive: #78bf6e; /* Button Click Color */
    --button-color: #FFFFFF;
    --color: #000000;
    --button-bg-color: var(--color-background-tertiary);
    --button-bg-color-secondary: var(--color-background-secondary);
    --button-bg-color-secondary-hover: var(--color-background-quarternary-hover);
}

/* ------ Secondary Buttons -- Add More Items ------*/
button.secondary {
    color: var(--color-text-senary);
    background-color: #FFFFFF;
    border: 2px solid var(--color-border-secondary);
}


/* ------ Favorites ------ */
.favorite-container {
    --favorite-card-icon-background-color: var(--color-background-secondary);
    --favorite-card-icon-color: var(--color-accent);
}

.icon-heart-filled.favorites {
    border: 1px solid var(--color-border-default);
}

.header_background {
    color: var(--color-text-quaternary);
    box-shadow: var(--shadow);
}

/* ------ Modal ------ */
.modal {
    --modal-header-color: var(--color-text-quaternary);
}

#modal_confirmation_delete{
    color: var(--color-text-quaternary);
}

/* ------ Upsell ------ */
.upsell-wrapper .upsell-card {
    box-shadow: var(--shadow);
    transition: var(--hover-transition);
}

.upsell-wrapper .upsell-card:hover {
    box-shadow: var(--hover-shadow);
    transform: var(--hover-transform);
    background-color: var(--color-background-secondary);
}

/* ------ Default ------ */
.button-link {
    color: var(--color-background-primary);
}

.cta-button {
    box-shadow: var(--shadow);
}

/* ------ Cart ------ */
.menu-item-cart-card-actions .item-quantity {
    color: var(--color-text-tertiary);
}

.promo-input-container > button {
    background-color: var(--color-background-secondary);
}

.cart-reward-section {
    --cart-reward-card-bg-color: var(--color-background-main);
    --cart-reward-arrow-color: var(--color-background-secondary);
}

.cart-reward-cards {
    padding: 0.5rem 0.2rem;
}

.cart-reward-card {
    box-shadow: var(--shadow);
    transition: var(--hover-transition);
}

.cart-reward-card:hover {
    box-shadow: 0 8px 7px rgba(0, 0, 0, 0.2);
    transform: var(--hover-transform);
    background-color: var(--color-background-main);
}

.cart-no-items-heading, .cart-no-items-info {
	color: var(--color-text-quaternary);
}

.menu-item-cart-card-parent {
  --menu-item-cart-card-price-color: var(--color-text-senary);
  --menu-item-cart-card-quantity-background-color: var(--color-background-primary);
}

.menu-item-cart-card-points {
  color: var(--color-background-primary);
}

/* ------ Limited Time ------ */
.limited-time {
    --limited-time-color-selected: var(--color-text-quaternary);
}

.limited-time > div > div > button {
    color: var(--color-text-primary);
}

.limited-time > div > div > button:hover {
    color: var(--color-text-quaternary) !important;
}

.limited-time > div > div > button.time-selected {
    border: 2px solid var(--limited-time-background-color-selected);
}

/* ------ Deal Builder ------ */
.deal-builder-container {
    --deal-builder-group-header-bg-color: var(--color-background-secondary);
    --deal-builder-group-header-added-color: var(--color-background-secondary);
    --customize-item-footer-bg-color: var(--color-background-secondary);
}

.deal-builder-container .deal-builder-header {
    background-color: var(--color-background-secondary);
}

.deal-builder-progress-bar.incomplete {
    background-color: #FFFFFF;
}

.deal-progress-header > h2 {
    color: var(--color-accent) !important;
}

.deal-builder-group-header {
    box-shadow: var(--shadow);
    
}

.menu-item-card-small__pill--size {
  background-color: var(--color-background-secondary);
}

.deal-builder-progress-bar.incomplete {
  background-color: var(--color-background-main);
}

/* ------ Meal Deal Item Section Card ------ */
.menu-item-card-small.horizontal.selected {
    border: none;
    color: var(--color-text-quaternary);
}

.menu-item-card-small.horizontal.selected .button-link {
   color: var(--color-text-quaternary);
}

/* ------ Button ------ */
button:disabled {
    color: var(--button-color);
}

/* ------ Recent Orders ------ */
.recent-order-main-card {
    --recent-orders-card-order-status-text-color: var(--color-text-quaternary);
}

/* ------ Account ------ */
#page_account {
    --account-header-background-color: var(--color-background-secondary);
}

#page_account .section-header { 
    box-shadow: var(--shadow);
}

#page_account .section-header-edit {
  color: var(--color-background-tertiary);
}

/* ------ Rewards ------ */
.page-rewards-body {
    --rewards-points-bar-color: var(--color-background-secondary);
    --rewards-points-bar-text-color: var(--color-text-primary);
    --rewards-header-bg-color: var(--color-background-secondary);
}

.rewards-section-header {
    box-shadow: var(--shadow);
}

/* ------ Radio Buttons -- Notifications, Save Credit Card, Remember Me, Privacy Policy ------ */
.checkRadio > input:checked + label::before {
  background-color: var(--color-background-tertiary);
}

/* ------ NavBottom -- Back to Home button on Track Order Page, Order Number Text, Route Button ------ */
.back-home-parent {
  --back-home-background-color: var(--color-background-main);
  background-color: var(--back-home-background-color);
}

.header .header-center-subtext {
    color: White;
    font-size: small;
}

.track-order-route-button {
  background-color: var(--color-background-secondary);
}