/* Scoped to the module's own containers, never to all badges on a product page. */
.siberia-product-badges,
.siberia-badge-preview {
  --sb-color: #151515;
  --sb-background: transparent;
  --sb-border-color: #151515;
  --sb-border-width: 0px;
  --sb-border-style: solid;
  --sb-radius: 0px;
  --sb-size: 10px;
  --sb-weight: 600;
  --sb-transform: uppercase;
  --sb-spacing: 1.6px;
}

.siberia-product-badges {
  --sb-scale: 1;
  --sb-edge: 12px;
  position: absolute;
  top: var(--sb-edge);
  left: var(--sb-edge);
  right: var(--sb-edge);
  height: calc(var(--sb-image-height) - 2 * var(--sb-edge));
  aspect-ratio: 1;
  z-index: 10;
  display: flex;
  flex-direction: column;
  align-items: stretch;
  gap: 6px;
  margin: 0;
  padding: 0;
  pointer-events: none;
}

.siberia-badge-row,
.siberia-badge-group {
  display: flex;
  flex-direction: column;
  gap: inherit;
}

.siberia-badge-columns {
  display: flex;
  align-items: flex-start;
  gap: inherit;
}

.siberia-badge-group {
  flex: 1;
  min-width: 0;
  align-items: flex-start;
}

.siberia-badge-row--bottom {
  margin-top: auto;
}

.siberia-badge-row--bottom .siberia-badge-columns {
  align-items: flex-end;
}

.siberia-badge-group--right {
  align-items: flex-end;
}

.siberia-product-badges .siberia-badge-group--bottom [data-badge-source="stock"] {
  order: 1;
}

.siberia-product-badges .siberia-badge[data-badge-source="stock"] {
  padding-block: calc(3px * var(--sb-scale, 1));
}

.siberia-product-badges--loop [data-badge-source="stock"] {
  width: 100%;
}

.siberia-product-badges .siberia-badge,
.siberia-badge-preview .siberia-badge {
  position: relative;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  box-sizing: border-box;
  max-width: 100%;
  min-width: 0;
  padding: calc(1.5px * var(--sb-scale, 1)) calc(10px * var(--sb-scale, 1));
  margin: 0;
  border: 0;
  border-radius: calc(var(--sb-radius, 0px) * var(--sb-scale, 1));
  background: var(--sb-background, transparent);
  color: var(--sb-color, #151515);
  font-family: Montserrat, sans-serif;
  font-size: calc(var(--sb-size, 10px) * var(--sb-scale, 1));
  font-weight: var(--sb-weight, 600);
  line-height: 1.2;
  letter-spacing: calc(var(--sb-spacing, 1.6px) * var(--sb-scale, 1));
  text-transform: var(--sb-transform, uppercase);
  text-align: center;
  white-space: normal;
  overflow-wrap: anywhere;
}

/* Overlay the border so a thin outline doesn't change the badge's dimensions. */
.siberia-product-badges .siberia-badge::after,
.siberia-badge-preview .siberia-badge::after {
  content: '';
  position: absolute;
  inset: 0;
  border: var(--sb-border-width, 0px) var(--sb-border-style, solid) var(--sb-border-color, #151515);
  border-radius: inherit;
  pointer-events: none;
}

.siberia-badge-single-slot {
  position: absolute;
  inset: 12px 27px;
  z-index: 10;
  pointer-events: none;
}

.siberia-badge-gallery-host {
  position: relative;
}

.siberia-badge-single-slot .siberia-product-badges--single {
  position: relative;
  inset: auto;
  height: 100%;
  aspect-ratio: auto;
}

.siberia-product-badges--single.siberia-product-badges--large {
  --sb-scale: 1.25;
  gap: 7.5px;
}

/* The optional sticky wrapper is a positioning ancestor inside the gallery column. */
.siberia-sticky-gallery-wrap > .siberia-badge-single-slot {
  left: 12px;
  right: 12px;
}

.iconic-woothumbs-images-wrap > .siberia-badge-single-slot {
  inset: 12px;
}

@media (max-width: 767px) {
  .siberia-product-badges--loop {
    --sb-edge: 8px;
  }

  .siberia-badge-single-slot {
    top: 8px;
    bottom: 8px;
    left: 23px;
    right: 23px;
  }

  .iconic-woothumbs-images-wrap > .siberia-badge-single-slot {
    inset: 8px;
  }
}

/* All labels remain readable if a configured stack is taller than the image. */
.siberia-product-badges--loop.siberia-product-badges--flow {
  position: relative;
  inset: auto;
  box-sizing: border-box;
  padding: var(--sb-edge);
  height: auto;
  aspect-ratio: auto;
}

/* Overflowing top labels flow before the photo; bottom labels stay on the photo. */
.siberia-product-badges--flow .siberia-badge-row--bottom {
  position: absolute;
  left: var(--sb-edge);
  right: var(--sb-edge);
  bottom: calc(var(--sb-edge) - var(--sb-image-height));
}

.siberia-badge-preview {
  --sb-scale: 1;
  display: flex;
  align-items: flex-start;
  padding: 16px;
  max-width: 260px;
  min-height: 15px;
  background: repeating-conic-gradient(#eee 0% 25%, #fff 0% 50%) 0 / 16px 16px;
}

.siberia-badge-preview [data-preview-disabled] {
  margin-left: 12px;
  color: #50575e;
  font-size: 12px;
}

#siberia-badge-settings .siberia-badge-field-hidden {
  display: none;
}
