/**
 * Header cart icon + live count bubble.
 * Enqueued site-wide (the header renders on every page). Reuses the header's
 * .call-now / .secondary-btn treatment so it matches the phone icon beside it.
 */
.ssm-cart-link {
  position: relative;
  display: inline-flex !important;
  align-items: center;
  justify-content: center;
  vertical-align: middle;
}
.ssm-cart-link .icon-cart {
  width: 24px;
  height: 24px;
  display: block;
  /* Explicit dark stroke: the button sits on a light ground, and the
     inherited currentColor was resolving light (invisible). Override the
     snippet's .follow-banner .icon:not(.icon-phone){fill:white} too. */
  fill: none !important;
  stroke: #2b2426 !important;
  stroke-width: 1.7;
}

/* Match the phone button's footprint in the fixed Follow-Us bar */
.follow-banner .follow-block.right .ssm-cart-link {
  padding: .5rem .35rem;
}

/* Item-count bubble */
.ssm-cart-link .ssm-cart-count {
  position: absolute;
  top: -2px;
  right: -2px;
  min-width: 18px;
  height: 18px;
  padding: 0 4px;
  border-radius: 999px;
  background: #6E3C4C;              /* brand dark-purple / maroon */
  color: #fff;
  font-family: 'Miriam Libre', 'Poppins', sans-serif;
  font-size: 10px;
  font-weight: 700;
  line-height: 18px;
  text-align: center;
  box-shadow: 0 1px 3px rgba(56, 21, 32, .4);
  pointer-events: none;
}
/* Hide the bubble when the cart is empty */
.ssm-cart-link .ssm-cart-count[data-count="0"] { display: none; }

/* If the surrounding header buttons use a maroon ground, flip the bubble for contrast */
.nav--maroon .ssm-cart-link .ssm-cart-count,
.block--dark .ssm-cart-link .ssm-cart-count {
  background: #fff;
  color: #6E3C4C;
}