.woocommerce ul.products li.product, 
.woocommerce-page ul.products li.product{
  overflow: unset;
}

.elegant-labels-woocommerce {
	display: flex;
	flex-wrap: wrap;
    flex-direction: row;
    position: absolute;
}

.elw-before-image {
	position: relative;
}

.elw-top-right {
  top: 0;
  right: 0;
  left: unset;
}
.elw-top-left {
  top: 0;
  left: 0;
  right: unset;
}
.elw-bottom-right{
  bottom: 0;
  right: 0;
  left: unset;
  top: unset;
}
.elw-bottom-left{
  bottom: 0;
  left: 0;
  right: unset;
  top: unset;
}

.elegant-badge {
    display: inline-block;
    padding: 5px 10px;
    border-radius: 4px;
    font-size: 12px;
    font-weight: 400;
    letter-spacing: 0.5px;
    line-height: 1.2;
    white-space: nowrap;
    z-index: 10;
    position: relative;
}

/* Image badge content sizing */
.elegant-badge-image .elegant-badge-image-content {
    max-width: 60px;
    max-height: 60px;
    width: auto;
    height: auto;
    display: block;
}

/* Mobile responsive image sizing */
@media (max-width: 768px) {
    .elegant-badge-image .elegant-badge-image-content {
        max-width: 40px;
        max-height: 40px;
    }
}

/* Product container positioning */
.woocommerce ul.products li.product {
    position: relative;
}

/* Loop badges positioning (shop/category pages) */
.elegant-badges-loop {
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    pointer-events: none;
    z-index: 5;
}

.elegant-badges-loop .elegant-badge {
    position: absolute;
    pointer-events: auto;
}

/* Gallery badges positioning (single product) */
.elegant-badges-gallery {
    position: relative;
    margin-bottom: 10px;
}

.elegant-badges-gallery .elegant-badge {
    margin-right: 10px;
    margin-bottom: 5px;
}

/* Details badges positioning (single product) */
.elegant-badges-details {
    margin-bottom: 15px;
}

.elegant-badges-details .elegant-badge {
    margin-right: 10px;
    margin-bottom: 5px;
}

/* Badge position classes */
.elegant-badge.elw-top-right {
    top: 0;
    right: 0;
}

.elegant-badge.elw-top-left {
    top: 0;
    left: 0;
}

.elegant-badge.elw-bottom-right {
    bottom: 0;
    right: 0;
}

.elegant-badge.elw-bottom-left {
    bottom: 0;
    left: 0;
}

/* Reset positioning for details badges */
.elegant-badges-details .elegant-badge {
    position: relative !important;
    top: auto !important;
    left: auto !important;
    right: auto !important;
    bottom: auto !important;
}

/* Absolute positioning for gallery badges */
.elegant-badges-gallery .elegant-badge {
    position: absolute;
}

/* Layout style variations */
.elegant-badge-label-one {
    border-radius: 4px;
}

.elegant-badge-label-two {
    border-radius: 20px;
}

.elegant-badge-label-three {
    border-radius: 0;
    transform: rotate(-2deg);
}


/* Mobile responsive styles */
@media (max-width: 768px) {
    .elegant-badge {
        font-size: 10px;
        padding: 3px 6px;
    }
    
    .elegant-badge.elw-top-right,
    .elegant-badge.elw-bottom-right {
        right: 5px;
    }
    
    .elegant-badge.elw-top-left,
    .elegant-badge.elw-bottom-left {
        left: 5px;
    }
    
    .elegant-badge.elw-top-right,
    .elegant-badge.elw-top-left {
        top: 5px;
    }
    
    .elegant-badge.elw-bottom-right,
    .elegant-badge.elw-bottom-left {
        bottom: 5px;
    }
    
    .elegant-badge-label-nine {
        width: 30px;
        height: 30px;
        font-size: 8px;
    }
}

/* Single product specific styles */
.single-product .elegant-badges-gallery {
    display: flex;
    position: absolute;
    top: 0px;
    bottom: auto;
    justify-content: flex-start;
    width: 100%;
    height: 100%;
}

.single-product .elegant-badges-details {
    border-bottom: 1px solid #eee;
    padding-bottom: 15px;
}

.elegant-badge-label-four {
  --r: .8em;
  border-block: .5em solid #0000;
  padding-inline: .5em calc(var(--r) + .25em);
  clip-path: polygon(100% 0,0 0,0 100%,100% 100%,100% calc(100% - .25em),calc(100% - var(--r)) 50%,100% .25em);
  background: radial-gradient(.2em 50% at left,#00000000,#0000) border-box, #FF6B6B padding-box; 
  width: fit-content;
}

.elegant-badge-label-four.elw-top-right,
.elegant-badge-label-four.elw-bottom-right {
  --r: .8em;  
  border-block: .5em solid #0000;
  padding-inline: calc(var(--r) + .25em) .5em;
  clip-path: polygon(0 0,100% 0,100% 100%,0 100%,0 calc(100% - .25em),var(--r) 50%,0 .25em);
  background:radial-gradient(.2em 50% at right,#00000000,#0000) border-box, #2699dc padding-box;
  width: fit-content;
}


.elegant-badge-label-five {
  --r: .8em; 
  border-block: .5em solid #0000;
  padding-inline: .5em calc(var(--r) + .25em);
  clip-path: polygon(100% 0,0 0,0 100%,100% 100%,calc(100% - var(--r)) calc(100% - .25em),100% 50%,calc(100% - var(--r)) .25em);
  background:    radial-gradient(.2em 50% at left,#00000000,#0000) border-box,   #45ADA8 padding-box; 
}


.elegant-badge-label-five.elw-top-right,
.elegant-badge-label-five.elw-bottom-right {
  --r: .8em;  
  border-block: .5em solid #0000;
  padding-inline: calc(var(--r) + .25em) .5em;
  clip-path: polygon(0 0,100% 0,100% 100%,0 100%,var(--r) calc(100% - .25em),0 50%,var(--r) .25em);
  background: radial-gradient(.2em 50% at right,#00000000,#0000) border-box, #BD1550 padding-box;
  width: fit-content;
}