/**
 * Layout fixes for the Invoice / E-Invoice action buttons that the plugin
 * injects into WooCommerce's order details table (thank-you page, view-order
 * page, My Account → Orders).
 *
 * The !important is needed because some themes (Flatsome's smallscreen
 * stylesheet in particular) promote .button to display:block; width:100%
 * inside table cells on mobile, which would stack the buttons with no gap.
 */



.woocommerce-order-details .order-actions--heading + td,
table.shop_table .order-actions--heading + td {
	white-space: nowrap !important;
	padding-top: 8px !important;
	padding-bottom: 8px !important;
	line-height: 1.4 !important;
}

.woocommerce-order-details .order-actions--heading + td .order-actions-button,
.woocommerce-order-details .order-actions--heading + td .woocommerce-button,
table.shop_table .order-actions--heading + td .order-actions-button,
table.shop_table .order-actions--heading + td .woocommerce-button {
	display: inline-block !important;
	width: auto !important;
	float: none !important;
	margin: 0 8px 0 0 !important;
	vertical-align: middle !important;
	white-space: nowrap !important;
}

/* Optional: on very small screens allow wrapping, but keep clean spacing */
@media (max-width: 480px) {
	.woocommerce-order-details .order-actions--heading + td,
	table.shop_table .order-actions--heading + td {
		white-space: normal !important;
	}

	.woocommerce-order-details .order-actions--heading + td .order-actions-button,
	.woocommerce-order-details .order-actions--heading + td .woocommerce-button,
	table.shop_table .order-actions--heading + td .order-actions-button,
	table.shop_table .order-actions--heading + td .woocommerce-button {
		margin: 0 8px 8px 0 !important;
	}
}