/* PIE Affiliate — 상품 상자·대가성 문구. 테마 팔레트 변수가 있으면 따르고, 없으면 기본색. */
.pie-disclosure {
	margin: 0 0 28px;
	padding: 12px 16px;
	border-radius: 14px;
	border: 1px solid var(--wp--preset--color--line, #E7E3DC);
	background: var(--wp--preset--color--butter, #FFF8DC);
	color: var(--wp--preset--color--muted, #3E3A36);
	font-size: 14px;
	line-height: 1.6;
}
.pie-product {
	display: flex;
	flex-wrap: wrap;
	gap: 20px;
	align-items: center;
	margin: 32px 0;
	padding: 24px;
	border: 2px solid var(--wp--preset--color--ink, #17161A);
	border-radius: 24px;
	background: var(--wp--preset--color--white, #FFFFFF);
	color: var(--wp--preset--color--ink, #17161A);
	transition: transform .28s cubic-bezier(.2, .8, .2, 1), box-shadow .28s cubic-bezier(.2, .8, .2, 1);
}
.pie-product:hover,
.pie-product:focus-within {
	transform: translateY(-4px);
	box-shadow: 0 14px 30px -14px rgba(23, 22, 26, .4);
}
.pie-product__body { flex: 1 1 260px; min-width: 0; display: flex; flex-direction: column; gap: 8px; align-items: flex-start; }
.pie-product__body > p { margin: 0; }
.pie-product__label { font-size: 12px; font-weight: 700; letter-spacing: .08em; color: var(--wp--preset--color--blue, #2F3FB8); }
.pie-product__name { font-size: 19px; font-weight: 700; line-height: 1.4; }
.pie-product__desc { font-size: 15px; line-height: 1.6; color: var(--wp--preset--color--muted, #4A4641); }
.pie-product__btn {
	display: inline-flex;
	align-items: center;
	min-height: 44px;
	margin-top: 6px;
	padding: 0 22px;
	border-radius: 999px;
	border: 2px solid var(--wp--preset--color--ink, #17161A);
	background: var(--wp--preset--color--cheese, #E8772E);
	color: var(--wp--preset--color--ink, #17161A);
	font-weight: 700;
	font-size: 15px;
	text-decoration: none;
}
.pie-product__btn:hover,
.pie-product__btn:focus-visible { background: var(--wp--preset--color--ink, #17161A); color: #fff; }
.pie-product__btn:focus-visible { outline: 3px solid var(--wp--preset--color--cheese, #E8772E); outline-offset: 3px; }
.pie-product__widget { flex: 0 0 auto; max-width: 100%; }
.pie-product__widget iframe { display: block; max-width: 100%; border: 0; border-radius: 12px; }
.pie-product-missing { padding: 8px 12px; border: 2px dashed #B32D2E; border-radius: 10px; color: #B32D2E; font-size: 14px; }
/* 사이트 공통 상품 카드(D-16): 버튼 위 고양이 귀(테마 공유 버튼과 같은 모양), 작은 제휴 표시 */
.pie-product [hidden] { display: none !important; }
.pie-product--site .pie-product__btn { position: relative; gap: 8px; margin-top: 16px; }
.pie-product--site .pie-product__btn > * { position: relative; z-index: 1; }
.pie-product--site .pie-product__btn > .pie-product__ear { position: absolute; top: -10px; width: 16px; height: 14px; pointer-events: none; }
.pie-product__ear--l { left: 14px; }
.pie-product__ear--r { right: 14px; }
.pie-product__ear path { fill: var(--wp--preset--color--cheese, #E8772E); stroke: var(--wp--preset--color--ink, #17161A); stroke-width: 2; stroke-linejoin: round; }
.pie-product__btn:hover .pie-product__ear path,
.pie-product__btn:focus-visible .pie-product__ear path { fill: var(--wp--preset--color--ink, #17161A); }
.pie-product__note { font-size: 12px; line-height: 1.5; color: var(--wp--preset--color--muted, #4A4641); }
/* 상품 이미지(0.1.4): 카드 안 가로 배치, 원본 120x240 세로 배너라 contain. 바깥 여백 없이 카드 gap 으로만 띄운다. */
.pie-product--site .pie-product__body { flex: 1 1 160px; }
.pie-product--site .pie-product__widget { flex-basis: 100%; }
.pie-product__media {
	flex: 0 0 120px;
	display: block;
	width: 120px !important;
	max-width: 120px;
	margin: 0;
	border: 1px solid var(--wp--preset--color--ink, #17161A);
	border-radius: 12px;
	overflow: hidden;
	background: var(--wp--preset--color--white, #FFFFFF);
	line-height: 0;
}
.pie-product__media:focus-visible { outline: 3px solid var(--wp--preset--color--cheese, #E8772E); outline-offset: 3px; }
.pie-product__img { display: block; width: 120px !important; height: auto !important; max-width: none; max-height: none; margin: 0; } /* 공식 배너(120x240)를 자르지 않고 그대로 — 상품명·쇼핑하기까지 보여야 승인 스크린샷에 유리 */
.pie-product__host { font-size: 12px; line-height: 1.4; letter-spacing: .02em; color: var(--wp--preset--color--muted, #4A4641); }
@media (max-width: 390px) {
	.pie-product--site { flex-direction: column; align-items: flex-start; }
	.pie-product--site .pie-product__body { flex: 0 0 auto; width: 100%; }
	.pie-product--site .pie-product__media { flex: 0 0 auto; } /* 세로 배치에선 flex-basis 가 높이가 된다 — 120px 로 두면 배너가 정사각형으로 잘린다 */
}
@media (prefers-reduced-motion: reduce) {
	.pie-product { transition: none; }
	.pie-product:hover, .pie-product:focus-within { transform: none; }
}
