@CHARSET "UTF-8";
/* TODO: CG20170310 Sketch/Bild-(Druck-)Größe */

@IMPORT "fontawesome-6.5.2/css/all.min.css";

/***********************************************************************
* globale Definitionen (z.B. jqm-Defaults umbiegen, workarounds, ...
***********************************************************************/
* {
	scrollbar-width: thin;
}

/*-- NB20260318 - Farbe für focus (Barrierefreiheit)   --*/
*:focus-visible,
.btn-check:checked:focus-visible + .btn,
.btn-check:focus-visible + .btn {
	outline: 2px solid #495057!important;
	outline-offset: 2px;
	box-shadow: none!important;
}

/*-- NB20250818 - dunklere Grenze wegen der Barrierefreiheit --*/
input, textarea {
    border-color: #6c757d!important;
}

div.clear {
	clear: both;
}

.error {
	color: #DD0000;
	font-size: 1.2em;
	font-weight: 700;
}

.ok {
	color: #009900;
	font-size: 1.2em;
	font-weight: 700;
}

/* Ajax-Nachrichtenbereich  (showWdMsg)
   CG20210420 fixierte Positionierung von webDialog übernommen... */
div#wdMsg {
	display: none;
	font-weight: bold;
	font-size: 1.3em;
	padding: 20px;
}

div#wdMsg.popup {
	position: fixed;
	z-index: 2000; /* calendarPopup hat 1099 */
	left: 20px;
	right: 20px;
	top: 20px;
	-webkit-box-shadow: 10px 10px 5px 0px rgba(0, 0, 0, 0.5);
	-moz-box-shadow: 10px 10px 5px 0px rgba(0, 0, 0, 0.5);
	box-shadow: 10px 10px 5px 0px rgba(0, 0, 0, 0.5);
}

div#wdMsg.popup.jqmAlert {
	-webkit-border-radius: 10px;
	-moz-border-radius: 10px;
	border-radius: 10px;
	background-color: rgb(249, 249, 249);
}

div#wdMsg .ui-btn { /* #closeMsg oder #errorDiscard */
	float:right;
	margin: -0.3em 0;
}

div#wdMsg[msgTyp="ok"] {
	color: #336600;
	background-color: #dcf795;
}

div#wdMsg[msgTyp="error"] {
	color: #663300;
	background-color: #ffbc95;
}

/* Fastclick im IE10 https://github.com/ftlabs/fastclick */
a, input, button {
	-ms-touch-action: none !important;
}

/* größere Schrift in Formular-Eingabefeldern */
input[type=text],
input[type=password],
input[type=number],
input[type=date],
input[type=email],
input[type=tel],
input[type=time],
select{
	font-size:1.2em;
}

/* Schriftgröße-Std-jQm-Definition (16px absolut) global überschreiben -> soll sich relativ weitervererben */
label.ui-input-text, textarea.ui-input-text, input.ui-input-text, .ui-controlgroup-label {
	font-size: inherit;
}

textarea.ui-input-text:not([readonly="readonly"]){
	background-color:#ffffff;
}

/*Kopfzeilen ohne Schatten (vom FCCM-Layout hierher verallgemeinert) */
.ui-body-c{
	text-shadow:none !important;
}

/**********************/
/* Header             */
/**********************/
.medpaperDocumentContainer[pauschalMode] div#pghdr {
	min-height: 0;
}

/* Produktname */
div#pghdr.ui-header h1.ui-title {
	margin-left: 5%;
	margin-right: 5%;
}

#bogen div#pghdr.ui-header h1.ui-title {
	margin: .2em 5% .3em;
}

/* Patientenname im Header */
div#pghdr h1 .pbSubTitle {
	font-size:0.9em;
	color:#ffffff;
}

/*****************************************
******************************************
* CSS für Bogenansicht                   *
******************************************
*****************************************/

/*
 CG20200322 workaround-Versuch für falsche medpaper-Iframe-Höhe in iOS 
 https://stackoverflow.com/questions/34320046/iframe-height-issues-on-ios-mobile-safari
 https://stackoverflow.com/questions/27559304/avoid-adding-min-height-by-jquery-mobile
 */
#bogen.ui-page.ui-page-active {
	min-height: auto !important;
}

/* gedisablete Elemente (z.B. Sperrung durch Unterschrift) sollen nur leicht ausgeblendet werden. Wichtig ist das es readonly ist, aussehen ist zweitrangig */
#bogen div.pbelem .ui-disabled,
#bogen div.pbelem .ui-select .ui-disabled {
	opacity: 0.8;
	filter: Alpha(Opacity=80);
}

/* oben nicht so viel Platz verschwenden, unten dafür Ende markieren*/
#bogen > div.ui-content {
	padding-top:0px;
	padding-left:0px;
	padding-right: 0px;
	border-bottom: 20px solid #5084B5;
}

/* Trennlinien zwischen Abschnitten; etwas Platz drumherum lassen*/
#bogen div.pbelem {
	position:relative;
	border-top: 1px dashed lightgray;
	border-right: 1px solid lightgray;
	box-sizing: border-box; /* sonst macht die 1px border mehrspaltiges Layout kaputt! 3*33.333% + 2*1px border passen nicht in 100%*/
	padding: 5px 0em 5px 0em;
	margin-top: 0px;
	margin-bottom: 0px;
	line-height:1.5/*em*/; /*CG20180816 ohne em-Einheit, sonst berechnet er 1.5em von .pbElem = 24px, selbst wenn der Inhalt (z.B. <h4>-Überschrift) viel größere Schrift hat!*/
}

/* Das erste Element braucht keine Top-Border, CG20181001 header-Elemente (und deren Kinder) auch nicht. */
#bogen .ui-content > div.pbelem:first-child,
#bogen div.pbelem.header, #bogen div.pbelem.header.inklude div.pbelem {
	border-top: none;
	padding-top:0;
}

/* CG20181001 Inkludes brauchen keinen Rand, sonst doppelt, Elemente mit "noBorder"-Klasse (und deren Kinder) auch komplett ohne Rand */
#bogen div.pbelem.inklude,
#bogen div.pbelem.noBorder, #bogen div.pbelem.noBorder.inklude div.pbelem {
	border-top: none;
	border-right: none;
}

/* variables Element-Layout (mehrspaltig) */
#bogen div.pbelem.std {
	clear:both;
}
#bogen div.pbelem.twoCol {
	float:left;
	width: 50%;
	box-sizing: border-box; /* anstatt von margin-left:-1px; -> passt besser */
}
#bogen div.pbelem.twoColClear {
	float:left;
	width: 50%;
	clear:left;
	box-sizing: border-box; /* anstatt von margin-left:-1px; -> passt besser */
}
#bogen div.pbelem.threeCol {
	float:left;
	width: 33.333%;
	box-sizing:border-box; /* anstatt von margin-left:-1px; -> passt besser */
}
#bogen div.pbelem.threeColClear {
	float:left;
	width: 33.333%;
	clear:left;
	box-sizing:border-box; /* anstatt von margin-left:-1px; -> passt besser */
}
#bogen div.pbelem.twoColRight {
	float:right;
	width: 50%;
	box-sizing:border-box; /* anstatt von margin-left:-1px; -> passt besser */
}
#bogen div.pbelem.twoColClearRight {
	float:right;
	width: 50%;
	clear:right;
	box-sizing:border-box; /* anstatt von margin-left:-1px; -> passt besser */
}
#bogen div.pbelem.threeColRight {
	float:right;
	width: 33.333%;
	box-sizing:border-box; /* anstatt von margin-left:-1px; -> passt besser */
}
#bogen div.pbelem.threeColClearRight {
	float:right;
	width: 33.333%;
	clear:right;
	box-sizing:border-box; /* anstatt von margin-left:-1px; -> passt besser */
}

/** CG20240430 in Spans eingesetzte Variablen sollten Umbrüche, z.B. aus Eingabe-Textareas beibehalten */
#bogen span[var] {
	white-space: pre;
}

/* Pflichtfelder mit gelbem Hintergrund hervorheben
IV20240108 deaktiviert, da nicht mehr benötigt
IV20240201 wieder aktiviert, da es wieder benötigt wird
NA20250304 Bis zur Bootstrap-Umstellung Template-Editor so lassen! Danach kann das hier endgültig weg.*/
div[class*="mandatory"] .elemContt,
.pbelem.table .mandColFlag {
	background-color: #ffffcc;
	/*border: 1px solid #dc3545; IV20240201_deaktiviert, da gelber Hintergrund bei jqm-Buttons völlig ausreichend*/
}

div.table.global-mandatory .missingMandatory{
	border: 2px solid #dc3545;
}

.medpaperDocumentContainer[workMode="print"] div[class*="mandatory"] .elemContt, /* CG20181030 beim Drucken Pflichtfelder nicht farblich hervorheben... */
.medpaperDocumentContainer[workMode="print"] .pbelem.table .mandColFlag
/*.medpaperDocumentContainer[workMode="print"] .a1 -- NB20250922 - wurde auskommentiert, siehe Ticket  https://service.innocon-systems.de/mantis/view.php?id=5648 --*/{ /* CG20181030 Perimed Seitenbereiche auch nicht farblich hervorheben... */
	background-color: transparent;
}

/**
 * CG20230224 neues Feature für Sanitas -> einzelne Elemente hervorhebbar machen
 */
#bogen div.pbelem.isHighlighted {
	background-color: #CCC;
	font-weight: bold;
	border: 1px solid red;
}

/***** ab hier wird es für ein paar hundert Zeiten etwas schwammig... 
* schlecht kommentiert, nur vorsichtig ändern!! 
* -> hauptsächlich voneinander abhängige Box-Modell-Eigenschaften, um Größe der Elemente zu steuern **********/

/*
CG+HW20240724 vermutlich unnötig und zur Vermeidung doppelter Margins von Inkludes gedacht, fkt. aber nicht z.B. bei mehrspaltigem Layout
div.elemContt > :first-child{
	margin-bottom: 0px !important;
	margin-top: 0px !important;
}*/

#bogen .pbelem.inklude {
	margin-bottom: 0px !important;
	margin-top: 0px !important;
}

#bogen div.pbelem .ui-field-contain{
	margin-bottom:0px !important;
	padding: 0;
}

/* http://stackoverflow.com/a/13153737  */
#bogen div.pbelem .ui-field-contain .ui-controlgroup-label {
	width: auto; /* 50% */
}

#bogen div.pbelem .ui-field-contain .ui-controlgroup-controls {
	/*    width: auto; /* 50% */
}

div.pbelem .elemContt .ui-field-contain .ui-controlgroup-controls .ui-input-text {
	width: 100%;
	box-sizing: border-box; /* jqm-Bugfix, damit bei geringer Breite die Textboxen den rechten Rahmen nicht sprengen (CG20180815) */
}

/* CG20180815 Bugfix für jQuery-Mobile-Layouzt, dass bei Breite < 28em plötzlich das Margin auf 0.4em setzt... */
.ui-controlgroup-label {
	margin-bottom: 0px !important;
}

/* CG20180814 variable Breiten von textInput-Elementen */
div.pbelem.textinput .ui-field-contain fieldset.textinput_smallWidth .ui-controlgroup-controls { width: 25%; }
div.pbelem.textinput .ui-field-contain fieldset.textinput_mediumWidth .ui-controlgroup-controls { width: 50%; }
div.pbelem.textinput .ui-field-contain fieldset.textinput_largeWidth .ui-controlgroup-controls { width: 75%; }
div.pbelem.textinput .ui-field-contain fieldset.textinput_fullWidth .ui-controlgroup-controls { width: 100%; }
div.pbelem.textinput .ui-field-contain fieldset.textinput_smallWidth .ui-controlgroup-label { width: 70%; }
div.pbelem.textinput .ui-field-contain fieldset.textinput_mediumWidth .ui-controlgroup-label { width: 45%; }
div.pbelem.textinput .ui-field-contain fieldset.textinput_largeWidth .ui-controlgroup-label { width: 20%; }

.pbelem:not(.inklude,.tpSketch) .elemContt{
	margin-left:10px;

}
.ui-field-contain div.ui-input-text{
	width:74%;   /* HW passt nicht fuer alle aufloseungen */
}


/* Text soll nicht links anstossen, sonst unschön bei mehrspaltigem Layout */
/*div.pbelem:not(.inklude,.tpSketch) .ui-field-contain .ui-controlgroup-label,*/
/*div.pbelem:not(.inklude,.tpSketch) .ui-field-contain label.ui-input-text,*/
#bogen div.pbelem:not(.inklude,.tpSketch) .elemContt{
	padding-left: 0.25em;
}

#bogen div.pbelem.twoColClear:not(.inklude,.tpSketch) .elemContt,
#bogen div.pbelem.twoCol:not(.inklude,.tpSketch) .elemContt{
	padding-left: 0.25em;
}

#bogen div.pbelem.threeColClear:not(.inklude,.tpSketch) .elemContt,
#bogen div.pbelem.threeCol:not(.inklude,.tpSketch) .elemContt{
	padding-left: 0.25em;
}

.hideIf18yo, .minderjaehrig .showIf18yo {
	display:none;
}

.minderjaehrig .hideIf18yo, .showIf18yo,
body[workmode="editor"] .hideIf18yo, body[workmode="editor"].minderjaehrig .showIf18yo {
	display:block;
}

/* CG20210531 jQuery-Mobile custom Selectmenüs immer als Popup erzwingen (s.a. bogen.js:4836) -> Höhe begrenzen und scrollbar machen */
#bogen .ui-selectmenu.ui-popup.customSelectMenuForcedOverlay > .ui-selectmenu-list.ui-listview {
	max-height: 80vh;
	overflow-y: scroll; /* auto wäre noch etwas schöner, aber dann wird wegen der dynamischen Scrollbar die Breite zu klein berechnet und die längste Option mit ... abgekürzt */
}

/* MH20180516 Umbruch von zwei Zeilen auf einer, bei kleinen Displays (Handys) */
@media (max-width: 960px) {
	#bogen > .elemContainer{
		padding-left:0px !important;
	}

	#bogen > .elemContainer > div.pbelem.inklude > .elemContt{
		margin-left:0px !important;
	}

	#bogen div.pbelem.threeCol, #bogen div.pbelem.threeColClear {
		float: left;
		width: 50%;
	}
}

@media (max-width: 500px) {
	#bogen div.pbelem .elemContt > h4 {
		padding-left:40px;
		padding-right:10px;
		/* These are technically the same, but use both */
		overflow-wrap: break-word;
		word-wrap: break-word;

		/* This is the dangerous one in WebKit, as it breaks things wherever */
		/*word-break: break-all;*/
		/* Instead use this non-standard one: */
	}

	#bogen div.pbelem > .elemContt:first-child{
		margin-right:10px;
	}

	#bogen div.pbelem.twoCol, #bogen div.pbelem.twoColClear {
		float: none;
		width: 100%;
	}
	#bogen div.pbelem.threeCol, #bogen div.pbelem.threeColClear {
		float: none;
		width: 100%;
	}
}

div.pbelem.jn legend {
	white-space: normal;
	width: 100%; /* sonst rauslaufende Texte im IE */
}

/* bei diesen Radiobuttons mehr Platz für Text */
div.pbelem.jn .ui-field-contain .ui-controlgroup-label,
div.pbelem.choice .ui-field-contain .ui-controlgroup-label {
	width: auto;
}
div.pbelem.jn .ui-field-contain .ui-controlgroup-controls,
div.pbelem.textinput .ui-field-contain .ui-controlgroup-controls,
div.pbelem.choice .ui-field-contain .ui-controlgroup-controls {
	float:right;
}

div.pbelem.jn .ui-field-contain .ui-controlgroup-label{
	width:67%; /* funckztioniert bei 2 splaten gut, bei einspalten zu wenig platz (lücke entsteht) (Calc? wkhtml?)*/
}

div.pbelem .inlineTextbox div.ui-input-text, div.pbelem .inline { /* Inline-Elemente -> nicht die ganze Zeile einnehmen! */
	display: inline-block;
	vertical-align: middle;
}

div.pbelem .mediumWidthTextbox div.ui-input-text, div.pbelem .mediumWidth {
	min-width: 200px;
	width: 20%;
}

div.pbelem .largeWidthTextbox div.ui-input-text, div.pbelem .largeWidth {
	min-width: 300px;
	width: 100%;
}

div.pbelem .smallWidthTextbox div.ui-input-text, div.pbelem .smallWidth {
	width: 100px;
}

div.pbelem div.jn_hint > .ui-block-a {
	margin-top: 0px; /* sonst unnötige Platzverschwendung (16px von .ui-block-a)*/
}

/* jquery-Fehler? 78% Breite für Radiobuttons überschreiben */
div.elemContt > *:first-child{
	margin-top:0px;
}
div.elemContt div.ui-controlgroup-controls {
	margin-right:2px;
	width: auto;
}

/******* CG20180815: ab hier nicht vernünftig kommentierte und begründbare Definitionen, alles darüber ist mit vorsicht zu genießen... *****/

/* CG20170621 durch Flipswitch Layoutumstellung hätte er sonst einen eckigen Rahmen (wg. <fieldset data-role="controlgroup">) */
#bogen div.pbelem.jn .flipSwitchContainer .ui-controlgroup .ui-btn-corner-all {
	border-radius: 1em;
	-webkit-border-radius: 1em;
}

/* CG20180815 automatische Silbentrennung, damit schmale Labels auch mit langen Wörtern vernünftig umbrechen und nicht in das benachbarte Input hineinragen */
#bogen div.pbelem .ui-controlgroup-label legend,
#bogen div.pbelem.static {
	word-break: break-word;
	-moz-hyphens: auto;
	-o-hyphens: auto;
	-webkit-hyphens: auto;
	-ms-hyphens: auto;
	hyphens: auto;
}

/* Buttons etwas vergrößern, damit man sie mit dem Finger besser trifft */
#bogen a[data-iconpos="notext"],
#patStart div[data-iconpos="notext"] {
	padding: 4px;
}

/* CG20180305 nicht ausgewählte Radio-/Checkbox-Buttons von ausgefüllten Auswahlgruppen stylen */
div.pbelem div.ui-controlgroup-controls.hasValue .ui-radio label.ui-radio-off .ui-btn-inner .ui-btn-text,
div.pbelem div.ui-controlgroup-controls.hasValue .ui-checkbox.ui-disabled label.ui-checkbox-off .ui-btn-inner .ui-btn-text,
.disabledStyle {
	text-decoration: line-through;
	color: gray;
	font-weight: normal;
}

/* NA20250203 Text für disableten Kamera-Button muss weiß bleiben, sonst schlecht lesbar */
div.pbelem.externalImaging .elemContt [subType="camera"] button.insertExtPictBtn.disabledStyle {
	text-decoration: line-through;
	font-weight: normal;
	color: var(--bs-btn-color);
}

/*IV20240131_Bootstrap_radio-buttons mit Einfachauswahl_nicht ausgewählte Option durchgestrichen*/

div.elemContt div.btn-group.hasValue input[type*="radio"]:not(:checked) + label,
	/* NA20240826 Ergänzung für .btn-group-vertical */
div.elemContt div.btn-group-vertical.hasValue input[type*="radio"]:not(:checked) + label {
	text-decoration: line-through;
	color: gray;
	font-weight: normal;
}

/* CG20220310 nicht ausgewählte Optionen sollen bei Bedarf nicht durchgestrichen sein können, weil man sonst denken könnte sie wären nicht auswählbar */
div.pbelem.noLineThrough div.ui-controlgroup-controls.hasValue .ui-radio label.ui-radio-off .ui-btn-inner .ui-btn-text,
div.pbelem.noLineThrough div.ui-controlgroup-controls.hasValue .ui-checkbox.ui-disabled label.ui-checkbox-off .ui-btn-inner .ui-btn-text {
	text-decoration: none;
	color: inherit;
	font-weight: inherit;
}

/* CG20220310 mehrzeilige Auswahl-Radiobuttons sollen linksbündigen Text haben können */
div.pbelem.leftAlignButtonTexts .ui-controlgroup-horizontal .ui-btn-inner {
	text-align: left;
}

/* ein Div, das wie eine jQm-Textarea aussehen soll (workaround für wkhtmltopdf-Bug, der textareas viiiel zu groß ausgibt) */
/* benutzt jetzt auch die gleiche Klasse wie ein Standard-jqm-Textfeld (.ui-input-text und nicht mehr textareaDiv), so dass im JS nur noch die Textarea gegen ein Div mit gleichen Klassen und gleichem Inhalt ausgetauscht werden muss */
.medpaperDocumentContainer[workMode="print"] > #bogen div.textareaDiv,
.medpaperDocumentContainer[workMode="editor"] > #bogen div.textareaDiv {
	border: 1px solid #aaa;
	margin: 8px 0 8px 0 !important;
	padding: 6px 6px 20px 6px !important;
	white-space: pre-wrap;
	word-wrap:break-word;
	min-height: 1em;
}

/* schwarzer linker Rand für dynamisch eingeblendete Bereiche (Container) 
* CG20181029 Umstellung von .mp-container auf deren .pbelem-Kinder und margin entfernt -> Layout (z.B. UKM) passt jetzt besser
*/
div.mp-container > .pbelem {
	/*margin:0px 0px 0px 1%;*/
	padding:0px 0px 0px 1%;
	border-left:3px solid #333333;
	box-sizing: border-box;
}

/******************************************************* 
* zu versteckende, dynamisch einzublendende Inhalte 
********************************************************/
.hidden, /*explizit zu versteckende Elemente, z.B. auszublendende Tabellenheader*/
.medpaperDocumentContainer[workMode="print"] div.ans > div.ui-grid-b > div.ui-block-c, /*kein Skizze-Button in Archivansicht*/
.medpaperDocumentContainer[workMode="print"] span.enqFlag div.ui-btn, /* keine Notizhinzufügen in Archivansicht */
.medpaperDocumentContainer[workMode="print"] div.pbelem > div.elemContt  span.textSelectBox div.ui-btn, /* keine textSelect-Manipulation in Archivansicht */
.medpaperDocumentContainer[workMode="print"] a.deleteEnqBtn, /* kein Rückfrage-Löschbutton in Archivansicht */
.medpaperDocumentContainer[workMode="print"] div.pbelem.image > div.elemContt > .clearImgSketch, /* keine sketch-Bearbeitung in Archivansicht */
.medpaperDocumentContainer[workMode="print"] div.pbelem.image > div.elemContt > .undoImgSketch, /* keine sketch-Bearbeitung in Archivansicht */
.medpaperDocumentContainer[workMode="print"] div.pbelem.signature div.ui-btn, /* keine Unterschriftbuttons in Archivansicht */
.medpaperDocumentContainer[workMode="print"] div.pbelem > div.enqBtnContainer, /* keine Rückfrage-Buttons in Druckansicht */
.medpaperDocumentContainer[workMode="print"] div.pbelem div.sketchToolbar, /* keine tpSketch-Toolbar in Druckansicht */
.medpaperDocumentContainer[workMode="print"] #pghdr .ui-navbar, /* in Druckmodus keine Header-Buttons (readOnly-Ansicht der Seite)*/
.medpaperDocumentContainer[workMode="print"] #bogen.startsWithTpSketch #pghdr, /* CG20201019 wenn Ausdruck mit tidyPrintSketch beginnt -> Header weglassen */
.medpaperDocumentContainer[workMode="print"] div.pbelem.noArchive, /* nicht zu druckende Elemente nicht drucken */
.medpaperDocumentContainer[workMode="patient"] div.enq a.approve, /* kein Antwort-Status-Button in Patientenansicht */
.medpaperDocumentContainer[workMode="patient"] div.enq .enqFlag .patientHide, /* keine Skizze/Bild-Anmerkung in Patientenansicht */
.medpaperDocumentContainer[workMode="patient"] div.pbelem.patientHide, /* keine Arztelemente in Patientenansicht */
.medpaperDocumentContainer[workMode="patient"] div.pbelem.signature div.signFieldContainer div.signContent, /*eigentlich div.signFieldContainer:not(.patVisible) -> IE7 fallback, s.u. */ /* im Patientenmodus keine Unterschriftsfelder (20140703: Änderung für Praxis Dr. Lukaschek: Patientenunterschriften doch anzeigen)*/
.medpaperDocumentContainer[workMode="patientSilent"] div.enq a.approve, /* keine Antwort-Form in Patientenansicht */
.medpaperDocumentContainer[workMode="patientSilent"] div.enq .enqFlag .patientHide, /* keine Skizze/Bild-Anmerkung in Patientenansicht */
.medpaperDocumentContainer[workMode="patientSilent"] div.pbelem.patientHide, /* keine Arztelemente in Patientenansicht */
.medpaperDocumentContainer[workMode="patientSilent"] div.pbelem.signature div.signFieldContainer div.signContent, /*eigentlich div.signFieldContainer:not(.patVisible) -> IE7 fallback, s.u. */ /* im Patientenmodus keine Unterschriftsfelder (20140703: Änderung für Praxis Dr. Lukaschek: Patientenunterschriften doch anzeigen)*/
.medpaperDocumentContainer[workMode="patientOnline"] div.enq a.approve, /* keine Antwort-Form in Patientenansicht */
.medpaperDocumentContainer[workMode="patientOnline"] div.enq .enqFlag .patientHide, /* keine Skizze/Bild-Anmerkung in Patientenansicht */
.medpaperDocumentContainer[workMode="patientOnline"] div.pbelem.patientHide, /* keine Arztelemente in Patientenansicht */
.medpaperDocumentContainer[workMode="patientOnline"] div.pbelem.signature div.signFieldContainer div.signContent, /*eigentlich div.signFieldContainer:not(.patVisible) -> IE7 fallback, s.u. */ /* im Patientenmodus keine Unterschriftsfelder (20140703: Änderung für Praxis Dr. Lukaschek: Patientenunterschriften doch anzeigen)*/
.medpaperDocumentContainer[workMode="anonymous"] div.pbelem.anonymousHide, /* CG20230607 definierte Elemente im anoymen Modus ausblenden */
.medpaperDocumentContainer[workMode] div.pbelem.javascript, /*eigentlich :not([workMode="editor"]) -> IE7 fallback, s.u. */
.medpaperDocumentContainer[workMode] div.pbelem.javascriptInclude, /*eigentlich :not([workMode="editor"]) -> IE7 fallback, s.u. */
div.signInvisibleMsg, /* Hinweis auf ausgeblendete Unterschrift (muss bei tatsächlich ausgeblendeter Unterschrift durch genaueren CSS-Selektor überschrieben/eingeblendet werden)*/
.medpaperDocumentContainer[workMode="editor"] #pghdr .ui-btn, /* Header im Editormodus ausblenden */
.medpaperDocumentContainer[workMode="editor"] #pghdr span.pbSubTitle, /* Header im Editormodus ausblenden */
div.pbelem.signature > div.enqBtnContainer,
div.pbelem.noEnquiry > div.enqBtnContainer, /* CG20190128 > eingefügt, weil Inklues ohne eigenen Anmerkungs-Button sonst auch alle Anmerkungen innerhalb der Inklude-Elemente ausblendete */
.medpaperDocumentContainer[workMode] div.pbelem.initialHide, /*eigentlich :not([workMode="editor"]) -> IE7 fallback, s.u. */ /* Elemente mit erweiterten Abhängigkeiten werden dynamisch per JS eingeblendet */
div.pbelem.triage div.enqBtnContainer,
div.pbelem.javascript div.enqBtnContainer,
div.pbelem.javascriptInclude div.enqBtnContainer,
.signed div.enqBtnContainer,
.multiPb, /* Hilfetext (patStart) für mehrere Bögen bzw. Wechsel dazwischen wird bei Bedarf dynamisch eingeblendet */
div.enqCont, /* Rückfragebereich initial ausblenden (wird im JS bei Bedarf nach Befüllung dynamisch eingeblendet) */
.medpaperDocumentContainer[workMode="webDialog"] #cancel, /* im WebDialog (IFrame) brauche ich diesen Cancel-Button nicht! (gilt das vllt. noch für andere workmodes??)*/
.medpaperDocumentContainer[workMode="patient"] #cancel, /* im Patientenmodus kein Abbrechen */
.medpaperDocumentContainer:not([pauschalMode]) .noPatdata,
.medpaperDocumentContainer[pauschalMode] .patdata,
.medpaperDocumentContainer[pauschalMode] div.enqBtnContainer,
#switchPb, /* wird dynamisch bei Bedarf eingeblendet */
.medpaperDocumentContainer[workMode="print"] #pghdr .elemConttProgress,
.medpaperDocumentContainer[workMode="print"] #pghdr .mandatoryProgress, /* keine Fortschrittsbalken in Druckansicht CG20180820 */
.medpaperDocumentContainer[workMode="print"] .pbelem.header, /* CG20180928 keine Header-Bereiche beim Drucken (dieser kommen per UeAkbArchivalFeature_HeaderHtml extra an den Anfang JEDER Druckseite */
.medpaperDocumentContainer[workMode="print"] #pbSelectPopup .ui-content > .ui-btn, /* CG20181017 kein "Bearbeitung abschliessen"-Button bei (Druck-)Ansicht mehrerer Dokumente (z.B. .../getBogen.php?casenr=0000000007) */
.medpaperDocumentContainer:not([workMode="print"]):not([workMode="editor"]):not([workMode="demo"]):not([workMode="printHeader"]) .printOnly, /* CG20181112 nur im Druckmodus (und Editor) sichtbare Bereiche (https://stackoverflow.com/a/25287292/3013066) */
.medpaperDocumentContainer[workMode="print"] .pbelem.externalImaging .elemContt .ui-btn:not(.noHideInPrint), /* CG20191011 externe Bild-Erfass-Buttons beim Drucken ausblenden */
.medpaperDocumentContainer[workMode="print"] .pbelem.externalImaging button.btn, /* NA20240723 FileUpload-Buttons in Bootstrap ebenso ausblenden */
.medpaperDocumentContainer[workMode="print"] #pghdr #myNavbar, /* CG20230323 keine Bootstrap-Header-Navbar-Buttons in Druckansicht */
#bogen.patientKnown .hideIfPatientKnown, /* CG20231108 Eingabeelemente für bekannte Patienten ausblenden (z.B. bei Fragen für Wiedererkennung) */
#bogen.patientUnknown .hideIfPatientUnknown, /* CG20231108 Eingabeelemente für unbekannte Patienten ausblenden */
.medpaperDocumentContainer[workMode="print"] i.mandatoryIcon, /* CG20240423 kein Bootstrap-Pflichtfeld-Symbol in Druckausgabe ("Projekt SK") */
	/* NA20240506 Nicht ausgewählte Optionen innerhalb einer Mehrfachauswahl mit der Klasse hideNotSelectedFieldsInPrint ausblenden im Druckmodus */
.medpaperDocumentContainer[workMode="print"] div.pbelem.hideNotSelectedFieldsInPrint div.elemContt div.ui-controlgroup-controls.hasValue .ui-radio /*:has(*/ .ui-radio-off, /*) leider wird es mit :has() nicht von wkhtmltopdf unterstützt :-( */
.medpaperDocumentContainer[workMode="print"] div.pbelem.hideNotSelectedFieldsInPrint div.elemContt div.ui-controlgroup-controls.hasValue .ui-radio input, /*Diese Zeile ist überflüssig, sobald wkhtmltopdf nicht mehr verwendet wird und kann durch ein :has() in der obigen ersetzt werden*/
	/* NA20250302 hideNotSelectedFieldsInPrint für Bootstrap*/
.medpaperDocumentContainer[workMode="print"] div.pbelem.hideNotSelectedFieldsInPrint div.elemContt div.hasValue input:not(:checked) + label,
	/* NA20240508 leere Tabellen innerhalb eines MedPapers beim Ausdrucken ausblendbar machen. */
.medpaperDocumentContainer[workMode="print"] div.pbelem.table.hideTableInPrintWhenEmpty:not(.hasValue),
.medpaperDocumentContainer[workMode="print"] div.pbelem.table > div.elemContt > button.addRow, /* CG20241011 kein "neue Zeile"-Button im Druckmodus für Tabellen */
.medpaperDocumentContainer[workMode="print"] div.pbelem.table > div.elemContt > table.medpaperTable > tbody > tr > td.removeRow, /* CG20241011 kein "Zeile löschen"-Button im Druckmodus für Tabellen */
div.pbelem.inklude > div.elemContt > div.multiInkludeTemplate, /* CG20241011 Mehrfach-Inkludes enthalten bis zur Widget-Initialisierung einmal das HTML als versteckte Vorlage: https://sdsrv4/mantis/view.php?id=3702 */
.medpaperDocumentContainer[workMode="print"] div.pbelem.inklude > div.elemContt > .multiIncludeWidget > button.addRow, /* CG20241011 kein "neue Zeile"-Button im Druckmodus für Multi-Inkludes */
.medpaperDocumentContainer[workMode="print"] div.pbelem.inklude > div.elemContt > .multiIncludeWidget > .multiIncludeContainer > div[data-rowIdx] > button.removeRow /* CG20241011 kein "Zeile löschen"-Button im Druckmodus für Multi-Inkludes */
{
	display: none;
}

/* IE7 unterstützt kein :not(), daher hier die nicht auszublendenen Elemente überschreiben/einblenden */
.medpaperDocumentContainer[workMode="patient"] div.pbelem.signature div.signFieldContainer.patVisible div.signContent, /* im Patientenmodus keine Unterschriftsfelder (20140703: Änderung für Praxis Dr. Lukaschek: Patientenunterschriften doch anzeigen)*/
.medpaperDocumentContainer[workMode="patientSilent"] div.pbelem.signature div.signFieldContainer.patVisible div.signContent, /* im Patientenmodus keine Unterschriftsfelder (20140703: Änderung für Praxis Dr. Lukaschek: Patientenunterschriften doch anzeigen)*/
.medpaperDocumentContainer[workMode="patientOnline"] div.pbelem.signature div.signFieldContainer.patVisible div.signContent, /* im Patientenmodus keine Unterschriftsfelder (20140703: Änderung für Praxis Dr. Lukaschek: Patientenunterschriften doch anzeigen)*/
.medpaperDocumentContainer[workMode="editor"] div.pbelem.javascript,
.medpaperDocumentContainer[workMode="editor"] div.pbelem.javascriptInclude,
.medpaperDocumentContainer[workMode="editor"] div.pbelem.initialHide, /* Elemente mit erweiterten Abhängigkeiten werden dynamisch per JS eingeblendet */
.medpaperDocumentContainer[workMode="editor"] #bogen.patientUnknown .hideIfPatientUnknown /* CG20231108 für unbekannte Patienten ausgeblendete Elemente im Templateeditor anzeigen */
{
	display:block;
}

.medpaperDocumentContainer[workMode="patient"] div.pbelem.signature div.signFieldContainer div.signInvisibleMsg,
.medpaperDocumentContainer[workMode="patientOnline"] div.pbelem.signature div.signFieldContainer div.signInvisibleMsg,
.medpaperDocumentContainer[workMode="patientSilent"] div.pbelem.signature div.signFieldContainer div.signInvisibleMsg { /*eigentlich div.signFieldContainer:not(.patVisible) -> IE7 fallback, s.u. */
	display:block;
}

.medpaperDocumentContainer[workMode="patient"] div.pbelem.signature div.signFieldContainer.patVisible div.signInvisibleMsg,
.medpaperDocumentContainer[workMode="patientOnline"] div.pbelem.signature div.signFieldContainer.patVisible div.signInvisibleMsg,
.medpaperDocumentContainer[workMode="patientSilent"] div.pbelem.signature div.signFieldContainer.patVisible div.signInvisibleMsg { /* hier IE7 fallback, s.o. */
	display:none;
}

/***************************************
* Speziallayout für textSelect-Inklude *
***************************************/

div.pbelem span.textSelectBox .ui-btn {
	margin: -1px 0 0 -38px;
}

div.pbelem span.textSelectBox div.ui-input-text {
	padding-left:40px;
}

div.pbelem span.textSelectBox .ui-btn[act="delete"] .ui-icon {
	background-position: -73px -1px; /* arrow-d */
}

div.pbelem span.textSelectBox .ui-btn[act="error"] .ui-icon {
	background-position: -503px -1px; /* alert */
}

div.pbelem span.textSelectBox .textSelect,
div.pbelem span.textSelectBox .choiceSelect {
	display:inline;
}

/* CG20171025 TextSelect z.B. für Mitarbeiterauswahl */
ul.textSelectList {
	display: inline-block;
	width: 100%;
	min-width: 200px;
	vertical-align: top;
}

/* Eingabelemente ohne Label zenriert anzeigen */
.centeredInput {
	text-align: center;
}

/* Eingabelemente ohne Label linksbündig anzeigen */
.leftInput {
	text-align: left;
}
/* Eingabelemente ohne Label rechtsbündig anzeigen */
.rightInput {
	text-align: right;
}
/* Eingabelemente mit Label rechtsbündig anzeigen */
.rightLabelInput >div>span {
	float: right;
	padding: 0px 5px 0px 0px;
}

div.pbelem.choice.centeredInput .ui-field-contain .ui-controlgroup-controls {
	float: none;
}

div.pbelem.choice.centeredInput .btn-group.ms-auto { /* CG20230913 centeredInput für Bootstrap-Auswahlelemente */
	margin-right: auto !important;
}

div.pbelem.choice.leftInput .ui-field-contain .ui-controlgroup-controls {
	float: none;
}

div.pbelem.choice.leftInput .btn-group,
div.pbelem.choice.leftInput .btn-group-vertical { /* CG20230913 leftInput für Bootstrap-Auswahlelemente */
	margin-left: 0 !important;
}


/*****************************************************
* Unterschriftsfelder (sketchSig & wacomSig)         *
*****************************************************/
/* alle Unterschriften gleich einrücken bzw. mit festem Abstand versehen */
.signFieldPadding {
	margin: 20px 5px 20px 50px;
}

.signFieldBox {
	position: relative;
	max-width: 400px;
}

.tlSignFieldLink, .brSignFieldLink {
	color: transparent !important;
	font-size: small !important;
	pointer-events: none !important;
	display: block !important;
	position: absolute !important;
	top: 0 !important; /* wie bei .signFieldPadding */
	left: 0 !important; /* wie bei .signFieldPadding */
}

.brSignFieldLink {
	top: auto !important; /* wie bei .signFieldPadding */
	left: auto !important;
	right: 0 !important;
	bottom: 0 !important;
}

.certificateField {
    cursor: pointer;
}

    /* immer weißer Hintergrund und schwarzer Rahmen */
.signField > :FIRST-CHILD, .certificateField  {
	background:white;
	border: 1px solid black;
}

/* alle Patientenunterschrift mit rotem Rahmen hervorheben */
div.pbelem.signature .signField[who="Patient"] > :FIRST-CHILD, .certificateField[who="Patient"] {
	border: 1px solid red;
}

/* SketchSig-Container */
.signField.sketchSig > canvas { /* Größe nicht hier sondern im HTML-Code vorgegeben (wegen Sketch-Plugin notwendig) */
	float: left; /* für Button-Div neben SketchSigs */
	margin-right: 5px; /* ... mit etwas Abstand */
}
/* Buttons neben SketchSig etwas nach unten verschieben */
.signField.sketchSig > div.sketchSigBtns {
	padding: 50px 0 0 0;
}
/* Buttons sollen gleiche Breite haben */
.signField.sketchSig > div.sketchSigBtns  .ui-btn {
	min-width: 100px;
}

/* Wacom-Sig-Größe vorgeben und als Container für Unterschriftsbilder layouten */
.signField.wacomSig > span, .signField > .cordovaSignBtn, .certificateField > .certificateSignBtn  {
	max-width: 400px;
	height: 240px;
	display: flex;
	justify-content: center;
	align-items: center;
	margin: 0;
	padding: 0;
}

/* WACOM-Control ausfüllend anzeigen */
.signField.wacomSig > span > object {
	width: 100%;
	height: 100%;
}

/* generierte WACOM-Bilder innerhalb Unterschriftsbereich zentriert anzeigen */
.signField.wacomSig > span > img {
	display: block;
	max-width: calc(100% - 2px);
	max-height: calc(100% - 2px);
	object-fit: contain;
	margin: 0;
	padding: 0;
}

.signField > .cordovaSignBtn .ui-btn-inner {
	padding-top: 100px;
}

/**********************************************/
/* Bilder/Skizzen vernünftig layouten
/* -> dürfen aufgrund ihrer Größe den Container nicht sprengen */
/* CG20181019                                 */
/**********************************************/

#bogen div.pbelem.image > div.elemContt img, /* Bilder (ohne Einzeichnen) auf inline img-Elemente ugmestellt -> einfach zu layouten -> funktioniert! */
#bogen div.pbelem.externalImaging > div.elemContt img { /* CG20200408 für img.picValUrl identisch erweitert (einwScheinKleinImg in PPC3-OnlineCheckin) */
	max-width: 100%;
	max-height: 80vh;
}

#bogen div.pbelem.image > div.elemContt canvas.imageSketch.classicSketch { /* Skizzen (Bilder + Einzeichnen) sind canvas-Elemente mit Hintergrund -> (Maximal-) Größe hier (ohne max-) festlegen, bei Ausgabe dynamisch die Bildabmessungen als max-Größen, damit es sich Bildschirmauflösung/Platz anpasst */
	background-size: 100%;
}


/**********************************************/
/* Sketch-Toolbar (für tidyPrint-ImageSketch) */
/* CG20160909                                 */
/**********************************************/

.tidyPrintSketch { /* CG20170411 Layout geändert, um rechten Rand dunkel als Bereich zum Scrollen hervorzuheben */
	margin-right: -55px;
}

.medpaperDocumentContainer[workMode="print"] .tidyPrintSketch { /* CG20200129 beim Drucken wird die Größe (tpSketchWidth) sonst falsch berechnet */
	margin-right: 0;
}

.tidyPrintSketch .tpSketchPageAndToolbarContainer {
	/* border-top: 1px dashed lightgray; CG20201019 stört beim Drucken... und eigentlich auch sonst. */
	display:block;
}

.tidyPrintSketch .tpSketchPageAndToolbarContainer .sketchToolbar,
.tidyPrintSketch .tpSketchPageAndToolbarContainer .scrollArea {
	position:absolute;
	right: 0;
	width: 140px; /* CG20170411 feste Breite, die canvas-Größenberechnung (bogen.js:setTpSketchCanvasSize()) benutzt den gleichen Wert, wenn dann an beiden Stellen ändern! */
	padding-right: 20px; /* CG20230425 Buttons rutschen sonst unter den rechten Scrollbalken 20px ist blöd, weil das je nach Browser abweichen oder ohne Scrolling ganz entfallen kann... */
}

.medpaperDocumentContainer[workMode="print"] #bogen .tidyPrintSketch .tpSketchPageAndToolbarContainer .scrollArea {
	display:none;
}

.tidyPrintSketch .tpSketchPageAndToolbarContainer .sketchToolbar {
	/* weitere Eigenschaften (z.B. position:absolute) zusammen mit .scrollArea definiert */
	/*display:none; /*CG 20160913 work in progress */
	display:inline-block;
}

.tidyPrintSketch .tpSketchPageAndToolbarContainer .scrollArea {
	/* weitere Eigenschaften (z.B. position:absolute) zusammen mit .sketchToolbar definiert */
	top: 0;
	bottom: 0;
	background: repeating-linear-gradient( /* https://css-tricks.com/stripes-css/ */ 45deg,
	#BBB,
	#BBB 10px,
	#AAA 10px,
	#AAA 20px
	);
}

.tidyPrintSketch .tpSketchPageAndToolbarContainer .sketchToolbar > a {
	margin-left: 5px;
	margin-right: 5px;
	font-size: 0.8em;
}

.tidyPrintSketch .tpSketchPageAndToolbarContainer .sketchToolbar > a .ui-btn-inner {
	font-size: inherit;
	padding-top:35px; /* jqm-Original 40px (.ui-btn-icon-top .ui-btn-inner) */
	padding-left: 4px; /* jqm-Original 20px (.ui-btn-inner) */
	padding-right: 4px; /* jqm-Original 20px (.ui-btn-inner) */
}

.tidyPrintSketch .tpSketchPageAndToolbarContainer[toolbarMode="insertText"] canvas,
.tidyPrintSketch .tpSketchPageAndToolbarContainer[toolbarMode="insertSignature"] canvas {
	cursor: pointer;
}

/* TODO MH20241216 Selektor für TpSketchInsert-Button gefixt, Farbe müsste noch angepasst werden */
.tidyPrintSketch .tpSketchPageAndToolbarContainer[toolbarMode="draw"] .tpSketchInsert[insertMode="draw"],
.tidyPrintSketch .tpSketchPageAndToolbarContainer[toolbarMode="insertText"][data-toolbarOptions="{\"footnote\":true}"] .tpSketchInsert[insertMode="insertText"][data-opts="{\"footnote\":true}"],
.tidyPrintSketch .tpSketchPageAndToolbarContainer[toolbarMode="insertText"][data-toolbarOptions="{\"footnote\":false}"] .tpSketchInsert[insertMode="insertText"][data-opts="{\"footnote\":false}"],
.tidyPrintSketch .tpSketchPageAndToolbarContainer[toolbarMode="insertSignature"] .tpSketchInsert[insertMode="insertSignature"] {
	background: yellow;
	color: black;
}

div#tpSketchInsertPopup textarea {
	min-width: 500px;
}

/* NA20240628 Bootstrap */
div#tpSketchInsertPopup textarea.form-control {
	min-width: unset;
}

div#tpSketchInsertPopup[toolbarMode="insertSignature"] .insertTextMode,
div#tpSketchInsertPopup[toolbarMode="insertSignatureForPlaceholder"] .insertTextMode,
div#tpSketchInsertPopup[toolbarMode="insertText"] .insertSignatureMode {
	display:none;
}

/* CG20170407 tpSketchInc-Text-Tabelle */
table.tpSketchPageInserts {
	width: 90%;
	margin:1%;
	font-size: 1.3em;
}
table.tpSketchPageInserts .pageHeaderRow th {
	background-color: #d6d6d6;
	padding: 5px;
}
table.tpSketchPageInserts td:first-child, table.tpSketchPageInserts th:first-child {
	border-right:1px solid #d6d6d6;
	vertical-align: top;
}
.medpaperDocumentContainer:not([workMode="print"]) table.tpSketchPageInserts tbody tr:hover {
	cursor: pointer;
	background-color: #d6d6d6;
}
table.tpSketchPageInserts tr td {
	border-top: 1px solid #d6d6d6;
	white-space: pre;
}
.ui-popup .ui-field-contain.idInputContainer label.ui-input-text {
	display:inline-block;
	line-height: 30px;
}

#tpSketchInsertPopup[p_txtidx=""] #tpSketchInsertPopupDeleteContainer, /* Löschen-Button nur beim erneuten Öffnen von bereits eingefügten sketchInserts einblenden */
#tpSketchInsertPopup div.signFieldContainer div.sketchSigBtns, /* CG20170529 im dynamischen tidyPrint-Unterschriftens-Popup doppelte Buttons ausblenden */
#tpSketchInsertPopup[toolbarMode="insertText"] #tpSketchInsertPopupResetSignatureContainer /* Zurücksetzen Button nur für Unterschriften einblenden */
{
	display:none;
}

.tidyPrintSketch .tpSketchPageAndToolbarContainer {
	position:relative;
}

.tidyPrintSketch .tpSketchPageAndToolbarContainer .txtMark {
	color:black;
	position:absolute;
	cursor:pointer;
	z-index: 100;
	text-align: center;
}

.tidyPrintSketch .tpSketchPageAndToolbarContainer .signatureLink {
	display: block;
	color: transparent;
	position: absolute;
	cursor: default;
	width: 1px;
	height: 1px;
	overflow: hidden;
	z-index: 0;
}

/* CG20200908 Platzhalter-Signaturen haben weißen Hintergrund */
/* CG20201020 nachdem die Platzhalterbilder beim Empfangen des Druckjobs aus dem PDF entfernt (bzw. transparent ersetzt) werden, müssen sie nicht mehr überdeckt werden -> weißer Hintergrund kann weg -> transparente Unterschriften für geringeren Platzbedarf sollten nun möglich sein.
.tidyPrintSketch .tpSketchPageAndToolbarContainer .txtMark.insertSignatureForPlaceholder {
	background: white;
}*/

.tidyPrintSketch .tpSketchPageAndToolbarContainer .txtMark.spenSigImgMark span img {
	max-height: 100%;
	max-width: 100%;
}

/* CG20200909 nach Absprache mit Hagen sollen nur Textinserts den Pfeilbekommen, keinerlei Unterschriften (unabh. vom Typ) */
.tidyPrintSketch .tpSketchPageAndToolbarContainer .txtMark.insertText {
	padding: 0px 0px 0px 16px;
	background:url("images/pfeil_links_oben.png") 0 0 no-repeat;
}

.tidyPrintSketch .tpSketchPageAndToolbarContainer .txtMark.insertText span {
	background-color: rgba(255, 255, 0, 0.5);
}

/* CG20200907 sketchToolbar-Button Icon von Unterschriften auf anderer Seite "arrow-r" */
/* TODO MH20241216 sketchToolbar-Button Icon von Unterschriften auf anderer Seite -> nicht mehr vorhanden? */
.tidyPrintSketch .tpSketchPageAndToolbarContainer .tpSketchSignature.otherPage .ui-icon-star {
	background-position:-108px 50% /* .ui-icon-arrow-r */
}

/* CG20200908 sketchToolbar-Button Icon von geleisteten Unterschriften "check" */
/* TODO MH20241216 sketchToolbar-Button Icon von geleisteten Unterschriften -> nicht mehr vorhanden? */
.tidyPrintSketch .tpSketchPageAndToolbarContainer .tpSketchSignature.signed .ui-icon-star {
	background-position:-252px 50%; /* .ui-icon-check */
}

/* CG20200908 sketchToolbar-Button Icon von fehlenden Pflichtfeld-Unterschriften "alert" */
/* TODO MH20241216 sketchToolbar-Button Icon von fehlenden Pflichtfeld-Unterschriften -> nicht mehr vorhanden? */
.tidyPrintSketch .tpSketchPageAndToolbarContainer .tpSketchSignature.global-mandatory:not(.signed) .ui-icon-star {
	background-position:-503px 50%; /* .ui-icon-alert */
}

/* CG20200908 Buttonarten sind jetzt per Include-Eigenschaft einzeln konfigurierbar
 * MH20250115 Buttonarten auch bei Bootstrap berücksichtigen und ausblenden
 */
.tidyPrintSketch .tpSketchPageAndToolbarContainer .sketchToolbar > a.ui-btn,
.tidyPrintSketch .tpSketchPageAndToolbarContainer .sketchToolbar > button {
	display:none;
}

.tidyPrintSketch .tpSketchPageAndToolbarContainer .sketchToolbar > .clearImgSketch,
.tidyPrintSketch .tpSketchPageAndToolbarContainer .sketchToolbar > .undoImgSketch,
.tidyPrintSketch.featureBtn-rotation .tpSketchPageAndToolbarContainer .sketchToolbar > .rotatePageLeft,
.tidyPrintSketch.featureBtn-rotation .tpSketchPageAndToolbarContainer .sketchToolbar > .rotatePageRight,
.tidyPrintSketch.featureBtn-draw .tpSketchPageAndToolbarContainer .sketchToolbar > .tpSketchInsert[insertmode="draw"],
.tidyPrintSketch.featureBtn-insertText .tpSketchPageAndToolbarContainer .sketchToolbar > .tpSketchInsert[insertmode="insertTextWithFootnote"],
.tidyPrintSketch.featureBtn-insertText .tpSketchPageAndToolbarContainer .sketchToolbar > .tpSketchInsert[insertmode="insertText"],
.tidyPrintSketch.featureBtn-insertSignature .tpSketchPageAndToolbarContainer .sketchToolbar > .tpSketchInsert[insertmode="insertSignature"],
.tidyPrintSketch.featureBtn-placeholderSignature .tpSketchPageAndToolbarContainer .sketchToolbar > .tpSketchSignature {
	display:block;
}
/* MH20240613 für MedPaper-Signatur manuelle Signatur-Button hinzugefügt, die jedoch nicht sichtbar sein dürfen */
.tidyPrintSketch.featureBtn-placeholderSignature .tpSketchPageAndToolbarContainer .sketchToolbar > .tpSketchSignature.manualSign {
	display:none;
}

/* Pflichtfeld - Unterschriftsplatzhalter - Buttons */
/* TODO MH20241216 ui-btn-up-c -> JQM-Klasse nicht mehr vorhanden? */
.tpSketchSignature.global-mandatory.ui-btn-up-c {
	background-color: #ffffcc;
	background-image: linear-gradient(#ffffcc, #eeeebb)
}

/* TODO MH20241216 ui-btn-hover-c -> JQM-Klasse nicht mehr vorhanden? */
.tpSketchSignature.global-mandatory.ui-btn-hover-c {
	background-color: #dfdfc0;
	background-image: linear-gradient(#f6f6c2, #e0e0ba)
}

/* TODO MH20241216 ui-btn-down-c -> JQM-Klasse nicht mehr vorhanden? */
.tpSketchSignature.global-mandatory.ui-btn-down-c {
	background-color: #d6d6b8;
	background-image: linear-gradient(#d0d0b0, #e0e0ba)
}

/* CG20201019 tpSketch-Bereiche in Templateeditor sichtbar machen */
body #bogen .showOnlyInEditor {
	display:none;
}

body[workMode="editor"] #bogen .showOnlyInEditor {
	display:block;
}

body[workMode="editor"] #bogen div.pbelem.tpSketch .tpImageSketch {
	border: 3px solid black;
	background: repeating-linear-gradient( /* https://css-tricks.com/stripes-css/ */ 45deg,
	#DDD,
	#DDD 10px,
	#EEE 10px,
	#EEE 20px
	);
}

/* CG20201019 tpSketch-Drucklayout anpassen (keine Ränder, Borders, Abstände) bei Druck von Druckjobs -> Seitenlayout möglichst 1:1 */
body[workMode="print"] #bogen.startsWithTpSketch.endsWithTpSketch .elemContt {
	padding-left: 0;
	margin-left: 0;
}

body[workMode="print"] #bogen.startsWithTpSketch.endsWithTpSketch div.pbelem {
	border-right: none;
}

body[workMode="print"] #bogen.startsWithTpSketch {
	padding-top:0 !important; /* important, um jqm-[data-role="page"]-Verhalten zu unterdrücken */
}

body[workMode="print"] #bogen.endsWithTpSketch {
	padding-bottom:0 !important; /* important, um jqm-[data-role="page"]-Verhalten zu unterdrücken */
}

body[workMode="print"] #bogen.endsWithTpSketch div.ui-content {
	border-bottom: none;
}

/**********************************************
* Layout für Rückfragebereich und -button
**********************************************/

#bogen div.enqCont {
	padding-top: 10px;
}


#bogen div.enqCont,
.pbelem > [picSketchContainer] /* CG20190805 über externe Bilddaten eingefügte Bilder so wie über alten Bildauswahldialog eingefügt layouten (nicht wie bisher immer in .enqCont) */
{
	margin: 0 55px 0 1%;
}

/* dlgIcon-Buttons fest am rechten Rand */
#bogen.MedpaperHtmlRenderer_jQueryMobile div.enqIconBtns,
div.enqBtnContainer_jqm {
	position: absolute;
	right: 0px;
}

.medpaperDocumentContainer[workMode="print"] #bogen div.enqIconBtns { /* CG20181029 beim Druck ist die Zeile schmaler (GUI-Aktions-Buttons fehlen) -> Approve-Flag weiter oben ausrichten */
	top:-6px;
}

/* Platz für dlgIcon-Buttons freihalten */
.medpaperDocumentContainer:not([pauschalMode]):not([workMode="print"]) #bogen:not(.noEnquiry) div.pbelem:not(.noEnquiry) > div.elemContt,
.medpaperDocumentContainer:not([pauschalMode]):not([workMode="print"]) #bogen div.pbelem.image > div.elemContt, /*CG20181019 bei Bildern auch ohne Anmerkungsbutton etwas Platz zum Scrollen lassen*/
.medpaperDocumentContainer:not([pauschalMode]):not([workMode="print"]) #bogen div.pbelem.tpSketch > div.elemContt { /*CG20201007 auch bei tpSketch-Inkludes... */
	margin-right: 55px;
	@media screen and (max-width: 576px) { /*--NB20241015 -Änderungen treten auf, wenn die Größe des Iframe kleiner als 576px ist--*/
		margin-right: 5px;
	}
}

/* CG20230203 Elemente ohne Anmerkungen horizontal zentrieren -> gleiches margin/padding für .elemContt rechts, wie (weiter oben definiert) links */
.medpaperDocumentContainer:not([pauschalMode]):not([workMode="print"]) #bogen.noEnquiry div.pbelem:not(.inklude,.tpSketch) > div.elemContt,
.medpaperDocumentContainer:not([pauschalMode]):not([workMode="print"]) #bogen div.pbelem.noEnquiry:not(.inklude,.tpSketch) > div.elemContt
{
	margin-right: 10px;
	padding-right: 1%;
}


#bogen div.pbelem.inklude > div.elemContt, /* CG20171201 außer bei Inkludes, da diese ja eigenen Rand für Ihre dlgIcon-Buttons haben... */
.medpaperDocumentContainer[workMode="print"] #bogen div.pbelem > div.elemContt, /* ... außer in der Druckansicht, wo es diesen Bereich nicht gibt */
.medpaperDocumentContainer[workMode="print"] #bogen div.enqCont,
.medpaperDocumentContainer[pauschalMode] #bogen div.pbelem > div.elemContt,
.medpaperDocumentContainer[pauschalMode] #bogen div.enqCont {
	margin-right: 0px;
}

#bogen div.enqBtnContainer_jqm {
	padding-top:0px;
	margin-top:3px;
	z-index: 5; /* CG20170411 damit der Button trotz tpSketchToolbar (scrollArea) sichtbar ist */
	top:0px;
}

/* Rückfragebuttons etwas stärker hervorheben */
.enqBtnContainer_jqm .ui-btn {
	border: 3px solid #FFDD00;
}

/* jqm */
#bogen a.approve[approve=true] {
	background: green;
}

/* bootstrap */
#bogen button.btn.approve[approve=true] {
	background: var(--bs-green);
	color: var(--bs-white);
}

/* jqm */
#bogen a.approve[approve=false] {
	background: red;
}

/* bootstrap */
#bogen button.btn.approve[approve=false] {
	background: var(--bs-red);
	color: var(--bs-white);
}

#bogen span.enqFlag span.enqLabel {
	margin-right: 30px;
}

#bogen span.enqFlag div.ui-btn {
	margin: 3px 10px;
}

/* Textareas (und im Druckmodus gleichaussehende Divs) im Rückfragebereich (auch Antworten) */
/* CG20181029 Layout für Dr. Volkert erneut überarbeitet (zuvor MH20180517): kein jqm ui-grid-a mehr... */

/* Variante1: https://stackoverflow.com/a/5587563/3013066 -> perfekt beim Drucken, fkt. nicht mit jqm-Textarea */
/*div.labelledTextarea {
	overflow: hidden;
}

div.labelledTextarea label {
    width: 100px;
    float: left;
}
div.labelledTextarea textarea, div.labelledTextarea .textareaDiv {
    overflow: hidden;
    background: #ccc
}*/

/* Variante2: https://stackoverflow.com/a/20222460/3013066 -> scheint überall ok zu sein :-) (Browserkompatibilität beobachten!!) */
#bogen.MedpaperHtmlRenderer_jQueryMobile div.labelledTextarea {
	display:table;
	width: 100%;
}

#bogen.MedpaperHtmlRenderer_jQueryMobile div.labelledTextarea > * {
	display: table-cell;
}

#bogen.MedpaperHtmlRenderer_jQueryMobile div.labelledTextarea > label {
	width: 90px;
	vertical-align: middle;
}

/* Skizzen-Canvas im Rückfragebereich */
#bogen canvas.pbSketch {
	/*TODO: die Breite und Höhe muss im HTML angegeben sein, sonst wird das Bild verzerrt. Ich behelfe mir erstmal mit einer festen Größe
	dynamisch ist schwierig, gerade bei Auflösungswechsel und laden von sketchDaten die in anderer Größe erstellt wurden...
	width : 100%; 
	height: 400px;*/
	border: 1px solid black;
}

/**********************************************/
/* Bildauswahldialog
/**********************************************/

/* CG20181030 muss größer sein: https://stackoverflow.com/a/24428096/3013066 */
#pictureSelectPopup-popup, #pictureSelectPopup {
	width: 98%;
}

#pictureSelectPopup ul#imageList {
	max-height:80vh;
	overflow-y:auto;
	list-style-type: none;
}
#pictureSelectPopup ul#imageList li {
	float:left;
	width:10%;
	margin:0.5%;
	padding:0.5%;
	background:#444;
	cursor:pointer;
	display:none; /* CG20181018 initial alles ausblenden, wird in bogen.js:updateSelectedPictureSources() je nach Auswahl eingeblendet */
}
#pictureSelectPopup ul#imageList li:hover {
	background:#888;
}
#pictureSelectPopup ul#imageList li img {
	width:100%;
}

/*CG20181030 .ui-disabled geht nicht in Android App
#pictureSelectPopup fieldset#pictureSourceSelection div.ui-checkbox.ui-disabled {
    pointer-events: auto;
}
... stattdessen .problem und manuell ähnlich gestyled */
#pictureSelectPopup div.problem {
	text-decoration: line-through;
	filter: Alpha(Opacity=30);
	opacity: .3;
	zoom: 1;
}

#pictureSelectPopup #refreshPictureSeletion {
	float:right;
}

#pictureSelectPopup ul#imageList li.loading {
	display:block;
	position:absolute;
	left:50%;
	top:40%;
	background:none;
}

#pictureSelectPopup ul#imageList li.loading img {
	width:auto;
}

/*--für Bootstrap Aussehen--*/
#pictureSelectPopupContent div#imageList img {
	object-fit: contain;
}

#pictureSelectPopupContent div#imageList {
	background-color: #3d3d3d;
}

/**********************************************/
/* PictureSketch im Anmerkungsbereich          */
/* ("Bild einfügen"-Feature ursprünglich fürs FCCM entwickelt) */
/* CG20170310                                 */
/* CG20190806                                 */
/**********************************************/

.pbelem [picSketchContainer] .picSketchZoomBtnContainer {
	float:left;
	margin-bottom: -15px;
}

.pbelem [picSketchContainer] .removePictureSketchBtn {
	float:right;
	margin-bottom: -15px;
}

.pbelem [picSketchContainer] .loadingPictureSketch {
	clear:both;
	padding:1.3em;
}

.pbelem [picSketchContainer] .loadingPictureSketch > .loadAnimation {
	display:inline-block;
	width:1em;
	height:1em;
	background-image: url('jquery/css/mobile/images/ajax-loader.gif');
	background-repeat: no-repeat;
	background-size: 1em;
}

/**********************************************/
/* CG20190806                                 */
/* Thumbnail-darstellung ".zoomedOut"          */
/**********************************************/

.pbelem [picSketchContainer].zoomedOut canvas { /* CG20190805 eingebettete Bilder nicht auf volle Breite skaliert, sondern als Thumbnail verkleinert darstellen */
	max-height: 30vh;
	max-width: 30vw;
	min-height: 185px; /* CG20190807 damit die Buttonleiste auch bei kleinen Auflösungen immer daneben passt (das Bild darf nicht weniger hoch werden) */
	background-repeat: no-repeat; /* CG20190807 sonst sieht es in Verbindung mit min-height beim Einblenden (.show('slow')) komisch aus */
}

.pbelem [picSketchContainer].zoomedOut {
	float:left; clear:none; /* mehrere Bilder nebeneinander */
	margin-right: 0; /* hier kein Std-enqBtn-Margin notwendig */
	position:relative; /* removePictureSketchBtn werden hier drin absolut positioniert */
}

.pbelem [picSketchContainer] { /* normalgroße ("reingezoomte") Bilder haben volle Breite -> nicht floaten, damit die Buttons immer richtig am Bild sitzen, falls davor floatender Thumbnail liegt */
	clear:left;
	margin-left: -1px; /*NB20260320 - damit Canvas nicht über den Rand des Border hinausragt*/
	margin-right: -1px;
}

/*.pbelem [picSketchContainer].zoomedOut .removePictureSketchBtn { !* Entfernen und Zurücksetzen-Buttons unterhalb von Zoom-Button *!
	position:absolute;
	left:0;
	top:45px;
}*/

.pbelem [picSketchContainer].zoomedOut .ui-btn { /* alle Buttons mit gleicher, definierter Breite untereinander */
	display:block; /* untereinander! */
	width: 140px; /* "Bild entfernen" sollte ohne Umbruch hinpassen, "Zeichnung zurücksetzen" sollte umbrechen; ÜBersetzung? --> Pech! */
}

.pbelem [picSketchContainer].zoomedOut .ui-btn .ui-btn-inner {
	white-space: normal; /* Button-Texte dürfen hier umbrechen! */
}

/* CG20191216 mit diesen Optionen kein Zoom-Button -> andere Buttons statisch links neben das Bild platzieren... */
.pbelem [picSketchContainer] .removePictureSketchBtn[data-editOptions="readonly_noZoom"] {
	float:left;
	position: static;
}

/***********************************
* Layout für Tabellen-Inklude 
***********************************/

table.medpaperTable {
	width: 100%;
}

table.medpaperTable th {
	border-bottom: 1px solid #d6d6d6;
}

table.medpaperTable td {
	vertical-align:middle;
}

table.medpaperTable td input[type="text"] {
	width: 100%;
}

table.medpaperTable tr:nth-child(even) {
	background: #e9e9e9;
}

table.medpaperTable.noRemove td.removeRow {
	display:none;
}

table.medpaperTable.removeUserRowsOnly td.removeRow.userDefined {
	display: block;
}

/* CG20190514 editierte Zeilen hervorheben */
table.medpaperTable tr.editedRow {
	background: yellow;
}


/* spezielles Layout für Zählfeld-Spalte mit Reset-Button */
table.medpaperTable .resetCounterContainer {
	float:right; /* Reset-Button rechts ausrichten */
	height:0px; /* keine Höhe, um vertical-align:middle der Spalte nicht kaputt zu machen (span.scanCounter hat andere Höhe als der Button)*/
	/*margin-top:-10px; /* um die halbe Button-Höhe nach oben verschieben, damit der Button relativ zum span.scanCounter auf mittiger Höhe sitzt */
}

table.medpaperTable .scanCounterContainer .ui-input-text {
	width: 50px !important;
	float:left;
}

/********************************************
* untere Auswahlliste bei mehreren Bögen    *
* (und gleichartiges Beispiel auf patStart) *
********************************************/

#patStart div#switchPbExample {
	position: relative;
}

#bogen #switchPb div#descr,
#patStart div#switchPbExample div#descr {
	position: absolute;
	left: 3px;
	bottom: 1px;
	width: 110px;
	font-size: 13px;
	font-weight: bold;
	text-align: left;
}

#bogen #switchPb ul,
#patStart div#switchPbExample div.ui-btn {
	margin: 0px 0px 0px 111px;
}

#pbSelectPopup .ui-content {
	min-width: 35em;
}

/* farbliche Hervorhebung je nach Bogenstatus */
#pbSelectPopup ul li .ui-icon {
	border: 3px solid white;
	margin-top: -13px;
}

#pbSelectPopup ul li.viewed .ui-icon,
#pbSelectPopup ul li.edited .ui-icon,
#pbSelectPopup ul li.pat_viewed .ui-icon,
#pbSelectPopup ul li.pat_edited .ui-icon {
	border-color: yellow;
}

#pbSelectPopup ul li.finished .ui-icon,
#pbSelectPopup ul li.pat_finished .ui-icon,
#pbSelectPopup ul li.reopened .ui-icon /* CG20230601 auch wiedereröffnete Bögen als abgeschlossen anzeigen (grün, aber anderes Icon in bogen.js) ... */
{
	border-color: #66BB00;
}

/***********************************
* Dokument-Auswahl für Bootstrap angepasst
* CG20230113 trotz CSS-Verbot, weil nicht weiß wie sonst...
***********************************/

#pbSelectPopup.modal #pbSelectList,
#pbSelectPopup.modal .modal-footer button {
	width: 100%;
}

#pbSelectPopup.modal #pbSelectList button,
#pbSelectPopup.modal .modal-footer button {
	font-size: 1.3em;
}

#pbSelectPopup.modal #pbSelectPopupFinishAnyway {
	display:none;
}

/***********************************
* Pflichtfeld-Meldung 
***********************************/

/* Pflichtfelder mit fehlenden Angaben; von .ui-btn-up-c und .ui-body-c aus jqmCSS abgewandelt 
dazu passende Element-Bestimmungs-Funktion: getJqmDisplayElementForInputField() in bogen.js:800 */
.ui-btn.missingMandatory, /* Radio-Button, select, checkbox */
.ui-input-text.missingMandatory,  /* Texteingabe (input & Textarea) */
.ui-input-text.checkRegexFailed, /* Texteingabe (input & Textarea): Textinputs mit falschem Input (checkRegex) CG20180816 */
.signField.missingMandatory > :FIRST-CHILD, /* Unterschriftsfeld */
.elemText.missingMandatory, /* CG20221028 allg. (Frage-)Texte von pbelems mit fehlenden Pflichtfeldern */
input.missingMandatory, /* CG20221028 Freitextantwort mit fehlendem Pflichtfeld; CG20230203 auch andere als Text-Input-Typen (number, date, password) */
input.checkRegexFailed, /* CG20230213 auch für checkRegexFailed-Klasse */
select.missingMandatory + span.select2 > span.selection > span, /* CG20221028 Dropdown mit fehlendem Pflichtfeld */
.ui-controlgroup-label.missingMandatory, .ui-controlgroup-label.checkRegexFailed, label.missingMandatory, label.checkRegexFailed, /* Labels zu fehlenden Eingaben auch hervorheben (fkt. auch für input[type="hidden"]) CG20200213 */
#missingMandatoryMsg,
#missingMandatoryMsg .ui-btn,
button.missingMandatory, #pbSelectPopup.modal #pbSelectPopupFinishAnyway,
	/*table.medpaperTable.missingMandatory  CG20230714 Tabellenpflichtfelder überarbeitet (https://sdsrv4/mantis/view.php?id=2589) IV20240108_deaktiviert, da Überarbeitung an Zeile 468*/
textarea.form-control.missingMandatory /*IV20240425_Freitextantwort mit fehlendem Pflichtfeld*/
{
	color: white;
	background: #f55 -webkit-gradient(linear, left top, left bottom, from(#f55), to(#f14848)) !important;
}

#missingMandatoryMsg {
	font-size: 1.2em; /* CG20171201 etwas größer */
	text-align: center;
	display:none; /* immer mit ausgeben, erst Einblenden, wenn Pflichtfeldprüfung fehlende Angaben ermittelt */
}

/*--NB20250317 - macht div für Stylesheet unsichtbar --*/
#bogen div[class*="pbElemGroup"] .mp-container  {
	display: contents;
}

/*--NB20250318 - verschiebt untergeordnete Elemente an das Ende des übergeordneten Containers --*/
body:not([workmode="editor"]) > #bogen div[class*="pbElemGroup"] {
	display: flex;
	align-items: end;
	@media screen and (max-width: 525px) {
		flex-wrap: wrap;
	}
}

div:has(> .regexFailMsg) {
	position: relative;
}

.regexFailMsg {
	color:#f55;
	font-size: 0.8em;
	margin-top: 0;
	position: absolute;
	z-index: 1001;
	background-color: #ffffff;
	padding: 0 2px 0 2px;
}

/*--NB20250318 - wenn ein .regexFailMsg vorhanden ist, wird in beiden untergeordneten Divs margin-bottom hinzugefügt, sodass .regexFailMsg das nächste Feld nicht überlappt --*/
/*-- für Div mit .regexFailMsg --*/
#bogen div[class*="pbElemGroup"] > div:has( .regexFailMsg),
#bogen div[class*="pbElemGroup"] > div.mp-container > div:has( .regexFailMsg),
	/*--wenn 1 Fedl hat .regexFailMsg --*/
#bogen div[class*="pbElemGroup"] > div:has( .regexFailMsg) + div,
#bogen div[class*="pbElemGroup"] > div:has( .regexFailMsg) + div.mp-container > div,
	/*--wenn 2 Fedl hat .regexFailMsg --*/
#bogen div[class*="pbElemGroup"] > div:has( + div .regexFailMsg),
#bogen div[class*="pbElemGroup"] > div:has( + div.mp-container .regexFailMsg) {
	margin-bottom: 2rem;
}

.ui-header #missingMandatoryMsg .ui-btn-inner {
	font-size: 16px; /* CG20171201 jqm-Standard (.ui-header .ui-btn-inner -> 12.5px) überschreiben */
}

/* CG20181210 nach oben herausgescrollte fehlende Pflichtangaben kenntlich machen */
#myNavbar #pbMenuBtn.missedMand {
	background-image: linear-gradient(#f55,#f14848);
}

/* CG20190807 anderes Dokument mit fehlenden Pflichtfeldern in Popup hervorheben (Std-Hintergrund oben via #missingMandatoryMsg .ui-btn) */
#pbSelectPopup #pbSelectList .missingMandatory .ui-btn-text a {
	color:white;
	text-shadow: 0 1px 0 #111;
	border: 1px solid #111;
}

/* CG20200518 mpOpt-tempSave=0 verhindert "Zwischenspeichern und Beenden"-Option */
#bogen[data-tempSave="0"] #finishAnywayContainer {
	display:none;
}

/*********************
* Kalender (-Seite)  *
*********************/

div#calendarPopup div#calendar {
	padding: 5px;
	margin-top:5px;
	float: left;
	/* overflow-y: auto; /* CG20210413 Y-Scrolling innerhalb der Kalenderansicht (bei fixem Detailbereich) erlauben CG20220524 fkt. mit fullCalendar v5 (display:flex) nicht mehr -> daher #calendarContainer */
}

/* CG20220524 workaround für neues fullCalendar v5 scroll/display-Verhalten */
div#calendarPopup div#calendarContainer {
	height: 100%;
	overflow-y: auto;
}

/*NA20240319: Soll nicht für Bootstrap gelten!*/
#bogen.MedpaperHtmlRenderer_jQueryMobile div#calendarPopup div#rightRow {
	margin: 20px;
	/*float: right;*/
	width: 400px;
	position:absolute;
	top:0px;
	right:0px;
	bottom:0px;
	overflow-y: auto;
}

/* CG20210421 bei zu kleinen Auflösungen muss auch innerhalb des Detailbereichs gescrollt werden... */
/*NA20240319: Soll nicht für Bootstrap gelten!*/
#bogen.MedpaperHtmlRenderer_jQueryMobile div#calendarPopup div#rightRow #scrollContainer {
	position: relative;
	height:100%;
	/* CG20220105 wird jetzt doch dynamisch im JS gesetzt (calendar.js -> $("#calendarPopup").on("popupbeforeposition", ...) min-height: 800px; /* auf Sicht ermittelter Wert, passend für 3 auswählbare Kalender als default ->  dynamische JS-Ermittlung notwendig, da Kalenderanzahl und zukünftig evtl. weitere GUI-Elemente variabel sind... */
}

div#calendarPopup div#rightRow #scrollContainer > .ui-btn:nth-last-child(2) {
	/* CG20220105 wird jetzt doch dynamisch im JS gesetzt (calendar.js -> $("#calendarPopup").on("popupbeforeposition", ...) margin-bottom:300px; /* CG20210422 das hier dynamisch aus genauer Höhe von #rightRow im JS zuweisen, min-height von #scrollContainer dann überhaupt notwendig?? */
}

/*NA20240319: Soll nicht für Bootstrap gelten!*/
#bogen.MedpaperHtmlRenderer_jQueryMobile div#calendarPopup div#rightRow div#rightBottom {
	position:absolute;
	bottom:20px;
	left:0px;
	right:0px;
}

div#calendarPopup div#rightRow .invalidDataMsg
{
	margin-left: 30px;
	font-size: 16px;
	color: #f55;
	font-weight: bold;
	display: none;
}


/******************************************************************
* globale Schriftgröße 
* (inkl. Buttons zum Ändern auf patStart und im Dokumentenmenü)
******************************************************************/
/***********************************************************/
/** region .normalFont   */
body.normalFont,
body.normalFont textarea,
body.normalFont a[id^="pb_fileAttachment"],
body.normalFont .ui-header .ui-title, body.normalFont .ui-footer .ui-title, body.normalFont .ui-popup .ui-title,
body.normalFont .ui-btn-inner,
body.normalFont label.ui-submit,
body.normalFont .ui-collapsible-heading,
body.normalFont .ui-controlgroup-label,
body.normalFont .ui-controlgroup .ui-checkbox label,body.normalFont .ui-controlgroup .ui-radio label,
body.normalFont label.ui-select,
body.normalFont label.ui-input-text,
body.normalFont input.ui-input-text,body.normalFont textarea.ui-input-text,
body.normalFont .ui-li-heading,
body.normalFont .ui-fullsize .ui-btn-inner, body.normalFont .ui-fullsize .ui-btn-inner,
body.normalFont div#calendarPopup div#rightRow .invalidDataMsg,
body.normalFont .ui-header #missingMandatoryMsg .ui-btn-inner,
body.normalFont .select2.select2-container .select2-selection.select2-selection--single,
body.normalFont .select2.select2-container .select2-selection.select2-selection--multiple,
body.normalFont .select2-container .select2-dropdown .select2-results__options .select2-results__option,
body.normalFont .select2-dropdown .select2-search .select2-search__field
{
	font-size: 16px;
}

body.normalFont .ui-header .ui-btn-inner, body.normalFont .ui-footer .ui-btn-inner, body.normalFont .ui-mini .ui-btn-inner
{
	font-size: 12.5px;
}

body.normalFont input.ui-mini,body.normalFont .ui-mini input,body.normalFont textarea.ui-mini,
body.normalFont input.ui-input-text.ui-slider-input, body.normalFont .ui-slider-switch .ui-slider-label, body.normalFont .ui-slider-switch.ui-mini .ui-slider-label,
body.normalFont .ui-li-divider
{
	font-size: 14px;
}

body.normalFont .ui-li-desc {
	font-size: 12px;
}
/** endregion */
/***********************************************************/
/* Listen-Count-Bubbles nur mit Beispiel anpassen!!!
.ui-li-has-count .ui-li-count 11px
*/
/***********************************************************/
/** region .bigFont  */
body.bigFont,
body.bigFont textarea,
body.bigFont a[id^="pb_fileAttachment"],
body.bigFont .elemText,
body.bigFont .ui-header .ui-title, body.bigFont .ui-footer .ui-title, body.bigFont .ui-popup .ui-title,
body.bigFont .ui-btn-inner,
body.bigFont label.ui-submit,
body.bigFont .ui-collapsible-heading,
body.bigFont .ui-controlgroup-label,
body.bigFont .ui-controlgroup .ui-checkbox label,
body.bigFont .ui-controlgroup .ui-radio label,
body.bigFont label.ui-select,
body.bigFont label.ui-input-text,
body.bigFont input.ui-input-text,body.bigFont textarea.ui-input-text,
body.bigFont .ui-li-heading,
body.bigFont .ui-fullsize .ui-btn-inner, body.bigFont .ui-fullsize .ui-btn-inner,
body.bigFont div#calendarPopup div#rightRow .invalidDataMsg,
body.bigFont .ui-header #missingMandatoryMsg .ui-btn-inner,
body.bigFont .select2.select2-container .select2-selection.select2-selection--single,
body.bigFont .select2.select2-container .select2-selection.select2-selection--multiple,
body.bigFont .select2.select2-container .select2-selection.select2-selection--multiple .select2-selection__choice,
body.bigFont .select2-container .select2-dropdown .select2-results__options .select2-results__option,
body.bigFont .select2-dropdown .select2-search .select2-search__field
{
	font-size: 24px;
}

body.bigFont .select2.select2-container .select2-selection--multiple .select2-search,
body.bigFont .select2.select2-container .select2-selection--multiple .select2-search .select2-search__field {
	height: 36px;
}

body.bigFont .ui-header .ui-btn-inner, body.bigFont .ui-footer .ui-btn-inner, body.bigFont .ui-mini .ui-btn-inner {
	font-size: 18.75px;
}

body.bigFont input.ui-mini,body.bigFont .ui-mini input,body.bigFont textarea.ui-mini,
body.bigFont input.ui-input-text.ui-slider-input, body.bigFont .ui-slider-switch .ui-slider-label, body.bigFont .ui-slider-switch.ui-mini .ui-slider-label,
body.bigFont .ui-li-divider
{
	font-size: 21px;
}

body.bigFont .ui-li-desc {
	font-size: 18px;
}

body.bigFont div.ui-slider-switch {
	height: 40px;
}

body.bigFont .ui-slider-track .ui-btn.ui-slider-handle, body.bigFont .ui-slider-switch .ui-btn.ui-slider-handle {
	height: 34px;
	top: 2px;
}
/** endregion */
/***********************************************************/

/***********************************************************/
/** region .hugeFont */
body.hugeFont,
body.hugeFont textarea,
body.hugeFont a[id^="pb_fileAttachment"],
body.hugeFont .ui-header .ui-title, body.hugeFont .ui-footer .ui-title, body.hugeFont .ui-popup .ui-title,
body.hugeFont .ui-btn-inner,
body.hugeFont label.ui-submit,
body.hugeFont .ui-collapsible-heading,
body.hugeFont .ui-controlgroup-label,
body.hugeFont .ui-controlgroup .ui-checkbox label,body.hugeFont .ui-controlgroup .ui-radio label,
body.hugeFont label.ui-select,
body.hugeFont label.ui-input-text,
body.hugeFont input.ui-input-text,body.hugeFont textarea.ui-input-text,
body.hugeFont .ui-li-heading,
body.hugeFont .ui-fullsize .ui-btn-inner, body.hugeFont .ui-fullsize .ui-btn-inner,
body.hugeFont div#calendarPopup div#rightRow .invalidDataMsg,
body.hugeFont .ui-header #missingMandatoryMsg .ui-btn-inner,
body.hugeFont .select2.select2-container .select2-selection.select2-selection--single,
body.hugeFont .select2.select2-container .select2-selection.select2-selection--multiple,
body.hugeFont .select2.select2-container .select2-selection.select2-selection--multiple .select2-selection__choice,
body.hugeFont .select2-container .select2-dropdown .select2-results__options .select2-results__option,
body.hugeFont .select2-dropdown .select2-search .select2-search__field
{
	font-size: 32px;
}

body.hugeFont .select2.select2-container .select2-selection--multiple .select2-search,
body.hugeFont .select2.select2-container .select2-selection--multiple .select2-search .select2-search__field {
	height: 48px;
}

body.hugeFont .ui-header .ui-btn-inner, body.hugeFont .ui-footer .ui-btn-inner, body.hugeFont .ui-mini .ui-btn-inner {
	font-size: 25px;
}

body.hugeFont input.ui-mini,body.hugeFont .ui-mini input,body.hugeFont textarea.ui-mini,
body.hugeFont input.ui-input-text.ui-slider-input, body.hugeFont .ui-slider-switch .ui-slider-label, body.hugeFont .ui-slider-switch.ui-mini .ui-slider-label,
body.hugeFont .ui-li-divider
{
	font-size: 28px;
}

body.hugeFont .ui-li-desc {
	font-size: 24px;
}

body.hugeFont div.ui-slider-switch {
	height: 56px;
}

body.hugeFont .ui-slider-track .ui-btn.ui-slider-handle, body.hugeFont .ui-slider-switch .ui-btn.ui-slider-handle {
	height: 36px;
	top: 8px;
}
/** endregion */
/***********************************************************/

#bogen div.pbelem h6, #bogen div.pbelem .btn {
	font-size: inherit;
}

/******************************************************************/
/* spezielle Layout-Klassen 
/* z.B. über custom-cssClasses auf pbElem-Ebene im Template-Editor 
/* oder direkt in eigenem HTML vergeben
/******************************************************************/

.patStammDat .ui-block-a {
	width:350px !important;
	padding: 0px 0px 0px 100px;
}

/* FB20180118 List-Styles */
li.disc{
	list-style: disc !important;
}

.boldred {
	font-weight: bold;
	color: red;
}

.bold {
	font-weight: bold;
}

div.pbelem textarea.big {
	min-height: 10em;
}

div.pbelem .major {
	font-weight: bold;
}

div.pbelem .minor {
	font-size: 0.9em;
}

div.pbelem .red {
	color:#D00000;
}

div.pbelem .green {
	color:green;
}

div.pbelem .blue {
	color:blue;
}

div.pbelem .rem {
	font-size: 0.9em;
}

.small { /* z.B. Adresse auf Lukaschek-Bögen */
	font-size: 0.8em;
}

.div-left {
	float: left;
	padding-left: 1px;
}
.div-right {
	float: right;
	padding-right: 1px;
}

.a1{
	background-color: #e6e6e6;
}

/* Chechkliste nachbauen */
.checkListAnswers div.ui-controlgroup-label{
	font-weight: bold;
	width: 92% !important;
}

/****************************
* Überschriftsbalken        *
* .topic bezieht sich primär auf Hintergrundfarbe 
* (kombinierbar mit <H*>-Tags für Überschriften und mit Form-Elementen wie z.B. Flipswitches)
* <H*>-Tags ohne Topic sind Überschriften mit Standard-Hintergrund
*****************************/

h2 {
	text-align: center;
}

#bogen div.pbelem.topic,
#bogen div.pbelem.topic1 {
	/*	font-size: 1.15em;
        background-color: #0080c0;*/
	background-color:#6d6e71; /* MH20180516 perimed Header-Color */
	font-size:1.5em;
	color: white;
	line-height:2.5em;
}

.topic {
	padding: 0 !important;
	/*	border: none !important;*/
}

.topic h3,
.topic h4 {
	padding: 10px 20px 10px 80px;
}

.topic i.fa {
	font-size: 1.25em;
	color: white;
}

.topic h3 > i,
.topic h4 > i {
	display:inline-block;
	margin-left: -40px;
	margin-right: 13px;
}

.topic h5 {
	margin:10px;
}

.topic.pbelem.jn .ui-field-contain .ui-controlgroup-label{
	width: 80%;
	/*background-color: yellow;*/
}

.topic .ui-controlgroup-controls{
	margin-top:5px;
}

/* CG20201217 zur Übersteuerung von z.B. aus .topic1-Elementen am Beginn eines Containers als komplettem Containerhintergrund übernommenen Design mit "normalem" Hintergrund in späteren Container-Elementen, z.B. Tangerhütte */
.defaultBg {
	background-color: rgb(249, 249, 249);
}

/******************************************************************/
/* Hintergrundfarben für Triagebögen                              */
/******************************************************************/

.triage, .triage_sichtung {
	text-align: center;
}

.triage .ui-input-text {
	margin-left: 20%;
	width: 60%;
}

.triage_sichtung .ui-input-text {
	width: 200px !important;
}

.trgRed {
	color: white;
	background-color: red;
}

.trgYellow {
	background-color: yellow;
}

.trgGreen {
	color: white;
	background-color: #00BB66;
}

/*********************
* mehrsprachige Dokumente mit deutschen Untertiteln
* CG20170313 aus FCCM-spezifischem Layout verallgemeinert
*********************/

span.secLang{
	display: block;
	font-size: 0.7em;
	font-weight: 100;
	/*color: #606060;*/
	opacity:0.5; /* besser als dunklere Farbe, weil es unabh. vom Hintergrund funktioniert */
}

h3 > span.secLang,
h4 > span.secLang {
	margin-left: 107px;
}

/*********************
* Drucklayout
* vom Standard abweichende Anpassungen für den Ausdruck
* (Seitenumbrüche, bestimmte GUI-Elemente ausblenden, Platz besser/anders nutzen)
**********************
* CG20151124: jetzt doch in @media-print-Block -> wkhtmltopdf-Aufruf mit --print-media-type 
* -> diesen @media-Block nach unten gezogen, damit die später definierten Layouts die oberen überschreiben (bei gleichem Selektor; komisch ich hätte gedacht, dass @media automatisch für höhere Gewichtung sorgt, scheint aber nicht so zu sein...)
**********************/
@media print {
	body.ui-mobile-viewport,
	div.ui-mobile-viewport,
	.ui-body,
	.ui-content,
	.ui-page
	{
		overflow: visible !important;
	}

	/* CG20180814 das wird benötigt, damit wkhtmltopdf Seitenumbrüche richtig setzen und page-break-*-Styles beachten kann :-) https://stackoverflow.com/a/21574057/3013066 */
	@page {
		/* TODO: Braking Change bez. wkhtmltopdf?
		/*size:21.0cm 29.7cm;*/
	}

	/* keine Seitenumbrüche innerhalb einzelner Bogen-Elemente */
	div.elemContt {
		page-break-inside: avoid;
	}

	/* CG20250130 bei großen Inkludes mglw. Sinnvoll (SWS Schritt 3) */
	.pbelem.allowPageBreaksInside > div.elemContt {
		page-break-inside: auto;
	}

	/* CG20190606 verhindert unnötige Leerseiten bei wkhtmltopdf-Ausdruck */
	#bogen {
		min-height: 0;
	}

	/* unterer Rand wird beim Druck nicht benötigt */
	#bogen div.ui-content {
		border-bottom: none;
	}

	div#pghdr {
		min-height: 0;
	}

	/* beim Ausdruck weißer Hintergrund! */
	body .ui-body-c, body.ui-overlay-c {
		background: white;
	}

	/* Seitenrand nicht per body-padding! */
	.ui-content {
		padding: 0px;
	}

	/* Abstände verkleinern */
	div.pbelem {
		/*padding: 0.5em 0;
		border-top: none;*/
		padding: 0.3em 0;
	}

	/* CG+RH20240612 tidyPrint-Sketch-Seiten haben sonst unnützen Platzbedarf, der das Seitenformat kaputt macht */
	#bogen div.pbelem .tpSketchPageAndToolbarContainer {
		line-height: 0;
	}
	/*
	 MH20240613 tpSketchInc-Text-Tabelle benötigt diesen Platz jedoch
	 -> wieder auf line-height von "#bogen div.pbelem"-Selektor zurückgesetzt
	*/
	#bogen div.pbelem .tpSketchPageAndToolbarContainer > .tpSketchPageInserts {
		line-height: 1.5;
	}

	/* keine Rückfrage-Buttons -> ganze Seite nutzen */
	div.pbelem > div.elemContt {
		margin-right:0px;
	}

	/* sonst in Druckansicht (nicht per wkhtmltopdf) im Firefox Header auf jeder Seite, der auf den hinteren Seiten auch noch content verdeckt... */
	div#pghdr {
		position:absolute;
		top:0;
	}

	/* Überschrift im ersten Element braucht nicht noch extra-margin... */
	.ui-content > div.pbelem:first-child > .elemContt > h1 {
		margin-top: 0 !important;
	}

	/* CG20171108 vor Ort in FFaM definierte Drucklayout Korrekturen */
	div.pbelem.twoCol div.elemContt div.ui-controlgroup-controls,
	div.pbelem.twoColClear  div.elemContt div.ui-controlgroup-controls,
	div.pbelem.threeCol  div.elemContt div.ui-controlgroup-controls,
	div.pbelem.threeColClear div.elemContt div.ui-controlgroup-controls,
	div.pbelem.twoColRight  div.elemContt div.ui-controlgroup-controls,
	div.pbelem.twoColClearRight  div.elemContt div.ui-controlgroup-controls,
	div.pbelem.threeColRight div.elemContt div.ui-controlgroup-controls,
	div.pbelem.threeColClearRight  div.elemContt div.ui-controlgroup-controls {
		/*margin-right:5% !important; CG20181030 hat mehr kaputtgemacht -> raus damit!!!*/
	}

	/* CG20180925 original-Mehrspaltige Layouts beim Drucken (@media (max-width...) fkt. mit wkhtmltopdf scheinbar nicht)*/
	#bogen div.pbelem.twoCol, #bogen div.pbelem.twoColClear {
		float:left;
		width: 50%;
		box-sizing: border-box; /* anstatt von margin-left:-1px; -> passt besser */
	}
	#bogen div.pbelem.threeCol, #bogen div.pbelem.threeColClear {
		float:left;
		width: 33.333%;
		box-sizing: border-box; /* anstatt von margin-left:-1px; -> passt besser */
	}

	/* CG20181030 wkhtmltopdf Bugfix
    Größe von Container-Inhalten beziehen sich sonst auf Breite des Containers
    (also im Falle von .pbelem.twoCol nur noch 25% (50% von 50%))
    im Firefox verhält sich das komplett anders, daher nur hier im "@media print"-Block :-(   */
	div.mp-container {
		/*width:100%;*/
		display:inline;
	}

    /* Signatur mit Zertifikat */
    .certificateField {
        border: none !important;
    }
    .certificateField > .certificateSignBtn {
        display: none !important;
    }
}

/* CG20171108 Deklaration ist doppelt mit jquery-mobile.css, aber Drucklayout geht sonst kaputt, im media-print-Block fkt. das scheinbar nicht. */
div.pbelem .elemContt .ui-field-contain .ui-controlgroup-label {
	/* border: 1px solid red; */
	display: inline-block;
}

/* CG20200612 Checkbox-Buttons mit font-awesome-Icons http://sdsrv4/mantis/view.php?id=648 */

#bogen .checkboxStyle .ui-checkbox-off .ui-btn-inner,
#bogen .checkboxStyle .ui-checkbox-on .ui-btn-inner,
#bogen .checkboxStyle .ui-checkboxradio-label,
#bogen .checkboxStyle .ui-checkboxradio-label.ui-checkboxradio-checked,
#bogen .checkboxStyle label.btn::before
{
	padding:0 5px;
}

#bogen .checkboxStyle .ui-checkbox-off .ui-btn-inner::before,
#bogen .checkboxStyle .ui-checkbox-on .ui-btn-inner::before,
#bogen .checkboxStyle .ui-checkboxradio-label::before,
#bogen .checkboxStyle label.btn::before
{
	display: inline-block;
	padding: 5px;
	font-family: "FontAwesome";
	font-size: 1.6em;
}

#bogen .checkboxStyle .ui-checkboxradio-label::before,
#bogen .checkboxStyle .ui-checkbox-off .ui-btn-inner::before,
#bogen .checkboxStyle label.btn::before {
	content: "\f096";
}

#bogen .checkboxStyle .ui-checkboxradio-label.ui-checkboxradio-checked::before,
#bogen .checkboxStyle .ui-checkbox-on .ui-btn-inner::before,
#bogen .checkboxStyle .hasValue label.btn::before {
	content: "\f046";
}

/* CG20200615 rolldate-Hack, um Monatsnamen anstatt der Zahlen (die mit den Tagen verwechselt werden könnten) anzuzeigen */
.rolldate-container #rolldate-month ul li[data-index] {
	color:white;
}

.rolldate-container #rolldate-month ul li[data-index] > span {
	color: black
}
/* CG20220325 Bilder aus Variablen untereinander darstellen (z.B. in Wunddokumentations-Report) */
#bogen .pbelem.externalImaging img.picUrlVar {
	display:block;
	margin:1% 0;
}


/* MP20220831 button definitionen */
#bogen div.pbelem.btnConfirm div.elemContt > div div.ui-btn {
	display: inline-block;
	line-height: 1.5;
	padding: 0.375rem 0.75rem;
	font-size: 1rem;
	border-radius: 0.25rem;
	transition: color 0.15s ease-in-out, background-color 0.15s ease-in-out, border-color 0.15s ease-in-out, box-shadow 0.15s ease-in-out;

	color: #fff;
	background: #194b7e;
	border: 0;
}
#bogen div.pbelem.btnConfirm div.elemContt > div div.ui-btn:hover {
	background: #14426e;
}
#bogen div.pbelem.btnConfirm div.elemContt > div div.ui-btn:focus, #bogen div.pbelem.btnConfirm div.elemContt > div div.ui-focus, #bogen div.pbelem.btnConfirm div.elemContt > div div.ui-btn:active, #bogen div.pbelem.btnConfirm div.elemContt > div div.ui-btn:checked {
	box-shadow: inset 0 0 3px #14426e,0 0 9px #14426e;
}
#bogen div.pbelem.btnConfirm div.elemContt > div div.ui-btn .ui-btn-inner {
	border-top: 0;
	text-shadow: none;
}
#bogen div.pbelem.btnConfirm div.elemContt > div {
	display: flex;
	justify-content: center;
}

#bogen div.pbelem.btnCancel div.elemContt > div div.ui-btn {
	line-height: 1.5;
	padding: 0.375rem 0.75rem;
	font-size: 1rem;
	border-radius: 0.25rem;
	transition: color 0.15s ease-in-out, background-color 0.15s ease-in-out, border-color 0.15s ease-in-out, box-shadow 0.15s ease-in-out;

	color: #194b7e;
	border: .15rem solid #194b7e;
}
#bogen div.pbelem.btnCancel div.elemContt > div div.ui-btn:hover {
	color: #fff;
	background: #14426e;
}
#bogen div.pbelem.btnCancel div.elemContt > div div.ui-btn:focus, #bogen div.pbelem.btnCancel div.elemContt > div div.ui-focus, #bogen div.pbelem.btnCancel div.elemContt > div div.ui-btn:active, #bogen div.pbelem.btnCancel div.elemContt > div div.ui-btn:checked {
	box-shadow: inset 0 0 3px #14426e,0 0 9px #14426e;
}
#bogen div.pbelem.btnCancel div.elemContt > div div.ui-btn .ui-btn-inner {
	border-top: 0;
	text-shadow: none;
}
#bogen div.pbelem.btnCancel div.elemContt > div {
	display: flex;
	justify-content: center;
}

#bogen div.pbelem.headlineFormal h2 {
	border-bottom: black;
	border-bottom-width: 3px;
	border-bottom-style: solid;
	padding-bottom: 0.5rem;
}

@media print {
	#bogen div.pbelem.printPreview div.ui-body-c {
		border: none;
		background: none;
		box-shadow: none;
		padding: 0 0 0 0.2em;
	}
	#bogen div.pbelem.printPreview div.ui-body-c input {
		padding: 0;
	}
}

/* Bild rechtsbündig - BM20221110 */
#bogen div.pbelem.image.rightAlignImage > div.elemContt img {/* Bilder (ohne Einzeichnen) auf inline img-Elemente ugmestellt -> einfach zu layouten -> funktioniert! */
	display: -webkit-box;
	margin-left: auto;
}
/* Bild rechtsbündig - BM20221110 */
#bogen div.pbelem.image.centerAlignImage > div.elemContt img {/* Bilder (ohne Einzeichnen) auf inline img-Elemente ugmestellt -> einfach zu layouten -> funktioniert! */
	display: -webkit-box;
	margin: auto;
}

/* CG20221216 Payment-Layout - Bezahlstatus-Ergänzung für Button */
.pbelem.payment[data-paymentStatus] .ui-btn div.paymentStatusDiv {
	padding:0.3em;
	white-space: initial;
}

.pbelem.payment[data-paymentStatus="Success"] .ui-btn {
	background-image: none;
	background-color: #1ca320;
	color:white;
	text-shadow: 0 1px 0 #000;
}

.pbelem.payment[data-paymentStatus="error"] .ui-btn div.paymentStatusDiv,
.pbelem.payment[data-paymentStatus="Rejection"] .ui-btn div.paymentStatusDiv,
.pbelem.payment[data-paymentStatus="AgeVerificationFailure"] .ui-btn div.paymentStatusDiv {
	background-color: #dc1313;
	color:white;
	text-shadow: 0 1px 0 #000;
}

.pbelem.payment[data-paymentStatus="Cancellation"] .ui-btn div.paymentStatusDiv {
	background-color: #f5c3c3;
}

/* CG20230614 Bild im jqm loading widget war nach links gerutscht (wegen Bootstrap-Anpassung?) ... -> wieder mittig ausrichten */
html.ui-mobile #dataSavedLoader {
	text-align: center;
}

/*
 * CG20230203
 * Layout ursprünglich für Bootstrap-Terminbuchung angepasst
 */

#bogen.MedpaperHtmlRenderer_Bootstrap div[class*="mandatory"] .elemContt {
	background: none;
}
.pbelem {
	border: none !important;
}
.pbelem.tpSketch {
	margin-top: 0 !important;
}

/*
 * viele ausgewählte Optionen bei Mehrfach-Dropdown-Auswahl untereinander vollständig darstellen
 * CG20231219 (Sanitas Projekt "KAV")
 */
.pbelem.choice .elemContt .ui-select > a.ui-btn .ui-btn-inner {
	white-space:normal;
}

.pbelem.highlight {
	/*	background: #CCC;*/
	border: 8px groove red !important;
	font-size: 1.3em;
	font-weight: bold;
}

.pbelem.highlight legend {
	font-size: 1.3em;
	font-weight: bold;
}

/*--NB20241030 - pictureSelectPopup Modal Fenster--*/
#pictureSelectPopupContent #collapseQuellSystem .form-check-input {
	border: 1px solid var(--bs-btn-color);
}

/*--NB20241122 - Positionierung mandatoryIcon--*/
.elemContt:has( > i.mandatoryIcon) {
	display: flex;
}

.elemContt > i.mandatoryIcon {
	padding-top: 4px;
}

.elemContt > i.mandatoryIcon + div {
	width: 100%;
}

.elemContt > div.d-flex > h6 {
	margin-right: 1rem!important;
}

.elemContt > i.mandatoryIcon + div.multiPic {
	margin-left: 1rem;
}

.elemContt > .row > .ms-auto {
	margin-left: 0!important;
}

.elemContt > .row:has( > div.ms-auto) {
	justify-content: space-between;
}

.elemContt:has( > div.multiPic) {
	flex-direction: column;
}

/* NA+NB 20250219 Gruppierte MedPaper-Elemente immer auf 100% Breite zwingen. */
div.groupedElems {
	width: 100%;
}

 /*NB20250306 - alle Buttons runden innerhalb .btn-group ab*/
#bogen .btn-group .btn,
#bogen .btn-group-vertical .btn {
	border-radius: var(--bs-btn-border-radius)!important;
}

/*-- NB20250325 - Inklude haben kein Padding --*/

div.inklude {
	padding: 0!important;
}

#bootstrapLoaderModal {
	z-index: 9999;
}

div.sketchToolbar > button.tpSketchSignature.signed {
	background-color: var(--bs-success);
	border-color: var(--bs-success);
}

/*-- NB20250707 - Stil für Kalendar Tooltips --*/
.tooltip {
	opacity: 1!important;
}

.custom-tooltip.tooltip > .tooltip-inner {
	background-color: #fdfefe;
	color: #17202a;
	border: 1px solid #707070;
	box-shadow: var(--bs-box-shadow) !important;
	max-width: 300px!important;
}

.custom-tooltip.tooltip > .tooltip-arrow::before {
	border-top-color: #707070;
	border-bottom-color: #707070;
}


/*-- NB20251216 - Fieldset für Radiobuttons  --*/
div.pbelem.jn fieldset legend, /*-- in Zeile 402 auch Stil für diese Tag --*/
fieldset legend {
	font-size: inherit;
	width: fit-content;
}

/*-- MP20260224 - Änderung der Gestaltung von readonly Eingabefeldern --*/
input[readonly],
.textareaDiv {
	background-color: #e9ecef;
	border: 1px solid #dee2e6 !important;
}
input[readonly]:hover {
	outline: none !important;
}
input[readonly]:focus {
	background-color: #e9ecef !important;
	box-shadow: none;
}

/***********************************************************/
/** region Barrierefreiheit */
/*-- NB20260224 - barrierefrei hover https://service.innocon-systems.de/mantis/view.php?id=6651 --*/
.select2-container .select2-results__options .select2-results__option.select2-results__option--highlighted,
.select2-container .select2-results__options .select2-results__option[aria-selected=true]:not(.select2-results__option--highlighted) {
	position: relative;
	background-color: #f8f9fa !important;
}

.select2-container .select2-results__options .select2-results__option.select2-results__option--highlighted::before,
.select2-container .select2-results__options .select2-results__option[aria-selected=true]:not(.select2-results__option--highlighted)::before {
	content: "";
	width: 10px;
	height: 100%;
	position: absolute;
	top: 0px;
	left: 0px;
	background-color: var(--accessibility-border-color);
}
.select2-container .select2-results__options .select2-results__option[aria-selected=true]:not(.select2-results__option--highlighted) {
	color: #212529 !important;
	font-weight: bold;
}
.select2-container .select2-results__options .select2-results__option.select2-results__option--highlighted[aria-selected=true] {
	font-weight: bold;
}

.dropdown-menu .dropdown-item:hover {
	position: relative;
	background-color: #f8f9fa!important;

	&::before {
		content: "";
		width: 10px;
		height: 100%;
		position: absolute;
		top: 0px;
		left: 0px;
		background-color: var(--accessibility-border-color);
	}
}

.btn:hover {
	text-decoration: underline;
	text-decoration-thickness: 2px;
}

/** endregion */
/***********************************************************/