/* CM HotSale Badge — Frontend CSS */

/* Contenedor padre debe ser relative */
.woocommerce ul.products li.product,
.woocommerce-page ul.products li.product {
    position: relative;
}

/* Badge base */
.cm-hotsale-badge {
    position: absolute;
    z-index: 10;
    pointer-events: none;
    line-height: 0;
}

/* Posiciones — loop */
.cm-hotsale-badge.cm-hotsale-top-left     { top: 8px;  left: 8px;  }
.cm-hotsale-badge.cm-hotsale-top-center   { top: 8px;  left: 50%; transform: translateX(-50%); }
.cm-hotsale-badge.cm-hotsale-top-right    { top: 8px;  right: 8px; }
.cm-hotsale-badge.cm-hotsale-center-left  { top: 50%;  left: 8px;  transform: translateY(-50%); }
.cm-hotsale-badge.cm-hotsale-center       { top: 50%;  left: 50%;  transform: translate(-50%,-50%); }
.cm-hotsale-badge.cm-hotsale-center-right { top: 50%;  right: 8px; transform: translateY(-50%); }
.cm-hotsale-badge.cm-hotsale-bottom-left  { bottom: 8px; left: 8px;  }
.cm-hotsale-badge.cm-hotsale-bottom-center{ bottom: 8px; left: 50%;  transform: translateX(-50%); }
.cm-hotsale-badge.cm-hotsale-bottom-right { bottom: 8px; right: 8px; }

.cm-hotsale-badge img {
    display: block;
    max-width: none; /* evitar que el tema lo encoja */
    height: auto;
    border: none;
    box-shadow: none;
    background: transparent;
}

/* Producto single: wrapper relativo en la imagen */
.woocommerce div.product div.images {
    position: relative;
}

/* Entrada suave */
.cm-hotsale-badge {
    animation: cmHsBadgeIn .35s cubic-bezier(.22,.61,.36,1) both;
}
@keyframes cmHsBadgeIn {
    from { opacity: 0; transform: scale(.7); }
    to   { opacity: 1; transform: scale(1); }
}

/* Ajuste para badges en top-center/bottom-center del single para no romper el transform */
.woocommerce div.product div.images .cm-hotsale-badge.cm-hotsale-top-center {
    transform: translateX(-50%);
}
.woocommerce div.product div.images .cm-hotsale-badge.cm-hotsale-bottom-center {
    transform: translateX(-50%);
}
.woocommerce div.product div.images .cm-hotsale-badge.cm-hotsale-center {
    transform: translate(-50%,-50%);
}