/*
 * "After buy" row under the trust bullets: divider, "Add to wishlist"
 * (CommerceKit's link, moved here by after-buy.js) on the left, payment
 * notice ("Köp nu, betala senare med Klarna.") on the right. Rendered by
 * includes/class-tpux-after-buy.php; loaded only while the row is on.
 */
.tpux-after-buy {
	display: flex;
	/* Never wrap the two cells: the notice wraps INSIDE its own cell,
	   right-aligned, so on a phone "Klarna." drops to a second line under
	   the notice text rather than the whole notice dropping under the
	   wishlist link (v2.14.3). */
	flex-wrap: nowrap;
	justify-content: space-between;
	align-items: center;
	gap: 8px 16px;
	margin: 16px 0 0;
	padding-top: 14px;
	border-top: 1px solid #ececec;
	font-size: 13px;
	line-height: 1.4;
	color: #555;
}

/* Wishlist slot: CommerceKit's own link keeps its heart icon; kill the
   margins its wrapper carries and put icon + text on the same centre
   line as the notice (v2.12.3). */
.tpux-after-buy__wishlist {
	flex: 0 0 auto;
	display: flex;
	align-items: center;
}

.tpux-after-buy__wishlist .commercekit-wishlist {
	margin: 0 !important;
	padding: 0 !important;
	line-height: 1.4;
}

.tpux-after-buy__wishlist .commercekit-wishlist a,
.theme-shoptimizer .tpux-after-buy__wishlist .commercekit-wishlist a {
	display: inline-flex;
	align-items: center;
	margin: 0;
	padding-top: 4px;
	font-size: 13px;
	line-height: 1.4;
}

/* The wrapper CommerceKit rendered into is empty after the move — no
   stray spacing. */
#shoptimizer-modals-wrapper:empty {
	display: none;
}

.tpux-after-buy__notice {
	flex: 1 1 auto;
	min-width: 0;
	margin-left: auto;
	text-align: right;
	line-height: 1.4;
}

.tpux-after-buy__notice strong {
	color: #111;
	font-weight: 700;
}

.tpux-after-buy__notice a {
	color: inherit;
	text-decoration: underline;
}

/* Only the notice (no wishlist found): keep it right-aligned. */
.tpux-after-buy--no-wishlist .tpux-after-buy__wishlist {
	display: none;
}

/* Image in the notice (a payment-methods strip or a logo pasted as
   <img>): the width/height attributes on the tag decide its size, it
   never overflows the cell, and it sits on the text line (v2.15.1 —
   2.15.0 capped it at 20px high, too small for a 300px strip). */
.tpux-after-buy__notice img {
	display: inline-block;
	max-width: 100%;
	height: auto;
	vertical-align: middle;
	margin: 0;
}