.wcpay-card-body {
	// increasing the specificity of the styles to override the Gutenberg ones
	&#{&} {
		padding: $grid-unit-30;
	}

	h4 {
		@include heading-md;
		margin-top: 0;
		margin-bottom: 24px;

		&:not( :first-child ) {
			margin-top: 32px;
		}

		+ p {
			margin-top: calc( 8px );
			margin-bottom: 24px;
			font-size: 12px;
			font-style: normal;
			color: #757575;
		}

		&:has( + p ) {
			margin-bottom: 0;
		}
	}

	> * {
		margin-top: 0;
		margin-bottom: 1em;

		// fixing the spacing on the inputs and their help text, to ensure it is consistent
		&:last-child {
			margin-bottom: 0;

			> :last-child {
				margin-bottom: 0;
			}
		}
	}

	input,
	select {
		margin: 0;
	}

	// spacing adjustment on "Express checkouts > Show express checkouts on" list
	ul > li:last-child {
		margin-bottom: 0;

		.components-base-control__field {
			margin-bottom: 0;
		}
	}

	// overriding the core styles to ensure that the select element can be clickable along its width.
	.wp-core-ui & select {
		max-width: none;
	}

	.components-checkbox-control {
		input[type='checkbox'] {
			&:checked:disabled {
				opacity: 0.3;
			}
		}
	}
}
