/* A status at the existing add position, not another actionable button. */
.menu-soldout-label,
.menu-soldout-price {
  display: none;
}

body:is([data-layout="mobile"], [data-layout="portrait"], [data-layout="desktop"])
  .menu-item.menu-soldout-action :is(.sold-out-msg, [data-operations-soldout-message]),
body:is([data-layout="mobile"], [data-layout="portrait"], [data-layout="desktop"])
  .menu-row.menu-item.menu-soldout-action .qty-box > :is(.qty-plus[data-target], .nova-product-add.add-button, .touch-config-trigger),
/* Match the late touch price-pill selector as well as ordinary add controls. */
body:is([data-layout="mobile"], [data-layout="portrait"])
  section.touch-menu-section .menu-row.menu-item.menu-soldout-action .qty-box > :is(.qty-plus[data-target], .nova-product-add.add-button, .touch-config-trigger) {
  display: none !important;
}

body:is([data-layout="mobile"], [data-layout="portrait"], [data-layout="desktop"])
  .menu-item.menu-soldout-action .menu-soldout-label {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  flex: 0 0 auto;
  box-sizing: border-box;
  height: 44px;
  padding: 0 10px;
  border: 4px solid transparent;
  border-radius: 16px;
  background: #fcede9;
  background-clip: padding-box;
  color: #b93830;
  font-size: 13px;
  font-weight: 600;
  line-height: 1;
  white-space: nowrap;
  cursor: default;
}

/* Desktop normally embeds the price in the + button; retain that exact text. */
body[data-layout="desktop"] .menu-item.menu-soldout-action.has-desktop-price-pill .menu-soldout-price {
  display: inline;
  order: -1;
  color: #111;
  font-size: 14px;
  font-weight: 700;
  white-space: nowrap;
}