/* ------------------------------------------------------------------------------------------------------------------------------------*/

/* ------------------------------------------------------------ CUSTOM CSS ------------------------------------------------------------*/

/* ------------------------------------------------------------------------------------------------------------------------------------*/

body{
	font-size:0.9em !important;
}
body.print{
	width: auto !important;
	padding-left: 0 !important;
	padding-right: 0 !important;
	margin-left: 0 !important;
	margin-right: 0 !important;}
}
@media print {
  @page {
    size: A4;
	margin: 0px;
  }
  
  .row{
	 // page-break-before: always;
  }

}



:root{
	--mainbgcolor: #b9b9b9;
	--mainbgcolor1: #cacaca;
	--mainbgcolor2: #f0f0f0;
	--inputbgcolor: #ccc;
	--maincolor: #212121;
	--maincolor1: #444;
	--maincolor2: #888;
	--managementbgcolor:#c06fc6;
	--weekendbgcolor:#ead900;
	--feiertagbgcolor:#f2af41;
	--statuscolor:#6cc46c;
	--neohighlight: #fff;
	--neoshadow: #bebebe;
	--neoshadow1: rgba(0,0,0,0.1);
	--filterbg: #86a886;
	--urlaubbg: #cec665;
	--krankbg:#d8983d;
	--freibg:#7bc0ef;

	--neodepth: 7px;
	--neoblur: 20px;
	--neodepth1: 2px;
	--neoblur1: 14px;
	--kundenlogo: url(../img/baltic-cleaning_black.png);

	--coloranreise: #4ca547;
	--colorabreise: #ce4949;
	--colorfirmenobjekt: #e58a38;
	--colorbuchung: #5dbf55;
	//#9ac497;

}


body.dark{
	--mainbgcolor: #212121;
	--mainbgcolor1: #444;
	--mainbgcolor2: #3a3a3a;
	--inputbgcolor: #303030;
	--maincolor: #fff;
	--maincolor1: #ddd;
	--maincolor2: #aaa;
	--neohighlight: rgb(100, 100, 100);
	--neoshadow: rgb(25, 25, 25);
	--neoshadow1: rgba(0,0,0,0.3);
	--kundenlogo: url(../img/baltic-cleaning.png);
}

body{
	background-color:var(--mainbgcolor);
	color:var(--maincolor);
	font-family: "Roboto Condensed", sans-serif;
	font-optical-sizing: auto;
	font-style: normal;
	font-size:1.2em;

	--neoout: var(--neodepth) var(--neodepth) var(--neoblur) var(--neoshadow), calc(-1 * var(--neodepth)) calc(-1 * var(--neodepth)) var(--neoblur) var(--neohighlight);
	--neoout1: var(--neodepth1) var(--neodepth1) var(--neoblur1) var(--neoshadow), calc(-1 * var(--neodepth1)) calc(-1 * var(--neodepth1)) var(--neoblur1) var(--neohighlight);
	--neoin: inset var(--neodepth) var(--neodepth) var(--neoblur) var(--neoshadow), inset calc(-1 * var(--neodepth)) calc(-1 * var(--neodepth)) var(--neoblur) var(--neohighlight);
	--neoframe: 0px var(--neodepth) calc(var(--neoblur) * 0.5) var(--neoshadow1);
	--neoline: 0 1px 0px var(--neohighlight), inset 0 -2px 0px var(--neoshadow);
	--neoline1: 1px 0px 0px var(--neohighlight), inset -2px 0px 0px var(--neoshadow);
	--neoday: 0px 0px 4px var(--neoshadow);
	--neoday_hover: inset 2px 2px 2px var(--neoshadow), inset -2px -2px 2px var(--neohighlight);
}

	/* From .io by namecho */ 
	.switch {
	 --button-width: 3.5em;
	 --button-height: 2em;
	 --toggle-diameter: 1.5em;
	 --button-toggle-offset: calc((var(--button-height) - var(--toggle-diameter)) / 2);
	 --toggle-shadow-offset: 10px;
	 --toggle-wider: 3em;
	 --color-grey: #cccccc;
	 --color-green: #333;
		width:122px;
		display:flex;
		justify-content:flex-end;
	}
	
	.slider {
		display: inline-block;
		width: var(--button-width);
		height: var(--button-height);
		background-color: var(--color-grey);
		border-radius: calc(var(--button-height) / 2);
		position: relative;
		transition: 0.3s all ease-in-out;
		pointer:cursor;
	}
	
	.slider::after {
		content: "";
		display: inline-block;
		width: var(--toggle-diameter);
		height: var(--toggle-diameter);
		background-color: #fff;
		border-radius: calc(var(--toggle-diameter) / 2);
		position: absolute;
		top: var(--button-toggle-offset);
		transform: translateX(var(--button-toggle-offset));
		box-shadow: var(--toggle-shadow-offset) 0 calc(var(--toggle-shadow-offset) * 4) rgba(0, 0, 0, 0.1);
		transition: 0.3s all ease-in-out;
	}
	
	.switch input[type="checkbox"]:checked + .slider {
		background-color: var(--color-green);
	}
	
	.switch input[type="checkbox"]:checked + .slider::after {
		transform: translateX(calc(var(--button-width) - var(--toggle-diameter) - var(--button-toggle-offset)));
		box-shadow: calc(var(--toggle-shadow-offset) * -1) 0 calc(var(--toggle-shadow-offset) * 4) rgba(0, 0, 0, 0.1);
	}
	
	.switch input[type="checkbox"] {
		display: none;
	}
	
	.switch input[type="checkbox"]:active + .slider::after {
		width: var(--toggle-wider);
	}
	
	.switch input[type="checkbox"]:checked:active + .slider::after {
		transform: translateX(calc(var(--button-width) - var(--toggle-wider) - var(--button-toggle-offset)));
	}
	



.animated{
	o-transition-duration:  all 0.4s ease 0s;
	ms-transition-duration:  all 0.4s ease 0s;
	moz-transition-duration:  all 0.4s ease 0s;
	webkit-transition-duration:  all 0.4s ease 0s;	
	transition: all 0.4s ease 0s;
}

.animated1{
	o-transition-duration:  all 0.4s ease 0.2s;
	ms-transition-duration:  all 0.4s ease 0.2s;
	moz-transition-duration:  all 0.4s ease 0.2s;
	webkit-transition-duration:  all 0.4s ease 0.2s;	
	transition: all 0.4s ease 0.2s;
}

input[type=text], input[type=date], input[type=time], input[type=password], textarea, select{
	background-color:var(--inputbgcolor);
	box-shadow: inset 2px 5px 10px rgba(0,0,0, 0.2);	
	border:0px;
	border-radius:6px;
	padding:10px 20px;
	color:var(--seccolor);
}

h2{
	font-weight:700;
	text-shadow:var(--neoout1);
	margin-bottom:10px;
}

select.office{
	padding:0;
}

select option{
	width:100%;
	padding:5px 10px;
	box-shadow: var(--neoline);	
}

option:hover,
option:focus,
option:active,
option:checked{
	background-color: var(--mainbgcolor);
}

*[type=submit], .submit{
	background-color:var(--inputbgcolor);
	box-shadow: -2px -2px 10px var(--neohighlight), 2px 2px 10px var(--neoshadow);	
	border:0px;
	border-radius:5px;
	padding:10px 40px;
	color:var(--maincolor);
	cursor:pointer;
	border:1px solid var(--inputbgcolor);
	text-decoration: none;

}

*[type=submit]:hover, .submit:hover{
	border:1px solid var(--neohighlight);
}


a{
	color:var(--maincolor2);
}

.section{
	padding-bottom:60px;
	padding-left:20px;
	padding-right:20px;
	width:calc(100% - 0px);
	max-width:100vw;
	display:flex;
	align-items:stretch;
	justify-content:flex-start;
	flex-wrap:wrap;
	gap:10px;
}

.section.topbar{
	width:100%;
	padding:20px 20px;
	justify-content:space-between;
}

.section.topbar .logo{
	width:122px;
	height:40px;
	background-image:url(../img/task2go_Logo_positive.svg);
	background-size:contain;
	background-repeat:no-repeat;
	cursor:pointer;
}

.section.topbar .datetime{
	font-size:0.7em;
	padding:5px 30px;
	//border:1px dashed var(--neohighlight);
	display: flex;
	flex-direction: column;
	justify-content: center;
	align-content: center;
	position: relative;	
	border-radius:10px;
	box-shadow:var(--neoframe);
}

.section.startseite .frame, .section.login .frame{
	gap:2em;
	flex-direction:column;
}

.section.startseite .frame, .section.login{
	justify-content:center;
}

.section.startseite .frame, .section.login form{
	flex-direction:column;
}

.section.login *[type=submit]{
	width:100%;
}

.dark .section.topbar .logo{
	background-image:url(../img/task2go_Logo_negative.svg);
}

.kundenlogo{
	width:150px;
	height:150px;
	background-image:var(--kundenlogo);
	background-size:contain;
	background-repeat:no-repeat;
}

.frame{
	background:linear-gradient(145deg, var(--mainbgcolor1), var(--mainbgcolor2));
	box-shadow: var(--neoframe);
	border-radius:10px;
	padding:20px;
	display:flex;
	flex-direction:column;
	flex-wrap:wrap;
	align-items:center;
	justify-content: center;
}

.frame form{
	display:flex;
	flex-direction:row;
	flex-wrap:wrap;
	align-items:flex-start;
	justify-content: flex-start;
	gap:10px;
}

.block{
	display:flex;
	flex-direction:column;
	align-items:stretch;
	justify-content:stretch;
	gap:10px;
}

.block.sidebar{
	width:80px;
}

.block.sidebar .user{
	width:100%;
	padding:20px 0;
}	

.block.content{
	width:calc(100% - 140px);
}

.table{
	display:flex;
	flex-direction:column;
	align-content:stretch;
	width:100%;
}

.table .row{
	display:flex;
	flex-direction:row;
	padding:8px 0;
	box-shadow: var(--neoline);
	justify-content:space-between;
}

.table .cell{
	display:flex;
	flex-wrap:nowrap;
}

.tabel.cell.actions{
	width:auto;
	align-items:center;
}

.frame.main-menu {
	flex-direction:row !important;
	width:calc(75% - 20px);
	gap:40px;
}

.sidebar .main-menu{
	flex-direction:column;
	width:auto;
	padding:10px;
	gap:10px;
	align-items:stretch;
}

.main-menu .button{
	position:relative;
	width:calc(20% - 40px);
	aspect-ratio: 1 / 1; 
	border-radius:10px;
	box-shadow:var(--neoout);
	display:flex;
	flex-direction:column;
	align-items:center;
	justify-content:center;
	text-decoration:none;
	color:var(--maincolor);
	font-size:1.2em;
	gap:0.5em;
}

.main-menu .button.active{
	box-shadow:none;
	//background:var(--neoshadow);
}

.sidebar .main-menu .button{
	width:100%;
	margin:0;
	font-size:0.9em;
}

.sidebar .main-menu .button span{
	display:none;
}

.main-menu .button i{
	font-size:2em;
}

.main-menu .button:hover{
	box-shadow:var(--neoin);
}	


.section.edit{
	align-items:space-between;
	gap:20px;
}

.section .user{
	font-size:1.5em;
	flex-direction:column;
	width:25%;
	padding:40px 40px;
}

.section.edit .frame.list{
	flex-direction:column;
	align-items:flex-start;	
	justify-content: flex-start;
	//width:20vw;
	padding:20px;
	
}

.section.edit .frame.list .table{
	font-size:0.8em;
}

.section.edit .frame.list .cell{
	width:80%;
}

.section.edit .frame.list .cell.actions{
	width:auto;
}

.section.edit .frame.list .row{
	padding:4px 10px;
}

.section.edit .frame.list .counter{
	width:30px;
}

.section.edit .frame.list a{
	text-decoration: none;
	color:var(--maincolor1);
}

.section.edit .frame.list a:hover{
	background:var(--mainbgcolor1);
}


.section .block.detail,.section .block.filter, .section .block.objekte{
	justify-content:stretch;
	box-shadow: inset 2px 5px 10px rgba(0,0,0, 0.2);
	border:1px solid #555;
	//box-shadow:var(--neoin);
	padding:10px;
	border-radius:10px;
}

.section .block.filter{
	width:20vw;
}

.section .block.objekte{
	width:20vw;
}
.section .block.detail{
	width:auto;
	max-width:calc(100vw - (40vw + 80px + 120px));
}

.objekt .fa-building{
	margin-right:5px;
	opacity:0.5;
}

.objekt .fa-ticket, .dienstplan .fa-ticket{
	margin-right:5px;
	color:var(--managementbgcolor);
}

.section.edit .block.detail .message{
	width:100%;
	text-align:center;
	font-size:1.2em;
	background-color:#acdb9e;
	padding:10px;
	border-radius:10px;
}

.section.edit .frame.actions{
	padding:20px 20px;
	justify-content:space-between;
	flex-direction:row;
}

.section.edit .frame.actions input{
	width:auto;
}

.section.edit .frame.detail{
	//width:60vw;
	padding:20px;
	flex-direction: row;
	font-size:1.0em;
	gap:10px;
	justify-content: space-around;
}

.section.edit .frame.detail > div{
	//width:100% !important;
	padding:0px !important;
}

.section.edit .frame.detail input[type="text"], .section.edit .frame.detail textarea, .section.edit .frame.detail input[type="date"]{
	width:calc(100% - 40px) !important;
	padding:10px 20px;
}


select.office {
	width:100%;
}

.section.edit .block.filter{
	//width:auto;
	justify-content:stretch;
	padding:10px;
	border-radius:10px;
	box-shadow: inset 2px 5px 10px rgba(0,0,0, 0.2);
	border:1px solid #555;
}

.section.edit .block.filter .frame{
	gap:10px;
}


.section.edit .frame .submits{
	width:100%;
	display:flex;
	flex-direction:row;
	gap:5px;
	justify-content:space-between;
}

.section.edit .frame *[type=submit][name=filter_office]{
	background-color:var(--filterbg);
}

.section.edit .block.buchungen{
	width:auto;
	justify-content:stretch;
	padding:10px;
	border-radius:10px;
	box-shadow: inset 2px 5px 10px rgba(0,0,0, 0.2);
	border:1px solid #555;
}

.section .frame.buchungen{
	width:auto;
	align-items:flex-start;
	justify-content: flex-start;
	padding:20px;
}

form.filter{
	width:100%;
}


.frame.buchungen .table .row{
	gap:0px;
	box-shadow:none;
	padding:1px 0;
}

.buchungen .cell.objekt{
	width:200px !important;
	font-size:0.7em;
	align-items:center;
}

.buchungen .cell.objekt a{
	color:var(--maincolor);
}	

.buchungen .cell.objekt button[type=submit]{
	padding:2px 10px;
	
}	

.buchungen .cell.objekt .monat{
	padding:0px 10px;
}


.cell.day{
	display:flex;
	align-items:center;
	justify-content:center;
	width:18px;
	aspect-ratio: 1 / 1;
	border-radius:2px;
	background:var(--mainbgcolor2);
	box-shadow:var(--neoday);
	cursor:cell;
	font-size:0.8em;
}


.cell.day:hover{
	box-shadow:var(--neoday_hover);
	background:var(--mainbgcolor);
	
}

.head .cell.objekt{
	font-size:1.2em;
}
.head .cell.day{
	background:none;
	box-shadow:none;
	justify-content:center;
	font-size:0.8em;
	align-items:center;
}
.head .cell.day.today{
	border:1px solid var(--maincolor2);
}

.head .cell.day a{
	text-decoration:none;
	color:var(--maincolor);
}	

.head .cell.day a:hover{
	text-decoration:underline;
}	

.head .cell.day.weekend{
	background:var(--weekendbgcolor);
}

.head .cell.day.feiertag{
	background:var(--feiertagbgcolor);
}


.data .cell.day{
	margin:2px;
	position:relative;
}
.data .cell.day.weekend{
	border:2px solid var(--weekendbgcolor);
	margin:0px;
}

.data .cell.day.feiertag{
	border:2px solid var(--feiertagbgcolor);
	margin:0px;
}

.data .cell.day.anreise{
	//background:var(--coloranreise);
	background-image: -webkit-linear-gradient(45deg, var(--mainbgcolor2) 50%, var(--coloranreise) 50%);
	cursor:zoom-in;
}
.data .cell.day.abreise{
	//background:var(--colorabreise);
	background-image: -webkit-linear-gradient(45deg, var(--colorabreise) 50%, var(--mainbgcolor2) 50%);
}

.data .cell.day.buchung{
	background:var(--colorbuchung);
	//background:var(--coloranreise);
	cursor:zoom-in;
}

.data .cell.day.abreise.anreise{
	background-image: -webkit-linear-gradient(45deg, var(--colorabreise) 50%, var(--coloranreise) 50%);
}

.data .cell.day.sperre::after{
	content:"";
	position:absolute;
	top:0px;
	left:0px;
	width:100%;
	height:100%;
	background: -webkit-repeating-linear-gradient(
    -45deg,
    rgba(255,255,255,0) 0px,
    rgba(255,255,255,0) 2px,
    #ccc 2px,
    #ccc 4px
	) 
}

.data .cell.day.anreise.buchung{
	background-image: -webkit-linear-gradient(45deg, var(--colorbuchung) 50%, var(--coloranreise) 50%);
}

.data .cell.day.abreise.buchung{
	background-image: -webkit-linear-gradient(45deg, var(--colorabreise) 50%, var(--colorbuchung) 50%);
}

.data .cell.day i{
	color:#fff;
}

.datefilter{
	width:100%;
	display:flex;
	flex-direction:row;
	justify-content:space-between;
	gap:20px;
}

.datefilter .jahr{
	width:30%;
}

.datefilter .monat{
	width:70%;
	display:flex;
	flex-direction:row;
	justify-content:flex-end;
	gap:10px;
}

.datefilter .monat button[type=submit]{
	padding:10px 10px;
}

.datefilter select.monate{
	width:80% !important;
	
}

.section.edit .block.detail.buchung{
	//width:60%;
}

.buchungen .table{
	width:auto;
}

.block.detail.buchung form{
	display:flex;
	gap:20px;
	flex-direction:column;
}

.objektblock{
	display:flex;
	flex-direction:row;
	gap:20px;
}

.objektdetail{
	align-items:flex-start;
	padding:20px;
	width:100%;
	margin-top:20px;
}

.objektdetail .titel{
	display:flex;
	flex-direction:row;
	justify-content:space-between;
	width:100%;
}

.objektdetail .table{
	font-size:1em !important;
}

.objektdetail .table .row{
	justify-content:stretch;
	padding:1px !important;
}

.objektdetail .cell.label{
	width:200px;
	padding:2px 4px !important;
}

.objektdetail.cell.value{
	width:calc(100% - 200px);
	text-align:left;
	background:var(--mainbgcolor1);
	padding:2px 14px;
	text-wrap:nowrap;
}	


.objektbuchung{
	flex-direction:row;
	align-items:flex-start;
	justify-content:space-between;
	padding:20px;
	width:100%;
	gap:20px;
}

.objektbuchung h3{
	font-weight:700;
	margin:15px 0;
}

.objektbuchung .anreise, .objektbuchung .abreise{
	border-radius:10px;
	padding:20px;
	height:100%;
	width:calc(50% - 10px);
}

.objektbuchung .firmenobjekt{
	border-radius:10px;
	padding:20px;
	height:100%;
	width:calc(100% - 10px);
	border:2px solid var(--colorfirmenobjekt);
}

.objektbuchung .anreise{
	border:2px solid var(--coloranreise);
}
.objektbuchung .anreise h2 i{
	color:var(--coloranreise);
}

.objektbuchung .abreise{
	border:2px solid var(--colorabreise);
}

.objektbuchung .abreise .title{
	display:flex;
	flex-direction:row;
	justify-content:space-between;
	align-items:center;
	margin-bottom:10px;
}

.objektbuchung .abreise .title .submit{
	padding:0px 5px;
	height:30px;
}


.objektbuchung .abreise h2{
	margin-bottom:0px;
}
.objektbuchung .abreise h2 i{
	color:var(--colorabreise);
}

.buchung .objektbuchung .submit{
	padding:5px 20px;
}

.buchung .objektbuchung input[type=date]{
	padding:5px 20px;
	margin:0px 10px;
}	

.buchung .objektbuchung .table .row{
	justify-content:stretch;
	padding:1px;
}

.buchung .objektbuchung .table .row.speziell{
	flex-direction:column;
}

.buchung .objektbuchung .table .row .cell.value input{
	width:40%;
	padding:2px 10px;
	text-align:center;
}

.buchung .objektbuchung .table .row.speziell .cell.value input{
	padding:5px 10px;
	text-align:left;
}	

.buchung .objektbuchung .cell.label{
	width:calc(100% - 60px);
	padding:2px 4px;
}

.buchung .objektbuchung .cell.value{
	width:60px;
	text-align:center;
	background:var(--mainbgcolor1);
	text-wrap:nowrap;
	justify-content:center;
}	
.buchung .objektbuchung .table .row.speziell .cell.label{
	width:100%;
}
.buchung .objektbuchung .table .row.speziell .cell.value{
	width:100%;
	background:none;
	padding:4px 0;
}


.buchung .objektbuchung .table .row.speziell .cell.value input{
	width:100%;
}	

.buchung .objektbuchung .table .row.text .cell.label{
	width:calc(100% - 200px);
}
.buchung .objektbuchung .table .row.text .cell.value{
	width:200px;
}

.buchung .objektbuchung .table .row.text .cell.value input{
	width:100%;
}	


.buchung .management{
	padding:20px;
	background-color:var(--managementbgcolor);
	width:100%;
	display:flex;
	flex-direction:row;
	justify-content:stretch;
}


.buchung .management i{
	margin-right:10px;
}

.buchung .management input[type=checkbox]{
	width: 40%;
	padding: 2px 10px;
	text-align: center;
	height:auto;
}	


.buchung .management > div{
	width:100%;
	border:2px solid var(--managementbgcolor);
	border-radius:10px;
	padding:10px;
}

.buchung .management .table .row{	
	justify-content: stretch;
	padding:2px 0;
}

.buchung .management .table .cell{
}
.buchung .management .table .cell.label{
	width: 60%;
	padding: 2px 4px;
	align-items:center;
}	
.buchung .management .table .cell.value{
	width: 40%;
	text-align: center;
	background: var(--mainbgcolor1);
	text-wrap: nowrap;
	justify-content: center;	
	padding:2px;
}

.dienstplan .frame.outlook{
	padding:10px;
	display:flex;
	flex-direction:row;
	align-items:stretch;
	justify-content:space-between;
	gap:20px;
	width:100%;
}

.dienstplan .frame.outlook form{
	width:300px;
}	

.dienstplan .frame.filter{
	padding:10px;
	gap:10px;
	width:100%;
}	

.dienstplan .frame.filter .type{
	display:flex;
	flex-direction:row;
	justify-content:space-between;
	width:100%;
	gap:10px;
}	

.dienstplan .frame.filter .type button{
	width:50%;
	text-align:center;
}	
.dienstplan .frame.filter .datum{
	display:flex;
	flex-direction:row;
	justify-content:space-between;
	width:100%;
	gap:10px;
}

.dienstplan .frame.filter .datum button{
	width:40px;
	padding:10px;
}

.dienstplan .frame.filter button.active{
	border:2px solid var(--neohighlight);	
}	


.dienstplan .frame.filter .datum input{
	width:80%;
}

.dienstplan .frame.filter .datum input.date{
	display:none;
}	

.dienstplan .frame.filter .datum input.date.active{
	display:inline-block;
}

.dienstplan .frame.day_outlook{
	padding:10px;
}

.dienstplan .frame.day_outlook .table{
	flex-direction:row;
}

.dienstplan .frame.day_outlook .table .row{
	box-shadow: var(--neoline1);
	padding:0 20px;
	gap:20px;
}	
	
.dienstplan .frame.day_outlook .table .label{
	height:40px;
	align-items:center;
}	

.dienstplan .frame.day_outlook .table .label i{
	margin-right:10px;
}	

.dienstplan .frame.day_outlook .table .value{
	width:80px;
	height:40px;
	display:flex;
	align-items:center;
	justify-content:center;
	font-size:1.6em;
}

.dienstplan .frame.day_outlook .table .anreisen .value{
	background: var(--coloranreise);
}	

.dienstplan .frame.day_outlook .table .abreisen .value{
	background: var(--colorabreise);
}

.dienstplan .frame.day_outlook .table .wechsel .value{
	background-image: -webkit-linear-gradient(67.5deg, var(--colorabreise) 50%, var(--coloranreise) 50%);
}

.dienstplan .frame.day_outlook .table .firmenobjekte .value{
	background: -webkit-repeating-linear-gradient(67.5deg, var(--colorabreise), var(--colorabreise) 25%, var(--coloranreise) 25%, var(--coloranreise) 50% );
}

.dienstplan .block.actions{
	width:auto;
	justify-content:stretch;
	box-shadow: inset 2px 5px 10px rgba(0,0,0, 0.2);
	border:1px solid #555;
	//box-shadow:var(--neoin);
	padding:10px;
	border-radius:10px;
}

.dienstplan .block.actions .frame{
	padding:20px;
}

.dienstplan .block.actions .frame .table{
font-size:1em;
}

.dienstplan .block.actions .frame .table .row{
	gap:10px;
}	


.dienstplan .block.actions .frame .table .label i{
	margin-right:10px;
}	

.dienstplan .tag{
	font-size:0.8em;
}
.dienstplan .tag .label{
	width:15%;
	justify-content:space-between;
	flex-direction:column;
}

.dienstplan .tag .cell.aufgaben{
	width:12%;
	flex-direction:column;
	gap:2px;
}	

.dienstplan .tag .aufgaben > div{
	display:flex;
	flex-direction:row;
	gap:2px;
	flex-wrap:wrap;
} 

.dienstplan .tag .aufgaben div .aufgabe{
	font-size:0.8em;
	border-radius:4px;
	background:var(--mainbgcolor2);
	width:auto;
	padding:1px 4px;
	cursor:help;
}
.dienstplan .tag .aufgaben i{
	margin-right:10px;
}

.dienstplan .tag .zuweisungen{
	width:60%;
	display:flex;
	flex-direction:row;
	align-items:center;
	justify-content:stretch;
	gap:4px;
}

.dienstplan .tag .mzuweisungen{
	display:flex;
	flex-direction:row;
	align-items:center;
	justify-content:stretch;
	width: 70%;
	gap:4px;
}

.dienstplan .tag .zuweisung.status{
	width:40%;
	align-items:flex-start;
	border-radius:10px;
	gap:4px;
}	

.dienstplan .tag .zuweisung.status form{
	width:100%;
}	

.dienstplan .tag .zuweisung{
	width:120px;
	align-items:center;
	padding:4px;
	border-radius:10px;
}	

.dienstplan .tag .uhrzeit{
	width:120px;
	align-items:center;
	padding:4px;
	border-radius:10px;
}	

.dienstplan .tag .uhrzeit input{
	padding:4px 10px;
}	


.dienstplan .tag .zuweisung.zugewiesen{
	padding:2px;
	border:3px solid var(--statuscolor);
}	

.dienstplan .tag .status{
	display:flex;
	flex-direction:column;
	align-items:center;
	justify-content:space-between;
	gap:2px;
	padding:0px;
}

.dienstplan .tag .status .statusbars{
	height:30px;
	width:100%;
	flex-direction:row;
}

.dienstplan .tag .status .statusbars .bar{
	width:25%;
	padding:10px 10px;
	display:flex;
	justify-content:center;
	align-items:center;
	text-align:center;
}

.dienstplan .tag .zuweisung select{
	padding:4px 8px;
	height:25px;
	width:100%;
	font-size:0.9em;
}

.dienstplan .tag .zuweisungen button[type="submit"]{
	width:40px;
	padding:6px 8px;
	//background:var(--statuscolor);
	font-size:0.8em;
}	


.dienstplan .tag .aufgaben.management{
	width:8%;
}

.dienstplan .tag .aufgaben.management div .aufgabe{
	background-color: var(--managementbgcolor);
}	

.dienstplan .tag .aufgaben.management i{
	margin:0px 4px;
}

.section.dienstplan.print{
	width:auto;
}

.section.dienstplan.print .block{
	box-shadow:none;
	padding:0px;
	border:0;
	width:auto;
}	

.section.dienstplan.print .block .frame{
	box-shadow:none;
}

.dienstplan.print .head{
	display:none !important;
}

.dienstplan.print .tag .row{
	display:block;
}

.dienstplan.print .tag .row > *{
	float:left;
}

.dienstplan.print .tag .row > .label{
	width:100%;
	border-bottom:1px solid #d1d1d1;
	padding:10px;
	font-size:1.2em;
}
.dienstplan.print .tag .row > .aufgaben{
	width:50%;
	border-right:1px solid #d1d1d1;
	padding:5px;
}
.dienstplan.print .tag .row > .aufgaben.management{
	width:50%;
	border-right:0px;
	padding:5px;
}
.dienstplan.print .tag .row > .zuweisungen{
	width:100%;
	flex-direction:column;
}

.dienstplan.print .tag .row > .zuweisungen .mzuweisungen{
	width:100%;
	flex-direction:row;
}

.dienstplan.print .tag .row > .zuweisungen .mzuweisungen .uhrzeit, .dienstplan.print .tag .row > .zuweisungen .mzuweisungen .zuweisung{
	width:calc(20% - 5px);
}	

.dienstplan.print .tag .row > .zuweisungen .uhrzeit input{
	font-size:1em;
}	

.dienstplan.print .tag .row > .zuweisungen .uhrzeit button{
	display:none;
}	

.dienstplan.print .tag input,.dienstplan.print .tag select, .dienstplan.print .tag button{
	border:1px solid #d1d1d1;
	background:none;
	box-shadow:none;
	pointer-events:none;
	padding:2px !important;
	height:20px;
}


.dienstplan.print .tag .status {
	width:100%;
}

.dienstplan.print .tag .status .statusbars{
	height:20px;
}


.statusbars {
	display:flex;
	flex-direction:row;
	width:100%;
	gap:4px;
	height:5px;
}

.statusbars .bar{
	width:25%;
	height:100%;
	background:var(--inputbgcolor);
}

.statusbars.status10 .bar1, .statusbars.status .bar1{
	background:var(--statuscolor);
}
	
.statusbars.status20 .bar1, .statusbars.status20 .bar2{
	background:var(--statuscolor);
}

.statusbars.status30 .bar1, .statusbars.status30 .bar2, .statusbars.status30 .bar3{
	background:var(--statuscolor);
}

.statusbars.status40 .bar1, .statusbars.status40 .bar2, .statusbars.status40 .bar3, .statusbars.status40 .bar4{
	background:var(--statuscolor);
}

.print .statusbars.status10 .bar1, .statusbars.status .bar1{
	background:var(--statuscolor);
	border:2px solid var(--statuscolor);
}
	
.print .statusbars.status20 .bar1, .statusbars.status20 .bar2{
	background:var(--statuscolor);
	border:2px solid var(--statuscolor);
}

.print .statusbars.status30 .bar1, .statusbars.status30 .bar2, .statusbars.status30 .bar3{
	background:var(--statuscolor);
	border:2px solid var(--statuscolor);
}

.print .statusbars.status40 .bar1, .statusbars.status40 .bar2, .statusbars.status40 .bar3, .statusbars.status40 .bar4{
	background:var(--statuscolor);
	border:2px solid var(--statuscolor);
}

.dienstplan .woche .cell.name{
	width:150px;
	align-items:center;
	font-weight:700;
	font-size:1.2em;
	display:flex;
	flex-direction:row;
	justify-content:space-between;
	
}

.dienstplan .woche .cell.dayplan{
	width:calc((100% - 140px) / 7);
	min-height:40px;
	display:flex;
	flex-direction:row;
	align-content:stretch;
	align-items:stretch;
	flex-wrap:wrap;
	//border:1px solid var(--mainbgcolor2);
	background:var(--mainbgcolor2);
}

.dienstplan .woche .cell.dayplan .status{
	width:100%;
	height:auto;
	display:flex;
	align-items:center;
	justify-content:center;
	padding:5px 0;
}

.dienstplan .woche .cell.dayplan .status.krank{
	background:var(--krankbg);
}
.dienstplan .woche .cell.dayplan .status.urlaub{
	background:var(--urlaubbg);
}
.dienstplan .woche .cell.dayplan .status.frei{
	background:var(--freibg);
}

.dienstplan .woche .head.offen{
	border:1px solid red;
}


.dienstplan .woche .head .cell{
	width:calc((100% - 140px) / 7);
	flex-direction:column;
	justify-content:center;
	align-items:center;
	padding:10px 0;
	text-align:center;
	color:var(--maincolor1);
	font-weight:700;
	font-size:1.1em;
	text-decoration:none;
}

.dienstplan .woche .head.offen .cell{
	padding:0;
}	


.dienstplan .woche .head .cell a{
	text-align:center;
	color:var(--maincolor1);
	font-weight:700;
	font-size:1.1em;
	text-decoration:none;
}

.dienstplan .woche .head a.cell:hover{
	text-decoration:underline;
}	

.dienstplan .woche .head .cell.name{
	width:150px;
}

.dienstplan .woche .head .cell.weekend{
	background:var(--weekendbgcolor);
}

.dienstplan .woche .head .cell.feiertag{
	background:var(--feiertagbgcolor);
}


.dienstplan .woche .data .cell.dayplan{
	margin:2px;
	position:relative;
}
.dienstplan .woche .data .cell.dayplan.weekend{
	border:4px solid var(--weekendbgcolor);
	background:var(--weekendbgcolor);
	margin:0px;
}

.dienstplan .woche .data .cell.dayplan.feiertag{
	border:4px solid var(--feiertagbgcolor);
	background:var(--feiertagbgcolor);
	margin:0px;
}

.dienstplan .woche .head .cell .zuweisungen{
	padding:5px;
	margin-top:0px;
	width:100%;
	height:100%;
	display:flex;
	flex-direction:column;
	justify-content:center;
	align-items:center;
}
.dienstplan .woche .head .cell .zuweisungen > div{
	font-size:0.9em;
	display:flex;
	flex-direction:row;
	justify-content:space-between;
	width:calc(100% - 20px);
	font-weight:400;
}

.dienstplan .woche .cell .zuweisungen.offen{
	//opacity:0.5;
}

.dienstplan .woche .cell .zuweisungen.offen:hover{
	//opacity:1;
}

.dienstplan .woche .cell .zuweisungen.offen button{
	padding:2px;
	font-size:0.8em;
}	

.dienstplan .woche .cell .zuweisungen > form{
	font-size:0.9em;
	display:flex;
	flex-direction:row;	
	flex-wrap:no-wrap;
	gap:0;
	justify-content:space-between;
	width:100%;
}
.dienstplan .woche .head .cell .zuweisungen > div:first-child{
	border-bottom:1px solid var(--maincolor2);
	font-weight:700;
}

.dienstplan .woche .data .cell.dayplan .zuweisungen{
	padding:10px;
	width:100%;
	display:flex;
	flex-direction:column;
	justify-content:flex-start;
	align-items:flex-start;
}

.dienstplan .woche .data .cell.dayplan .zuweisungen > div{
	display:flex;
	flex-direction:row;
	gap:4px;
	justify-content:center;
	align-items:center;
}

.dienstplan .woche .data .cell.dayplan .zuweisungen .uhrzeit{
	display:flex;
	padding:1px 4px;
	border:1px solid var(--mainbgcolor1);
	border-radius:2px;
	width:auto;
}

.dienstplan .woche .data .cell.dayplan .ansicht{
	position:absolute;
	z-index:100;
	bottom:5px;
	right:10px;
}



.dienstplan .mitarbeiter .frame{
	padding:10px !important;
}


.dienstplan .mitarbeiter .label, .dienstplan .mitarbeiter .aufgaben{
	width:auto;
}

.dienstplan .mitarbeiter .table{
	gap:10px;
}

.dienstplan .mitarbeiter .table .row{
	flex-direction:column;
	border:2px solid var(--maincolor2);
	padding:10px;
	border-radius:10px;
}

.dienstplan .mitarbeiter .table .row .uhrzeit{
	width:auto;
	text-align:center;
	font-size:2em;
	padding:4px 10px;
	border:1px solid var(--mainbgcolor);
	border-radius:6px;
	margin-bottom:10px;
	
}

.dienstplan .mitarbeiter .table .row .objekt{
	font-size:1.5em;
}	

.dienstplan .mitarbeiter .tag .zuweisungen{
	width:100%;
}

.dienstplan .mitarbeiter .tag .zuweisungen .liste{
	display:flex;
	flex-direction:row;
	gap:6px;
}

.dienstplan .mitarbeiter .tag .zuweisungen .liste .item{
	padding:4px 8px;
	border-radius: 4px;
	background: var(--mainbgcolor2);
}

.dienstplan .mitarbeiter .tag .zuweisungen > div{
	display:flex;
	flex-direction:row;
}

.dienstplan .mitarbeiter .status{
	padding-bottom:10px;
}

.dienstplan .mitarbeiter .status .statusbars{
	height:40px;
	font-size:0.8em;
}

.dienstplan .mitarbeiter .status .statusbars .bar{
	display:flex;
	align-items:center;
	justify-content:center;
	text-align:center;
	padding:10px 10px;
}

.dienstplan .mitarbeiter .adresse{
	padding-bottom:10px;
	margin-bottom:10px;
	box-shadow: var(--neoline);
	display:flex;
	flex-direction:column;
	justify-content:space-between;
	padding-top:10px;
}

.dienstplan .mitarbeiter .adresse > div{
	display:flex;
	flex-direction:row;
	justify-content:space-between;
}

.dienstplan .mitarbeiter .table .row .cell.aufgaben{
	flex-direction:column;
	gap:10px;
	width:auto;
}

.dienstplan .mitarbeiter .table .row .cell.aufgaben .frame{
	padding:10px;
	min-width:100%;
	flex-direction:column;
	align-items:flex-start;
	justify-content:flex-start;
	text-wrap:nowrap;
}

.dienstplan .mitarbeiter .table .row .cell.aufgaben .frame > div{
	display:flex;
	flex-direction:column;
	gap:5px;
}

.dienstplan .mitarbeiter .table .row .cell.aufgaben .frame.anreise{
	border:1px solid var(--coloranreise);
}
.dienstplan .mitarbeiter .table .row .cell.aufgaben .frame.abreise{
	border:1px solid var(--colorabreise);
}

.dienstplan .mitarbeiter .table .row .cell.aufgaben .frame > div .aufgabe{
	padding:5px 10px;
	text-wrap:nowrap;
}