@media (max-width: 1024px) {
  .woocommerce-notices-wrapper {
    padding: 0 1rem;
  }
}
.woocommerce-info,
.woocommerce-message,
.woocommerce-error {
  font: var(--font-body-small);
  border: none;
  color: var(--text);
  background-color: var(--background);
  border-radius: var(--radius);
  max-width: 1300px;
  margin: 1rem auto 0 auto;
}
.woocommerce-message::before {
  color: var(--primary);
}

.woocommerce-error a {
  color: var(--secondary-foreground);
}
.woocommerce-error::before {
  color: var(--destructive);
}
.woocommerce-message a {
  color: var(--accent-foreground);
  text-decoration: none;
  font: var(--font-body-small);
  margin-right: 0.2rem;
  background-color: var(--accent);
  padding: 0.2rem 0.8rem;
  border-radius: 5px;
  transition: all 0.3s;
}

.woocommerce-message a:hover {
  background-color: var(--e-global-color-primary);
  color: var(--primary-foreground);
}

.woocommerce-Price-amount.amount {
  color: var(--text);
}

.item-variations-wrapper {
  margin-right: 0.5rem;
}

.item-variation {
  margin-bottom: 0.25em;
  display: flex;
  gap: 4px;
}

.item-variation span {
  color: var(--muted-foreground) !important;
  font-weight: 500 !important;
  font-size: 0.8rem !important ;
}

.color-variation {
  display: flex;
}

.color-swatch {
  width: 18px;
  height: 18px;
  border-radius: 50%;
  border: 1px solid #ddd;
  box-shadow: var(--box-shadow);
  display: inline-block;
}

/*PRICE*/

.woocommerce:where(body:not(.woocommerce-uses-block-theme)) div.product p.price,
.woocommerce:where(body:not(.woocommerce-uses-block-theme)) div.product span.price {
  font-size: unset !important;
}

.woocommerce-variation-price {
  text-align: end;
  font: var(--font-title-4);
}
.price,
.simple-product-price {
  display: flex;
  flex-direction: column !important;
  gap: 0.5rem;
}
.simple-product-price p {
  margin: 0;
}
.woocommerce-Price-currencySymbol {
  font: var(--font-body-extra-small);
}

.discount-container {
  display: flex;
  flex-direction: row-reverse;
  gap: 0.5rem;
}
.discount-badge {
  display: flex;
  background-color: var(--destructive);
  color: var(--destructive-foreground);
  align-items: center;
  justify-content: center;
  gap: 0.25rem;
  font: var(--font-body-small);
  border-radius: var(--radius);
  padding: 0.05rem 0.25rem;
}

.price del,
.simple-product-price del,
.discount-container del {
  font: var(--font-body);
  text-decoration-style: dashed;
  text-decoration-color: var(--destructive);
}
.price ins,
.simple-product-price ins {
  font: var(--font-title-4);
  text-decoration: none;
  text-align: end;
}