.product-ribbons {
    pointer-events: none;
    position: absolute;
    inset: 0;
    z-index: 5;
}

.product-ribbons--details {
    position: relative;
    inset: auto;
    margin-bottom: 0.5rem;
}

.product-ribbon {
    position: absolute;
    padding: 4px 10px;
    font-size: 12px;
    font-weight: 600;
    color: #fff;
    background: #d93b3b;
    border-radius: 2px;
    line-height: 1.2;
    white-space: nowrap;
    pointer-events: auto;
    box-shadow: 0 1px 3px rgba(0,0,0,0.15);
}

.product-ribbons--details .product-ribbon {
    position: relative;
    display: inline-block;
    margin-right: 4px;
}

.product-ribbon--top-left { top: 8px; left: 8px; }
.product-ribbon--top-right { top: 8px; right: 8px; }
.product-ribbon--center { top: 50%; left: 50%; transform: translate(-50%, -50%); }
.product-ribbon--bottom-left { bottom: 8px; left: 8px; }
.product-ribbon--bottom-right { bottom: 8px; right: 8px; }

.product-item { position: relative; }