/* PP Ribbon — Front-end Styles */

/* ── Shop/category loop ribbon ── */
.pp-ribbon-tag {
    position: absolute;
    top: 12px;
    left: 0;
    display: inline-block;
    padding: 5px 12px 5px 10px;
    border-radius: 0 20px 20px 0;
    font-size: 0.7rem;
    font-weight: 700;
    letter-spacing: 0.06em;
    text-transform: uppercase;
    white-space: nowrap;
    z-index: 10;
    pointer-events: none;
    box-shadow: 0 2px 8px rgba(0,0,0,0.15);
    line-height: 1;
}

/* Ensure the image link wrapper is relative so ribbon positions correctly */
.woocommerce-loop-image-link {
    position: relative;
    display: block;
}

/* ── Single product page ribbon ── */
.pp-ribbon-tag--product {
    position: absolute;
    top: 16px;
    left: 0;
    border-radius: 0 24px 24px 0;
    font-size: 0.75rem;
    padding: 7px 16px 7px 12px;
    z-index: 10;
    pointer-events: none;
    box-shadow: 0 2px 10px rgba(0,0,0,0.15);
}

/* The product image wrapper on single product needs position:relative */
.woocommerce-product-gallery {
    position: relative;
}