html, body{		
	left:0;
	top:0;	
	margin-top: 0px;
	margin-left: 0px;
	background-color:#FFFFFF;
    height: 100% !important;
    max-height: 100% !important;
    width: 100% !important;
	max-width: 100% !important;
	position: fixed !important; /* Verhindert jegliches Scrollen der Grundfläche */
    overflow: hidden !important;
}	

.c0 {
	left:2.5vw !important;}
.c1 {
	left:8.5vw !important;}
.c2 {
	left:14.5vw !important;}
.c3 {
	left:20.5vw !important;}
.c4 {
	left:26.5vw !important;}
.c5 {
	left:32.5vw !important;}
.c6 {
	left:38.5vw !important;}
.c7 {
	left:44.5vw !important;}
.c8 {
	left:50.5vw !important;}
.c9 {
	left:56.5vw !important;}
.c10 {
	left:62.5vw !important;}
.c11 {
	left:68.5vw !important;}
.c12 {
	left:74.5vw !important;}
.c13 {
	left:80.5vw !important;}	
.c14 {
	left:86.5vw !important;}	
.c15 {
	left:92.5vw !important;}	


.r0 {
	top:4vh !important;}
.r1 {
	top:10vh !important;}
.r2 {
	top:16vh !important;}
.r3 {
	top:22vh !important;}
.r4 {
	top:28vh !important;}
.r5 {
	top:34vh !important;}
.r6 {
	top:40vh !important;}
.r7 {
	top:46vh !important;}
.r8 {
	top:52vh !important;}
.r9 {
	top:58vh !important;}
.r10 {
	top:64vh !important;}
.r11 {
	top:70vh !important;}
.r12 {
	top:76vh !important;}
.r13 {
	top:82vh !important;}
.r14 {
	top:88vh !important;}
.r15 {
	top:94vh !important;}

.set-off {
	background-image: url(icon/set-off.gif?v=2018);
	background-size: 6vh 6vh;
	background-repeat: no-repeat;
	background-position: 1vh 1vh;
}
.set-lock {
	background-image: url(icon/set-lock.gif?v=2018);
	background-size: 6vh 6vh;
	background-repeat: no-repeat;
	background-position: 1vh 1vh;
}
.set-time {
	background-image: url(icon/set-time.gif?v=2018);
	background-size: 6vh 6vh;
	background-repeat: no-repeat;
	background-position: 1vh 1vh;
}
.set-help {
	background-image: url(icon/set-help.gif?v=2018);
	background-size: 6vh 6vh;
	background-repeat: no-repeat;
	background-position: 1vh 1vh;
}
.set-info {
	background-image: url(icon/set-info.gif?v=2018);
	background-size: 6vh 6vh;
	background-repeat: no-repeat;
	background-position: 1vh 1vh;
}
.set-ok {
	background-image: url(icon/set-ok.gif?v=2024);
	background-size: 6vh 6vh;
	background-repeat: no-repeat;
	background-position: 1vh 1vh;
}
.set-save {
	background-image: url(icon/set-save.gif?v=2018);
	background-size: 6vh 6vh;
	background-repeat: no-repeat;
	background-position: 1vh 1vh;
}
.set-alias {
	background-image: url(icon/set-alias.gif?v=2018);
	background-size: 6vh 6vh;
	background-repeat: no-repeat;
	background-position: 1vh 1vh;
}	
.set-data {
	background-image: url(icon/set-data.gif?v=2018);
	background-size: 6vh 6vh;
	background-repeat: no-repeat;
	background-position: 1vh 1vh;
}	
.set-pc {
	background-image: url(icon/set-pc.gif?v=2018);
	background-size: 6vh 6vh;
	background-repeat: no-repeat;
	background-position: 1vh 1vh;
}
.set-valide {
	background-image: url(icon/set-valide.gif?v=2018);
	background-size: 6vh 6vh;
	background-repeat: no-repeat;
	background-position: 1vh 1vh;
}
.set-mobil {
	background-image: url(icon/set-mobil.gif?v=2018);
	background-size: 6vh 6vh;
	background-repeat: no-repeat;
	background-position: 1vh 1vh;
}
	
.wd {
	background-color: #44c767;
}
.sa {
	background-color: #ffd700;
}	 
.so {
	background-color: #fe1a00;
}
.vd {
	background-color: #663399;
}	 
.hd { 
	background-color: #c71818;
}
.on { 
	background-color: #007dc1;
}
.no { 
	background-color: #bddbff;
}
.of { 
	background-color: #dbe6c4;
}
.in { 
	background-color: #eeeeee;
}

.days {
	width:11vw;
	height:8vh;
	padding-left:5vh;
	border-style:none;
	position:absolute;
}
.set1 {
	width:5vw;
	height:8vh;
	border-style:none;
	position:absolute;
}
.set2 {
	width:11vw;
	height:8vh;
	border-style:none;
	position:absolute;
}
.set3 {
	width:17vw;
	height:8vh;
	border-style:none;
	position:absolute;
}
.set4 {
	width:23vw;
	height:8vh;
	border-style:none;
	position:absolute;
}
.set5 {
	width:29vw;
	height:8vh;
	border-style:none;
	position:absolute;
}		  	 
.set6 {
	width:35vw;
	height:8vh;
	border-style:none;
	position:absolute;
}
.set7 {
	width:41vw;
	height:8vh;
	border-style:none;
	position:absolute;
}
.set8 {
	width:47vw;
	height:8vh;
	border-style:none;
	position:absolute;
}
.set9 {
	width:53vw;
	height:8vh;
	border-style:none;
	position:absolute;
}
.set10 {
	width:59vw;
	height:8vh;
	border-style:none;
	position:absolute;
}
.set11 {
	width:55vw;
	height:8vh;
	border-style:none;
	position:absolute;
}
.set12 {
	width:71vw;
	height:8vh;
	border-style:none;
	position:absolute;

}
.set13 {
	width:77vw;
	height:8vh;
	border-style:none;
	position:absolute;

}

.fw {	
	font-family:Arial;
	font-weight:bold;
	font-size: 3.6vmin;
	text-decoration:none;
	color:white;
	-moz-border-radius:2vh;
	-webkit-border-radius:2vh;
	border-radius:2vh;
	display: block !important;
}
.fb {	
	font-family:Arial;
	font-weight:bold;
	font-size: 3.6vmin;
	text-decoration:none;
	color:black;
	-moz-border-radius:2vh;
	-webkit-border-radius:2vh;
	border-radius:2vh;
	display: block !important;
}
div {
	width:95vw;
	left: 2.5vw;
	top:16vh;
	border-style:none;
	position:absolute;
	overflow-y:scroll;
	overflow-x:hidden;
	padding:0px;
}

.list {
	top:78vh;
	height:8vh;
}
.day{
	width:100%;
}
.day td, .day th{
	text-align: center;
	font-size: 1.8vmin;
}
.list td{
	text-align: center;
	font-size: 2vmin;
}
.summe td{
	text-align: right;
	width: 3.2vw;
	white-space:normal;
	font-size: 2vmin;
}
.h8 {
	height:42vh;
}
.h10 {
	height:51vh;
}
.h12 {
	height:60vh;
}
.h14 {
	height:69vh;
}

input[type="time"]::-webkit-clear-button{
    display:none;
}	
	
input[type='range'] {
	-webkit-appearance: none; /* Chrome, Safari, Opera */
	-moz-appearance: none;    /* Firefox */
	appearance: none;         /* Standard */
    background-color: gray;
		position: absolute;
}

input[type='text'] {
		text-align: center;
}
input[type='password'] {
		text-align: center;
}


/* Verhindert das Springen, ohne die Position r2, r4 etc. zu stören */
button {
    /* Absolut unbeweglich machen */
    position: absolute !important;
    margin: 0 !important;
    padding: 0 !important;
    border: none !important;
    
    /* Touch-Verhalten optimieren */
    touch-action: manipulation !important;
    -webkit-tap-highlight-color: transparent !important;
    outline: none !important;
}

/* Deaktiviert ALLES, was der Browser beim Tippen/Hovern ändern möchte */
button:hover, button:active, button:focus {
    /* Wir erzwingen, dass top/left/transform sich NICHT ändern dürfen */
    transform: none !important;
    box-shadow: none !important;
    /* Da r- und c-Klassen !important sind, bleiben sie eh fix */
}
button {
    /* Absolut unbeweglich machen */
    position: absolute !important;
    margin: 0 !important;
    padding: 0 !important;
    border: none !important;
    
    /* Touch-Verhalten optimieren */
    touch-action: manipulation !important;
    -webkit-tap-highlight-color: transparent !important;
    outline: none !important;
}

/* Deaktiviert ALLES, was der Browser beim Tippen/Hovern ändern möchte */
button:hover, button:active, button:focus {
    /* Wir erzwingen, dass top/left/transform sich NICHT ändern dürfen */
    transform: none !important;
    box-shadow: none !important;
    /* Da r- und c-Klassen !important sind, bleiben sie eh fix */
}
button {
    /* Absolut unbeweglich machen */
    position: absolute !important;
    margin: 0 !important;
    padding: 0 !important;
    border: none !important;
    
    /* Touch-Verhalten optimieren */
    touch-action: manipulation !important;
    -webkit-tap-highlight-color: transparent !important;
    outline: none !important;
}

/* Deaktiviert ALLES, was der Browser beim Tippen/Hovern ändern möchte */
button:hover, button:active, button:focus {
    /* Wir erzwingen, dass top/left/transform sich NICHT ändern dürfen */
    transform: none !important;
    box-shadow: none !important;
    /* Da r- und c-Klassen !important sind, bleiben sie eh fix */
}
button {
    /* Absolut unbeweglich machen */
    position: absolute !important;
    margin: 0 !important;
    padding: 0 !important;
    border: none !important;
    
    /* Touch-Verhalten optimieren */
    touch-action: manipulation !important;
    -webkit-tap-highlight-color: transparent !important;
    outline: none !important;
}

/* Deaktiviert ALLES, was der Browser beim Tippen/Hovern ändern möchte */
button:hover, button:active, button:focus {
    /* Wir erzwingen, dass top/left/transform sich NICHT ändern dürfen */
    transform: none !important;
    box-shadow: none !important;
    /* Da r- und c-Klassen !important sind, bleiben sie eh fix */
}
button {
    /* Absolut unbeweglich machen */
    position: absolute !important;
    margin: 0 !important;
    padding: 0 !important;
    border: none !important;
    
    /* Touch-Verhalten optimieren */
    touch-action: manipulation !important;
    -webkit-tap-highlight-color: transparent !important;
    outline: none !important;
}

/* Deaktiviert ALLES, was der Browser beim Tippen/Hovern ändern möchte */
button:hover, button:active, button:focus {
    /* Wir erzwingen, dass top/left/transform sich NICHT ändern dürfen */
    transform: none !important;
    box-shadow: none !important;
    /* Da r- und c-Klassen !important sind, bleiben sie eh fix */
}
button {
    /* Absolut unbeweglich machen */
    position: absolute !important;
    margin: 0 !important;
    padding: 0 !important;
    border: none !important;
    
    /* Touch-Verhalten optimieren */
    touch-action: manipulation !important;
    -webkit-tap-highlight-color: transparent !important;
    outline: none !important;
}

/* Deaktiviert ALLES, was der Browser beim Tippen/Hovern ändern möchte */
button:hover, button:active, button:focus {
    /* Wir erzwingen, dass top/left/transform sich NICHT ändern dürfen */
    transform: none !important;
    box-shadow: none !important;
    /* Da r- und c-Klassen !important sind, bleiben sie eh fix */
}
button {
    /* Absolut unbeweglich machen */
    position: absolute !important;
    margin: 0 !important;
    padding: 0 !important;
    border: none !important;
    
    /* Touch-Verhalten optimieren */
    touch-action: manipulation !important;
    -webkit-tap-highlight-color: transparent !important;
    outline: none !important;
}

/* Deaktiviert ALLES, was der Browser beim Tippen/Hovern ändern möchte */
button:hover, button:active, button:focus {
    /* Wir erzwingen, dass top/left/transform sich NICHT ändern dürfen */
    transform: none !important;
    box-shadow: none !important;
    /* Da r- und c-Klassen !important sind, bleiben sie eh fix */
}
button {
    /* Absolut unbeweglich machen */
    position: absolute !important;
    margin: 0 !important;
    padding: 0 !important;
    border: none !important;
    
    /* Touch-Verhalten optimieren */
    touch-action: manipulation !important;
    -webkit-tap-highlight-color: transparent !important;
    outline: none !important;
}

/* Deaktiviert ALLES, was der Browser beim Tippen/Hovern ändern möchte */
button:hover, button:active, button:focus {
    /* Wir erzwingen, dass top/left/transform sich NICHT ändern dürfen */
    transform: none !important;
    box-shadow: none !important;
    /* Da r- und c-Klassen !important sind, bleiben sie eh fix */
}
/* ======================================================
   Vergleichsansicht (Tabellenlayout)
   ====================================================== */

.vers {
    position: relative;
    overflow: hidden;
    background: #fff;
    border: none;
}

/* Wrapper mit Scrollverhalten */
.vers #liste-wrapper {
    position: absolute;
    inset: 0;
    overflow: auto;
    padding: 0;
    box-sizing: border-box;
}

/* Tabellenlayout */
.vers .compare-table {
    border-collapse: collapse;
    width: max-content;
    min-width: 100%;
    font-size: 0.9rem;
    background: white;
}

/* Kopfzeile fixiert */
.vers .compare-table thead th {
    position: sticky;
    top: 0;
    background: #ccc;
    z-index: 10 !important;
    padding: 0.5rem 0.8rem;
    text-align: left;
    white-space: nowrap;
}

/* Fixierte Spalten (Datum, Name, Tätigkeit, Summe) */
.vers .compare-table th:nth-child(1),
.vers .compare-table td:nth-child(1) {
    position: sticky;
    left: 0;
    z-index: 9 !important;
    background: #f8f9fa;
}

/* 2. Spalte komplett ausblenden, aber im DOM belassen */
.vers .compare-table th:nth-child(2),
.vers .compare-table td:nth-child(2) {
    width: 0 !important;
    min-width: 0 !important;
    max-width: 0 !important;
    padding: 0 !important;
    border: none !important;
    overflow: hidden !important;
    white-space: nowrap !important;
    visibility: collapse !important; /* bleibt im DOM für Copy */
    position: static !important; /* überschreibt evtl. Inline-Styles */
    left: auto !important;
    z-index: auto !important;
    background: transparent !important;
}

/* Tätigkeit */
.vers .compare-table th:nth-child(3),
.vers .compare-table td:nth-child(3) {
    position: sticky;
    left: 10rem; /* angepasst nach Entfernen von Spalte 2 */
    z-index: 9 !important;
    background: #fff;
}

/* 4. Spalte */
.vers .compare-table th:nth-child(4),
.vers .compare-table td:nth-child(4) {
    position: sticky;
    left: 22rem;
    z-index: 9 !important;
    background: #fff;
}

/* Letzte Spalte fixieren (Summe) */
.vers .compare-table th:last-child,
.vers .compare-table td:last-child {
    position: sticky;
    right: 0;
    background: #fafafa;
    z-index: 9 !important;
    font-weight: bold;
}

/* Kopfzeile über fixierten Spalten */
.vers .compare-table thead th:nth-child(1),
.vers .compare-table thead th:nth-child(3),
.vers .compare-table thead th:nth-child(4),
.vers .compare-table thead th:last-child {
    z-index: 11 !important;
}

/* Tabellenzellen */
.vers .compare-table th,
.vers .compare-table td {
    border-bottom: 1px solid #ddd;
    padding: 0.3rem 0.6rem;
    white-space: nowrap;
    text-align: right;
}

/* Erste Spalte linksbündig */
.vers .compare-table td:first-child {
    text-align: left;
    font-weight: bold;
}

/* AZ-Spalten grau einfärben */
.vers .compare-table td.az-cell {
    background: #f2f2f2;
}

/* Abweichungsmarkierung */
.vers .compare-table td.error {
    background-color: #ffd6d6;
}

/* Hover-Effekt */
.vers .compare-table tbody tr:hover {
    background: #f5f5f5;
}

/* Tooltip für Name */
.vers .compare-table td[title]:hover {
    cursor: help;
    background: #eef;
}

/* Scrollbar */
.vers #liste-wrapper::-webkit-scrollbar {
    height: 0.8rem;
    width: 0.8rem;
}
.vers #liste-wrapper::-webkit-scrollbar-thumb {
    background: #bbb;
    border-radius: 0.4rem;
}
.vers #liste-wrapper::-webkit-scrollbar-thumb:hover {
    background: #888;
}

td.error-soll {
    background-color: #ff8080 !important;
    color: #000;
    font-weight: bold;
}


/* Dropdown für Tätigkeitsfilter */
#taetigkeitFilter {
    position: fixed;
    background: #fff;
    border: 1px solid #aaa;
    border-radius: 4px;
    box-shadow: 0 2px 6px rgba(0,0,0,0.25);
    padding: 4px 6px;
    z-index: 9999;
}

/* Dropdown-Optionen */
#taetigkeitFilter select {
    width: 160px;
    font-size: 0.9rem;
    padding: 2px;
}

/* Tätigkeit rot einfärben, wenn Fehler in der Zeile */
.vers .compare-table tr:has(td.error) td:nth-child(4) {
    color: #f22;
    font-weight: bolder;
}

/* Markierung für kopierte / bestätigte Fehlerzellen */
td.messing {
    background-color: #fff8b0; 
}

/* ======================================================
   Validation Tabelle (Monatsübersicht)
   ====================================================== */

/* Tabelle Grundlayout */
.validation_table {
    border-collapse: collapse;
    width: max-content; /* Breite passt sich Inhalt an */
    font-size: 1rem;
}

/* Kopfzeile fixieren */
.validation_table thead th {
    position: sticky;
    top: 0;
    background: #f0f0f0;
    z-index: 10;
    padding: 4px 6px;
    text-align: center;
    border: 1px solid #ccc;
}

/* Erste Spalte ID fixieren */
.validation_table th.col_id,
.validation_table td.col_id {
    position: sticky;
    left: 0;
    background: #f9f9f9;
    z-index: 9; /* hinter der Kopfzeile */
    text-align: left;
    padding: 4px 6px;
    border: 1px solid #ccc;
}

/* Zweite Spalte Name fixieren */
.validation_table th.col_name,
.validation_table td.col_name {
    position: sticky;
    left: calc(var(--col_id_width, 50px)); /* Dynamische Breite der ID-Spalte */
    background: #f9f9f9;
    z-index: 9; /* hinter der Kopfzeile */
    text-align: left;
    padding: 4px 6px;
    border: 1px solid #ccc;
}

/* Wochentage / Tage */
.validation_table th:not(.col_id):not(.col_name),
.validation_table td:not(.col_id):not(.col_name) {
    text-align: center;
    padding: 4px;
    border: 4px solid transparent;
    margin: 2px;
}


/* Validierungspunkte */
.day_ok { border: 4px solid green; }
.day_error { border: 4px solid red; color: white; font-weight: bold; text-align: center; }

/* Verhindert das "Sticky Hover" auf Touch-Geräten, ohne das Gitter zu zerstören */
@media (hover: none) {
    button:hover {
        /* Wir rühren 'top' NICHT an! */
        /* Wir neutralisieren nur eventuelle Transformationen oder Schatten */
        transform: none !important;
        box-shadow: none !important;
    }
}