/**
 * Beneficio en el catálogo (fuera de /perfil/): badge en el listado de
 * tienda y aviso en la ficha de producto. Ambos se pintan SOLO para un
 * beneficiario logueado con convenio utilizable — ver class-wconv-catalogo.php.
 *
 * No hay tokens de color globales en el tema (astra-child/inc/css/walon-fonts.css
 * solo define tipografía: --w-font-body, --w-font-head, --w-wt-*), así que los
 * colores van directos, igual que en walon-badge-nuevo-settings.php y en
 * walon-pdp-benefits-natacion-tapones.php. El verde (#137A46) es el mismo que
 * ya usa walon-mi-cuenta para su estado "ok" (mi-cuenta.css --ok): reutilizado
 * aquí para que "ahorro/beneficio activo" tenga siempre el mismo color en todo
 * el sitio, cuenta y tienda por igual.
 */

/* ============ Badge en el listado (tienda / categoría) ============
 * Misma mecánica que .walon-badge--nuevo (posición absoluta sobre la tarjeta
 * de producto), esquina opuesta para que ambos badges puedan convivir sin
 * pisarse si un producto fuera nuevo y tuviera convenio a la vez.
 */
.woocommerce ul.products li.product {
	position: relative;
}

.walon-badge--convenio {
	position: absolute;
	top: 10px;
	right: 0;
	z-index: 50;
	padding: 5px 10px;
	background: #137A46;
	border-radius: 0;
	box-sizing: border-box;
	color: #fff;
	font-size: 12px;
	letter-spacing: 0.04em;
	line-height: 1;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	pointer-events: none;
	font-family: var(--w-font-body);
	font-weight: var(--w-wt-medium, 500);
}

@media (max-width: 544px) {
	.walon-badge--convenio {
		top: 8px;
		right: 0;
		padding: 4px 7px;
		font-size: 10px;
	}
}

/* ============ Aviso en la ficha de producto ============
 * Mismas medidas y familia tipográfica que la tarjeta de promo ya usada en
 * PDP (walon-swim-gift-card-v2): tarjeta blanca, borde suave, radio 10px.
 * Se distingue por un borde izquierdo verde en vez de una imagen, porque
 * aquí no hay foto que mostrar — es un dato (el % y el nombre del convenio).
 */
body.single-product .summary.entry-summary .wconv-pdp-aviso {
	display: block;
	width: 80%;
	max-width: 80%;
	margin: 12px 0 14px;
	padding: 10px 14px;
	background: #fff;
	border: 1px solid #e5e7eb;
	border-left: 3px solid #137A46;
	border-radius: 10px;
	box-shadow: 0 2px 10px rgba(7, 23, 47, .05);
	box-sizing: border-box;
	font-family: var(--w-font-body);
}

body.single-product .summary.entry-summary .wconv-pdp-aviso strong {
	display: block;
	margin: 0 0 3px;
	color: #137A46;
	font-family: var(--w-font-head);
	font-weight: var(--w-wt-heavy, 800);
	font-size: 13px;
	line-height: 1.5;
}

body.single-product .summary.entry-summary .wconv-pdp-aviso span {
	display: block;
	margin: 0;
	color: #6F6F6C;
	font-weight: var(--w-wt-medium, 500);
	font-size: 11px;
	line-height: 1.3;
}

/* El botón "añadir al carrito" no debe llevar el aviso pegado dentro de su
 * propia caja de variación — igual regla que ya aplica walon-swim-gift-card-v2
 * dentro de .woocommerce-variation-add-to-cart. */
body.single-product .summary.entry-summary .woocommerce-variation-add-to-cart .wconv-pdp-aviso {
	display: none;
}

@media (max-width: 921px) {
	body.single-product .summary.entry-summary .wconv-pdp-aviso {
		width: 100%;
		max-width: 100%;
	}
}