/* Cafés El Criollo – Product Badges
 *
 * WP ROCKET / Used CSS – safelist obligatoria (el CSS se carga en todo el front,
 * UCSS eliminará estos selectores en páginas sin badges si no están listados):
 *   .criollo-badges
 *   .criollo-badges--top-left
 *   .criollo-badges--top-right
 *   .criollo-badges--bottom-left
 *   .criollo-badges--bottom-right
 *   .criollo-badge
 */

/* Contenedores de anclaje.
   El badge se ancla al wrapper de la IMAGEN cuando existe (GeneratePress
   envuelve el thumbnail en .wc-product-image > .inside-wc-product-image),
   y cae a li.product como fallback en temas/loops que no lo generan. */
.woocommerce ul.products li.product,
.woocommerce-page ul.products li.product,
.wc-product-image,
.inside-wc-product-image,
.criollo-lm-thumb {
    position: relative;
}

.woocommerce-product-gallery,
.woocommerce-product-gallery__image,
.woocommerce-product-gallery__wrapper {
    position: relative;
}

.criollo-badges {
    position: absolute;
    z-index: 9;
    display: flex;
    flex-direction: column;
    gap: 4px;
    pointer-events: none;
    max-width: 60%;
}

.criollo-badges--top-left    { top: 10px;    left: 10px;  align-items: flex-start; }
.criollo-badges--top-right   { top: 10px;    right: 10px; align-items: flex-end;   }
.criollo-badges--bottom-left { bottom: 10px; left: 10px;  align-items: flex-start; }
.criollo-badges--bottom-right{ bottom: 10px; right: 10px; align-items: flex-end;   }

.criollo-badge {
    display: inline-block;
    padding: 5px 11px;
    font-size: 11px;
    font-weight: 700;
    line-height: 1.2;
    text-transform: uppercase;
    letter-spacing: 0.5px;
    border-radius: 2px;
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.15);
    white-space: nowrap;
}

@media (max-width: 768px) {
    .criollo-badge { font-size: 10px; padding: 4px 9px; }
}