/* repair-item-modern.css
   修理項目ページ共通の仕上げCSS。
   対象: glass/display/battery/kiban/water/dockconnector/camera/
        home_button/sleep_button/speaker/earphonejack/vibrator/otherparts
   読み込み順: 必ず service.css・既存ページCSSの後。
   ※ 修理項目ページのみ enqueue。TOP・機種別ページには当てない。
   ※ 本文の装飾（結論ブロック・料金カード・th 等）は service.css が既に
     整えているため、ここでは触らない（競合・二重枠を防ぐ）。
     役割は「旧画像の非表示」「表の横はみ出し防止」「追従CTA回避余白」のみ。 */

/* ============================================================
   1. 旧レガシー画像の非表示（本文途中の故障端末写真・割れ写真・
      旧サムネイル・旧メニューのアイコン・保証バナー・MICロゴ）
      これら旧画像は全て theme_sp 由来。
      設計済み画像（hero / CMW500バナー・カード / redesign2 の
      アイコン・kiban実機写真）は theme_v2/redesign2 由来なので
      対象外＝残す。指示書の除外条項に準拠。
   ============================================================ */
.legacy-restored-content img[src*="/theme_sp/"],
.legacy-restored-content .pct,
.legacy-restored-content .thumb,
.legacy-restored-content .bnr_warrantee img,
.legacy-restored-content .bnr_mic,
.legacy-restored-content .menu_list img,
.legacy-restored-content .menu_thumbbtn img {
  display: none !important;
}

/* 画像を消した跡に不自然な空白を残さない */
.legacy-restored-content .pct,
.legacy-restored-content figure:empty,
.legacy-restored-content p:empty {
  margin: 0 !important;
  padding: 0 !important;
}

/* 念のため：設計済み画像は常に表示（万一レガシー内に入っていても） */
.service-hero img,
.service-visual img,
.legacy-restored-content .sdp-quality-card img,
.legacy-restored-content .sdp-quality-banner img,
.legacy-restored-content .sdp-quality-banner__media img,
.legacy-restored-content img[src*="/redesign2/"] {
  display: block !important;
}

/* ============================================================
   2. 表：スマホで横にはみ出してページ全体を崩さない（横スクロール）
   ============================================================ */
.legacy-restored-content table {
  max-width: 100%;
}

@media (max-width: 820px) {
  /* 幅の広い表は枠内で横スクロール（min-width:640px等で膨張して切れるのを防ぐ） */
  .legacy-restored-content table {
    display: block;
    width: auto;
    min-width: 0;
    max-width: 100%;
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
  }
}

/* ============================================================
   3. 本文下に余白（追従CTA .estimate-dock に隠れない）
      ※ 追従CTA自体は非表示にしない
   ============================================================ */
.service-body {
  padding-bottom: 28px;
}

@media (max-width: 620px) {
  .service-body {
    padding-bottom: 136px;
  }
}
