[Bug]: image overlap in product pages.

[unlux]

Package.json file

{
  "name": "backend",
  "version": "0.0.1",
  "description": "jj project",
  "author": "Medusa (https://medusajs.com)",
  "license": "MIT",
  "keywords": [
    "sqlite",
    "postgres",
    "typescript",
    "ecommerce",
    "headless",
    "medusa"
  ],
  "scripts": {
    "build": "medusa build && cd .medusa/server && cp ../../.env .env && yarn install",
    "seed": "medusa exec ./src/scripts/seed.ts",
    "start": "medusa start",
    "dev": "medusa develop",
    "test:integration:http": "TEST_TYPE=integration:http NODE_OPTIONS=--experimental-vm-modules jest --silent=false --runInBand --forceExit",
    "test:integration:modules": "TEST_TYPE=integration:modules NODE_OPTIONS=--experimental-vm-modules jest --silent=false --runInBand --forceExit",
    "test:unit": "TEST_TYPE=unit NODE_OPTIONS=--experimental-vm-modules jest --silent --runInBand --forceExit"
  },
  "dependencies": {
    "@medusajs/admin-sdk": "2.9",
    "@medusajs/cli": "2.9",
    "@medusajs/framework": "2.9",
    "@medusajs/medusa": "2.9",
    "@mikro-orm/core": "6.4.3",
    "@mikro-orm/knex": "6.4.3",
    "@mikro-orm/migrations": "6.4.3",
    "@mikro-orm/postgresql": "6.4.3",
    "@rsc-labs/medusa-wishlist": "0.0.3",
    "algoliasearch": "^5.34.1",
    "awilix": "^8.0.1",
    "jsonwebtoken": "^9.0.2",
    "medusa-plugin-razorpay-v2": "^0.1.2",
    "pg": "^8.13.0"
  },
  "devDependencies": {
    "@medusajs/test-utils": "2.9",
    "@mikro-orm/cli": "6.4.3",
    "@swc/core": "1.5.7",
    "@swc/jest": "^0.2.36",
    "@types/jest": "^29.5.13",
    "@types/node": "^20.0.0",
    "@types/react": "^18.3.2",
    "@types/react-dom": "^18.2.25",
    "jest": "^29.7.0",
    "prop-types": "^15.8.1",
    "react": "^18.2.0",
    "react-dom": "^18.2.0",
    "ts-node": "^10.9.2",
    "typescript": "^5.6.2",
    "vite": "^5.2.11",
    "yalc": "^1.0.0-pre.53"
  },
  "engines": {
    "node": ">=20"
  },
  "packageManager": "yarn@3.2.1"
}

Node.js version

v24.6.0

Operating system name and version

macOS Sequoia 15.5 arm64

Browser name

Google Chrome

What happended?

on https://next.medusajs.com/dk/products/shorts in mobile view, the mobile-action is hovering over the product images. when you scroll down and reach its designated spot, it sticks to the page (and gets scrolled with it), but if you scroll further, it comes back in an unexpected way, as seen in the attatched ss below. it overlaps the items in the related-products section.

Screen.Recording.2025-08-28.at.4.18.10.PM.mov

Expected behavior

the mobile-action should be at the top of ever other element and not get overlapped by any image in the related-products section.

Actual behavior

the mobile-action gets overlapped by the product thumbnails on related-products section.

Link to reproduction repo

https://github.com/medusajs/nextjs-starter-medusa/