.badge {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  position: relative;
  flex-shrink: 0;
}

.badge.big {
  width: 31px;
  height: 35px;
}

.badge.small {
  width: 26.88px;
  height: 30.35px;
}

@media (max-width: 500px) {
  .badge.small {
    width: 18.11px;
    height: 20.44px;
  }
}

.badge.new {
  background-image: url('/img/newBadge.webp');
  background-size: contain;
  background-repeat: no-repeat;
  background-position: center;
  padding-bottom: 3px;
}

.badge.sale {
  background-image: url('/img/saleBadge.webp');
  background-size: contain;
  background-repeat: no-repeat;
  background-position: center;
}

.badge-text {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 100%;
  height: 100%;
  font-family: 'Inter', sans-serif;
  font-size: 10px;
  font-weight: 800;
  line-height: 100%;
  color: white;
}

.badge.big .badge-text {
  font-size: 12px;
}

@media (max-width: 500px) {
  .badge-text {
      font-size: 7px;
  }
}

.badge.top {
  background-image: url('/img/topBadge.webp');
  background-size: contain;
  background-repeat: no-repeat;
  background-position: center;
}

.catalogSystem-card__badges {
  display: flex;
  gap: 8.67px;
  margin-left: 23px;
  margin-top: -1px;
  position: absolute;
}

@media (max-width: 500px) {
  .catalogSystem-card__badges {
    gap: 5px;
    margin-left: 12px;
  }
}

.product-page-badges {
  display: flex;
  gap: 10px;
  position: absolute;
  left: 22px;
  z-index: 10;
}