/* 2026-09-21 大隆さん指示。ai-search-layout-fix.css へ直接足すと、
   public/ と assets-v126/ の2枚へ同じ125行を書くことになるので、1枚に分ける。
   外したくなったら index.html からこの1行を消せば元に戻る。 */
/* 2026-09-21 大隆さん指示:
   ・Google提示・ホシル提示・レコメンド提示は、ホシルバズと同じくスマホ1画面に2商品
   ・提示欄の縦が長すぎるので詰める（価格は1行、説明と手がかりはここでは出さない）
   ・カードの中は 写真 → 商品名（見切れてよい）→ 価格 → ボタン
   ボタンは幅いっぱいの縦積みのまま。46vw に5つ横並びは潰れて押せなくなる。 */
@media (max-width:760px){
  .result-row-confirmed .result-track,
  .result-row-unconfirmed .result-track,
  .result-row-recommended .result-track{
    display:flex;
    flex-direction:row;
    flex-wrap:nowrap;
    align-items:stretch;
    gap:10px;
    max-height:none;
    overflow-x:auto;
    overflow-y:hidden;
    scroll-snap-type:x mandatory;
    overscroll-behavior-x:contain;
    padding:2px 2px 8px;
  }
  .result-row-confirmed .result-track>.product-card,
  .result-row-unconfirmed .result-track>.product-card,
  .result-row-recommended .result-track>.product-card{
    flex:0 0 min(210px,46vw);
    width:min(210px,46vw);
    min-width:0;
    min-height:0;
    display:flex;
    flex-direction:column;
    align-items:stretch;
    gap:6px;
    padding:10px;
    border-width:1px;
    border-radius:14px;
    scroll-snap-align:start;
  }
  .result-row-confirmed .result-track>.product-card>*,
  .result-row-unconfirmed .result-track>.product-card>*,
  .result-row-recommended .result-track>.product-card>*{
    grid-column:auto;
    width:100%;
    max-width:100%;
    min-width:0;
  }
  .result-row-confirmed .result-track>.product-card>.rank,
  .result-row-unconfirmed .result-track>.product-card>.rank,
  .result-row-recommended .result-track>.product-card>.rank{
    position:static;
    width:max-content;
    box-shadow:none;
  }
  /* 説明文・一致した手がかりは、ここでは縦を食うだけなので出さない（商品ページと詳細に残る） */
  .result-row-confirmed .result-track>.product-card>p,
  .result-row-unconfirmed .result-track>.product-card>p,
  .result-row-recommended .result-track>.product-card>p,
  .result-row-confirmed .result-track>.product-card>.evidence,
  .result-row-unconfirmed .result-track>.product-card>.evidence,
  .result-row-recommended .result-track>.product-card>.evidence,
  .result-track>.product-card .product-card-media-actions:empty{
    display:none;
  }
  .result-row-confirmed .result-track>.product-card h3,
  .result-row-unconfirmed .result-track>.product-card h3,
  .result-row-recommended .result-track>.product-card h3{
    min-height:0;
    font-size:12px;
    line-height:1.4;
    -webkit-line-clamp:2;
    line-clamp:2;
  }
  /* 価格は1行。「確認済み送料込み価格」「送料・商品ページへ」は畳む */
  .result-row-confirmed .result-track>.product-card .single-price-offer,
  .result-row-unconfirmed .result-track>.product-card .single-price-offer,
  .result-row-recommended .result-track>.product-card .single-price-offer{
    display:flex;
    flex-direction:row;
    align-items:baseline;
    flex-wrap:nowrap;
    gap:6px;
    padding:6px 8px;
    border-radius:10px;
  }
  .result-row-confirmed .result-track>.product-card .single-price-offer>.price-rank,
  .result-row-unconfirmed .result-track>.product-card .single-price-offer>.price-rank,
  .result-row-recommended .result-track>.product-card .single-price-offer>.price-rank,
  .result-row-confirmed .result-track>.product-card .single-price-offer>small,
  .result-row-unconfirmed .result-track>.product-card .single-price-offer>small,
  .result-row-recommended .result-track>.product-card .single-price-offer>small{
    display:none;
  }
  .result-row-confirmed .result-track>.product-card .single-price-offer>strong,
  .result-row-unconfirmed .result-track>.product-card .single-price-offer>strong,
  .result-row-recommended .result-track>.product-card .single-price-offer>strong{
    flex:0 1 auto;
    overflow:hidden;
    white-space:nowrap;
    text-overflow:ellipsis;
    font-size:10px;
  }
  .result-row-confirmed .result-track>.product-card .single-price-offer>b,
  .result-row-unconfirmed .result-track>.product-card .single-price-offer>b,
  .result-row-recommended .result-track>.product-card .single-price-offer>b{
    flex:0 0 auto;
    margin-left:auto;
    font-size:16px;
    line-height:1.2;
  }
  /* ボタンは幅いっぱいの縦積み。高さを揃えて詰める */
  .product-card-actions{display:grid;gap:5px}
  .product-card-action:empty{display:none}
  .result-row-confirmed .result-track>.product-card .product-card-actions button,
  .result-row-unconfirmed .result-track>.product-card .product-card-actions button,
  .result-row-recommended .result-track>.product-card .product-card-actions button,
  .result-row-confirmed .result-track>.product-card .product-card-actions a,
  .result-row-unconfirmed .result-track>.product-card .product-card-actions a,
  .result-row-recommended .result-track>.product-card .product-card-actions a{
    width:100%;
    min-height:30px;
    padding:6px 8px;
    font-size:10.5px;
    line-height:1.3;
  }
}

/* 2026-09-22 大隆さん報告「口コミを投稿する、がはみ出てる」。
   口コミの見出し行は「口コミ / 件数 / 口コミを投稿する」の横並びで、投稿ボタンは
   折り返さない設定だった。スマホの2列カードでは幅が足りず、カードから飛び出す。
   狭い画面では投稿ボタンを次の行へ落として、幅いっぱいで置く。 */
@media (max-width:760px){
  .experience-head{flex-wrap:wrap}
  .experience-head .experience-post{
    flex:1 0 100%;
    margin:6px 0 0;
    white-space:normal;
    text-align:center;
  }
}

/* 2026-09-22 大隆さん指示「レコメンド提示もボタンサイズや配置や表示方法を
   ホシル提示に合わせて改善」。統合カードと同じ 2列2行・同じ大きさにそろえる。 */
@media (max-width:760px){
  .result-row-recommended .result-track>.product-card .product-card-actions{
    display:grid;
    grid-template-columns:1fr 1fr;
    grid-auto-rows:1fr;
    gap:5px;
    align-items:stretch;
  }
  .result-row-recommended .result-track>.product-card .product-card-actions>*{min-width:0;display:flex}
  .result-row-recommended .result-track>.product-card .product-card-actions button,
  .result-row-recommended .result-track>.product-card .product-card-actions a{
    margin:0;
    width:100%;
    display:flex;
    align-items:center;
    justify-content:center;
    padding:6px 3px;
    min-height:34px;
    line-height:1.5;
    font-size:10px;
    white-space:nowrap;
    overflow:visible;
  }
  /* 口コミは見出しの行だけにして、カードを短くする（中身はモールのページで足りる）。 */
  .result-row-recommended .result-track>.product-card .experience-block{padding:7px 8px}
  .result-row-recommended .result-track>.product-card .experience-count{display:none}
}

/* 2026-09-22 大隆さん指示「まだレコメンド欄のボタンがホシル提示欄と全く同じ配置に
   なってないよ」。価格比較は4つのボタンの外へ出して価格の行に置き、口コミは
   「💬 口コミ」ボタン1つに畳む（押すと中身と入力欄が開く）。統合カードと同じ形。 */
@media (max-width:760px){
  .result-row-recommended .result-track>.product-card>.product-card-price-row{
    display:flex;
    align-items:baseline;
    gap:6px;
    min-width:0;
    margin:0;
  }
  .result-row-recommended .result-track>.product-card>.product-card-price-row .product-card-action-buy{
    margin-left:auto;
    flex:0 0 auto;
    display:flex;
  }
  .result-row-recommended .result-track>.product-card>.product-card-price-row .product-card-action-buy button{
    margin:0;
    padding:4px 7px;
    min-height:0;
    border-radius:7px;
    font-size:10px;
    white-space:nowrap;
  }
  .result-row-recommended .result-track>.product-card .experience-block{display:none}
  .result-row-recommended .result-track>.product-card.reviews-open .experience-block{display:block}
  /* 2026-09-22 大隆さん報告「レコメンドの気になるボタンが統一されてない」。
     ♡ の中は display:grid の入れ物で、升目いっぱいに広がっていなかった（隣より細い・
     背が高い）。統合カードと同じ作りにそろえる。押したあとに出る案内文も行を跨がせる。 */
  .result-row-recommended .result-track>.product-card .product-card-action-keep{flex-direction:column;align-items:stretch}
  .result-row-recommended .result-track>.product-card .keep-product{display:flex;flex-direction:column;gap:4px;width:100%}
  .result-row-recommended .result-track>.product-card .keep-product-note{
    order:2;
    display:block;
    width:100%;
    font-size:9.5px;
    line-height:1.4;
    white-space:normal;
    text-align:center;
  }
  .result-row-recommended .result-track>.product-card .keep-product-note.hidden{display:none}
}