@media (max-width: 767px) {
  html,
  body,
  #root {
    min-height: 100%;
    background: #fffdfc;
  }

  body {
    padding-bottom: 0 !important;
  }

  header.fixed.inset-x-0.top-0 {
    padding-top: env(safe-area-inset-top);
  }

  header.fixed.inset-x-0.top-0 + div[aria-hidden="true"] {
    height: calc(112px + env(safe-area-inset-top)) !important;
  }

  header.sticky.top-0 {
    min-height: calc(50px + env(safe-area-inset-top));
    padding-top: env(safe-area-inset-top);
  }

  /* iOS Safari: keep the cart fully covering the visual viewport and safe area. */
  aside.fixed.inset-y-0.right-0 {
    inset: 0 !important;
    width: 100vw !important;
    height: 100vh !important;
    min-height: 100vh !important;
    max-height: none !important;
    background: #fffdfc !important;
    overscroll-behavior: contain;
  }

  @supports (height: 100dvh) {
    aside.fixed.inset-y-0.right-0 {
      height: 100dvh !important;
      min-height: 100dvh !important;
    }
  }

  @supports (-webkit-touch-callout: none) {
    aside.fixed.inset-y-0.right-0 {
      min-height: -webkit-fill-available !important;
    }
  }

  aside.fixed.inset-y-0.right-0 > footer {
    padding-bottom: max(12px, env(safe-area-inset-bottom)) !important;
    background: #fffdfc !important;
  }

  /* OTP recovery is intentionally disabled for now. Login remains phone + password only. */
  form + button + * {
    --flamingo-auth-otp-disabled: 1;
  }

  button.shrink-0.text-\[9px\].font-medium.text-\[\#C1646C\] {
    display: none !important;
  }
}

/* Product detail hero: fill the frame while keeping the product's top visible. */
.react-transform-wrapper,
.react-transform-component {
  width: 100% !important;
  height: 100% !important;
}

.react-transform-component {
  display: flex !important;
  align-items: flex-start !important;
  justify-content: center !important;
}

.react-transform-component > img {
  width: 100% !important;
  height: 100% !important;
  max-width: 100% !important;
  max-height: 100% !important;
  object-fit: cover !important;
  object-position: center top !important;
}