/*ToolbarColor*/
body>header>.toolbar {
    background-color:#ffffff ;
}
/*images of tool bar*/
header .toolbar .retailer-data sp-dropdown .sp-dropdown-text img,
 header .toolbar .user-details sp-dropdown .sp-dropdown-text img ,
 header .toolbar .language sp-dropdown .sp-dropdown-text img, 
 header .toolbar .newsletter  img
 {
    filter: invert(1);
    -webkit-filter: invert(1);
}

body>header>.toolbar>.data>.coupons.coupons{
    filter: invert(0);
    -webkit-filter: invert(1);
	font-weight: 100;
}

body > header > .toolbar > .data > .coupons.active {
    filter: none; /* Removes the inversion */
    -webkit-filter: none;
    background-color: #your-new-bg-color; 
}


sp-dropdown .sp-dropdown-text .arrow {
   filter: invert(0);
    -webkit-filter: invert(1);
}

/*images of tool bar on open state*/
 header .toolbar .retailer-data sp-dropdown.open .sp-dropdown-text img,
 header .toolbar .user-details sp-dropdown.open .sp-dropdown-text img ,
 header .toolbar .language sp-dropdown.open .sp-dropdown-text img
 {
    filter: invert(0);
    -webkit-filter: invert(0);
}
/*text color for drop down list of toolbar*/
body>header>.toolbar>.data>.user-details sp-dropdown>.sp-dropdown-options-wrapper>sp-option .option-content, body>header>.toolbar>.data>.language sp-dropdown>.sp-dropdown-options-wrapper>sp-option .option-content, body>header>.toolbar>.data>.retailer-data sp-dropdown>.sp-dropdown-options-wrapper>sp-option .option-content {
    border-top: 1px solid #FFFFFF;
    color: #FFFFFF;
}
/* color for drop down list of toolbar on hover state* usually the same as current category */
body>header>.toolbar>.data>.user-details sp-dropdown>.sp-dropdown-options-wrapper>sp-option:hover,
body>header>.toolbar>.data>.language sp-dropdown>.sp-dropdown-options-wrapper>sp-option:hover,
body>header>.toolbar>.data>.retailer-data sp-dropdown>.sp-dropdown-options-wrapper>sp-option:hover {
    background-color: #19322B !important;
}
/*categories text color*/
body>header>.menu>.categories>.category>.category-content>.content>.name
{
	color: #000000;
}

/*text toolbar*/
sp-dropdown .sp-dropdown-text * {
    
	color: #000 !important;	
}

sp-dropdown.open .sp-dropdown-text * {
	color: #ffffff !important;
}
/*--------login text  - before login -------------*/
body>header>.toolbar>.data>.user-details>button.login {
	color: #9A9A9A !important;
}


html div.sidenav>div>nav>header
{
	background-color: #960F44;
}

/*drop down menu on login/store detailes/and language*/
body>header>.toolbar>.data>.user-details sp-dropdown.open, body>header>.toolbar>.data>.language sp-dropdown.open, body>header>.toolbar>.data>.retailer-data sp-dropdown.open,
body>header>.toolbar>.data>.user-details sp-dropdown>.sp-dropdown-options-wrapper, body>header>.toolbar>.data>.language sp-dropdown>.sp-dropdown-options-wrapper, body>header>.toolbar>.data>.retailer-data sp-dropdown>.sp-dropdown-options-wrapper{
    background-color: # !important;
}

/*search area color*/
body>header>.toolbar>.data>.search-wrapper>.search>.input>input
{
    background-color: #E8E8E8 !important;
}
/*--------categories-------------*/

/*categories lines seperator*/
body>header>.menu>.categories>.category {
    
	border-left: 1px solid #19322B !important;
}

/*categories current*/
body>header>.menu>.categories>.category.current>.category-content {
    background-color: #19322B !important;
}

/*under line on over and selected - usually as current category*/
body>header>.menu>.categories>.category.open>.category-content
{
	box-shadow: inset 0px -5px #19322B !important;
}


/*---------------------checkout-------------------*/
/*check out button*/
html div.sidenav>div>nav.cart>footer>.checkout>span
{
	background-color: #960F44;
}
/*small check out button*/
html div.sidenav>div>nav>header .right .button
{
	background-color: #960F44;
	border: 1px solid #ffffff;
}
/*Check out button text color*/
html div.sidenav>div>nav.cart>footer>.checkout>span>span,
html div.sidenav>div>nav.cart>footer>.checkout>span
{
	color:   #ffffff !important;
}
/*secondary checkout button color*/
checkout-bottom-banner .total-summary .next-button button {
    background-color: #960F44;
    border-color: #ffffff;
}

/*Trash can color*/

html div.sidenav>div>nav header.nav-header .left>.clean-cart-icon, html div.sidenav>div>nav>header .left>.clean-cart-icon {
    background-color: #D3D3D3;
}

/*START Narrow componant spacing*/

html.home section.main section.view .home-page-wrapper>.content {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    gap: .7em;
    text-align: center;
    background-position: bottom left, 0 0, 8px 8px;
    background-size: auto;
    background-repeat: repeat;
    background-size: 70%;
    -webkit-transition: padding .3s linear;
    transition: padding .3s linear;
    -webkit-padding-start: 3.5em;
    padding-inline-start: 3.5em;
    padding-top: .5em;
    padding-bottom: .5em;
    position: relative;
    z-index: 1;
}

html.home section.main section.view .home-page-wrapper>.content>.component {
    gap: .7em;
    padding-top: .7em;
    padding-bottom: .7em;
    border-radius: 1px;
}

/*END Narrow componant spacing*/


/* START Update the banner height */

.background {
  height: 94px !important;
}

/* Update the wrapper to allow elements below to move up */
.background-wrapper {
  height: 94px !important;
}

/* END Update the banner height */

/*Change arrow color*/

html.home section.view .home-page-wrapper>.content>.component>.header-wrapper>.carousel-btns-wrapper>.action button>svg use {
    fill: #960F44;
}

html.home section.view .home-page-wrapper>.content>.component>.header-wrapper>.carousel-btns-wrapper>.action button.disabled svg use {
    fill: #c39a6c;
}