/******************** WooCommerce Styling ********************/

.wc-block-mini-cart__badge {
  background: var(--wp--preset--color--accent) !important;

  font-size: 10px;
  font-weight: 600;
  height: 16px;
  justify-content: center;
  left: 100%;
  margin-left: -50%;
  min-width: 1.4285714286em;
  padding: 0.25em;
  position: absolute;
  transform: translateY(-50%);
  white-space: nowrap;
  z-index: 1;
}

/* Replace WooCommerce cart icon */
.wc-block-mini-cart__icon {
  display: none !important;
}

.wc-block-mini-cart__quantity-badge::before {
  content: '';
  display: inline-block;
  width: 22px;
  height: 22px;
  background-image: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="%23000000" stroke-width="1.3" stroke-linecap="round" stroke-linejoin="round"><path d="M6 2L3 6v14a2 2 0 0 0 2 2h14a2 2 0 0 0 2-2V6l-3-4z"></path><line x1="3" y1="6" x2="21" y2="6"></line><path d="m16 10a4 4 0 0 1-8 0"></path></svg>') !important;
  background-size: contain;
  background-repeat: no-repeat;
  background-position: center;
}

/* Dark mode cart icon */
html.theme-dark .wc-block-mini-cart__quantity-badge::before,
body.theme-dark .wc-block-mini-cart__quantity-badge::before,
.theme-dark .wc-block-mini-cart__quantity-badge::before {
  background-image: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="%23ffffff" stroke-width="1.3" stroke-linecap="round" stroke-linejoin="round"><path d="M6 2L3 6v14a2 2 0 0 0 2 2h14a2 2 0 0 0 2-2V6l-3-4z"></path><line x1="3" y1="6" x2="21" y2="6"></line><path d="m16 10a4 4 0 0 1-8 0"></path></svg>') !important;
}

/* Ensure the quantity badge container displays as flex for proper alignment */
.wc-block-mini-cart__quantity-badge {
  display: flex !important;
  align-items: center !important;
}

.wc-block-mini-cart__button {
  padding: 6px 8px 7px 8px;
}