/* Product tag badges on the shop's product images (loop and single product), SWMH_TE_Frontend_Tags.
   A badge's own colour is inlined per tag; #e53935 is SWMH_TE_Tag_Badges::DEFAULT_COLOR. */
.swmh-te-product-image-wrapper {
    position: relative;
    /* Own low stacking context: the badge overlay is trapped here at
       this level, so it can never rise above theme hover UI (add-to-cart
       bar, wishlist/quick-view icons) no matter how the card nests. */
    z-index: 0;
}

.swmh-te-product-tags {
    position: absolute;
    display: flex;
    flex-direction: column;
    /* Each badge hugs its own text - the column's default
       `stretch` would widen all badges to match the longest. */
    align-items: flex-start;
    gap: 4px;
    /* Catalog/loop overlay sits low so theme UI (quick-view, sale
       flashes, wishlist icons) can layer above it. */
    z-index: 5;
    /* Overlay only - never intercept clicks meant for the product
       link or the gallery lightbox underneath. */
    pointer-events: none;
    --swmh-te-badge-offset: 8px;
}

.swmh-te-product-tags--single {
    z-index: 100;
    --swmh-te-badge-offset: 12px;
}

.swmh-te-product-tags--pos-top-left {
    top: var(--swmh-te-badge-offset);
    left: var(--swmh-te-badge-offset);
}

.swmh-te-product-tags--pos-top-right {
    top: var(--swmh-te-badge-offset);
    right: var(--swmh-te-badge-offset);
    align-items: flex-end;
}

.swmh-te-product-tags--pos-bottom-left {
    bottom: var(--swmh-te-badge-offset);
    left: var(--swmh-te-badge-offset);
    flex-direction: column-reverse;
}

.swmh-te-product-tags--pos-bottom-right {
    bottom: var(--swmh-te-badge-offset);
    right: var(--swmh-te-badge-offset);
    flex-direction: column-reverse;
    align-items: flex-end;
}

.swmh-te-product-tag {
    display: inline-block;
    padding: 4px 10px;
    font-size: 11px;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.5px;
    color: #fff;
    background: #e53935;
    border-radius: 3px;
}

/* Positioning anchors for the relocated single-product overlay:
   the first gallery image when present, the gallery otherwise. */
.woocommerce-product-gallery,
.woocommerce-product-gallery__image {
    position: relative;
}