/*
 * -----------------------------------------------------------------------------
 * Lucom Interaction Platform
 * (C) Lucom GmbH, Erkrath. All rights reserved.
 *
 * $Id: responsive.css 28049 2021-12-14 16:45:43Z marc $
 * -----------------------------------------------------------------------------
 */

@charset "UTF-8";

.flex-container {
	display: flex;
	flex-direction: row;
	flex-wrap: nowrap;
	align-items: flex-start;
	justify-content: flex-start;
	overflow: hidden;
}

.flex-container.flex-vertical {
	display: flex;
	flex-direction: column;
	flex-wrap: nowrap;
	align-items: stretch;
	justify-content: flex-start;
}

.flex-container > .formControl.formControlText,
.flex-container > .formControl.formControlMultilineText {
	/* overwrites fixed inline-size in FF for input fields with special type
	(e.g. type="number"), s. FFWS-9532 */
	inline-size: auto;
}

.flex-container > .formControl,
.flex-container > .lookupWrapper > .formControl,
.flex-container > .lip_signatureWrapper,
.flex-container > .lip_signatureWrapper > .formControlSignature {
	flex-basis: auto;
	flex-grow: 1;
	flex-shrink: 0;
}

.flex-container.flex-vertical > .formControl {
	flex-grow: 0;
}

.flex-container > label.formControl,
.flex-container > div.formControl.formControlLabel,
.flex-container > h1.formControl.formControlLabel,
.flex-container > h2.formControl.formControlLabel,
.flex-container > h3.formControl.formControlLabel,
.flex-container > h4.formControl.formControlLabel,
.flex-container > h5.formControl.formControlLabel,
.flex-container > h6.formControl.formControlLabel,
.flex-container > a.formControl.formControlLink,
.flex-container > .lip_signatureWrapper,
.flex-container > .lip_signatureWrapper > .formControlSignature {
	flex-shrink: 1;
}

.flex-container > label.formControl {
	flex-grow: 0;
}

.flex-container > div.formControl.formControlLabel {
	flex-grow: 1;
}

ul.ffw_errorLabel, ul.ffw_errorLabelMin {
	list-style: none;
	padding: 0;
	margin: 0;
}

.flex-container fieldset.formControl {
	align-self: stretch;
	flex-shrink: 1;
	/* reset min-width/min-inline-size of fieldset */
	min-width: 0;
}

.formToolbar .buttonPanel .toolbar .inner {
	flex-wrap: wrap;
}

.form-main .content {
	overflow-x: hidden;
	flex: 1 1 auto;
	/* needed for IE11 (FFWS-10936): */
	width: 100%;
}

.formControl.formControlSignature, .formControl.formControlSignature:focus {
	margin-right: 8px;
}

/* ------------------------------------------------------- control overwrites */

label.formControl,
div.formControl.formControlLabel,
h1.formControl.formControlLabel,
h2.formControl.formControlLabel,
h3.formControl.formControlLabel,
h4.formControl.formControlLabel,
h5.formControl.formControlLabel,
h6.formControl.formControlLabel,
a.formControl.formControlLink {
	overflow-wrap: break-word;
	word-break: break-word;
}

label.formControl,
div.formControl.formControlLabel {
	display: flex;
	align-items: center;
	justify-content: flex-start;
	min-width: 50px;
}

label.formControl.collapsed,
div.formControl.formControlLabel.notEditable,
div.formControl.formControlLabel.collapsed {
	align-items: flex-start;
}

img.formControl.formControlImage,
div.formControl.formControlImage {
	flex-grow: 0;
	flex-shrink: 0;
	flex-basis: auto;
}

div.formControl.formControlImage {
	display: flex;
	align-items: flex-start;
	justify-content: flex-start;
}

.lip_checkbox {
	flex-grow: 0;
	flex-shrink: 0;
}

.flex-container .ffw_addSegmentInstance.flex-container.flex-vertical {
	padding: 0;
	width: 100%;
	flex-wrap: nowrap;
	align-items: flex-start;
}

.flex-container .ffw_addSegmentInstance .button.primary {
	position: static;
	left: auto;
	top: auto;
	margin: 8px 45px;
	white-space: normal;
	flex-shrink: 1;
}

.form div.lookupWrapper {
	display: flex;
	flex-direction: row;
	flex-wrap: nowrap;
	align-items: center;
	justify-content: flex-start;
	flex-grow: 1;
	flex-shrink: 1;
}

.form div.lookupWrapper input.lookupOpener {
	position: static;
}

.form .lip_icon {
	height: 100%;
}

/* ------------------------------------------ viewport width dependent styles */

.flex-container {
	flex-wrap: nowrap;
	padding: 0;
}

.flex-container.flex-erroneous,
.flex-container.flex-errorGroup {
	padding: 0;
}

.flex-container .flex-column,
.flex-container .flex-labelGroup {
	flex-wrap: nowrap;
	padding: 0;
	align-items: stretch;
	width: 100%;
}

.flex-container > .formControl,
.flex-container > .lip_checkbox,
.flex-container > div.datePickerWrapper {
	margin: 0;
}

.flex-container.ffw_verticalColumnGroup,
.flex-container.ffw_verticalColumnGroup .flex-container {
	padding: 0;
	flex-wrap: nowrap;
	flex-grow: 1;
	flex-shrink: 1;
}

form.centered .goToTop {
	right: 20px;
}

.viewEmbeddings,
#lip_modalWindow .viewEmbeddings {
	padding: 0;
}

.viewEmbeddings .modal {
	width: auto;
	max-width: 1400px;
	margin: 15px 20px;
}

.flex-container > .flex-container.flex-column:not(.flex-vertical) .formControl,
.flex-container > .flex-container.flex-labelGroup:not(.flex-vertical) .formControl {
	flex-shrink: .75;
}

.flex-container > .flex-container.flex-column:not(.flex-vertical) label.formControl,
.flex-container > .flex-container.flex-labelGroup:not(.flex-vertical) label.formControl {
	flex-shrink: 1;
}


/* ------------------------------------------ responsive min-rendering (single column) */

.responsive-min .flex-container {
	flex-wrap: wrap;
	padding: 10px 20px;
}

.responsive-min .flex-container.error-container {
	padding: 0 !important;
	width: 100%;
}

 .responsive-min .flex-container.fixed-error-container {
 	width: 100%;
 }

 .responsive-min .flex-container.fixed-error-container:not(:last-child) {
 	padding: 0;
 }

 .responsive-min .flex-container.fixed-error-container:last-child {
 	padding: 0 0 10px 0;
 }

.responsive-min .flex-container > .flex-container:not(:last-child) {
	padding-bottom: 20px;
}

.responsive-min .flex-container.error-container > .flex-container:not(:last-child) {
	padding-bottom: 0;
}

.responsive-min .flex-container.error-container > .flex-container:last-child {
	padding-bottom: 20px;
}


.responsive-min .flex-container > .flex-container.flex-column:not(.flex-vertical),
.responsive-min .flex-container > .flex-container.flex-labelGroup:not(.flex-vertical) {
	flex-wrap: wrap;
}

.responsive-min .flex-container > .flex-container.flex-column.nowrap,
.responsive-min .flex-container > .flex-container.flex-labelGroup.nowrap {
	flex-wrap: nowrap;
}

.responsive-min .flex-container > .flex-container.flex-column:not(.flex-vertical) .formControl,
.responsive-min .flex-container > .flex-container.flex-labelGroup:not(.flex-vertical) .formControl {
	flex-shrink: 1;
}

.responsive-min .flex-container .flex-column,
.responsive-min .flex-container .flex-labelGroup {
	flex-wrap: nowrap;
	padding: 0;
	align-items: stretch;
	width: 100%;
}

.responsive-min .flex-container.flex-erroneous {
	padding: 10px 20px 0 20px;
}

.responsive-min .flex-container.flex-errorGroup {
	padding: 0 20px 10px 20px;
}

.responsive-min .flex-container > .formControl,
.responsive-min .flex-container > .formControl:focus,
.responsive-min .flex-container > .lip_checkbox,
.responsive-min .flex-container > div.datePickerWrapper,
.responsive-min .flex-container > div.selectize-control,
.responsive-min .flex-container > .ffw_addSegmentInstance .button.primary,
.responsive-min .flex-container > [id^="richEdit:"],
.responsive-min .flex-container > div.lip_signatureWrapper,
.responsive-min .flex-container > div.buttonWrapper,
.responsive-min .flex-container > div.lookupWrapper,
.responsive-min .flex-container > div.formControl.componentWrapper {
	margin: 0 10px 5px 10px;
}

.responsive-min .flex-container .ffw_addSegmentInstance.flex-container.flex-vertical {
	align-items: stretch;
}

.responsive-min ul.ffw_errorLabelMin {
	margin: 0 10px 5px 10px;
}

.responsive-min .viewEmbeddings {
	padding: 0 30px;
}

.responsive-min .ffw_segmentGroup {
	padding-top: 10px;
	padding-bottom: 10px;
}

.responsive-min .flex-container > fieldset.fieldset-structural.formControl {
	margin: 0;
}

.responsive-min fieldset.fieldset-structural > .flex-container {
	padding-left: 0;
	padding-right: 0;
}

.responsive-min fieldset.fieldset-structural > .flex-container:first-of-type {
	padding-top: 0;
}

.responsive-min fieldset.fieldset-structural > .flex-container:last-child {
	padding-bottom: 0;
}

/* ------------------------------------------------------------------- side bars
*/

/* aside */

.formBody .responsive-min:not(.responsive-form-only) .form-main aside {
	position: absolute;
	top: 0;
	transition: none;
}

/* sticky-content */

.formBody .responsive-min:not(.responsive-form-only) .form-main aside .sticky-content > * {
	padding-top: 0;
}

/* left */

.formBody .responsive-min:not(.responsive-form-only) .form-main aside.left {
	top: 0;
	height: 100%;
}

.formBody .responsive-min:not(.responsive-form-only) .form-main aside.left .sticky-spacer {
	display: none;
}

.formBody .responsive-min:not(.responsive-form-only) .form-main aside.left .sticky-content {
	top: 0;
	height: 100vh;
}