/* 위시리스트 (2026-09-13 D267) — 하트 버튼 + 목록. 와이어프레임 톤, 모양은 디자이너 몫.
   하트는 44px 터치 면적. 카드에서는 담기 버튼 옆, 상세에서는 담기 버튼 오른쪽, 목록에서는 줄 끝. */
.pn-wish {
	display: inline-flex; align-items: center; justify-content: center;
	width: 44px; height: 44px; margin: 0; padding: 0;
	border: 1px solid var(--pn-line); border-radius: 2px; background: #fff; color: var(--pn-ink);
	font-size: 20px; line-height: 1; cursor: pointer; text-decoration: none; vertical-align: middle;
	transition: border-color .15s, color .15s;
}
.pn-wish:hover { border-color: var(--pn-ink); }
.pn-wish[aria-pressed="true"] { color: #A23B2A; border-color: #A23B2A; }
.pn-wish[aria-busy="true"] { opacity: .6; }
.pn-wish__icon { display: block; transform: translateY(-1px); }

/* 상점 카드 — product-button 블록 바로 뒤. 블록이 만드는 버튼과 한 줄에 놓는다. */
.wc-block-components-product-button + .pn-wish--card,
.pn-wish--card { margin-left: 8px; }
/* 우커머스가 이 래퍼를 flex **column**(gap 12px)으로 그린다(실측) — 행으로 돌려야 하트가 담기 버튼 옆에 선다.
   담기 버튼의 인라인 margin-bottom:1rem 은 행에서 세로를 어긋나게 하므로 여기서만 0. */
.wc-block-components-product-button.wp-block-woocommerce-product-button { flex-direction: row; align-items: center; justify-content: center; flex-wrap: wrap; gap: 8px; }
.wc-block-components-product-button.wp-block-woocommerce-product-button > .wp-block-button__link { margin-bottom: 0 !important; } /* 인라인 style 을 이기려면 !important 가 유일 — 아임웹 위젯 규칙과 무관한 WP 화면 */
.wp-block-woocommerce-product-button .pn-wish--card { margin-left: 0; }

/* 상품 상세 — form.cart 안, 담기 버튼 옆 */
form.cart .pn-wish--single { margin-left: 8px; }

/* 목록 */
.pn-wishlist { list-style: none; margin: 0; padding: 0; border-top: 1px solid var(--pn-line); }
.pn-wishlist__item { display: grid; grid-template-columns: 96px 1fr; gap: 14px; padding: 16px 0; border-bottom: 1px solid var(--pn-line); }
.pn-wishlist__media img { display: block; width: 96px; height: 96px; object-fit: cover; background: var(--pn-line); }
.pn-wishlist__name { display: block; font-size: 15.5px; font-weight: 700; color: var(--pn-ink); text-decoration: none; margin-bottom: 4px; }
.pn-wishlist__name:hover { text-decoration: underline; text-underline-offset: 4px; }
.pn-wishlist__price { font-size: 14px; color: var(--pn-ink-soft); margin-bottom: 10px; }
.pn-wishlist__price .pn-price-tbd { display: block; font-size: 12px; margin: 4px 0 0; }
.pn-wishlist__actions { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; }
@media (min-width: 768px) {
	.pn-wishlist__item { grid-template-columns: 120px 1fr; gap: 20px; }
	.pn-wishlist__media img { width: 120px; height: 120px; }
}