.form-error {
	color: var(--color-red);
	font-size: var(--text-xs);
	margin-top: var(--spacing);
}

.form-footer {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: calc(2 * var(--spacing));

	> div {
		display: flex;
		align-items: center;
		gap: calc(2 * var(--spacing));
	}
}

.form-cols {
	display: grid;
	grid-template-columns: repeat(2, minmax(0, 1fr));
	gap: calc(6 * var(--spacing));

	@media (width < 40rem) {
		display: flex;
		flex-direction: column;
		gap: calc(4 * var(--spacing));
	}
}

.form-quick-select {
	display: flex;
	align-items: center;
	gap: calc(2 * var(--spacing));

	@media (width < 40rem) {
		flex-wrap: wrap;
		> input { flex: 1 0 100% }
	}
}