/* * 我要买卡 Batch 14 * 手机端商品页优化 * * 1. 产品特点与同类商品改为上下排列。 * 2. 同类商品改为小卡片横向滑动。 * 3. 隐藏商品页底部 PayPal 快捷付款按钮。 * 4. 仅在 767px 及以下生效，PC 端不受影响。 */ @media (max-width: 767px) { /* ===== 产品特点 / 同类商品：由左右分栏改为上下排列 ===== */ html.wymk-product-page .wymk-product-info-split { display: block !important; grid-template-columns: minmax(0, 1fr) !important; width: 100% !important; max-width: 100% !important; min-width: 0 !important; overflow: visible !important; } html.wymk-product-page .wymk-product-info-split > * { display: block !important; float: none !important; width: 100% !important; max-width: 100% !important; min-width: 0 !important; margin-left: 0 !important; margin-right: 0 !important; } /* ===== 同类/相关商品模块 ===== */ html.wymk-product-page .wymk-related-mobile { display: block !important; width: 100% !important; max-width: 100% !important; min-width: 0 !important; margin: 24px 0 10px !important; padding: 22px 0 4px !important; border-top: 1px solid #eeeeee; overflow: hidden !important; box-sizing: border-box !important; } html.wymk-product-page .wymk-related-mobile .wymk-related-heading { display: block !important; margin: 0 16px 16px !important; padding: 0 0 8px !important; font-size: 22px !important; font-weight: 700 !important; line-height: 1.35 !important; color: #171b2c !important; border-bottom: 2px solid #171b2c; width: fit-content; max-width: calc(100% - 32px); } /* 兼容 Journal 的轮播轨道 */ html.wymk-product-page .wymk-related-track { display: flex !important; flex-flow: row nowrap !important; align-items: stretch !important; gap: 12px !important; width: 100% !important; max-width: 100% !important; min-width: 0 !important; height: auto !important; margin: 0 !important; padding: 2px 16px 12px !important; overflow-x: auto !important; overflow-y: hidden !important; scroll-snap-type: x proximity; overscroll-behavior-x: contain; -webkit-overflow-scrolling: touch; transform: none !important; box-sizing: border-box !important; } html.wymk-product-page .wymk-related-track::-webkit-scrollbar { height: 3px; } html.wymk-product-page .wymk-related-card { display: block !important; flex: 0 0 138px !important; width: 138px !important; max-width: 138px !important; min-width: 138px !important; height: auto !important; margin: 0 !important; padding: 10px !important; box-sizing: border-box !important; overflow: hidden !important; scroll-snap-align: start; background: #ffffff !important; border: 1px solid #eeeeee !important; border-radius: 10px !important; box-shadow: 0 3px 12px rgba(0, 0, 0, 0.045) !important; } /* 商品图片固定为小尺寸白底方图 */ html.wymk-product-page .wymk-related-card img { display: block !important; width: 106px !important; max-width: 106px !important; height: 106px !important; max-height: 106px !important; margin: 0 auto 9px !important; padding: 0 !important; object-fit: contain !important; object-position: center !important; background: #ffffff !important; border: 0 !important; } html.wymk-product-page .wymk-related-card .image, html.wymk-product-page .wymk-related-card .product-image, html.wymk-product-page .wymk-related-card .product-img, html.wymk-product-page .wymk-related-card .product-thumb { width: 100% !important; max-width: 100% !important; height: auto !important; min-height: 0 !important; margin: 0 !important; padding: 0 !important; overflow: visible !important; } /* 商品标题最多两行 */ html.wymk-product-page .wymk-related-card .name, html.wymk-product-page .wymk-related-card .product-name, html.wymk-product-page .wymk-related-card .caption h4, html.wymk-product-page .wymk-related-card h3, html.wymk-product-page .wymk-related-card h4 { display: -webkit-box !important; min-height: 38px !important; max-height: 38px !important; margin: 6px 0 !important; overflow: hidden !important; -webkit-box-orient: vertical; -webkit-line-clamp: 2; font-size: 14px !important; font-weight: 600 !important; line-height: 19px !important; color: #222222 !important; white-space: normal !important; word-break: break-word !important; } html.wymk-product-page .wymk-related-card .price, html.wymk-product-page .wymk-related-card .product-price { margin: 5px 0 0 !important; font-size: 14px !important; font-weight: 700 !important; line-height: 20px !important; color: #e62b1e !important; } /* 隐藏同类商品卡片中不适合手机的小按钮 */ html.wymk-product-page .wymk-related-card .quickview-button, html.wymk-product-page .wymk-related-card .button-group, html.wymk-product-page .wymk-related-card .wishlist, html.wymk-product-page .wymk-related-card .compare, html.wymk-product-page .wymk-related-card [data-toggle="tooltip"], html.wymk-product-page .wymk-related-card .product-action { display: none !important; } /* 隐藏轮播箭头，改为手指左右滑动 */ html.wymk-product-page .wymk-related-mobile .swiper-button-prev, html.wymk-product-page .wymk-related-mobile .swiper-button-next, html.wymk-product-page .wymk-related-mobile .owl-nav, html.wymk-product-page .wymk-related-mobile .slick-arrow, html.wymk-product-page .wymk-related-mobile .module-nav { display: none !important; } /* ===== 商品页底部 PayPal 快捷付款按钮 ===== */ html.wymk-product-page .wymk-hide-mobile-paypal, html.wymk-product-page #paypal-button-container, html.wymk-product-page [id^="paypal-button-container"], html.wymk-product-page .paypal-buttons, html.wymk-product-page .paypal-button-container, html.wymk-product-page .ppc-button-wrapper { display: none !important; visibility: hidden !important; width: 0 !important; max-width: 0 !important; min-width: 0 !important; height: 0 !important; max-height: 0 !important; margin: 0 !important; padding: 0 !important; overflow: hidden !important; } /* PayPal 隐藏后，让旁边的购物/结算按钮填满剩余宽度 */ html.wymk-product-page .wymk-mobile-buy-row { display: flex !important; width: 100% !important; max-width: 100% !important; gap: 8px !important; } html.wymk-product-page .wymk-mobile-buy-row > :not(.wymk-hide-mobile-paypal) { flex: 1 1 auto !important; max-width: 100% !important; } }