.badge-overlay {
    position: absolute;
    left: 0%;
    top: 0px;
    width: 100%;
    height: 100%;
    overflow: hidden;
    pointer-events: none;
    z-index: 10;
    -webkit-transition: width 1s ease, height 1s ease;
    -moz-transition: width 1s ease, height 1s ease;
    -o-transition: width 1s ease, height 1s ease;
    transition: width 0.4s ease, height 0.4s ease
}

.badge {
    margin: 0;
    padding: 0;
    color: #FFF;
    padding: 10px 10px;
    font-size: 15px;
    font-family: Arial, Helvetica, sans-serif;
    text-align: center;
    line-height: normal;
    text-transform: uppercase;
    background: #333;
}

.badge.badge-shape-rounded {
    border-radius: 18px;
}

.badge.badge-shape-pill {
    border-radius: 999px;
}

.badge.badge-shape-circle {
    min-width: 72px;
    min-height: 72px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border-radius: 999px;
    padding: 10px;
}

.badge.badge-shape-diamond {
    clip-path: polygon(50% 0%, 100% 50%, 50% 100%, 0% 50%);
    padding: 18px 20px;
}

.badge.badge-shape-diamond::before,
.badge.badge-shape-diamond::after {
    display: none;
}

.badge.badge-shape-star {
    clip-path: polygon(50% 0%, 61% 35%, 98% 35%, 68% 57%, 79% 91%, 50% 70%, 21% 91%, 32% 57%, 2% 35%, 39% 35%);
    padding: 22px 18px;
}

.badge.badge-shape-hexagon {
    clip-path: polygon(25% 0%, 75% 0%, 100% 50%, 75% 100%, 25% 100%, 0% 50%);
    padding: 16px 20px;
}

.badge.badge-shape-ticket {
    clip-path: polygon(0 0, 100% 0, 100% 28%, 92% 36%, 100% 44%, 100% 100%, 0 100%, 0 44%, 8% 36%, 0 28%);
    padding: 14px 18px;
}

.badge.badge-shape-bookmark {
    clip-path: polygon(0 0, 100% 0, 100% 100%, 50% 78%, 0 100%);
    padding: 12px 16px 18px;
}

.badge.badge-shape-burst {
    clip-path: polygon(50% 0%, 62% 12%, 78% 4%, 82% 20%, 98% 18%, 90% 34%, 100% 50%, 90% 66%, 98% 82%, 82% 80%, 78% 96%, 62% 88%, 50% 100%, 38% 88%, 22% 96%, 18% 80%, 2% 82%, 10% 66%, 0% 50%, 10% 34%, 2% 18%, 18% 20%, 22% 4%, 38% 12%);
    padding: 20px 18px;
}

.badge.badge-shape-circle::before,
.badge.badge-shape-circle::after,
.badge.badge-shape-diamond::before,
.badge.badge-shape-diamond::after,
.badge.badge-shape-star::before,
.badge.badge-shape-star::after,
.badge.badge-shape-hexagon::before,
.badge.badge-shape-hexagon::after,
.badge.badge-shape-ticket::before,
.badge.badge-shape-ticket::after,
.badge.badge-shape-bookmark::before,
.badge.badge-shape-bookmark::after,
.badge.badge-shape-burst::before,
.badge.badge-shape-burst::after {
    display: none;
}

.badge:not(.left):not(.right)::before, .badge:not(.left):not(.right)::after {
    content: '';
    position: absolute;
    top: 0;
    margin: 0 -1px;
    width: 100%;
    height: 100%;
    background: inherit;
    min-width: 55px
}

.badge::before {
    right: 100%
}

.badge::after {
    left: 100%
}

/* ================== Badge Position CSS ========================*/
.badge.left-top {
    position: absolute;
    top: 0;
    left: 0;
    -ms-transform: translateX(-30%) translateY(0%) rotate(-45deg);
    -webkit-transform: translateX(-30%) translateY(0%) rotate(-45deg);
    transform: translateX(-30%) translateY(0%) rotate(-45deg);
    -ms-transform-origin: top right;
    -webkit-transform-origin: top right;
    transform-origin: top right;
}

.badge.right-top {
    position: absolute;
    top: 0;
    right: 0;
    -ms-transform: translateX(30%) translateY(0%) rotate(45deg);
    -webkit-transform: translateX(30%) translateY(0%) rotate(45deg);
    transform: translateX(30%) translateY(0%) rotate(45deg);
    -ms-transform-origin: top left;
    -webkit-transform-origin: top left;
    transform-origin: top left;
}

.badge.left-bottom {
    position: absolute;
    bottom: 0;
    left: 0;
    -ms-transform: translateX(-30%) translateY(0%) rotate(45deg);
    -webkit-transform: translateX(-30%) translateY(0%) rotate(45deg);
    transform: translateX(-30%) translateY(0%) rotate(45deg);
    -ms-transform-origin: bottom right;
    -webkit-transform-origin: bottom right;
    transform-origin: bottom right;
}

.badge.right-bottom {
    position: absolute;
    bottom: 0;
    right: 0;
    -ms-transform: translateX(30%) translateY(0%) rotate(-45deg);
    -webkit-transform: translateX(30%) translateY(0%) rotate(-45deg);
    transform: translateX(30%) translateY(0%) rotate(-45deg);
    -ms-transform-origin: bottom left;
    -webkit-transform-origin: bottom left;
    transform-origin: bottom left;
}

.badge.top {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    text-align: center;
}

.badge.top-left {
    position: absolute;
    top: 12px;
    left: 12px;
}

.badge.top-right {
    position: absolute;
    top: 12px;
    right: 12px;
}

.badge.center {
    position: absolute;
    top: 50%;
    left: 0;
    width: 100%;
    text-align: center;
    -ms-transform: translateX(0%) translateY(-50%) rotate(0deg);
    -webkit-transform: translateX(0%) translateY(-50%) rotate(0deg);
    transform: translateX(0%) translateY(-50%) rotate(0deg);
}

.badge.center-left {
    position: absolute;
    top: 50%;
    left: 12px;
    -ms-transform: translateY(-50%);
    -webkit-transform: translateY(-50%);
    transform: translateY(-50%);
}

.badge.center-right {
    position: absolute;
    top: 50%;
    right: 12px;
    -ms-transform: translateY(-50%);
    -webkit-transform: translateY(-50%);
    transform: translateY(-50%);
}

.badge.bottom {
    position: absolute;
    bottom: 0;
    left: 0;
    width: 100%;
    text-align: center;
}

.badge.bottom-left {
    position: absolute;
    bottom: 12px;
    left: 12px;
}

.badge.bottom-right {
    position: absolute;
    bottom: 12px;
    right: 12px;
}

.badge.left {
    position: absolute;
    top: 0;
    left: 0;
    width: 38px;
    height: 100%;
    text-align: center;
    writing-mode: vertical-lr;
}

.badge.right {
    position: absolute;
    top: 0;
    right: 0;
    width: 38px;
    height: 100%;
    text-align: center;
    writing-mode: vertical-lr;
}

/*Theme Astra Fix Product*/
body.theme-astra.woocommerce div.product div.images .with-badges:first-child .woocommerce-product-gallery__image:nth-child(n+2) {
    width: auto;
}
/** Mini Cart */
.woocommerce-mini-cart .badge-position, .widget_recently_viewed_products .badge-position {
    position: unset !important;
}
.woocommerce-mini-cart .badge-position .badge-overlay, .widget_recently_viewed_products .badge-position .badge-overlay {
    display: none;
}
