/*
 * ==================================================
 * 商品カード内のボタンスタイル (A/Bテスト対応)
 * ================================================== */

/*
 * 【Bパターン (常に横並び)】
 *  Aパターンにする場合は、下の「▼▼▼ A/Bテスト切り替え ▼▼▼」ブロックの
 * コメントアウトを外してCSSを有効にしてください。
 * -------------------------------------------------- */
.search-card-actions {
  display: flex;
  gap: 4px;
}
.search-card-actions > a {
  flex: 1;
  min-width: 0;
}
.search-card-actions > a.c-btn-block {
  width: auto;
}

/*
 * ▼▼▼ A/Bテスト切り替え ▼▼▼
 *
 * 【Aパターン (スマホの3カラム時のみ縦並び)】にする場合は、以下のCSSを有効にしてください。
 *  Bパターンに戻す場合は、再度コメントアウトが必要です。
 * -------------------------------------------------- */
@media screen and (max-width: 766px) {
  .product-list-container.column-3 .search-card-actions {
    flex-direction: column;
    justify-content: flex-start;
    min-height: 88px;
  }
  .product-list-container.column-3 .search-card-actions > a {
    flex-grow: 0;
  }
}
