/* ==========================================================================
   入荷記事の商品カード修理  —  v0.2.0 (2026-08-23)

   値の正本: DESIGN-SYSTEM.md v1.2.1
     §3-2-2 文字の下限 12px ／ §3-2-3 価格・購入ボタン・在庫は 14px 以上
     §5-1   Mall型ボタン（角丸10px・14px以上・600〜700）
     §5-2   タッチ端末は 幅88 × 高44px 以上。**判定は幅ではなく pointer: coarse**
     §5-3   商品名は min-height（固定高を禁止）
     §6-3   新規CSSのブレークポイントは ≤599 / 600–1099 / ≥1100
     §8-1   --ag-* のみ・参照は必ず2引数 var()・!important 禁止・px で書く

   対象は入荷記事の商品カード（.arrival-product-item 系）だけ。
   ヘッダー・説明書・/shop/・メニュー・投稿本文には一切触れない。

   ■ なぜセレクタにクラスが1つ多いのか（.arrival-products を足している理由）
     入荷記事95本は post_content の中に <style> を持ち、そこで
       .arrival-product-item .shop-link { font-size:10px; padding:6px 2px }  … (0,2,0)
     を宣言している。post_content の <style> は <body> の中にあるため、
     文書順ではテーマCSSより必ず後に来る。
     当初の設計どおり wp_footer で enqueue したが、**実測の結果 WP Rocket が
     配信時に <head> の末尾へ移すため、post本文の <style> より前になる**
     （2026-08-23 実測: 8ページ種別すべてで wp-custom-css の直後・本文styleの前）。
     そこで文書順ではなく**詳細度**で勝たせる。親の .arrival-products を1つ足して
     (0,3,0) にすれば、!important を使わずに確実に上書きできる。
     .arrival-products が必ず親に居ることはDBで全数確認済み
     （.arrival-product-item を含む投稿 105本すべてが .arrival-products を持つ／
       wrapper を持たない投稿は 0本）。

   ロールバック: functions.php 末尾の require_once 1行を削除 → cache/min/ をパージ。
   ========================================================================== */

/* --- 購入ボタン: 文字は本文小（14px以上）------------------------------------
   現行は 10px（スマホ）／11px（PC）で、§3-2-3「価格・購入ボタン・在庫は14px以上」
   に反していた。モール識別色（楽天 #BF0000 / Yahoo! #FF0033）は §7-1 により
   揃えない＝ここでは色に一切触れない。                                        */
.arrival-products .arrival-product-item .shop-link {
	font-size: var(--ag-fs-sm, 14px);
}

/* --- スマホ帯（≤599px）: 横並びをやめて縦積みにする -------------------------
   375px ではカード幅 166.5px・.product-info の内寸 146.5px しかなく、
   88px 幅のボタンを2個横に並べることが物理的にできない（88×2＋gap > 146.5）。
   §5-2 の 88 × 44px を満たすには構造を変えるしかない、というのがこの便の主旨。
   縦積みにすると 1個あたり およそ 146.5 × 44px になる。                        */
@media (max-width: 599px) {

	.arrival-products .arrival-product-item .product-links {
		flex-direction: column;
		gap: var(--ag-sp-1, 8px);
	}

	/* wpautop が2つのボタンの間に入れた <br>（投稿本文の改行由来。1カードに1個）。
	   横並びのときは幅がほぼ0で無害だったが、縦積みにすると
	   「行の高さ 30.4px を持つ3つ目のフレックスアイテム」になり、
	   宣言した 8px の隙間が実測 46.4px に膨らむ（2026-08-23 実測: 8 + 30.4 + 8）。
	   投稿本文は触れないので、縦積みの帯でだけ表示を消す。               */
	.arrival-products .arrival-product-item .product-links br {
		display: none;
	}

	.arrival-products .arrival-product-item .shop-link {
		/* 本文側の flex:1（＝flex-basis:0）を縦積みでは打ち消す。
		   縦方向に flex-basis:0 が残ると、フレックスの内在サイズ計算により
		   .product-links の高さが 96px ではなく 134.4px に膨らみ、
		   宣言した 8px の隙間が実測 46.4px になってしまう（2026-08-23 実測）。
		   横並びのままの帯（600px以上）では flex:1 が等幅を作るので触らない。 */
		flex: 0 0 auto;
		display: flex;
		align-items: center;
		justify-content: center;
		min-height: var(--ag-btn-h, 44px);
		min-width: var(--ag-btn-w-min, 88px);
		padding: var(--ag-sp-1, 8px);
	}
}

/* --- タッチ端末の最低寸法（§5-2）-------------------------------------------
   幅で判定すると iPad 横（1024〜1366px）がデスクトップ扱いになり、
   ボタンが小さいまま漏れる。だから pointer: coarse で判定する。
   ≤599px の指定と重なるが、600〜1099px のタッチ端末（横並びのまま）を
   拾うために必要。マウス端末の見た目は変えない。                              */
@media (pointer: coarse) {

	.arrival-products .arrival-product-item .shop-link {
		display: flex;
		align-items: center;
		justify-content: center;
		min-height: var(--ag-btn-h, 44px);
		min-width: var(--ag-btn-w-min, 88px);
	}
}

/* --- 商品名: 固定高（line-clamp 2行 + overflow:hidden）をやめる -------------
   §5-3「商品名は min-height（固定高を禁止）」。
   カスタマイザー追加CSS側の -webkit-line-clamp 一式は同じ便で撤去するが、
   ここでも display / overflow を明示して、万一戻されても見切れないようにする。
   line-height は現行と同値の 1.5 を明示している。min-height の 3em が
   「1.5em × 2行分」であることを、この宣言だけで保証するため。                  */
.arrival-products .arrival-product-item .product-name {
	display: block;
	overflow: visible;
	line-height: 1.5;
	min-height: 3em;
}

/* --- 税別表記: 文字の下限 12px（§3-2-2）-------------------------------------
   現行 10px（スマホ）／11px（PC）。価格の一部なので同じカード内で是正する。   */
.arrival-products .arrival-product-item .product-price .tax-label {
	font-size: var(--ag-fs-xs, 12px);
}
