/*
 * Aoki Pochipp Adapter - in-article Pochipp box, phone layout.
 * CSS only. Pochipp's own settings are not changed.
 * Phone (<600px): image left / title right, buttons stacked compactly below.
 */
@media screen and (max-width: 599px) {
	body .pochipp-box[data-lyt-mb] {
		display: grid !important;
		grid-template-columns: 92px minmax(0, 1fr);
		grid-template-areas:
			"img body"
			"btns btns"
			"logo logo";
		column-gap: 12px;
		row-gap: 0;
		align-items: start;
		box-sizing: border-box;
		width: auto !important;
		max-width: none !important;
		margin: 20px 0 !important;
		padding: 14px 12px 8px !important;
		border-radius: 12px;
		font-size: 13px;
	}

	body .pochipp-box[data-lyt-mb][data-img="r"] {
		grid-template-columns: minmax(0, 1fr) 92px;
		grid-template-areas:
			"body img"
			"btns btns"
			"logo logo";
	}

	body .pochipp-box[data-lyt-mb]:not(:has(.pochipp-box__image)) {
		grid-template-columns: minmax(0, 1fr);
		grid-template-areas:
			"body"
			"btns"
			"logo";
	}

	body .pochipp-box[data-lyt-mb] .pochipp-box__image {
		grid-area: img;
		width: 92px !important;
		margin: 0 !important;
		padding: 0 !important;
	}

	body .pochipp-box[data-lyt-mb] .pochipp-box__image a {
		display: block;
		overflow: hidden;
		border-radius: 8px;
		background: #fff;
	}

	body .pochipp-box[data-lyt-mb] .pochipp-box__image img {
		display: block;
		width: 92px !important;
		height: 92px !important;
		max-width: none !important;
		margin: 0 !important;
		object-fit: contain;
	}

	body .pochipp-box[data-lyt-mb] .pochipp-box__body {
		grid-area: body;
		width: auto !important;
		min-width: 0;
		margin: 0 !important;
		padding: 0 !important;
		align-self: center;
	}

	body .pochipp-box[data-lyt-mb] .pochipp-box__title {
		display: -webkit-box;
		margin: 0 0 4px !important;
		overflow: hidden;
		font-size: 14px;
		font-weight: 700;
		line-height: 1.5;
		-webkit-box-orient: vertical;
		-webkit-line-clamp: 3;
		line-clamp: 3;
		overflow-wrap: anywhere;
	}

	body .pochipp-box[data-lyt-mb] .pochipp-box__title a {
		font-weight: 700;
	}

	body .pochipp-box[data-lyt-mb] .pochipp-box__info {
		margin: 0 !important;
		font-size: 11.5px;
		line-height: 1.4;
		opacity: .75;
	}

	body .pochipp-box[data-lyt-mb] .pochipp-box__price {
		margin: 2px 0 0 !important;
		font-size: 12px;
	}

	body .pochipp-box[data-lyt-mb] .pochipp-box__btns {
		grid-area: btns;
		display: flex !important;
		flex-direction: column;
		gap: 8px;
		margin: 12px 0 0 !important;
		padding: 0 !important;
	}

	body .pochipp-box[data-lyt-mb] .pochipp-box__btns > .pochipp-box__btnwrap {
		flex: 0 0 auto !important;
		width: 100% !important;
		min-width: 0 !important;
		max-width: 100% !important;
		margin: 0 !important;
		padding: 0 !important;
		font-size: 15px;
	}

	body .pochipp-box[data-lyt-mb] .pochipp-box__btn {
		min-height: 46px;
		padding: 9px 12px !important;
		font-size: 15px;
		line-height: 1.3;
	}

	body .pochipp-box[data-lyt-mb] .pochipp-box__saleInfo {
		margin: 0 0 3px !important;
		font-size: 11.5px;
		line-height: 1.35;
	}

	/* Sale microcopy badge (sale-microcopy plugin) placed above each button. */
	body .pochipp-box[data-lyt-mb] .pochipp-box__btnwrap > .smc-badge {
		margin: 0 0 4px !important;
		padding: 3px 10px !important;
		font-size: 12px !important;
		line-height: 1.35 !important;
	}

	body .pochipp-box[data-lyt-mb] .pochipp-box__logo {
		position: static !important;
		grid-area: logo;
		justify-self: end;
		margin: 6px 0 0 !important;
	}
}

@media screen and (max-width: 359px) {
	body .pochipp-box[data-lyt-mb] {
		grid-template-columns: 76px minmax(0, 1fr);
		column-gap: 10px;
		padding: 12px 10px 8px !important;
	}

	body .pochipp-box[data-lyt-mb][data-img="r"] {
		grid-template-columns: minmax(0, 1fr) 76px;
	}

	body .pochipp-box[data-lyt-mb] .pochipp-box__image,
	body .pochipp-box[data-lyt-mb] .pochipp-box__image img {
		width: 76px !important;
	}

	body .pochipp-box[data-lyt-mb] .pochipp-box__image img {
		height: 76px !important;
	}
}