.badgeContainer {
  position: absolute;
  top: 10px;
  display: flex;
  z-index: 1;
}

.cardBadge {
  border-radius: 15px;
  color: #FFFFFF;
  margin-left: 10px;
  padding: 1px 10px;
	&__percentage {
		vertical-align: middle;
	}
  &--discount {
	  	@include medium-weight;
		background: $brand-red;
		border-radius: 0 15px 15px 0;
		margin-left: 0;
	  	min-width: 70px;
  }
  &--extraInfo {
		@include medium-weight;
		background: $brand-navy;
  }
  &--green {
		background: $brand-green;
  }
  &--popular {
		background: $interactive-color;
  }
	&--endTime {
		background: $brand-red;
		border-radius: 15px 0 0 15px;
		position: absolute;
		right: 0;
	}
  span {
		vertical-align: middle;
  }
  svg, svg * {
		width: 14px;
		height: 14px;
		fill: #FFFFFF;
		vertical-align: middle;
  }
}