/* ===== TruscendHairCo mobile responsiveness fixes ===== */
/* 1. 根级防横向溢出 */
html, body { max-width: 100%; overflow-x: clip; }

/* 2. 媒体元素不超屏 */
img, video, embed, object { max-width: 100%; height: auto; }
img[width][height] { height: auto; }
iframe { max-width: 100%; }

/* 3. YouTube 嵌入自适应（原站 iframe 固定 1024x600 导致手机横向溢出） */
iframe[src*="youtube"],
iframe[src*="youtu.be"],
iframe[src*="youtube-nocookie"] {
  width: 100% !important;
  height: auto !important;
  aspect-ratio: 16 / 9;
  display: block;
}

/* 4. 隐藏未初始化的 Dawn 弹窗（JS 已静态化，弹窗不会被打开，
      否则 product-media-modal 会在手机端把页面撑宽 ~12px） */
product-modal, quick-add-modal, media-modal, .media-modal { display: none !important; }

/* 5. 富文本内表格/长内容防溢出（仅小屏，避免撑宽页面） */
@media (max-width: 749px) {
  .rte table {
    display: block;
    width: max-content;
    max-width: 100%;
    overflow-x: auto;
  }
}
.rte img { max-width: 100%; height: auto; }

/* 6. 移动端价格筛选抽屉等浮层固定在视口内 */
.mobile-facets__wrapper details[open] > summary ~ div { max-width: 100vw; }