/* Use margins and iframe heights (ew) to make the gaps. */
/* Adding a manual gap causes problems with Clover's iFrame heights */
#payment-form {
	gap: 0;
}

/* For some reason, Clover assigns a massive height on every iframe, and each element is its own iframe */
iframe {
	height: 4rem !important;
	overflow: hidden !important;
}

/* Override the stylesheet defaults. This is for the calc'd total */
input:disabled {
	background-color: var(--background-color);
	color: var(--text-color) !important;
	font-weight: bold;
	text-align: center;
}

input:disabled::placeholder {
	color: var(--text-color);
}

/* Start with card-payment being hidden, as default is cash */
/* Note: default is cash primarily so the iframes can load in */
#card-payment, #check-info {
	display: none;
	background-color: var(--sand);
	margin-block-start: 1rem;
	border-radius: var(--round-corners);
}

#check-info {
	margin-block-end: 0;
	padding-block: 0.5em;
}

/* Fix Clover's Privacy Policy link being illegible */
.clover-footer a {
	color: #B1B6B8 !important;
}