/* ID:17002 */
@charset "utf-8";

input.person{
	width:15em;
}
input[type="number"]{
	padding-right: 4px;
	text-align: right;
	body.touch &,/*always disabled*/
	&.nospin{
		&::-webkit-outer-spin-button,
		&::-webkit-inner-spin-button {
			-webkit-appearance: none;
		}

		& {
			-moz-appearance: textfield;
		}
	}
}

i[onclick],
a[onclick]{
	cursor:pointer;
}

main#content.qmTools {
	.ersteller{
		display: none;
	}
	@media print {
		.ersteller{
			display: flex;
		}
	}
	visibility: hidden;
}

div#liste{
	/*wo wird das benutzt?*/
	h4{
		border-radius: 5px;
	}
}

/*list on mainpage*/
div.liste{
	table.messages tbody td{
		height:4ex;
		padding-left: 1em;
		padding-right: 1em;
		vertical-align: middle;
		&:first-child{
			padding-left:0;
			padding-right: 0;
		}
	}
}

@keyframes fadeAway {
	0% {
		opacity:1;
	}
	99%{
		min-height: 4ex;
		height:inherit;
	}
	100% {
		display:none;
		opacity:0;
		position:absolute;
		visibility: hidden;
	}
}

/*warnings*/
div{
	&.erfolg,
	&.fehler,
	&.warnung,
	&.information,
	&.running{
		background: lightgray;
		border: 1px solid;
		border-radius: 5px;
		font-family: "liberation_sans", sans-serif;
		margin-bottom: 1ex;
		max-width:50em;
		min-height: 4ex;
		overflow: visible;
		padding: 1ex 1em 1ex 4em;
		position: relative;
		&::before{
			font-family: var(--fa-font);
			font-size: inherit;
			font-style: normal;
			font-variant: normal;
			font-weight: 900;
			line-height: 1;
			font-size: 2em;
			left: .5em;
			position: absolute;
		}
		&.center{
			margin-left:auto;
			margin-right:auto;
		}
		/*Buttons in diesen Divs sollten keinen Platz zusätzlich beanspruchen*/
		button{
			margin:0!important;
		}
	}

	&.erfolg{
		animation: fadeAway 500ms 2s forwards;
		background-color: #dff0d8;
		border-color: #3c763d;
		color: #3c763d;
		left:0;
		position: absolute;
		right:0;
		top:0;
		z-index: 3002;
		&::before{
			content:var(--fa-var-check);
		}
	}

	&.information{
		background-color: #d9edf7;
		border-color: #31708f;
		color: #31708f;
		&::before{
			content:var(--fa-var-info-circle);
		}
	}

	&.fehler{
		color: #ca0a16;
		background-color: lightgrey;
		border-color: #ca0a16;
		font-weight: bold;

		&::before{
			content:var(--fa-var-exclamation-triangle);
		}
	}

	&.warnung{
		background-color: #fffa52;
		border-color: lightgrey;
		color: #606060;
		/*font-family: "liberation_sansbold", sans-serif;*/
		font-weight: bold;
		&::before{
			content:var(--fa-var-exclamation-circle);
		}
	}

	&,h4{
		&.gefahr {
			background-color:#B30000;
			border-radius: 5px;
			box-sizing: border-box;
			color:white;
			font-weight: bold;
			padding: 1ex;
		}
	}
	&.mangel {
		font-weight: bold;
	}
	&.done {
		background-color: lightgreen;
	}
	&.closeButton{
		margin-top: 4ex;
		text-align:center;
	}
	.markChange{
		float: right;
	}
}

#login_window{
	width:40em;
  height:37em;
	main{
		display:block;
	}
}

/*formdesigner*/
.formdesc{
	font-weight: bold;
}

.formrequired{
	color:red;
}

/*history*/
.historyContainer{
	background-color:white;
	max-height: 80ex;
	max-width: 80%;
	min-height: 10ex;
	min-width: 10em;

	table{
		width:95%;
		td.left{
			width: 12em;
		}
	}
	div.window_frame{
		padding:1ex;
	}
}

.rpc_waiting{
	align-items: center;
	background: #f5f5f5b3;
	bottom: 0;
	color: grey;
	display: grid;
	font-size: 3em;
	left: 0;
	position: absolute;
	right: 0;
	top: 0;
	width: 100%;
	z-index: +1;
	div{
		margin:auto;
		text-align: center;
		width:50%;
	}
}


.changed{
	border: 4px solid red;
}

option,optgroup,ul{
	.selectedVal{
		background: darkgrey;
		color: white;
		font-weight: bold;
	}
}

select{
	optgroup{
		font-weight:bold;
		font-style:italic;
		option{
			padding-left: 1em;
			background-color: white;
			color: #1F1C1B;
		}
	}
}

/*highlight some options*/
option,
ul.ui-multiselect-checkboxes li{
	&.important{
		color:white;
		background-color:red;
	}
	&.lowlight{
		color:grey
	}
	&.highlight{
		color:red;
		font-style: italic;
	}
}

label,
span{
	&.publicComment{
		color:blue;
	}
}

div.flexRow{
	display: flex;
	flex-wrap: wrap;
	flex-direction: row;
	&.flexSpace{
		justify-content: space-between;
		&.stickTop,
		&.stickBottom{
			box-sizing: border-box;
			padding-left: 0.5em;
		}
	}
}
span.radioItem{
	margin-right:2em;
}

fieldset{
	&.contentOnly{
		display: contents;
	}
	table.editTable{
		width:100%;
		background-color: #FBFBFB;
	}
	table.formdesigner{
		width:100%;
	}
}

table.formdesigner{
	tr.formdesigner{
		&.trenner{
			td{
				border-top:2px solid gray;
			}
		}

	}
	td{
		overflow: hidden;
	}
	td.formdesigner{
		&[colspan]{
			width: 100%;
		}
		.flexRow{
			column-gap: 3em;
		}
	}
}

nav.pager{
	text-align:center;
	/*remove navigation with one page*/
	&:has(button.first.disabled):has(button.last.disabled){
		display:none;
	}
}

nav.entryPager{
	display: flex;
  max-width: 60em;
  justify-content: space-between;
}

.stickTop,
.stickBottom{
	/*deactivated in mobile view*/
	background-color: lightgray;
	box-sizing: border-box;
	padding: 1ex 0 1ex 1ex;
	position: relative;
	position: sticky;
	width:100%;
	z-index: 3001;
	&.centered{
		text-align: center;
	}
}

.stickTop{
	height: 3.5rem;
	margin-bottom: 1ex;
	top: 0;
	button{
		max-height: 2.2em;
		max-width: 15em;
		overflow: hidden;
	}
}

.stickBottom{
	bottom:0;

	form{
		display: inline-block;
	}
}

body.plain{
	:has(> .stickTop){
		.floatingTabs{
			top: 3.5rem;
		}
	}
}

div.pagination{
	align-items: baseline;
	display: flex;
	gap: 1em;
	justify-content: center;
	button{
		margin-right:0 !important;
	}
	span.currentPage{
		font-weight: bold;
	}
	button.noButton,
	span.currentPage{
		padding-right:.75em;
	}
	.shortPages{
		white-space: nowrap;
	}
}

body.touch{
	div.pagination .longPages{
		display: none;
	}
}

body.plain{
	div.pagination .shortPages{
		display: none;
	}
}

/* JS-Paginierung Anzeige auf kleinen Screens*/
@media (max-width: 950px){
	div.pagination .longPages{
		display: none;
	}
}

form#filter{
	margin-bottom: 2ex;
}

table{
	/*pager*/

	&.inlineIcons{
		color:var(--themeColor);
		margin-bottom: 2ex;
	}
	&.filter{
		color: black;
		width:100%;
		max-width: 60em;
	}

	/*filter table*/
	&.filter,
	&.inlineIcons{

		td{
			padding-right:.5em;
			select,
			/*Multiselector*/
			button.ui-multiselect{
				min-width: 20em;
			}
			input:not([type="date"],[type="time"],[type="checkbox"],[type="radio"]){
				min-width: 20em;
			}
		}
	}
	&.inlineIcons tr td {
		&> span{
			position: relative;
			&> i {
				bottom: 0;
				font-size: 1.2em;
				left: 1ex;
				line-height: 1;
				position: absolute;
				/* zum Zentrieren der Icons spezifisch für checkin*/
				width: 2em;
			}
			input,
			select,
			button.ui-multiselect{
				padding-left: 2.4em;
			}
		}
	}

	&.MABildListe tbody tr{
		height: 8ex;
		.Bild,
		.Name:has(input.zoom){
			min-width: 12ex;
			position:relative;
			img{
				max-width: 3em;
			}
			input.zoom{
				display:none;
				& ~ label > img{
					cursor: zoom-in;
				}
				&:checked ~ label > img{
					background: white;
					border: 2px solid;
					cursor: zoom-out;
					max-width:min-content;
					/*position: absolute;  absoloute erzeugt scrolling - fixed hat die falsche position.*/
				}
			}
		}
		td.privat,
		td.dienstlich{
			i.fas{
				width:2em;
			}
		}
		&.newMA {

			img /*Startseite*/{
				border: 2px solid green;
			}
			td.Eintrittsdatum{
				font-weight: bold;
			}
		}
		&.wiederMA{
			img /*Startseite*/{
				border: 2px solid green;
			}
			td.Wiedereintritt{
				font-weight: bold;
			}
		}
		&.oldMA{
			img/*Startseite*/{
				border: 2px solid red;
			}
			td.Austrittsdatum{
				font-weight: bold;
			}
		}
		&.changeMA {
			img/*Startseite*/{
				border: 2px solid orange;
			}
			td.Vertragswechsel{
				font-weight: bold;
			}
		}
		.Name{
			/* Personalveränderungen abstände entfernen */
			label{
				margin-left: 0!important;
				padding: 0!important;
			}
		}
	}

	/*Tool specific*/
	&.innertable{
		width:100%;
	}
	&.editTable{
		td.left {
			color:#333;
			max-width: 22em;
			min-width: 16em;
			width: 30%;
			&:empty{
				background-color: inherit !important;
			}
		}
		td.right{
			padding-left:.5ex;
			span.helpText,
			span.helpIcon{
				display:inline-block;
			}
			span.helpIcon{
				max-width: 2.5em;
				right: 1ex;
				position: absolute;
			}
		}
		input.checkedOK{
			color:green;
		}
		span.changedVal{
			display: block;
			&:before{
				content:' (Vorher: ';
			}
			&:after{
				content: ')';
			}
		}
	}
	&.formdesigner{
		td.formdesigner{
			padding-right:2em;
			padding-bottom:1ex;
			padding-left:0.5em;
		}
		td.left {
			max-width: 22em;
			min-width: 14em;
			width: 30%;
		}
		td.left.empty {
			min-width: 0;
			padding: 0;
			width:0;
		}
		td.right{
			max-width:100%;
		}
		td.spaceTop{
			padding-top: 4ex;
		}
		td.nostyle div{
			padding:0;
		}
	}
	&.statistik{
		td{
			&.number{
				text-align:right;
				min-width: 2em;
			}
			&.sum{
				font-weight: bold;
			}
		}
	}
	&.desisummary tr{
		td,th{
			text-align: center;
		}
	}
	&.small{
		background-color: white;
		td {
			font-size: 9pt;
			vertical-align:top;
		}
		th {
			font-size: 10pt;
			vertical-align:top;
		}
	}

	&.verteilstatistik{
		td.Anzahl,
		td.Soll,
		td.Ist,
		td.Differenz {
			text-align:right;
		}

		td.Soll:after,
			td.Ist:after,
			td.Differenz:after {
			content: "%"
		}
	}

	&.MsgCenterFolder{
		tr.new td{
			font-weight: bold;
		}
	}
	/*buttons that should break to the next row*/
	td button.break{
		margin-top:1ex;
		display: block;
	}

	span,
	tbody tr,
	tbody tr td{
		&.del{
			text-decoration: line-through;
		}

		&.ersatz{
			color:red;
			font-style: italic;
		}
		&.leih{
			color:blue;
			font-style: italic;
		}
		&.inactive{
			color:grey;
			td.Ersetzen,
			td.Löschen{
				/* Für Stammdatenlöschung text verstecken, da nicht relevant */
				font-size: 0;
			}
		}
		&.warnung{
			color:white !important;
			background-color: red !important;
		}

		&.mark{
			color: red;
		}
		&.genehmigung{
			font-style: italic;
		}
		&.new{
			font-weight: bold;
		}
		&.important{
			font-weight: bold;
			color:red !important;
			input{
				color: red !important;
			}
		}
	}
	tr{
		&.changeLog{
			span.element{
				font-weight: bold;
				&:after{
					content: ": ";
				}
			}
			div.change{
				display:inline-block;
			}

			ins{
				text-decoration: underline;
			}
			del{
				text-decoration: line-through;
			}
		}
		&.break td{
			border-bottom: 2px solid #0073EA;
		}
		&.old{
			text-decoration: line-through;
		}
	}

	tr.required td label,
	td.required label{
		color:red;
		font-weight:bold;
	}

	tr.missing input,
	td.missing input,
	input.missing{
		border: 1px solid red;
	}

	td{
		&.center{
			text-align:center;
		}

		&.critical{
			color: red;
		}
		&.right{
			[type="button"],
			[type="reset"]{
				margin-left: 2em;
			}

			[type="submit"],
			[type="button"],
			[type="reset"]{
				min-width: 10em;
				margin-top: 2ex;
				&.smallButton,
				&.ui-multiselect-collapser{
					/*e.g. message center*/
					min-width: auto;
					margin-top: auto;
					margin-left: auto;
				}
			}
			button.noButton{
				background: none;
				border:none;
				color:darkblue;
			}

			[type="button"].ui-multiselect{
				margin-top: inherit;
				margin-left: inherit;
				margin-right: 0;
			}
			div.tox-tinymce button{
				width:auto;
				min-width: unset;
				margin-top:unset;
				margin-left:unset;
			}
			textarea{
				height:8ex;
			}
			input[type="number"]{
				width:12em;
				min-width: 0em;
			}
			select,
			.selectGroup,
			textarea,
			input:not(input[type="date"],input[type="datetime-local"],input[type="time"],input[type="radio"],input[type="checkbox"],input[type="number"]),
				/*Multiselector*/
				button.ui-multiselect,
				div.multicompleter,
				aldente-multicompleter,
				/* Tiny*/
				div.tox-tinymce{
				min-width: 25em;
				max-width: 35em;
				width:calc(100% - 3em);
			}
			span.concated{/*concated: hier sollten die Breiten nicht angepaßt werden!*/
				select,
				input:not(input[type="date"],input[type="time"],input[type="radio"],input[type="checkbox"],input[type="number"]),
					/*Multiselector*/
					button.ui-multiselect,
					/* Tiny*/
					div.tox-tinymce{
					min-width: unset;
					max-width: unset;
					width:unset;
				}
			}

			input[type="checkbox"].nullCheck{	/*hide checkboxes and switch ban*/
				display:none;
				& + button > label{
					& > i.fas{
						padding-right:0;
					}
					& > i.notNull{
						display:unset;
					}
					& > i.null{
						display:none;
					}
				}
				&:checked + button > label{
					& > i.notNull{
						display:none;
					}
					& > i.null{
						display:unset;
					}
				}
			}
		}

		.doLock{/*show locking icon if hovered*/
			text-align:center;
			padding-right:1em;
			i.doLock{
				visibility:hidden;
			}
			&:hover{
				i.doLock{
					visibility:visible;
					color:red;
				}
			}
		}
	}
}

div.legende{/*Legende bspw. in Statistik Fahrzeug*/
	margin-top:2ex;
	&::before{
		content:"Legende";
		font-weight:bold;
	}
	table{
		border:1px solid gray;
	}
}

span.help,
.formhelp,
label.help,
legend.help span{
	border-bottom-style: solid;
	border-bottom-width: 1px;
	cursor:help;
}

p.description{
	color:#cc0000;
}

label.b{
	font-weight: bold;
}

fieldset.editTable{
	border-radius: 5px;
	border: 1px solid lightgrey;
	margin-bottom: 3ex;
	margin-right:2em;
	max-width: 60em;
	min-width: unset;/* fix fieldset width*/
	padding: 1ex;
	table{
		&.mceLayout{
			table{
				width:auto;
			}
		}
		&.viewTable td{
			width:50%;
		}
	}
}

legend.editTable,
summary.editTable{
	border-radius: 4px;
	font-weight: bold;
	max-width: 90%;
	padding: 0 1ex;
	width: 22em;
}

legend.editTable,
/*klappbare Legend*/
summary.editTable{
	background: var(--legendColor);
	color: var(--legendFontColor);
}

/*Messages*/
div.vismenu {
	margin: 10px;
	z-index: 9999;
}

#visualization {
	background: white;
	position: relative;

	.vis-time-axis{
		.vis-grid.vis-saturday,
		.vis-grid.vis-sunday {
			background: gray;
		}

		.vis-text.vis-saturday,
		.vis-text.vis-sunday {
			color: white;
		}
		.vis-grid.vis-today{
			background: #FFD700;
		}
	}
	.vis-labelset{
		.vis-label.umgebucht{
			background-color:lightblue;
			color:white;
		}
		.vis-label.ersatz{
			color:red;
		}
	}
	.vis-item .vis-delete{
		background: none;
		&:hover:after{
			color:red !important;
		}
	}




	.vis-item{
		&.black{
			--base-color: black;
		}
		&.maroon{
			--base-color: maroon;
		}
		&.green{
			--base-color: green;
		}
		&.olive{
			--base-color: olive;
		}
		&.navy{
			--base-color: navy;
		}
		&.purple			{
			--base-color: purple;
		}
		&.teal{
			--base-color: teal;
		}
		&.gray{
			--base-color: gray;
		}
		&.red{
			--base-color: red;
		}
		&.blue{
			--base-color: blue;
		}
		&.fuchsia{
			--base-color:fuchsia;
		}
		&.silver{
			--base-color:silver;
		}
		&.orange{
			--base-color:orange;
		}
		&.lime{
			--base-color:lime;
		}
		&.yellow{
			--base-color:yellow;
		}
		&.aqua{
			--base-color:aqua;
		}
		&.white{
			--base-color:white;
		}
	}

	.vis-item{
		&.black,&.maroon,&.green,&.olive,&.navy,&.purple,&.teal,&.gray,&.red,&.blue,&.fuchsia{
			background-color: var(--base-color);
			border-color: lch(from var(--base-color) calc(l + 10) c h);
			color: white;
			&.unsteady{
				background: repeating-linear-gradient(45deg, var(--base-color), var(--base-color) 10px, #333 10px, #333 20px);
			}
			&.vis-selected{
				background-color: lch(from var(--base-color) calc(l + 20) c h);
				border-color:var(--base-color);
				&.unsteady{
					background: repeating-linear-gradient(45deg, lch(from var(--base-color) calc(l + 20) c h), lch(from var(--base-color) calc(l + 20) c h) 10px, #333 10px, #333 20px);
				}
			}
		}
	}


	.vis-item{
		&.silver,&.orange,&.lime,&.yellow,&.aqua,&.white{
			background-color: var(--base-color);
			border-color: lch(from var(--base-color) calc(l - 10) c h);
			color: black;
			&.unsteady{
				background: repeating-linear-gradient(45deg, var(--base-color), var(--base-color) 10px, #ccc 10px, #ccc 20px);
			}

			&.vis-selected{
				background-color: lch(from var(--base-color) calc(l - 20) c h);
				border-color:var(--base-color);
				&.unsteady{
					background: repeating-linear-gradient(45deg, lch(from var(--base-color) calc(l - 20) c h), lch(from var(--base-color) calc(l - 20) c h) 10px, #ccc 10px, #ccc 20px);
				}
			}
		}
	}


}

select:invalid + button.ui-multiselect{
	background: none;
	color:white;
	font-weight: bold;
}

input:invalid,
select:invalid,
select:invalid + button.ui-multiselect,
textarea:invalid {
	background-color: #fff0f0 !important;
	border: 1px solid red !important;
}

.hidden{
	display: none;
}

span.fileLink{
	display:inline-block;
	margin: 0px 1em 0px 1em;
}

/** Image upload */
.imgGroupFlex{
	display: flex;
	flex-wrap: wrap;
	img{
		cursor: pointer;
	}
}

div.uploadImg{
	/*START entfernen wenn UPPY
	standardmäßig nicht zeigen*/
	display: none;

	/*erstes el immer zeigen*/
	&:first-of-type{
		display: block;
	}
	/* immer zeigen, wenn Source vorhanden*/
	&.hasSource{
		display: block;
		/* immer das folgende Element zeigen (neues Bild einfügen)*/
		& + .uploadImg{
			display: block;
		}
	}
	/*ENDE entfernen wenn UPPY*/

	.imageUploadInput{
		& + label {
			cursor: pointer;
		}
		display:none;
	}
	.preview{
		height: auto;
		max-height: 150px;
		max-width: 150px;
		min-width: 100px;
		width: auto;
	}

	margin: 0.25em 1em 0.25em 1em;
	position: relative;
	label{
		img.preview{
			cursor: pointer;
		}
	}

	div.uploadImgButtons{
		/*buttons at bottom of img upload*/
		bottom: 0;
		justify-content: space-between;
		margin-left:0;
		margin-top: 0;
		min-width: 5em;
		position: absolute;
		width:100%;
		button{
			margin-left:0;
			margin-right:0;
			min-width:0;
			position:relative;
			text-align: center;
			width:2.5em !important;
		}
	}
}

fieldset.pie{
	background:white;
	margin-bottom:2em;
	position:relative;

	table.statistik{
		margin-top:2em;
		margin-left:auto;
		margin-right:auto;
	}
}

table.toolDetails{
	border-spacing:2px;
	color:white;
	tbody td{
		padding:0;
		word-break: break-all;
	}
	&:hover{
		color:black;
	}
}

div#template,
.template{
	display:none;
}

i.fa.text-danger{
	color:red;
}

div.mangel i.far.info{
	color:black;
}

div.tabs{
	li.ui-tabs-tab{
		span.text{
			padding-left:.5ex;
		}
		a.ui-tabs-anchor{
			padding: 0.9em 1em;
			&:focus{
				outline: none;
			}
		}
	}
}

#canvasoverlay{
	background:white;
	padding-top:5px;
}

table.changeLog{
	table.innerLogTable{
		width:100%;
		th,td{
			background: white;
			border: 1px solid grey;
			color: black;
			width:33%;
		}
	}
}

div.splittedTable{
	/*table splitted with lines attribute*/
	display: flex;
	flex-flow: row wrap;
	justify-content: space-around;
	table{
		margin-top: 1ex;
	}
}

/*video*/
.videodiv{
	padding-top: 56.25%;
	position: relative;
	width: 100%;
	iframe{
		bottom: 0;
		left: 0;
		right: 0;
		top:0;
		position: absolute;
		width: 100%;
	}
}

/* Personalwähler Multi*/
div.multiPers{
	& > div{
		display:grid;
		grid-template-columns: 1fr 3em 2em;
	}
}
table td.right div.multicompleter,
aldente-multicompleter{
	border-radius: 5px;
	border: 1px solid grey;
	box-sizing: border-box;
	display: grid;
	padding: 3px;
	input{
		border: 1px solid #eeeeee;
		margin: 3px 0;
		max-width: unset;
		min-width: unset;
	}
	aldente-autocompleter{
		flex-grow: 1;
	}
}

/* QR Code Druck*/
#qrCodes{
	/* dies muss inline sein, kollidiert aber mit Stickbottom, daher erst in print.scss gesetzt*/
	display: inline-block;
}
/* Platz bei kleinen Codes besser nutzen*/
.smallSize span.qrInfo{
	line-height: 1;
}
.qrPrintEntity{
	border: 1px solid black;
	box-sizing: border-box;
	color: black;
	display: flex;
	float: left;
	gap: 0.1em;
	height: var(--entityHeight);
	/* line-height nicht geeignet für 1cm QR*/
	line-height: 1.4;
	margin-right: 1px;
	overflow: hidden;
	width: var(--entityWidth);
	&.column{
		.qrSpan{
			margin-left: auto;
			margin-right: auto;
		}
	}
	span,
	svg,
	img{
		box-sizing: border-box;
		max-height: 100%;
	}
	img{
		height: 100%;
		width: 100%;
	}
	.qrSpan{
		height: min-content;
		position: relative;
		.downloadOverlay{
			cursor: pointer;
			display: none;
			position: absolute;
			right: 0px;
		}
		&:hover{
			.downloadOverlay{
				align-items: center;
				background: #7c7c7ccd;
				color: white;
				display: grid;
				font-size: large;
				height: 100%;
				text-align: center;
				width: 100%;
			}
		}
	}
	.qrSVG{
		display: inline-flex;
	}
	.qrInfo{
		max-width: 100%;
		font-size: 1rem;
		overflow: hidden;
		textarea{
			max-width: 100%;
			padding: 0;
		}
		table, td, th{
			border-color: #00000000;
		}
		p{
			margin: 0;
		}
	}
	/* Padding in Tabellen ausstellen*/
	table{
		td{
			padding: 0;
		}
	}
	/* Vertikalmodus*/
	&.column{
		align-items: center;
		flex-direction: column;
		gap: 0;
		height: var(--entityWidth);
		text-align: center;
		width: var(--entityHeight);
		textarea{
			text-align: center;
		}
	}
	&.noBorder{
		border: none;
	}
	/*ptouch*/
	&[format*="perPage"]{
		tbody{
			display: flex;
			flex-wrap: wrap;
			gap: 0 0.5ex;
		}
	}
}

/* qr Overlay*/
.qrScanner {
	main#content, main#content article{
		margin: 0;
		padding: 0;
	}
}
#QROverlay{
	box-sizing: border-box;
	display: grid;
	/* Kameramodus*/
	grid-gap: 1ex;
	grid-template-rows: 50% 1fr;
	height: 100vh;
	max-height: 100vh;
	/* Handscanner*/
	&.single{
		grid-template-rows: 100%;
	}
	#actionDiv{
		overflow: auto;
		position: relative;
	}
	#canvasDiv{
		aspect-ratio: 1;
		height: 100%;
		line-height: 0;
		max-width: 100%;
		margin-bottom: 1ex;
		position: relative;
		.requireGesture{
			align-items: center;
			background: white;
			display: grid;
			font-size: 1rem;
			justify-content: center;
			position: absolute;
			/* ios Bug: Canvas muss sichtbar sein*/
			top: 1px;
			left: 0;
			right: 0;
			bottom: 1px;
		}
	}
	#qrCanvasOverlay{
		--size: 20%;
		border: 3px solid;
		bottom: var(--size);
		left:		var(--size);
		position: absolute;
		right:	var(--size);
		top:		var(--size);
	}
	#qrCanvas{
		aspect-ratio: 1;
		height: 100%;
		max-width: 100%;
		width: auto;
	}
	#qrFieldset{
		min-height: 14em;
	}
}

div.yearmonth{
	display: grid;
	grid-gap: 1%;
	grid-template-columns: 8em 9em;
	select, button.ui-multiselect{
		max-width: unset!important;
		min-width: unset!important;
	}
	select{
		width: fit-content!important;
	}
}
/* Leeres Inputfeld sorgt bei iOS für Verschiebung*/
div.bestellnummer{
	position: relative;
	input{
		padding-left: 6em;
	}
	nobr{
		align-items: center;
		bottom: 0;
		display: flex;
		left: 0.7em;
		position: absolute;
		/* 1 px Höhenkorrektur*/
		top: 1px;
	}
}

button.legend{
	float: right;
}

/*Resize content feature*/
#mainResize{
	right: .5ex;
	top: .5ex;
	position: absolute;
	z-index: +1;
	i{
		text-align: center;
		width: 2ex;
	}
}
#minimizeContent{
	display:none;
}
#maximizeContentCheck:checked ~ #main {
	& #nav,
	& #sidebar	{
		display:none;
	}
	& #content{
		padding-left: 1em;
	}
	& #maximizeContent{
		display:none;
	}
	& #minimizeContent{
		display:unset;
	}
	#mainResize{
		right: 1ex;
	}

}

body:has(#maximizeContentCheck:checked) {
	max-width: unset;
}

.gridFit{
	display: grid;
	grid-template-columns: auto max-content;
}

/* QR-Unterschrift*/
#authQr svg{
	height: auto;
	max-width: 100%;
	width: 350px;
}

/* schneller benutzerwechsel*/
#userQuickChange{
	details{
		display: inline;
	}
	summary{
		display: inline-block;
	}
	div{
		background: white;
		border-radius: 5px;
		padding: 1ex;
		position: absolute;
		right: 0;
		z-index: 999;
	}
}

/* KFZ Löschen*/
form.deleteKFZ{
	.del{
		display: none;
	}
}

/*FIXME: move this*/
#id_VisibilityMelderCIRS{
	display:none;
}