/**
 * Garderoba MONO mobile header compatibility.
 *
 * MONO 1.0.13 keeps native Lumise cart actions in the top navigation. On
 * real iOS Safari the native right action block can remain hidden/collapsed
 * even though desktop device emulation shows it. This override only applies
 * to the MONO editor on phone widths and restores the existing native Lumise
 * cart controls; it does not duplicate cart/pricing logic.
 */
@media only screen and (max-width: 736px) {
  body.lumise-theme-mono-editor #LumiseDesign #lumise-navigations {
    overflow: visible !important;
  }

  body.lumise-theme-mono-editor #LumiseDesign #lumise-navigations ul[data-block="right"] {
    align-items: center !important;
    display: flex !important;
    gap: 4px !important;
    height: var(--lmono-header-height, 60px) !important;
    margin: 0 !important;
    position: absolute !important;
    right: max(4px, env(safe-area-inset-right, 0px)) !important;
    top: 0 !important;
    width: auto !important;
    z-index: 1000010 !important;
  }

  body.lumise-theme-mono-editor #LumiseDesign #lumise-navigations ul[data-block="right"] > li#lumise-cart-options,
  body.lumise-theme-mono-editor #LumiseDesign #lumise-navigations ul[data-block="right"] > li#lumise-proceed {
    align-items: center !important;
    display: flex !important;
    float: none !important;
    height: var(--lmono-header-height, 60px) !important;
    margin: 0 !important;
    opacity: 1 !important;
    padding: 0 !important;
    visibility: visible !important;
    width: auto !important;
  }

  body.lumise-theme-mono-editor #LumiseDesign #lumise-navigations ul[data-block="right"] .lumise-price,
  body.lumise-theme-mono-editor #LumiseDesign #lumise-navigations ul[data-block="right"] .back_shop,
  body.lumise-theme-mono-editor #LumiseDesign #lumise-navigations ul[data-block="right"] #lumise-exit-editor {
    display: none !important;
  }

  body.lumise-theme-mono-editor #LumiseDesign #lumise-navigations button#lumise-addToCart {
    align-items: center !important;
    display: inline-flex !important;
    height: 36px !important;
    justify-content: center !important;
    margin: 0 !important;
    min-width: 42px !important;
    opacity: 1 !important;
    padding: 0 9px !important;
    visibility: visible !important;
  }

  body.lumise-theme-mono-editor #LumiseDesign #lumise-navigations #lumise-proceed > button#lumise-cart-action {
    align-items: center !important;
    display: inline-flex !important;
    font-size: 11px !important;
    height: 36px !important;
    justify-content: center !important;
    margin: 0 !important;
    max-width: 92px !important;
    min-width: 78px !important;
    opacity: 1 !important;
    overflow: hidden !important;
    padding: 0 9px !important;
    text-overflow: ellipsis !important;
    visibility: visible !important;
    white-space: nowrap !important;
  }

  body.lumise-theme-mono-editor #LumiseDesign #lumise-navigations #lumise-proceed > button#lumise-cart-action > span {
    display: block !important;
    overflow: hidden !important;
    text-overflow: ellipsis !important;
    white-space: nowrap !important;
  }

  /* Keep the MONO secondary bar inside the real iPhone safe area. */
  body.lumise-theme-mono-editor #LumiseDesign .lmono-save-design-bar[aria-hidden="false"] {
    padding-right: max(8px, env(safe-area-inset-right, 0px)) !important;
  }

  body.lumise-theme-mono-editor #LumiseDesign .lmono-save-design-bar__utilities {
    flex: 0 0 auto !important;
    min-width: 0 !important;
  }

  body.lumise-theme-mono-editor #LumiseDesign .lmono-save-design-bar__options {
    max-width: 92px !important;
    overflow: hidden !important;
    text-overflow: ellipsis !important;
    white-space: nowrap !important;
  }
}

@media only screen and (max-width: 390px) {
  body.lumise-theme-mono-editor #LumiseDesign #lumise-navigations ul[data-block="right"] {
    gap: 2px !important;
  }

  body.lumise-theme-mono-editor #LumiseDesign #lumise-navigations #lumise-proceed > button#lumise-cart-action {
    max-width: 84px !important;
    min-width: 72px !important;
    padding-left: 7px !important;
    padding-right: 7px !important;
  }
}
