/**
 * WC Badge Agotado — estilos del frontal.
 *
 * Los valores configurables llegan como variables CSS inyectadas con
 * wp_add_inline_style (ver WCBA\Frontend\Assets::dynamic_css).
 *
 * Anclaje: el badge SIEMPRE vive dentro de un contenedor que envuelve la
 * imagen real (span.wcba-media en listados, div.woocommerce-product-gallery__image
 * en la ficha), de modo que las posiciones preestablecidas se calculan sobre
 * la foto y se ven igual en cualquier tamaño y resolución.
 */

/* Ancla de la miniatura en listados: envuelve exactamente la imagen. */
.wcba-media {
	position: relative;
	display: block;
}

/* Ancla en la ficha: el badge se inyecta dentro del primer item de la galería. */
.woocommerce-product-gallery__image {
	position: relative;
}

.wcba-badge {
	/* Separación proporcional a la foto, con tope: en miniaturas pequeñas
	   queda pegado (4%) y en fotos grandes no se aleja más de 8px del borde. */
	--wcba-inset: min(8px, 4%);

	position: absolute;
	z-index: 30;
	display: inline-block;
	box-sizing: border-box;
	max-width: calc(100% - (var(--wcba-inset) * 2));
	padding: var(--wcba-padding, 4px 10px);
	background: var(--wcba-bg, #d63638);
	color: var(--wcba-color, #fff);
	font-family: var(--wcba-font, inherit);
	font-size: var(--wcba-size, 12px);
	font-weight: var(--wcba-weight, 700);
	line-height: 1.2;
	letter-spacing: 0.02em;
	text-align: center;
	text-transform: none;
	white-space: nowrap;
	overflow: hidden;
	text-overflow: ellipsis;
	pointer-events: none; /* no bloquea el clic sobre el producto */
}

/* En la ficha, por encima del disparador de zoom de la galería (z-index 9). */
.wcba-badge--single {
	z-index: 31;
}

/* ---- Posiciones preestablecidas ---- */

.wcba-pos-top-left {
	top: var(--wcba-inset);
	left: var(--wcba-inset);
}

.wcba-pos-top-center {
	top: var(--wcba-inset);
	left: 50%;
	transform: translateX(-50%);
}

.wcba-pos-top-right {
	top: var(--wcba-inset);
	right: var(--wcba-inset);
}

.wcba-pos-center-left {
	top: 50%;
	left: var(--wcba-inset);
	transform: translateY(-50%);
}

.wcba-pos-center {
	top: 50%;
	left: 50%;
	transform: translate(-50%, -50%);
}

.wcba-pos-center-right {
	top: 50%;
	right: var(--wcba-inset);
	transform: translateY(-50%);
}

.wcba-pos-bottom-left {
	bottom: var(--wcba-inset);
	left: var(--wcba-inset);
}

.wcba-pos-bottom-center {
	bottom: var(--wcba-inset);
	left: 50%;
	transform: translateX(-50%);
}

.wcba-pos-bottom-right {
	bottom: var(--wcba-inset);
	right: var(--wcba-inset);
}

/* ---- Formas ---- */

.wcba-badge--rect {
	border-radius: 0;
}

.wcba-badge--rounded {
	border-radius: var(--wcba-radius, 4px);
}

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

/* Cinta diagonal: contenedor recortado en la esquina superior izquierda
   con la banda rotada -45º. Siempre anclada arriba a la izquierda. */
.wcba-badge--ribbon {
	top: 0;
	left: 0;
	right: auto;
	bottom: auto;
	transform: none;
	width: 110px;
	height: 110px;
	max-width: none;
	padding: 0;
	background: transparent;
	border-radius: 0;
	overflow: hidden;
	white-space: normal;
}

.wcba-badge--ribbon .wcba-badge__inner {
	position: absolute;
	top: 28px;
	left: -40px;
	display: block;
	width: 160px;
	padding: var(--wcba-padding, 4px 10px);
	background: var(--wcba-bg, #d63638);
	text-align: center;
	white-space: nowrap;
	overflow: hidden;
	text-overflow: ellipsis;
	transform: rotate(-45deg);
	box-shadow: 0 1px 3px rgba(0, 0, 0, 0.25);
}

/* ---- Sugerencias de FiboSearch ---- */

/* Motor nativo (gratuito): badge en miniatura de la sugerencia. */
.wcba-fibo-thumb {
	position: relative;
	display: block;
}

.wcba-badge--fibo {
	top: 2px;
	left: 2px;
	right: auto;
	bottom: auto;
	transform: none;
	z-index: 5;
	max-width: calc(100% - 4px);
	padding: 1px 4px;
	font-size: 8px;
	line-height: 1.2;
	border-radius: 2px;
}

/* Chip inline del motor Pro: va delante del nombre del producto
   (hueco title_before de la sugerencia), no sobre la miniatura. */
.wcba-badge--fibo-chip {
	position: static;
	display: inline-block;
	max-width: none;
	transform: none;
	margin-right: 5px;
	padding: 1px 5px;
	font-size: 9px;
	line-height: 1.3;
	border-radius: 2px;
	vertical-align: middle;
	white-space: nowrap;
}

/* ---- Responsive ---- */

@media (max-width: 480px) {
	.wcba-badge {
		font-size: min(var(--wcba-size, 12px), 11px);
	}

	.wcba-badge--ribbon {
		width: 88px;
		height: 88px;
	}

	.wcba-badge--ribbon .wcba-badge__inner {
		top: 20px;
		left: -46px;
		width: 150px;
	}
}