.menube-flow-public-badges {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: .32rem;
  margin: 0 0 .4rem 0;
  max-width: 100%;
}

.menube-flow-public-badge {
  display: inline-flex;
  align-items: center;
  width: fit-content;
  max-width: 100%;
  padding: .32rem .58rem;
  border-radius: 999px;
  font-size: .72rem;
  font-weight: 800;
  line-height: 1;
  letter-spacing: .01em;
  background: rgba(188, 139, 64, .14);
  color: #8a5c16;
  box-shadow: none;
}

.menube-flow-public-badge[data-flow-flag="last_units"] {
  background: rgba(190, 18, 60, .10);
  color: #9f1239;
}

.menube-flow-public-badge[data-flow-flag="open_wine"],
.menube-flow-public-badge[data-flow-flag="pairing_special"] {
  background: rgba(127, 29, 29, .11);
  color: #7f1d1d;
}

.menube-flow-public-badge[data-flow-flag="fast_service"] {
  background: rgba(33, 145, 80, .12);
  color: #166534;
}

.menube-flow-public-badge[data-flow-flag="slow_preparation"] {
  background: rgba(120, 113, 108, .14);
  color: #57534e;
}

.menube-flow-public-active {
  position: relative;
}

/* MENUBE_FLOW_PUBLIC_BADGES_MOBILE_SAFE_20260609
   Corrige badges públicos de Menube Flow en móvil.
   Objetivo: que Últimas unidades / Recomendado ahora / Servicio rápido
   no se monten sobre la imagen ni queden en posición absoluta irregular.
   No toca Pairing Bubble, Pulse, carrito ni Sumiller.
*/
@media (max-width: 768px) {
  .menu2-item [class*="menube-flow"][class*="badges"],
  .menu2-item [class*="menube-flow"][class*="flags"],
  .menu2-item [class*="flow"][class*="badges"],
  .menu2-item [class*="flow"][class*="flags"],
  article [class*="menube-flow"][class*="badges"],
  article [class*="menube-flow"][class*="flags"],
  article [class*="flow"][class*="badges"],
  article [class*="flow"][class*="flags"] {
    position: static !important;
    inset: auto !important;
    left: auto !important;
    right: auto !important;
    top: auto !important;
    bottom: auto !important;
    transform: none !important;
    width: 100% !important;
    max-width: 100% !important;
    display: flex !important;
    flex-wrap: wrap !important;
    align-items: center !important;
    justify-content: flex-start !important;
    gap: 6px !important;
    margin: 0 0 10px 0 !important;
    padding: 0 !important;
    z-index: 2 !important;
    pointer-events: none !important;
  }

  .menu2-item [class*="menube-flow"][class*="badge"]:not([class*="badges"]),
  .menu2-item [class*="flow"][class*="badge"]:not([class*="badges"]),
  article [class*="menube-flow"][class*="badge"]:not([class*="badges"]),
  article [class*="flow"][class*="badge"]:not([class*="badges"]) {
    position: static !important;
    transform: none !important;
    max-width: 100% !important;
    display: inline-flex !important;
    align-items: center !important;
    width: auto !important;
    white-space: nowrap !important;
    line-height: 1.15 !important;
    margin: 0 !important;
  }

  .menu2-item,
  article.menu2-item {
    overflow: visible !important;
  }
}

/* MENUBE_FLOW_PUBLIC_BADGES_REAL_DOM_SAFE_20260609
   Ajuste exacto para clases reales:
   .menube-flow-public-badges / .menube-flow-public-badge
   Evita que las etiquetas se monten encima de la imagen en móvil.
*/
@media (max-width: 768px) {
  article.menu2-item .menube-flow-public-badges,
  .menu2-item .menube-flow-public-badges {
    position: static !important;
    inset: auto !important;
    transform: none !important;
    clear: both !important;
    width: 100% !important;
    max-width: 100% !important;
    display: flex !important;
    flex-wrap: wrap !important;
    align-items: center !important;
    justify-content: flex-start !important;
    gap: 7px !important;
    margin: 8px 0 10px 0 !important;
    padding: 0 !important;
    z-index: 1 !important;
    pointer-events: none !important;
  }

  article.menu2-item .menube-flow-public-badge,
  .menu2-item .menube-flow-public-badge {
    position: static !important;
    transform: none !important;
    display: inline-flex !important;
    align-items: center !important;
    width: auto !important;
    max-width: 100% !important;
    white-space: nowrap !important;
    line-height: 1.15 !important;
    margin: 0 !important;
    z-index: 1 !important;
  }

  article.menu2-item img,
  .menu2-item img {
    z-index: 0 !important;
  }

  article.menu2-item,
  .menu2-item {
    overflow: visible !important;
  }
}

/* MENUBE_FLOW_PUBLIC_BADGE_CLASS_ALIASES_001
   Alias de compatibilidad para auditoría y futuras clases directas.
   No cambia el layout existente; solo asegura clases públicas estables.
*/

.menube-flow-public-badge--fast_service {
  background: rgba(34, 197, 94, .13);
  color: #166534;
}

.menube-flow-public-badge--last_units {
  background: rgba(219, 39, 119, .11);
  color: #9d174d;
}

.menube-flow-public-badge--boost {
  background: rgba(185, 132, 47, .12);
  color: #6b4a16;
}


/* MENUBE_FLOW_PUBLIC_LONG_BADGE_WRAP_001
   Refuerzo suave para labels dinámicos largos:
   “Recomendado por nuestro/nuestra chef {Nombre}”.
   No cambia el layout; solo evita overflow.
*/

.menube-flow-public-badges {
  max-width: 100%;
  min-width: 0;
  flex-wrap: wrap;
}

.menube-flow-public-badge,
[class*="menube-flow-public-badge"] {
  max-width: 100%;
  white-space: normal;
  overflow-wrap: anywhere;
  line-height: 1.12;
}

@media (max-width: 760px) {
  .menube-flow-public-badge,
  [class*="menube-flow-public-badge"] {
    line-height: 1.08;
  }
}
