/* ===== /shop-renewal/ 限定レイアウト上書き ===========================
 * サイドバー（検索・絞り込み・最近閲覧した商品）を左カラムに置く。
 *
 * v1 の ea-product-listing-styles.css は本番 /shop/ と共有しているので触らない。
 * このファイルは固定ページ本文に [ssr_hero] があるとき（= /shop-renewal/ 108454）
 * だけ配られるので、本番 /shop/ の見た目は 1px も動かない。
 *
 * DOM 順（main → aside）は v1 のまま据え置き、flex の order だけで入れ替える。
 * HTML を並べ替えると v1 の HTML transient と、.ea-sidebar を前提にした
 * ドロワー制御 JS まで巻き込むため。読み上げ順は本文が先のままで視覚順だけ変わる。
 *
 * 1024px 以下は v1 が flex-direction:column にして «本文の下» に積む作りなので、
 * ここで order を効かせると絞り込みが本文の «上» に来て一覧が押し下がる。
 * よって PC 幅（1025px 以上）だけに限定する。
 * 768px 以下は position:fixed のドロワーで、そもそも order が効かない。
 *
 * セレクタは子結合子で 0,2,0。v1 側の .ea-sidebar（0,1,0）より強いので、
 * CSS の読み込み順が入れ替わっても勝つ。
 * ------------------------------------------------------------------ */

@media (min-width: 1025px) {
	.ea-listing-container > .ea-sidebar {
		order: -1;
	}

	.ea-listing-container > .ea-main-content {
		order: 0;
	}
}

/* 一覧の «上» の余白を詰める。
 *
 * v1 の 40px は «一覧がページの最初の要素» を前提にした値で、本番 /shop/ ではそれが正しい。
 * このページはヒーロー → 目的別カード → 一覧と入口が3段続くので、そのうえ 40px を空けると
 * 商品の1枚目が折り返しの下に落ちる（1440x900 実測で 40px → 商品カード上端 661px）。
 *
 * v1 の ea-product-listing-styles.css は本番と共有なので触らない。
 * セレクタは .entry-content を足して 0,2,0 にし、読み込み順が入れ替わっても勝つようにする
 * （このファイル冒頭のサイドバー入れ替えと同じ理由）。
 */
.entry-content .ea-listing-container {
	padding-top: 12px;
}