/* Učini da kontejner oko slike bude "position:relative" (potrebno za absolute labels) */
.woocommerce ul.products li.product .woocommerce-LoopProduct-link,
.woocommerce ul.products li.product .product-element-top,
.woocommerce ul.products li.product .product-image,
.woocommerce ul.products li.product .product-image-wrapper,
.woocommerce ul.products li.product .wd-product-thumb,
.woocommerce ul.products li.product .wd-product,
.woocommerce div.product div.images,
.woocommerce div.product .woocommerce-product-gallery {
  position: relative;
}

/* Wrap za više labela */
.ai-pl-wrap{
  position:absolute;
  top:0; left:0;
  width:100%;
  height:100%;
  pointer-events:none;
  z-index: 9;
}

/* Labela */
.ai-pl-label{
  position:absolute;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  font-weight:700;
  line-height:1;
  background: var(--ai-pl-bg);
  color: var(--ai-pl-color);
  font-size: var(--ai-pl-fs);
  border-radius: var(--ai-pl-radius);
  padding: calc((var(--ai-pl-pad, "6 10") * 1px)); /* fallback ako tema ignoriše */
  z-index: var(--ai-pl-z);
  white-space: nowrap;
  box-shadow: 0 6px 16px rgba(0,0,0,.12);
}

/* Pošto padding u "6 10" nije standardan preko CSS var, koristimo jednostavniji override: */
.ai-pl-label{ padding: 6px 10px; }
.ai-pl-label[style*="--ai-pl-pad:"]{
  /* Ne možemo direktno parsirati "6 10" bez JS-a, pa ostaje default.
     Ako želiš 100% kontrolu paddinga, reci mi – dodaću 2 polja: pad_y i pad_x. */
}

/* Pozicije + offseti */
.ai-pl-top_left{ top: var(--ai-pl-y); left: var(--ai-pl-x); }
.ai-pl-top_right{ top: var(--ai-pl-y); right: var(--ai-pl-x); }
.ai-pl-bottom_left{ bottom: var(--ai-pl-y); left: var(--ai-pl-x); }
.ai-pl-bottom_right{ bottom: var(--ai-pl-y); right: var(--ai-pl-x); }
.ai-pl-center{
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  margin-left: var(--ai-pl-x);
  margin-top: var(--ai-pl-y);
}
