/* Estilos para badges dinámicos con nombres únicos */
/* ARCHIVO CARGADO CORRECTAMENTE - badges-custom.css */

/* Badge RECOMENDADO - Naranja - Con máxima especificidad */
.ps-product__badge .ps-badge.ps-badge--recomendado,
.ps-badge.ps-badge--recomendado {
  background-color: #FF9500 !important;
  color: #ffffff !important;
  display: inline-block !important;
  font-size: 12px !important;
  padding: 0 10px !important;
  font-weight: 500 !important;
  text-align: center !important;
  line-height: 20px !important;
  border-radius: 50px !important;
  text-transform: uppercase !important;
}

/* Badge AGOTADO - Azul oscuro - Con máxima especificidad */
.ps-product__badge .ps-badge.ps-badge--agotado,
.ps-badge.ps-badge--agotado {
  background-color: #39485f !important;
  color: #ffffff !important;
  display: inline-block !important;
  font-size: 12px !important;
  padding: 0 10px !important;
  font-weight: 500 !important;
  text-align: center !important;
  line-height: 20px !important;
  border-radius: 50px !important;
  text-transform: uppercase !important;
}

/* Badge personalizado - Gris - Con máxima especificidad */
.ps-product__badge .ps-badge.ps-badge--tag-custom,
.ps-badge.ps-badge--tag-custom {
  background-color: #6C757D !important;
  color: #ffffff !important;
  display: inline-block !important;
  font-size: 12px !important;
  padding: 0 10px !important;
  font-weight: 500 !important;
  text-align: center !important;
  line-height: 20px !important;
  border-radius: 50px !important;
  text-transform: uppercase !important;
}

/* Badge EN STOCK - Verde - Con máxima especificidad */
.ps-product__badge .ps-badge.ps-badge--instock,
.ps-badge.ps-badge--instock {
  background-color: #28a745 !important;
  color: #ffffff !important;
  display: inline-block !important;
  font-size: 12px !important;
  padding: 0 10px !important;
  font-weight: 500 !important;
  text-align: center !important;
  line-height: 20px !important;
  border-radius: 50px !important;
  text-transform: uppercase !important;
}

/* Badge AGOTADO - Marrón oscuro - Con máxima especificidad */
.ps-product__badge .ps-badge.ps-badge--outstock,
.ps-badge.ps-badge--outstock {
  background-color: #4a0008 !important;
  color: #ffffff !important;
  display: inline-block !important;
  font-size: 12px !important;
  padding: 0 10px !important;
  font-weight: 500 !important;
  text-align: center !important;
  line-height: 20px !important;
  border-radius: 50px !important;
  text-transform: uppercase !important;
}

/* Badge EN OFERTA - Rosa - Con máxima especificidad */
.ps-product__badge .ps-badge.ps-badge--sale,
.ps-badge.ps-badge--sale {
  background-color: #e91e63 !important;
  color: #ffffff !important;
  display: inline-block !important;
  font-size: 12px !important;
  padding: 0 10px !important;
  font-weight: 500 !important;
  text-align: center !important;
  line-height: 20px !important;
  border-radius: 50px !important;
  text-transform: uppercase !important;
}

/* Badge CONTROL ESPECIAL - Morado oscuro - Con máxima especificidad */
.ps-product__badge .ps-badge.ps-badge--control-especial,
.ps-badge.ps-badge--control-especial {
  background-color: #6a1b9a !important;
  color: #ffffff !important;
  display: inline-block !important;
  font-size: 12px !important;
  padding: 0 10px !important;
  font-weight: 500 !important;
  text-align: center !important;
  line-height: 20px !important;
  border-radius: 50px !important;
  text-transform: uppercase !important;
}

/* Badge FORMULA MEDICA - Morado - Con máxima especificidad */
.ps-product__badge .ps-badge.ps-badge--formula-medica,
.ps-badge.ps-badge--formula-medica {
  background-color: #7b3ff2 !important;
  color: #ffffff !important;
  display: inline-block !important;
  font-size: 12px !important;
  padding: 0 10px !important;
  font-weight: 600 !important;
  text-align: center !important;
  line-height: 20px !important;
  border-radius: 50px !important;
  text-transform: uppercase !important;
  margin-top: 4px !important;
}

.ps-product__badge .ps-badge.ps-badge--formula-medica i,
.ps-badge.ps-badge--formula-medica i {
  margin-right: 4px;
  font-size: 11px;
}