/* Etiqueta "Oferta Grupal" en loops (tienda, categorías, relacionados) — estilo tipo Shopify (píldora + gradiente) */

/* IMPORTANTE: El badge debe estar dentro de un contenedor con position:relative */
/* Asegurar que los productos tengan posición relativa */
.woocommerce ul.products li.product,
.woocommerce-page ul.products li.product,
.woocommerce .products .product,
.woocommerce-page .products .product,
.wc-block-product,
.wc-block-grid__product {
	position: relative !important;
}

/* Contenedor: solo imagen + badge (referencia para position:absolute) */
.woocommerce ul.products li.product .tuko-loop-product-visual,
.woocommerce-page ul.products li.product .tuko-loop-product-visual,
.woocommerce .products .product .tuko-loop-product-visual,
.woocommerce-page .products .product .tuko-loop-product-visual,
.wc-block-product .tuko-loop-product-visual,
.wc-block-grid__product .tuko-loop-product-visual {
	position: relative !important;
	display: block;
	width: 100%;
	overflow: hidden;
	/* Hereda radios típicos de tarjeta si el tema los pone en la imagen */
	border-radius: inherit;
}

/* Imagen ocupa el ancho del contenedor */
.woocommerce ul.products li.product .tuko-loop-product-visual img,
.woocommerce-page ul.products li.product .tuko-loop-product-visual img,
.woocommerce .products .product .tuko-loop-product-visual img,
.woocommerce-page .products .product .tuko-loop-product-visual img,
.wc-block-product .tuko-loop-product-visual img,
.wc-block-grid__product .tuko-loop-product-visual img {
	display: block;
	width: 100%;
	height: auto;
	vertical-align: middle;
}

/* Badge base: SOLO posicionamiento, sin top/right por defecto (se aplican en contextos específicos) */
.tuko-group-offer-badge {
	position: absolute;
	z-index: 5;
	/* Mismo gradiente que la etiqueta "Unido" del modal fullscreen (.tuko-fsp-corner-tag-joined) */
	background: linear-gradient(135deg, #7c3aed 0%, #4f46e5 100%);
	color: #ffffff;
	font-size: 0.625rem;
	font-weight: 700;
	line-height: 1.25;
	letter-spacing: 0.08em;
	text-transform: uppercase;
	padding: 0.4rem 0.75rem 0.4rem 0.85rem;
	/* Píldora / cápsula */
	border-radius: 9999px;
	box-shadow: 0 2px 8px rgba(124, 58, 237, 0.25);
	white-space: nowrap;
	pointer-events: none;
	font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
	-webkit-font-smoothing: antialiased;
}

@media (min-width: 480px) {
	.tuko-group-offer-badge {
		font-size: 0.6875rem;
		padding: 0.45rem 0.85rem 0.45rem 0.95rem;
	}
}

/* Fallback: productos Tuko sin wrap (temas muy personalizados) */
.woocommerce ul.products li.product .woocommerce-loop-product__link,
.woocommerce-page ul.products li.product .woocommerce-loop-product__link,
.woocommerce .products .product .woocommerce-loop-product__link,
.woocommerce-page .products .product .woocommerce-loop-product__link {
	position: relative;
	display: block;
}

/* Badge dentro del anchor pero fuera del wrap: anclar arriba-derecha del enlace */
.woocommerce ul.products li.product .woocommerce-loop-product__link > .tuko-group-offer-badge,
.woocommerce-page ul.products li.product .woocommerce-loop-product__link > .tuko-group-offer-badge,
.woocommerce .products .product .woocommerce-loop-product__link > .tuko-group-offer-badge,
.woocommerce-page .products .product .woocommerce-loop-product__link > .tuko-group-offer-badge {
	top: 0.625rem;
	right: 0.625rem;
}

/* Con wrap: posición respecto a la zona de imagen */
.woocommerce ul.products li.product .tuko-loop-product-visual .tuko-group-offer-badge,
.woocommerce-page ul.products li.product .tuko-loop-product-visual .tuko-group-offer-badge,
.woocommerce .products .product .tuko-loop-product-visual .tuko-group-offer-badge,
.woocommerce-page .products .product .tuko-loop-product-visual .tuko-group-offer-badge {
	top: 0.625rem;
	right: 0.625rem;
}

/* WooCommerce Blocks: productos renderizados por bloques */
.wc-block-product,
.wc-block-grid__product {
	position: relative !important;
}

.wc-block-product .tuko-loop-product-visual,
.wc-block-grid__products .wc-block-product .tuko-loop-product-visual,
.wc-block-grid__product .tuko-loop-product-visual {
	position: relative !important;
	display: block;
	width: 100%;
	overflow: hidden;
}

/* Badge dentro del contenedor visual del bloque */
.wc-block-product .tuko-loop-product-visual .tuko-group-offer-badge,
.wc-block-grid__products .wc-block-product .tuko-loop-product-visual .tuko-group-offer-badge,
.wc-block-grid__product .tuko-loop-product-visual .tuko-group-offer-badge {
	top: 0.625rem;
	right: 0.625rem;
}

/* Si el badge está directamente en el contenedor de imagen del bloque (sin wrap) */
.wc-block-product__image,
.wp-block-woocommerce-product-image,
.wc-block-grid__product-link,
.wc-block-product a {
	position: relative !important;
}

.wc-block-product__image .tuko-group-offer-badge,
.wp-block-woocommerce-product-image .tuko-group-offer-badge,
.wc-block-grid__product-link .tuko-group-offer-badge,
.wc-block-product a .tuko-group-offer-badge {
	top: 0.625rem;
	right: 0.625rem;
}

/* Si el badge está directamente en el <li> del bloque (último recurso) */
.wc-block-product > .tuko-group-offer-badge,
.wc-block-grid__product > .tuko-group-offer-badge {
	top: 0.625rem;
	right: 0.625rem;
}