/*
 * CPT Badge para FacetWP — Estilos
 *
 * Shapes puras, sin texto:
 *   Cursos     → ⚪ Círculo blanco  → border-radius 50% — #ffffff
 *   Postgrados → 🟥 Cuadrado rojo  → sin rotación      — #d11a1a
 *   Masters    → ⬚ Rombo negro     → rotado 45°        — #000000
 */

/* ============================================================
   1. CONTENEDOR — ya tiene position: relative por el tema
   ============================================================ */
.fwpl-item.el-c37w2d.imagencurso {
	position: relative; /* explícito como referencia */
}

/* ============================================================
   2. BADGE BASE
   ============================================================ */
.cpt-badge {
	position:  absolute;
	top:       10px;
	right:     10px;
	z-index:   20;
	display:   block;
	pointer-events: none;
	filter: drop-shadow(0 2px 5px rgba(0, 0, 0, 0.40));
	animation: cpt-badge-appear 0.2s ease-out both;
}

@keyframes cpt-badge-appear {
	from { opacity: 0; transform: scale(0.5); }
	to   { opacity: 1; transform: scale(1);   }
}

/* ============================================================
   3. CÍRCULO BLANCO — "cursos"
   Borde fino para que se vea sobre fondos claros.
   ============================================================ */
.cpt-badge--curso {
	width:         32px;
	height:        32px;
	background:    #ffffff;
	border:        1px solid rgba(0, 0, 0, 0.15);
	border-radius: 50%;
}

/* ============================================================
   4. CUADRADO ROJO — "postgrados"
   ============================================================ */
.cpt-badge--postgrado {
	width:         28px;
	height:        28px;
	background:    #d11a1a;
	border-radius: 3px;
}

/* ============================================================
   5. ROMBO NEGRO — "masters"
   Cuadrado de 28 × 28 rotado 45°
   ============================================================ */
.cpt-badge--master {
	width:         28px;
	height:        28px;
	background:    #000000;
	transform:     rotate(45deg);
	border-radius: 3px;
}

/* ============================================================
   6. RESPONSIVE — móviles pequeños
   ============================================================ */
@media (max-width: 480px) {
	.cpt-badge { top: 6px; right: 6px; }
	.cpt-badge--curso     { width: 26px; height: 26px; }
	.cpt-badge--postgrado { width: 22px; height: 22px; }
	.cpt-badge--master    { width: 22px; height: 22px; }
}