/* =================================================================
   Jusa Kids — Promociones (frontend badges)
   ================================================================= */

/*
 * Las cocardas se inyectan dentro de .jk-card__media (position:relative)
 * vía JavaScript. El .jk-card__sale está en top:14px / left:14px / ~24px alto.
 * Posicionamos la cocarda justo debajo: top = 14 + 24 + 6 = 54px.
 */

/* ---- Badge base ---- */
.jkp-badge {
	display: inline-block;
	padding: 4px 10px;
	border-radius: 999px;
	font-size: 11px;
	font-weight: 800;
	line-height: 1.3;
	letter-spacing: 0.4px;
	text-transform: uppercase;
	white-space: nowrap;
	font-family: var(--jk-display, sans-serif);
}

/* ---- Badge dentro de la card del loop ---- */
.jk-card__media .jkp-badge {
	position: absolute;
	top: 54px;   /* debajo de .jk-card__sale (top 14px + ~24px alto + 6px gap) */
	left: 14px;
	z-index: 3;
}

/* ---- Variantes por slug ---- */
.jkp-badge--cyber-jusa {
	background: #0D1B2A;
	color: #00E5CC;
}

.jkp-badge--navidad {
	background: #B22222;
	color: #ffffff;
}

.jkp-badge--reyes-magos {
	background: #4B0082;
	color: #FFD700;
}

/* ---- Badge en la ficha de producto (PDP) ---- */
.jkp-badge--pdp {
	position: static;
	display: inline-block;
	margin-bottom: 10px;
	font-size: 13px;
	padding: 5px 14px;
}

/* ---- Responsive (tarjetas pequeñas) ---- */
@media (max-width: 480px) {
	.jk-card__media .jkp-badge {
		font-size: 9px;
		padding: 3px 8px;
		top: 46px;
		left: 8px;
	}
}