.alternative-actions {
	display: flex;
	flex-direction: column;
	gap: 1rem;
}
.actions-wrapper {
	display: flex;
	flex-direction: column;
	gap: 5rem;
}
button {
	width: fit-content;
}

form {
	flex: 1 0 0;
	align-self: stretch;
	display: flex;
	flex-direction: column;
	gap: 4rem;
}

.input-container {
	display: flex;
	flex-direction: column;
	gap: 3rem;
}

section {
	display: flex;
	flex-direction: column;
	gap: 5rem;
	align-self: stretch;
}

.message {
	font-size: 1.8rem;
}
.error {
	color: #991b1b;
}
.success {
	color: #166534;
}

@media screen and (max-width: 900px) {
	section {
		flex-direction: column;
		gap: 10rem;
	}
	form {
		gap: 5rem;
	}
}

.cbx-icon {
	width: 1.8rem;
	height: 1.8rem;
	position: relative;
	z-index: 1;
	fill: none;
	stroke-linecap: round;
	stroke-linejoin: round;
	stroke: var(--text-color);
	stroke-width: 1.5;
	transform: translate3d(0, 0, 0);
	transition: all 0.2s ease;
}

.cbx-wrapper {
	display: flex;
	flex-direction: row;
	gap: 1rem;
	align-items: flex-start;
}
.cbx-wrapper input[type='checkbox'] {
	position: absolute;
	opacity: 0;
	cursor: pointer;
	height: 0;
	width: 0;
}
.cbx-wrapper label {
	display: inline-block;
	font-size: 2rem;
}

.cbx-wrapper .check {
	cursor: pointer;
	position: relative;
	width: 1.8rem;
	height: 1.8rem;
	-webkit-tap-highlight-color: transparent;
	transform: translate3d(0, 0, 0);
}
.cbx-icon path {
	stroke-dasharray: 64;
	stroke-dashoffset: 0;
}
.cbx-icon polyline {
	stroke-dasharray: 22;
	stroke-dashoffset: 66;
}
.cbx-wrapper .check:hover svg {
	opacity: 0.6;
}
.cbx-wrapper input[type='checkbox']:checked + .check svg {
	opacity: 1;
}
.cbx-wrapper input[type='checkbox']:checked + .check svg path {
	stroke-dashoffset: 64;
	transition: all 0.3s linear;
}
.cbx-wrapper input[type='checkbox']:checked + .check svg polyline {
	stroke-dashoffset: 42;
	transition: all 0.2s linear;
	transition-delay: 0.15s;
}
.check.error svg {
	stroke: #991b1b;
}
.checkbox-error {
	margin-top: -2rem;
}

.form-heading {
	display: flex;
	flex-direction: column;
	gap: 2rem;
}
