:root {
	--spacer: 1rem;
	--spacer-1: calc(var(--spacer) *.25);
	--spacer-2: calc(var(--spacer) * .5);
	--spacer-3: var(--spacer);
	--spacer-4: calc(var(--spacer) * 1.5);
	--spacer-5: calc(var(--spacer) * 3);
	--spacer-6: calc(var(--spacer) * 4.5);
	--spacer-7: calc(var(--spacer) * 6);

	--inner-spacing: var(--spacer);
}

.button__green svg {
	stroke: currentColor;
	vertical-align: middle;
}

.fb-auto {
	flex-basis: auto;
}

.u-gap-1 {gap: var(--spacer-1)}
.u-gap-2 {gap: var(--spacer-2)}
.u-gap, .u-gap-3 {gap: var(--spacer-3)}
.u-gap-4 {gap: var(--spacer-4)}
.u-gap-5 {gap: var(--spacer-5)}

.u-stack {
	display: flex;
	flex-direction: column;
}

.u-gap-inherit {
	gap: inherit;
}

.overflow-hidden {
	overflow: hidden;
}

label,
.form-group {
	margin-bottom: 0;
}

/* region fieldset */
.fieldset {
	display: flex;
	flex-direction: column;
	gap: var(--spacer-4);
	padding-block: var(--spacer-3);
	overflow: hidden;
}

.fieldset__legend {
	display: flex;
	margin: 0;
	color: white;
	background-color: var(--color-theme);
}

.fieldset > .fieldset__legend {
	margin-top: calc(var(--spacer-3) * -1);
	margin-bottom: calc(var(--spacer-2) * -1);
}

fieldset > .fieldset__legend {
	float: left;
}

.fieldset > .row {
	margin-inline: 0;
}
/*noinspection CssNonIntegerLengthInPixels*/
@media (max-width: 575.98px) {
	.fieldset > .row {
		display: flex;
		flex-direction: column;
		gap: inherit;
	}
}
/* region fieldset */

/* region apps__toolbar */
.apps-toolbar,
.apps-toolbar .apps-toolbar__group {
	display: flex;
	flex-direction: column;
	align-items: stretch;
	gap: inherit;
}

@media (min-width: 576px) {
	.apps-toolbar,
	.apps-toolbar .apps-toolbar__group {
		flex-direction: row;
		align-items: center;
	}

	.apps-toolbar--split {
		justify-content: space-between;
	}

	.u-w-sm-auto { width: auto }
}
/* endregion apps__toolbar */

/* region occupant */
#occupants {
	overflow: clip!important;
}

.occupant {
	flex-shrink: 0;
}

.occupant:focus-visible {
	box-shadow: none;
}

.occupant__legend {
	position: relative;
}

.occupant__remove {
	position: absolute;
	inset: 0 0 0 auto;
	border-radius: 0;
	background-color: rgb(220 53 69 / .85);
	color: white;
}

.occupant__remove:hover,
.occupant__remove:focus {
	background-color: rgb(220 53 69 / 1)
}
/* endregion occupant */

/* region colorbox */
.intro-message__head {
	font-weight: 500;
}

.form_feedback_title {
	background-color: var(--color-theme);
	padding: 6px;
	color: white;
	font-weight: 500;
	text-shadow: 1px 1px 1px #000;
}

.form_feedback_body {
	background-color: white;
	padding: .5rem .625rem;
	padding-inline-end: 1rem;
}
/* endregion colorbox */