/* Formatierungen für optimierte Desktop-Darstellung */
@media screen and (min-width: 1025px) {

	/* --- BODY-BEREICH  --- */

	/* Body-Element wird formatiert */
	.hw-top {
		font-size: 1rem;
		grid-template-rows: 5rem 3rem auto min-content;
	}

	/* --- FORMULARFELDER --- */

	/* Standardformatierungen für Formularelemente */
	button,
	input,
	select,
	textarea {
		font-size: 1rem;
	}

	/* Deaktivierte Buttons werden entsprechend dargestellt */
	button:disabled,
	input:disabled,
	select:disabled,
	button.hw-disabled,
	input.hw-disabled,
	select.hw-disabled {
		cursor: not-allowed;
	}

	/* Deaktivierte Buttons werden entsprechend dargestellt */
	button:disabled:hover,
	button:disabled:focus,
	button:disabled:active {
		background-color: var(--hw-greyed);
		color: var(--hw-linecol);
		cursor: not-allowed;
		box-shadow: none;
	}

	/* Animation für Buttons aktivieren */
	.hw-button-imagetext,
	.hw-label-imagetext,
	.hw-button-imagesmall,
	.hw-filter-searchlabel {
		transition: background-color .25s ease, color .25s ease, box-shadow .25s ease;
	}

	/* Cursor für Buttons ändern */
	.hw-button-imagetext,
	.hw-button-imagetext-content,
	.hw-button-imagesmall,
	.hw-button-imagebig,
	.hw-button-imagelink,
	.hw-button-imagelink-content,
	.hw-label-imagetext,
	.hw-label-imagetext-content,
	.hw-filter-searchlabel {
		cursor: pointer;
	}

	/* Standard-Button mit Icon und Text beim Aktivieren umfärben */
	.hw-button-imagetext:hover,
	.hw-button-imagetext:focus,
	.hw-button-imagetext:active,
	.hw-label-imagetext:hover,
	.hw-label-imagetext:focus,
	.hw-label-imagetext:active,
	.hw-button-imagesmall:hover,
	.hw-button-imagesmall:focus,
	.hw-button-imagesmall:active,
	.hw-filter-searchlabel:hover,
	.hw-filter-searchlabel:focus,
	.hw-filter-searchlabel:active {
		background-color: var(--hw-light);
		color: var(--hw-bgcolor);
		box-shadow: 0 0 .5rem var(--hw-linecol);
	}

	/* Standard-Button mit Icon und Text beim Aktivieren umfärben */
	.hw-button-imagetext:hover .hw-button-imagetext-content,
	.hw-button-imagetext:focus .hw-button-imagetext-content,
	.hw-button-imagetext:active .hw-button-imagetext-content {
		color: var(--hw-bgcolor);
	}

	/* Cursor für Buttons ändern */
	button:disabled .hw-button-imagetext,
	button:disabled .hw-button-imagetext-content,
	button:disabled .hw-button-imagesmall,
	button:disabled .hw-button-imagebig,
	button:disabled .hw-label-imagetext,
	button:disabled .hw-label-imagetext-content {
		cursor: not-allowed;
	}

	/* Inhalt von Imagelink-Buttons wird formatiert */
	.hw-button-imagelink-content {
		transition: color .25s ease;
	}

	/* Imagelink-Buttons reagieren wie Hyperlinks */
	.hw-button-imagelink:hover .hw-button-imagelink-content,
	.hw-button-imagelink:focus .hw-button-imagelink-content,
	.hw-button-imagelink:active .hw-button-imagelink-content {
		text-decoration: none;
		color: var(--hw-light);
	}

	/* Formatierung von Feldbezeichnern in Eingabemasken */
	.hw-form-label,
	.hw-label-imagetext {
		font-size: 1rem;
	}

	/* Formatierung von Eingabefeldern in Formularen */
	.hw-input-text {
		font-size: 1rem;
		width: 15rem;
	}

	/* Formatierung von Eingabefeldern in Formularen */
	.hw-input-value {
		font-size: 1rem;
		width: 10rem;
	}

	/* Formatierung von Auswahlfeldern in Formularen */
	.hw-input-select {
		font-size: 1rem;
		cursor: pointer;
	}
	
	/* Eingabefeld für Datum wird definiert */
	.hw-input-barcode {
		width: 10rem;
	}

	/* Eingabefeld für Datum wird definiert */
	.hw-input-datum {
		width: 7rem;
		cursor: pointer;
	}

	/* Eingabefeld für Datum wird definiert */
	.hw-input-datumzeit {
		width: 10rem;
		cursor: pointer;
	}
	
	/* Eingabefeld für Zeit wird definiert */
	.hw-input-zeit {
		width: 5rem;
	}

	/* Formularfeld für Datei-Uploads */
	.hw-input-file {
		min-width: 30rem;
		cursor: pointer;
	}

	/* Zeile in Radioliste oder Checkboxliste */
	.hw-input-list-row {
		font-size: 1rem;
		transition: color .25s ease, background-color .25s ease;
	}

	/* Zeile in Radioliste oder Checkboxliste */
	/* Checkbox-Label positionieren */
	.hw-input-list-row:hover,
	.hw-input-list-row:focus,
	.hw-input-list-row:active {
		background-color: var(--hw-contbg);
		color: var(--hw-dark);
	}

	/* Formularfeld für Radiobuttons oder Checkboxen */
	.hw-input-checkbox,
	.hw-input-checkbox ~ .hw-form-label,
	.hw-input-radio,
	.hw-input-radio ~ .hw-form-label,
	.hw-input-list-checker,
	.hw-input-list-label {
		cursor: pointer;
	}

	/* Textzeilen in Eingabemaske */
	.hw-formline-header, 
	.hw-formline-text,
	.hw-formline-check,
	.hw-formline-radio {
		font-size: 1rem;
	}

	/* Kürzere Darstellung von Eingabefeldern */
	.hw-input-text.hw-input-short,
	.hw-input-select.hw-input-short {
		width: 5rem;
	}

	/* Textzeilen in Eingabemaske */
	.hw-formline-firsthalf,
	.hw-formline-secondhalf {
		font-size: 1rem;
	}

	/* Normale Textzeile in Eingabemaske */
	.hw-formline-hinweis {
		font-size: .9rem;
	}

	/* --- ZEBRA DATEPICKER --- */

	/* Hover-Formatierung für Zebra_DatePicker */
	.hw-formline-zebracont .Zebra_DatePicker .dp_hover {
		transition: background-color .25s ease, color .25s ease;
	}

	/* Hover-Formatierung für Zebra_DatePicker */
	.hw-formline-zebracont .Zebra_DatePicker .dp_hover {
		color: var(--hw-contbg);
		background-color: var(--hw-light);
		text-decoration: none;
		cursor: pointer;
	}

	/* Feste Größe für vor- und zurück-Pfeile vergeben */
	.hw-formline-zebracont .Zebra_DatePicker .dp_previous::before,
	.hw-formline-zebracont .Zebra_DatePicker .dp_next::before,
	.hw-formline-zebracont .Zebra_DatePicker .dp_view_toggler.dp_icon::before,
	.hw-formline-zebracont .Zebra_DatePicker .dp_view_toggler.dp_icon.dp_calendar::before,
	.hw-formline-zebracont .Zebra_DatePicker .dp_confirm.dp_icon::before {
		font-size: 1rem;
	}

	/* Icon für DatePicker wird dargestellt */
	.Zebra_DatePicker_Icon::before {
		font-size: 1rem;
		cursor: pointer;
	}

	/* Icon für DatePicker wird dargestellt */
	.hw-filter-container .Zebra_DatePicker_Icon::before {
		font-size: .9rem;
	}
	
	/* --- SETUP --- */

	/* Formatierung für Setup-Routine */
	.hw-setup {
		grid-row-start: 1;
		grid-row-end: 5;
	}

	/* Formatierung für Masterkeys in Setup-Routine */
	.hw-setup-masterkeys {
		overflow-x: auto;
		font-size: 1.2rem;
		line-height: 1.5rem;
	}

	/* --- LOGO-BANNER --- */

	/* Platzierung des Bildlogos in der Kopfleiste */
	.hw-logo-banner {
		margin-left: 1.5rem;
	}

	/* Platzierung des Bildlogos in der Kopfleiste */
	.hw-logo-banner,
	.hw-logo-bild {
		height: 3rem;
	}

	/* Formatierung der Schriftzüge in der Kopfleiste */
	.hw-logo-schrift {
		font-size: 1.2rem;
		margin: 1rem;
	}

	/* Formatierung der Schriftzüge in der Kopfleiste */
	.hw-logo-firma,
	.hw-logo-titel {
		height: 1.5rem;
		line-height: 1.5rem;
		vertical-align: middle;
	}

	/* --- FOOTER-LEISTE --- */

	/* Formatierung der Footerleiste mit Datum */
	.hw-datum {
		font-size: .9rem;
		grid-row-start: 4;
		grid-row-end: 5;
		z-index: 9080;
	}

	/* --- LOGIN-SEITE --- */

	/* Positionierung des Login-Feldes */
	.hw-login {
		grid-row-start: 2;
		grid-row-end: 4;
	}

	/* Formatierung von Feldbezeichnern in Eingabemasken */
	.hw-login-label {
		font-size: 1rem;
	}

	/* --- LIZENZ-HINWEIS --- */

	/* Eintrag bei fehlerhafter Lizenz */
	.hw-lizenz {
		display: inline-block;
		vertical-align: top;
		text-align: left;
	}
	
	/* Fehlermeldung bei fehlerhafter Lizenz */
	.hw-lizenz-fehler {
		font-size: 1rem;
		font-weight: bold;
		padding: 1rem 1.5rem 1rem 0;
		line-height: 1rem;
		margin: 0;
	}
	
	/* --- MELDUNGEN --- */
	
	/* Meldestelle für Mitteilungskurzdarstellung */
	.hw-meldestelle {
		right: 1.5rem;
		top: 1.5rem;
		border: 1px solid var(--hw-linecol);
		border-radius: .5rem;
		height: 2rem;
		font-size: .9rem;
		display: flex;
	}

	/* Meldestelle mit aktuellen Mitteilungen */
	.hw-meldestelle.aktiv {
		background-color: var(--hw-contbg);
		transition: background-color .25s ease;
	}

	/* Meldestelle mit aktuellen Mitteilungen */
	.hw-meldestelle.aktiv:hover,
	.hw-meldestelle.aktiv:focus,
	.hw-meldestelle.aktiv:active {
		background-color: var(--hw-bgcolor);
	}

	/* Es sind keine Mitteilungen vorhanden */
	.hw-meldeleer {
		color: var(--hw-linecol);
		align-self: center;
		padding: .5rem;
	}
	
	/* Meldungsblöcke in der Meldestelle werden formatiert */
	.hw-meldhinweis,
	.hw-meldwarnung,
	.hw-meldfehler {
		padding: .5rem 1rem;
		align-self: center;
		cursor: pointer;
		background-position: 1rem center;
		background-repeat: no-repeat;
	}
	
	/* Schriftfarbe für Hinweise wird festgesetzt */
	.hw-meldhinweis {
		color: var(--hw-dark);
		border-left: 1px solid var(--hw-linecol);
	}
	
	/* Schriftfarbe für Warnungen wird festgesetzt */
	.hw-meldwarnung {
		color: var(--hw-light);
		border-left: 1px solid var(--hw-linecol);
	}
	
	/* Schriftfarbe für Fehler wird festgesetzt */
	.hw-meldfehler {
		color: var(--hw-error);
		border-left: 1px solid var(--hw-linecol);
	}

	/* Wenn mehrere Meldungsarten nebeneinander erscheinen, dann erhält nur die erste Darstellung keinen Rahmen */
	.hw-meldhinweis:nth-child(2),
	.hw-meldwarnung:nth-child(2),
	.hw-meldfehler:nth-child(2) {
		border-left: 0;
	}
	
	/* Gesammelte Fehler-, Warnungs- und Hinweismeldungen */
	.hw-meldungen {
		font-size: .9rem;
		top: 10rem;
		right: 1.5rem;
		max-height: 50vh;
		max-width: 30%;
		box-shadow: 0 0 .5rem var(--hw-linecol);
		padding: 1rem 0 1rem 1rem;
		background-color: var(--hw-bgcolor);
		border-radius: .5rem;
		color: var(--hw-dark);
		position: fixed;
	}
	
	/* Schließen-Button im Mitteilungscenter */
	.hw-meldclose {
		margin-right: 1rem;
		cursor: pointer;
		transition: color .5s ease;
	}

	/* Schließen-Button im Mitteilungscenter beim Überfahren */
	.hw-meldclose:hover,
	.hw-meldclose:focus,
	.hw-meldclose:active {
		color: var(--hw-light);
	}

	/* Meldungen müssen bei Bedarf gescrollt werden */
	.hw-meldinhalt {
		max-height: calc(50vh - 4rem);
	}

	/* --- HAUPT-INHALTE --- */

	/* Standard-Tabellenformatierungen */
	table {
		font-size: 1rem;
	}

	/* Überschrift 2. Ordnung */
	h2 {
		font-size: 1.4rem;
	}

	/* Verhalten von Links beim Überfahren */
	a:hover,
	a:focus,
	a:active {
		text-decoration: none;
	}
	
	/* Tabelleninhalt erhält unteren Abstand */
	.hw-tabcont {
		margin-bottom: 1rem;
		display: grid;
		grid-template-columns: auto auto;
	}
	
	/* Sekundärer Eintrag */
	.hw-conttab-subline {
		font-size: .9rem;
	}

	/* Tabellenzeile ohne Text */
	.hw-conttab-symbolic::before {
		font-size: 1rem;
	}

	/* Zusätze bei geänderten Buchungsdaten */
	.hw-conttab-symbolic.hw-icons-korrigiert::before,
	.hw-conttab-symbolic.hw-icons-abwesend::before {
		font-size: .7rem;
	}

	/* Inhaltsbereich wird definiert */
	.hw-content {
		grid-row-start: 3;
		grid-row-end: 4;
		overflow-y: auto;
		overflow-x: auto;
		padding: 1.5rem;
		box-sizing: border-box;
		position: relative;
	}

	/* Hauptüberschrift wird formatiert */
	.hw-head-title {
		font-size: 1.8rem;
		margin-top: 0;
		margin-bottom: 1rem;
	}

	/* Titel in Filterbar wird formatiert */
	.hw-filter-title, .hw-seiten-title {
		font-size: .9rem;
	}

	/* Felder für Filterbar verkleinern */
	input.hw-filter-widget,
	select.hw-filter-widget,
	select.hw-seiten-widget,
	.hw-filter-widget.hw-button-imagesmall::before {
		font-size: .9rem;
		height: 1.5rem;
	}

	/* Label-Suchfeld für Filterbar formatieren */
	.hw-filter-searchlabel::before {
		font-size: .9rem;
	}

	/* Animation in Tabellen wird aktiviert */
	.hw-conttab tr td {
		transition: color .25s ease, background-color .25s ease;
	}

	/* Tabellenzeile wird beim Überfahren mit der Maus hervorgehoben */
	.hw-conttab tr:hover td,
	.hw-conttab tr:focus td,
	.hw-conttab tr:focus-within td,
	.hw-conttab tr:active td,
	.hw-conttab tr:hover td .hw-disabled,
	.hw-conttab tr:focus td .hw-disabled,
	.hw-conttab tr:focus-within td .hw-disabled,
	.hw-conttab tr:active td .hw-disabled {
		background-color: var(--hw-contbg);
		color: var(--hw-dark);
	}

	/* Standard-Zeilenhöhe für Leermeldung */
	.hw-contleer {
		line-height: 1rem;
		grid-column-start: 1;
		grid-column-end: 3;
	}

	/* Block mit Hinweis auf notwendige Pflichtfelder */
	.hw-pflichtfelder {
		color: var(--hw-dark);
		font-size: .9rem;
		margin-bottom: 1rem;
	}

	/* Akkordeon-Inhalt wird formatiert */
	.hw-akkordcont {
		font-size: .9rem;
	}

	/* Darstellung von Begriffserklärungen in Legendenform */
	.hw-legende {
		font-size: .9rem;
		line-height: 1.5rem;
		margin-bottom: 1rem;
	}

}