/*
 * Markething Herba — product loop CARD.
 *
 * Restyles Blocksy's WooCommerce cards (shop, category/tag archives, related
 * products, up-sells) to match the Elementor loop design: a single primary
 * category pill + ACF subtitle (injected by the Product_Card module via
 * Blocksy's title:before / title:after card hooks), a round red discount badge,
 * and a centered layout. Scoped to loop cards (li.product) so the single
 * product page (div.product) is untouched.
 */

/* Centered card content */
.woocommerce ul.products li.product,
ul.products li.product,
.related.products li.product,
.up-sells li.product {
  text-align: center !important;
  background: #fff !important;
  border-radius: 12px !important;
  overflow: hidden !important;
  padding: 0 16px 18px !important;
}

/* Media is the positioning context for the badge; full-bleed to the card edges */
li.product > figure {
  position: relative !important;
  margin: 0 -16px 12px !important;
}

/* Product image: 1:1 ratio, full image visible (never cropped) */
li.product .ct-media-container {
  aspect-ratio: 1 / 1 !important;
  background: #fff !important;
}
li.product .ct-media-container img,
li.product img.wp-post-image {
  width: 100% !important;
  height: 100% !important;
  aspect-ratio: 1 / 1 !important;
  object-fit: contain !important;
  background: #fff !important;
}

/* Discount badge -> red circle, top-right of the image */
li.product > figure .ct-woo-badges {
  position: absolute !important;
  top: 12px !important;
  right: 12px !important;
  left: auto !important;
  margin: 0 !important;
  z-index: 2 !important;
}
li.product > figure .ct-woo-badges .onsale {
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  box-sizing: border-box !important;
  width: 52px !important;
  height: 52px !important;
  min-width: 0 !important;
  padding: 0 !important;
  border-radius: 50% !important;
  background: #b3261e !important;
  color: #fff !important;
  font-size: 15px !important;
  font-weight: 700 !important;
  line-height: 1 !important;
}

/* Category pill (above the title) */
li.product .mh-card-category {
  margin: 4px 0 6px !important;
  line-height: 1 !important;
}

/* Subtitle (below the title, above the price) */
li.product .mh-card-subtitle {
  margin: 4px 0 8px !important;
  font-family: "Santral", sans-serif !important;
  font-size: 14px !important;
  font-weight: 400 !important;
  line-height: 1.4 !important;
  letter-spacing: -0.2px !important;
  color: #6f6670 !important;
}

/* Hide Blocksy's all-categories meta list (replaced by the single pill) */
li.product .entry-meta,
li.product ul.entry-meta,
li.product .meta-categories {
  display: none !important;
}

/* Title */
li.product .woocommerce-loop-product__title {
  font-weight: 700 !important;
  color: #2d202b !important;
}

/* Price */
li.product .price,
li.product .price .woocommerce-Price-amount {
  color: #2d202b !important;
  font-weight: 700 !important;
}

/* Button (kept on catalog cards) */
li.product .ct-woo-card-actions {
  justify-content: center !important;
}
li.product .ct-woo-card-actions .button,
li.product .button.add_to_cart_button {
  border-radius: 7px !important;
}