:root {
    --white-text: #FFFFFF;
    
    --primary-text: #555555;
    --primary-text-hover: #333333;
    
    --white-background:#FFFFFF;
    
    --primary-background: #C2C0C1;
    --primary-background-hover: #C2C0C1;
    
    --secondary-background: #402489;
    --secondary-background-hover: #402489;
    --secondary-border: #402489;

    --light-gray-background: rgb(246 245 245);
    --light-gray-border: rgb(246 245 245);
    
    --primary-border: #C2C0C1;
    --primary-border-hover: #402489;
    
    --primary-boxshadow: color(srgb 0.85 0.16 0.45 / 0.15);

    --footer-background:#402489;
    
    --checkout-background: #13A6A2;
    --checkout-background-hover: #ADCF3F;
    
    --wishlist-background: #F9C74F;
    --wishlist-background-hover: #ADCF3F;

    --hamburger-menu-toogle: #C2C0C1;
    --hamburger-menu-toogle-hover: #402489;

    --homepage-category-button: #DA3931;
    
    --product-card-favorites: #F1BB17;
    --product-card-favorites-hover: #F1BB17;
    --product-card-cart: #DA3931;
    --product-card-cart-hover: #B14593;

    --footer-top-border:#402489;
    --footer-divider-border:#13A6A2;
    
    --homepage-features: #F1BB17;
    
    --header-user-avatar: #402489;
    --header-cart-notification: #402489;
    
    --homepage-category-active: #DA3931;

    --list-item-background: rgba(0, 0, 0, 0.03);
    
    --bg-blue-squarepancake:#402489;
    --blue-text:#402489;
    --red-background:#DA3931;
    --red-text:#DA3931;
    --yellow-border:#F1BB17;
    --yellow-text:#F1BB17;
    --yellow-background:#F1BB17;
    --tea-background:#12a5a1;
    --tea-background-100:#12a5a007;
    --tea-text:#12a5a1;
    --green-background:#ADCF3F;
    --green-text:#ADCF3F;
}


[data-theme="dark"] {

}

*:focus {
  outline: none;
}


input[type="radio"] {
  accent-color: var(--primary-text);
}

input[type="checkbox"] {
  accent-color: var(--primary-text);
}

.search-submit-button{
    width: 100%;
    color: #FFFFFF;
    background: #402489;
    padding: 5px;
}

.single-add-to-cart{
    background: var(--white-background)!important;
    width: 100%;
    color: var(--primary-text);
    border: 2px solid var(--primary-background);
}

.single-add-to-cart:hover{
    background: #402489!important;
    color: #FFFFFF;
    border: 2px solid #402489;
}


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

.primary-background{
background: var(--primary-background);    
}

.secondary-background{
background: var(--secondary-background);    
}

.primary-background-hover{
background: #C2C0C1;
}

.primary-button{
background: var(--primary-background)!important;
color:var(--white-text);
text-align: center;
align-items: center;
width: 100%;
height: 50px;
}

.secondary-button{
background: var(--secondary-background)!important;
color:var(--white-text);
text-align: center;
align-items: center;
width: 100%;
height: 50px;
}

.primary-border-sm{
border: 1px solid var(--primary-border);
}

.primary-border-md{
border: 2px solid var(--primary-border);
}

.primary-border-lg{
border: 3px solid var(--primary-border);
}

.primary-border-xl{
border: 5px solid var(--primary-border);
}


.checkout-background{
background:var(--checkout-background);
}

.checkout-background:hover{
background:var(--checkout-background-hover);
}

.footer-background{
background:var(--footer-background);
}

.list-item-background{
background:var(--list-item-background);
}

.checkout-continue{
background: #402489;    
}

.homepage-features{
background: var(--homepage-features);
}

.homepage-features-text{
color: var(--homepage-features);
}


.bg-yellow-squarepancake{
background: var(--yellow-background);
}

.yellow-text{
  color:var(--yellow-text);
}

.bg-tea-squarepancake{
  background: var(--tea-background);
}

.bg-tea-squarepancake-100{
  background: var(--tea-background-100);
}

.tea-text{
  color:var(--tea-text);
}

.bg-green-squarepancake{
  background: var(--green-background);
}

.green-text{
  color:var(--green-text);
}


.bg-blue-squarepancake{
  background: var(--bg-blue-squarepancake);
}

.blue-text{
  color:var(--blue-text);
}

.bg-red-squarepancake{
  background: var(--red-background)
}

.red-text{
  color:var(--red-text);
}

.blue-border{
  border-color: var(--bg-blue-squarepancake)
}