/* general */
.form-group {
	margin-bottom: 1rem;
}
.form-actions {
	margin-top: 2rem;
	display: flex;
	justify-content: center;
}
.form-actions > .btn + .btn {
	margin-left: 0.5rem;
}

/* component: group */
.form-box {
	--form-box-padding-x: 1rem;
	--form-box-padding-y: 1rem;
	--form-box-border-width: var(--bs-border-width);
	--form-box-border-color: var(--bs-border-color);
	--form-box-border-radius: var(--bs-border-radius);
	margin-bottom: 1rem;
	padding: var(--form-box-padding-y) var(--form-box-padding-x);
	border: var(--form-box-border-width) solid var(--form-box-border-color);
	border-radius: var(--form-box-border-radius);
}
.form-box.border-0 {
	--form-box-padding-x: 0;
	--form-box-padding-y: 0;
	--form-box-border-width: 0;
}
.form-box-header {
	margin-bottom: 2rem;
	display: flex;
}
.form-box-header > .form-box-title {
	align-self: center;
}

/* component: dynamic list */
.dynamic-list {
	margin-bottom: 1rem;
}
.dynamic-list > .form-box:not(:last-child) {
	margin-bottom: 0;
	border-bottom-left-radius: 0;
	border-bottom-right-radius: 0;
}
.dynamic-list > .form-box > .form-box-header > .btn-remove {
	margin-left: auto;
	align-self: flex-start;
	display: flex;
}
.dynamic-list > .form-box + .form-box {
	margin-top: calc(var(--form-box-border-width) * -1);
	border-top-left-radius: 0;
	border-top-right-radius: 0;
}
.dynamic-list > .form-box-btn {
	overflow: hidden;
	margin-bottom: 0;
	padding: 0;
	border: var(--form-box-border-width) solid var(--form-box-border-color);
	border-radius: 0 0 var(--form-box-border-radius) var(--form-box-border-radius);
}
.dynamic-list > .form-box-btn > .btn {
	width: 100%;
	border-top-left-radius: 0;
	border-top-right-radius: 0;
}

/* component: file picker */
.form-file {
	position: relative;
	display: flex;
}
.form-file > [type=file] {
	position: absolute;
	inset: 0;
	opacity: 0;
}
.form-file > .form-file-placeholder {
	border-top-right-radius: 0;
	border-bottom-right-radius: 0;
}
.form-file > .btn-browse {
	border-top-left-radius: 0;
	border-bottom-left-radius: 0;
}