/*
 * Gr4vy gateway row on the checkout: title and card logos on one line,
 * tagline underneath. The title is a bare text node inside the label, so it
 * becomes the first flex item on its own.
 *
 * FunnelKit's checkout forces payment labels to `display: initial !important`
 * (selector specificity 1-4-4) and their spans to inline-block, so every rule
 * here is !important and uses a selector that outranks it (1-5-4); the
 * repeated class is only there to add specificity (two copies would only
 * tie at 1-4-4, and FunnelKit's stylesheet loads later, so it would win).
 */
body #payment ul.payment_methods li.wc_payment_method.payment_method_gr4vy.payment_method_gr4vy.payment_method_gr4vy > label {
	display: inline-flex !important;
	flex-wrap: wrap !important;
	align-items: center !important;
	column-gap: 0.75em !important;
	row-gap: 0.25em !important;
	width: calc(100% - 2.5em) !important;
	vertical-align: middle !important;
}

body #payment ul.payment_methods li.wc_payment_method.payment_method_gr4vy.payment_method_gr4vy.payment_method_gr4vy > label .gr4vy-card-brands {
	display: inline-flex !important;
	flex-wrap: wrap !important;
	gap: 6px !important;
	margin: 0 0 0 auto !important;
	order: 2 !important;
}

body #payment ul.payment_methods li.wc_payment_method.payment_method_gr4vy.payment_method_gr4vy.payment_method_gr4vy > label .gr4vy-card-brands img {
	display: block !important;
	width: 38px !important;
	height: 24px !important;
	max-height: none !important;
	margin: 0 !important;
	float: none !important;
}

body #payment ul.payment_methods li.wc_payment_method.payment_method_gr4vy.payment_method_gr4vy.payment_method_gr4vy > label .gr4vy-tagline {
	display: flex !important;
	align-items: center !important;
	flex-basis: 100% !important;
	order: 3 !important;
	margin: 0 !important;
	font-size: 0.875em !important;
	font-weight: normal !important;
	opacity: 0.75;
}

body #payment ul.payment_methods li.wc_payment_method.payment_method_gr4vy.payment_method_gr4vy.payment_method_gr4vy > label .gr4vy-lock {
	display: block !important;
	flex: none !important;
	margin: 0 0.4em 0 0 !important;
}

@media (max-width: 600px) {
	body #payment ul.payment_methods li.wc_payment_method.payment_method_gr4vy.payment_method_gr4vy.payment_method_gr4vy > label .gr4vy-card-brands {
		gap: 4px !important;
		margin: 0 !important;
		order: 4 !important;
	}

	body #payment ul.payment_methods li.wc_payment_method.payment_method_gr4vy.payment_method_gr4vy.payment_method_gr4vy > label .gr4vy-card-brands img {
		width: 32px !important;
		height: 20px !important;
	}
}