/**
 * InstaPay front-end styles: checkout payment box, order received page.
 * Neutral by design so the active theme keeps control of typography.
 */

.instapay-details {
	margin: 0 0 1em;
}

.instapay-instructions {
	margin: 0 0 1em;
}

.instapay-instructions p:last-child {
	margin-bottom: 0;
}

.instapay-account {
	margin: 0 0 1em;
	padding: 0;
	list-style: none;
	border: 1px solid rgba( 0, 0, 0, 0.12 );
	border-radius: 4px;
}

.instapay-account li {
	display: flex;
	flex-wrap: wrap;
	gap: 0.5em;
	justify-content: space-between;
	margin: 0;
	padding: 0.6em 0.9em;
	border-bottom: 1px solid rgba( 0, 0, 0, 0.08 );
}

.instapay-account li:last-child {
	border-bottom: 0;
}

.instapay-account__label {
	opacity: 0.75;
}

.instapay-account__value {
	font-weight: 600;
	word-break: break-word;
	text-align: right;
}

.instapay-account__total .instapay-account__value {
	font-size: 1.1em;
}

.instapay-qr-wrap {
	margin: 0 0 1em;
	text-align: center;
}

.instapay-qr-wrap img,
img.instapay-qr {
	display: inline-block;
	max-width: 220px;
	height: auto;
	border: 1px solid rgba( 0, 0, 0, 0.12 );
	border-radius: 4px;
	padding: 8px;
	background: #fff;
}

.instapay-qr-caption {
	margin: 0.5em 0 0;
	font-size: 0.9em;
	opacity: 0.75;
}

.instapay-upload {
	margin: 0 0 1em;
}

.instapay-upload__input {
	display: block;
	width: 100%;
	max-width: 100%;
	margin: 0.35em 0;
}

.instapay-upload__hint {
	display: block;
	font-size: 0.85em;
	opacity: 0.7;
}

.instapay-upload__status:empty {
	display: none;
}

.instapay-upload__done {
	display: flex;
	align-items: center;
	flex-wrap: wrap;
	gap: 0.6em;
}

.instapay-upload__thumb {
	width: 48px;
	height: 48px;
	object-fit: cover;
	border-radius: 4px;
	border: 1px solid rgba( 0, 0, 0, 0.15 );
}

.instapay-upload__ok {
	color: #1b7a43;
	font-weight: 600;
}

.instapay-upload__error {
	color: #b32d2e;
	font-weight: 600;
}

.instapay-upload__busy {
	opacity: 0.8;
}

.instapay-upload__remove {
	background: none;
	border: 0;
	padding: 0 0.25em;
	margin: 0;
	font: inherit;
	font-size: 0.9em;
	color: inherit;
	opacity: 0.7;
	text-decoration: underline;
	cursor: pointer;
}

.instapay-upload__remove:hover {
	opacity: 1;
}

.instapay-notice {
	margin: 0 0 1em;
	padding: 0.75em 1em;
	border-radius: 4px;
	background: rgba( 0, 0, 0, 0.04 );
	border-left: 3px solid rgba( 0, 0, 0, 0.25 );
}

.instapay-notice--ok {
	border-left-color: #1b7a43;
}

.instapay-thankyou {
	margin: 0 0 2em;
}

.instapay-blocks__reference label,
.instapay-blocks__description {
	display: block;
	margin-bottom: 0.35em;
}

.instapay-blocks__reference input[type="text"] {
	width: 100%;
}