/* Accessible Forms Pro: front-end styles that build on the free plugin's form.css. */
.af-wrap .af-turnstile {
	margin-block: 0.5em;
}

/* Steps, saved progress and attachments. The theme-proof guards for them stay in form.css. */
/* Attachments are not kept after a failed submit. The notice needs action,
 * so it is bold and marked with a bar, but it is not an error. */
.af-wrap .af-reselect {
	margin: 0;
	font-weight: 700;
	border-inline-start: 4px solid var(--af-text);
	padding-inline-start: 0.6em;
}
.af-wrap .af-progress ol {
	display: flex;
	flex-wrap: wrap;
	gap: 0.75rem 1.5rem;
	padding-inline-start: 1.5rem;
}
.af-wrap .af-progress [aria-current='step'] {
	font-weight: 700;
	text-decoration: underline;
	text-underline-offset: 4px;
}
.af-wrap .af-step-status {
	font-weight: 600;
}
.af-wrap .af-save-progress {
	margin-block-start: 24px;
	border-top: 1px solid var(--af-border);
	padding-block-start: 16px;
}
.af-wrap .af-save-progress summary {
	cursor: pointer;
	padding: 8px 0;
	font-weight: 600;
}
.af-wrap .af-draft-actions {
	display: flex;
	flex-wrap: wrap;
	gap: 12px;
}
.af-wrap .af-resume-link {
	width: 100%;
}
.af-wrap :is(button.af-step-back, button.af-step-next, button.af-review-edit, .af-save-progress button) {
	border-radius: var(--af-radius);
	padding: 0.65em 1em;
	font-family: inherit;
	line-height: inherit;
	cursor: pointer;
}

.af-wrap .af-review-heading {
	font-size: 1.2em;
	font-weight: 700;
	line-height: 1.4;
	margin: 0 0 0.5em;
}
.af-wrap .af-review > p {
	margin: 0 0 1.5em;
}
.af-wrap .af-review-list {
	margin: 0;
	padding: 0;
}
.af-wrap .af-review-row {
	padding-block: 1em;
	border-block-start: 1px solid var(--af-border);
}
.af-wrap .af-review-row dt {
	font-weight: 600;
	margin: 0 0 0.4em;
}
.af-wrap .af-review-row dd {
	display: flex;
	align-items: flex-start;
	justify-content: space-between;
	gap: 1em;
	margin: 0;
}
.af-wrap:not(#af-guard) .af-review-value {
	min-inline-size: 0;
	white-space: pre-wrap;
	overflow-wrap: anywhere;
}
.af-wrap:not(#af-guard) :is(.af-review-row dt, .af-review-value, .af-review > p) {
	font-size: max(var(--af-min-text), 1em) !important;
}
.af-wrap .af-review-edit {
	flex: none;
}
@media (max-width: 480px) {
	.af-wrap .af-review-row dd {
		flex-direction: column;
		gap: 0.75em;
	}
}