@charset "utf-8";
/*
* $Id: ea.css,v 0.7 2024/08/16 13:38:33 robert Exp $
*  (Zeit in UTC!)
* Datei: ea.css
*
* erstellt: 13.02.2024
* letzte Änderung: 22.05.2025
* Autor: Robert Berghaus, ROBe EDV
*/

/*
	22.05.2025: Angepaßt an ea.css aus der Anwendung!
	12.08.2024: Das Untermenü wird nur noch angezeigt, wenn der Cursor auf dem Menüpunkt ist.
	27.06.2024:	Für FormOverlay muß pointer-events aus none stehen, sonst
					überdeckt auch das unsichtbare Feld Elemente für die Maus.
	15.06.2024: Nur SeitenRumpfMitte soll einen Scrollbalken bekommen.
	14.05.2024: Textfarbe für input:disabled auf schwarz gesetzt.
	14.02.2024: Mit Daten auf Generator abgeglichen
	13.02.2024:	Von buchhaltung bzw. cna-prj übernommen
*/

/* 
	allgemeine Einstellungen
*/
* {
	margin: 0;
	border: 0;
}

/* body {
*/
body {
	height: 100%;
	width: 100%;
	text-align: center;
	font-family: Helvetica;
	font-size: 14px;
	border: 0;
	color: black;
	background-color: white;
}	/*body {*/

body, div, header, nav, footer {
	box-sizing: border-box;
}	/*body, div {*/

hr {
	height: 1px;
	margin-top: 1em;
	margin-bottom: 1em;
}	/*hr {*/

h1 {
	padding-bottom: 1em;
	font-size: 1.7em;
}	/*h1 {*/

h2 {
	margin-top: 0em;
	margin-bottom: 0em;
	padding-top: 0em;
	padding-bottom: 1em;
	font-size: 1.3em;
}	/*h2 {*/

/*	a, a:visited {
*/
a, a:visited {
	color: blue;
	font-style: italic;
}	/*a, a:visited {*/

/* Einstellungen für Tabellen:
*/
table {
	border: 1px solid grey;
	font-family: monospace;
	text-align: left;
}

th, td {
	border: 1px solid lightgrey;
	padding-left: 3px;
	padding-right: 3px;
}

th {
	font-size: 16px;
}

td {
	font-size: 14px;
}

input {
	font-family: monospace;
	font-size: 1em;
}

label {
	font-size: 0.8em;
}

/*
Was bewirkt input:button?
*/
button, input[type=button], input[type=submit], input[type=reset] {
	margin: 0 0.5em 0 0.5em;
	border: 2px solid lightgrey;
	border-radius: 5px;
	padding: 0.1em 0.5em 0.1em 0.5em;
	background-color: lightcyan;
	font-size: 1em;
}

/*
	Hier sind meine Bezeichner
	Zuerst kommen die grossen Bloecke! (ab 24.11.2023)
	Grundformatierung jetzt nur mit CSS3
*/

/*	#SeitenContainer {
	border: 3px solid grey;
	color: black;
	background-color: whiteblue;
*/
#SeitenContainer {
	height: 100%;
	width: 90%;
	position: relative;
	margin: auto;
}	/*#SeitenContainer {*/

/* @media screen and ( min-width: 60em ) {*/
/* 	#SeitenContainer {*/
/* 		width: 90%;*/
/* 		margin-left: 5%;*/
/* 	}*/
/* }*/

/*	#SeitenKopf {
	border: 1px solid cyan;
	color: cyan;
	background-color: white;
	width: 100%;
	margin: 0;
	clear: right;
*/
#SeitenKopf {
}	/*#SeitenKopf { */

/*	#SeitenRumpf {
	width: 100%;
	color: green;
	background-color: grey;
	width: 100%;
	color: black;
	overflow: auto;
*/
#SeitenRumpf {
	height: 100%;
	width: auto;
	/* Meine Voreinstellung */
	border: 1px solid black;
	padding: 0.2em .5em 0.2em .5em;
	display: flex;
	clear: left;
}	/*#SeitenRumpf {*/

/*	#SeitenFuss {
	background-color: lightgreen;
	clear: left;
*/
#SeitenFuss {
	height: 1em;
	width: 100%;
	padding: 0.1em 0 0.1em 0;
	display: table;
	font-size: 0.7em;
	border: 1px solid black;
	color: darkgrey;
	vertical-align: bottom;
	text-align: center;
	color: #6d709b;
	clear: both;
	float: none;
	background-position: bottom;
	background-color: lightgrey;
}	/*#SeitenFuss {*/

/*
	Untergliederungen vom Kopf
*/
/* für mittiges Logo im Kopf:
*/
#SeitenKopf figure {
	margin-bottom: 0.2em;
	text-align: center;
}

/*	#SeitenMenue {
*/
#SeitenMenue {
	margin: 0;
	color: Black;
}	/*#SeitenMenue {*/

/* Breite für das Menue:
*/
@media screen and ( min-width: 60em ) {
	#SeitenMenue {
		padding-left: calc( ( 100% - 58em ) / 2 );
	}
}

/*	#Navigation {
	position: relative; top: 0px; left: 0px;
	margin: 0 0 0 0;
	border: 1px solid black;
	padding: 0 0 0 0;
	text-align: center;
	line-height: 0;
	height: 1.5em;
	line-height: 1.5em;
	font-size: 12px;
*/
#Navigation {
	width: 100%;
	height: 2em;
	text-align: center;
	font-family: Arial, Verdana, sans-serif;
}

/* Formatierungen fürs Menü
	margin: 0;
	padding: 0;
	border: none;
	outline: none;
*/
.menu, 
.menu li ul,
.menu li,
.menu a {
	margin: 0;
	text-wrap: nowrap;
}

/*	.menu {
	height: 2em; *40px;*
*/
.menu {
	width: 100%;
	text-align: center;
	border-radius: 5px;
	border: none;
}

/*	.menu li {
	Liste im Menü:
	margin: 0.4em 0 0.55em 0;
	border-right: 1px solid #4f5058;
	height: 2em;
	line-height: 1.5em; *28px;*
*/
.menu li {
	position: relative;
 	border-left: 1px solid #393942;
	padding: 0 1em 0 1em;
	list-style: none;
	float: left;
	display: block;
	text-decoration: none;
 	font-family: Helvetica, Arial, sans-serif;
	font-weight: bold;
	font-size: 1em;
	line-height: 150%;
 	color: grey;
}

.menu li a {
	color: grey;
	text-decoration: none;
}

.menu li:first-child { border-left: none; }
.menu li:last-child { border-right: none; }
 
.menu li:hover > a { color: blue; }

/* Unterliste im Menü:
	background: #1f2024;
	margin-top: 0.5em;
	padding: 0.5em;
*/
.menu ul {
	position: absolute;
	padding: 0.5em;
	left: 0;
	width: 100%;
	opacity: 0;
	border-radius: 0 0 5px 5px;
}

.menu ul:hover { opacity: 1; }

.menu li:hover > ul { opacity: 1; }

/*
	margin: 0;
	padding: 0;
.menu li ul li {
	height: 0;
	padding: 2.0em;
   width: auto;
	overflow: hidden;
}
*/ 

.menu ul li {
	height: 0;
	margin: 0;
	padding: 0;
	overflow: hidden;
}
 
.menu li:hover > ul li {
	height: 100%;
	padding: 0;
	overflow: visible;
}

/*	.menu li ul li {
	margin: 0em 0.5em 0.2em 0.5em;
	border-bottom: 1px solid grey;
	padding: 0em 0.5em 0.1em 0.5em;
	width: max-content;
	color: white;
*/
.menu li ul li {
	width: 100%;
	border: none;
	text-align: center;
	background-color: white;
}

.menu li ul li:last-child {
	border: none;
}

.menu ul li:first-child a { padding-top: 1.0em; border: none; }

.menu li.aktiv {
	color: blue;
	text-decoration: underline;
	cursor: pointer;
}

.menu li.inaktiv {
	color: darkgrey;
}

/*
	Untergliederungen von SeitenRumpf
*/
/*	#SeitenRumpfLinks {
	border: 1px solid grey;
	color: grey;
*/
#SeitenRumpfLinks {
	width: 15%;
	border-right: 1px solid grey;
	overflow: auto;
	font-size: 0.8em;
	text-align: left;
}	/* #LinkerTeil {*/

/* Beide auf table-cell, damit die Spalten gleich hoch werden!
*/
#SeitenRumpfLinks, #SeitenRumpfMitte {
	display: table-cell;
}

/*	#SeitenRumpfMitte {
	border: 2px solid grey;
*/
#SeitenRumpfMitte {
	width: 85%;
	overflow: auto;
}	/* #MittelTeil {*/

/*	#SeitenInhalt {
*/
#SeitenInhalt {
	margin: 0 0 0 1em;
	padding: 0em 1em 1em 1em;
}	/* #SeitenInhalt {*/

/* @media screen and ( min-width: 70em ) { */
/* 	#SeitenInhalt  { */
/* 		margin-left: calc( ( 100% - 58em ) / 2 ); */
/* 		width: 58em; */
/* 	} */
/* } */

/* Einstellungen für die StatusZeile:
*/
#StatusZeile {
	width: 100%;
	clear: left;
	float: right;
	font-size: 0.9em;
	border: 1px solid grey;
	text-align: left;
}	/*#StatusZeile {*/

/*
	Untergliederungen von SeitenFuss
*/
/* Einstellungen für den SeitenFuss:
	background-color: DarkCyan;
	border: 2px solid Cyan;
	clear: left;
*/
#SeitenFuss {
	width: 100%;
	margin: 0;
	margin-top: 0.1em;
	color: black;
	display: table;
	font-size: 0.7em;
}

/* Linker Teil des Seitenfusses:
	background-color: DarkKhaki;
	border: 2px solid Yellow;
*/
#SeitenFussLinks {
	width: 25%;
	display: table-cell;
	text-align: center;
}

/* Mittlerer Teil des Seitenfusses:
*/
#SeitenFussMitte {
	width: 35%;
	display: table-cell;
	text-align: center;
}

/* Rechter Teil des Seitenfusses:
	background-color: Salmon;
	border: 2px solid Red;
*/
#SeitenFussRechts {
	width: 40%;
	display: table-cell;
	text-align: center;
}

.fliess_text {
	width: 65em;
	text-align: left;
	font-size: 16px;
}

/*	#BodyOverlay {
	position: static;
	position: relative;
	position: absolute;
	position: sticky;
	* ohne pointer-events kann darunter liegendes nicht angeklickt werden.
	pointer-events: none;
*/
#BodyOverlay {
	position: fixed;
	top: 0;
	right: 0;
	bottom: 0;
	left: 0;
	background-color: rgba( 255, 255, 255, 0.4 );
	opacity: 0;
	transition: opacity 300ms ease-in-out;
	pointer-events: none;
}	/*#BodyOverlay {*/

/*	#FormOverlay {
	pointer-events: auto;
*/
#FormOverlay {
	position: fixed;
	top: 20%;
	left: 50%;
	transform: translate( -50%, -50% );
	padding: 20px;
	background-color: white;
	color: black;
	border-radius: 8px;
	box-shadow: 8px 8px 16px rgba( 0, 0, 0, 0.1 );
	opacity: 0;
	pointer-events: none;
	transition: opacity 300ms ease-in-out;
	font-size: 16px;
	font-family: Helvetica, Arial;
	font-style: normal;
	text-align: left;
}	/*#FormOverlay {*/

/*	.Titel {
	Erstmal nur zum Testen im Overlay
*/
.titel {
	white-space: nowrap;
	overflow: hidden;
	text-overflow: ellipsis;
}	/*.Titel {*/

/*
#BodyOverlay.sichtbar, #FormOverlay.sichtbar {
*/
#BodyOverlay.sichtbar {
	pointer-events: auto;
	opacity: 1;
}	/*#BodyOverlay.sichtbar {*/

#FormOverlay.sichtbar {
	pointer-events: auto;
	opacity: 1;
}	/*#FormOverlay.sichtbar {*/

/*
#BodyOverlay.unsichtbar, #FormOverlay.unsichtbar {
	opacity: 0;
}	/*#BodyOverlay.sichtbar, #FormOverlay.sichtbar {*/

/* Hiermit wird die ID ausgeblendet */
.user_verwaltung th:first-child { display: none }
.user_verwaltung td:first-child { display: none }

/*	#Dialog {
*/
#Dialog {
	position: fixed;
	top: 20%;
	left: 50%;
	transform: translate( -50%, -50% );
	padding: 20px;
	background-color: white;
	color: black;
	border-radius: 8px;
	box-shadow: 8px 8px 16px rgba( 0, 0, 0, 0.1 );
	opacity: 0;
	pointer-events: auto;
	transition: opacity 300ms ease-in-out;
	font-size: 16px;
	font-family: Helvetica, Arial;
	font-style: normal;
	text-align: left;
}	/*#Dialog {*/

/*	#Dialog.sichtbar {
	pointer-events: auto;
*/
#Dialog.sichtbar {
	opacity: 1;
}	/*#Dialog.sichtbar {*/

dialog::backdrop {
	background: hsl( 201 50% 40% /.5 );
}

#DialogStandard, 
#DialogAbmelden, 
#DialogUserLoeschen, 
#DialogDBLoeschen, 
#DialogDBAnlegen, 
#DialogBuchungLoeschen, 
#DialogBuchungsjahrAendern,
#DialogBuchungenImportieren {
	position: absolute;
	top: 30%;
	left: 50%;
	transform: translate( -50% );
	padding: 20px;
	background-color: white;
	color: black;
	border-radius: 8px;
	box-shadow: 8px 8px 16px rgba( 0, 0, 0, 0.1 );
	opacity: 0;
	pointer-events: none;
	transition: opacity 300ms ease-in-out;
}	/*#DialogAbmelden, #DialogUserLoeschen, #DialogDBLoeschen, #DialogDBAnlegen, #DialogBuchungLoeschen {*/

#DialogStandard.sichtbar, 
#DialogAbmelden.sichtbar, 
#DialogUserLoeschen.sichtbar, 
#DialogDBLoeschen.sichtbar, 
#DialogDBAnlegen.sichtbar, 
#DialogBuchungLoeschen.sichtbar, 
#DialogBuchungsjahrAendern.sichtbar,
#DialogBuchungenImportieren.sichtbar {
	opacity: 1;
	pointer-events: auto;
	border: 5px solid grey;
}	/*#MittelTeilOverlay.sichtbar, .overlay.sichtbar {*/ 

/*
Auf Parent kann ich so einfach nicht zugreifen
*/
/* input { */
	/* color: red; */
/* } */

input:valid {
	color: green;
}

input:invalid {
	color: red;
}

input:disabled, select:disabled {
	color: black;
}

.zahlen {
	text-align: right;
}

.selektiert {
	background-color: lightgreen;
}

.fett {
	font-size: 18px;
	font-weight: bold;
}

/*
	Buchungen
*/
#Buchungen {
	width: max-content;
}

/*
	width: 1em;
*/
#B_id {
	background: lightgreen;
}

/*
	width: 2em;
*/
#B_Tag {
	background: lightgreen;
}

/* .tag { */
	/* width: min-content; */
/* } */

/*
	width: 30em;
*/
#B_Text {
	background: lightgreen;
}

/*
	width: 9em;
*/
#B_Betrag {
	background: lightgreen;
}

/*
	width: 4em;
*/
#B_MWStProzent {
	background: lightgreen;
}

/*
	width: 9em;
*/
#B_Netto {
	background: lightgreen;
}

/*
	width: 9em;
*/
#B_MWSt {
	background: lightgreen;
}

/*
	width: 2em;
*/
#B_Sonderbuchung {
	background: lightgreen;
}

/*
*/
#B_Aktion {
	background: lightgreen;
	width: fit-content;
}

.kein_Rahmen {
	border: 0px;
}

.links {
	text-align: left;
}

.zentriert {
	text-align: center;
}

.rechts {
	text-align: right;
}

.betrag {
	width: auto;
}

/*
	bringet es so nicht
.tag {
	size: 15;
}
*/

.mwstProzent {
	color: green;
}

.mwst {
	color: green;
}

.sonderBuchung {
	visibility: hidden;
}

.ausblenden {
	visibility: collapse;
}

@media print {
	body {
		background-color: lightcyan;
	}

	#SeitenMenue, #SeitenRumpfLinks, #SeitenFuss {
		display: none;
		background-color: yellow;
	}
}

#BackgroundOverlay {
	position: fixed;
	top: 0;
	right: 0;
	bottom: 0;
	left: 0;
	background-image: url( "../img/ROBe-Entwicklung-Logo.svg" );
	background-repeat: no-repeat;
	background-position: center;
	background-size: contain;
	opacity: 0.1;
	pointer-events: none;
}	/*#BackgroundOverlay {*/

#ID_Logo {
	height: auto;
	width: 40%;
}

:focus {
	border-color: blue;
}

.default {
	font-weight: bold;
}