@import "@Themes/constants.scss";

.root {
	width: 566px;
	margin: auto;
	margin-top: 80px;
	display: flex;
	flex-direction: column;
	gap: var(--spacing-xl, 32px);

	@media (max-width: $screen-m) {
		width: 474px;
	}

	@media (max-width: $screen-s) {
		width: 100%;
		padding: var(--spacing-md, 16px);
	}

	.header {
		display: flex;
		flex-direction: column;
		gap: var(--spacing-sm, 8px);
	}

	.content {
		display: flex;
		flex-direction: column;
		gap: var(--spacing-xl, 32px);

		.section {
			.section-title {
				margin-bottom: var(--spacing-xl, 32px);
			}

			> form {
				display: flex;
				flex-direction: column;
				gap: var(--spacing-md, 16px);
			}
		}
	}
}