/* Product card "Buy Now" next to "Add to cart" (inc/card-buy-now.php). */
.sng-card-actions {
	display: flex;
	gap: 8px;
	width: 100%;
}

.sng-card-actions > .button {
	flex: 1 1 0;
	min-width: 0;
	justify-content: center;
	white-space: nowrap;
}

/* Outline style; selectors beat the card's own `.brxe-e3bed8.brxe-product-add-to-cart button.button`. */
.sng-card-actions > button.button.sng-card-buy-now.sng-card-buy-now,
.sng-card-buy-now {
	display: flex;
	align-items: center;
	justify-content: center;
	padding: 9px 16px;
	font-family: "Work Sans", sans-serif;
	font-size: 14px;
	font-weight: 600;
	line-height: 1.5;
	color: var(--color-ink, #2b1d14);
	cursor: pointer;
	background-color: transparent;
	border: 1px solid var(--color-ink, #2b1d14);
	border-radius: var(--radius-pill, 999px);
	transition: background-color 0.2s, color 0.2s;
}

.sng-card-actions > button.button.sng-card-buy-now.sng-card-buy-now:hover,
.sng-card-actions > button.button.sng-card-buy-now.sng-card-buy-now:focus-visible {
	color: var(--color-surface-cream, #f9f5ee);
	background-color: var(--color-ink, #2b1d14);
}

/* Card hover paints the card's buttons orange (`.sng-card:hover .sng-card__cta ... button.button`): keep the
   outline while the card is hovered, fill only when the button itself is hovered. */
@media (hover: hover) {
	.sng-card:hover .sng-card__cta .sng-card-actions > button.button.sng-card-buy-now.sng-card-buy-now {
		color: var(--color-ink, #2b1d14);
		background-color: transparent;
	}

	.sng-card:hover .sng-card__cta .sng-card-actions > button.button.sng-card-buy-now.sng-card-buy-now:hover,
	.sng-card:hover .sng-card__cta .sng-card-actions > button.button.sng-card-buy-now.sng-card-buy-now:focus-visible {
		color: var(--color-surface-cream, #f9f5ee);
		background-color: var(--color-ink, #2b1d14);
	}
}

/* Phones (two cards per row): buttons stacked. */
@media (max-width: 767px) {
	.sng-card-actions {
		flex-direction: column;
		gap: 6px;
	}

	.sng-card-actions > button.button.sng-card-buy-now.sng-card-buy-now {
		padding: 9px 0;
		font-size: 13px;
	}
}
