/* Badge AGOTADO */
.agotado {
	position: relative;
	opacity: 0.6;
	pointer-events: none;
}

.agotado::before {
	content: 'AGOTADO';
	position: absolute;
	top: 50%;
	left: 50%;
	transform: translate(-50%, -50%) rotate(-15deg);
	background: linear-gradient(135deg, #ef4444, #dc2626);
	color: white;
	font-weight: 900;
	font-size: 2rem;
	padding: 0.75rem 2rem;
	border-radius: 8px;
	box-shadow: 0 4px 20px rgba(239, 68, 68, 0.5);
	z-index: 10;
	letter-spacing: 2px;
	text-transform: uppercase;
	border: 2px solid rgba(255, 255, 255, 0.3);
	animation: agotado-pulse 2s ease-in-out infinite;
}

.agotado button {
	opacity: 0.4;
	cursor: not-allowed;
	filter: grayscale(100%);
}

@keyframes agotado-pulse {
	0%, 100% {
		transform: translate(-50%, -50%) rotate(-15deg) scale(1);
	}
	50% {
		transform: translate(-50%, -50%) rotate(-15deg) scale(1.05);
	}
}

/* Badge más pequeño para móviles */
@media (max-width: 768px) {
	.agotado::before {
		font-size: 1.5rem;
		padding: 0.5rem 1.5rem;
	}
}