
div.mainmenu.feuilledetemps #mainmenuspan_feuilledetemps::before {
	content: url(../img/object_timesheet_20.png);
}

.fa-dol-feuilledetemps::before {
	content: url(../img/object_timesheet_32.png);
}

div.mainmenu.feuilledetemps {
	background-image: none;
}



/* Dimenssions */ 

#mainbody.feuilledetemps #id-container {
	height: calc(100vh - 54px);
  	display: block;
}

#mainbody.feuilledetemps #id-right {
	display: flex;
  	flex-direction: column;
 	height: calc(100% - 33px);
}

#mainbody.feuilledetemps #id-right div.fiche div.tabs {
	height: auto;
}

#mainbody.feuilledetemps #id-right div.fiche.tab {
	flex: 1 1 100%;
  	height: 0;
}

#mainbody.feuilledetemps #id-right div.fiche {
	margin-bottom: 20px;
}

#mainbody.feuilledetemps #id-right div.fiche.tab #feuilleDeTempsForm {
	height: 100%;
	display: flex;
	flex-direction: column;
}

#mainbody.timesheet:not(.displaycolumn) #id-right div.fiche form:not(.notoptoleftroright) {
	height: calc(100vh - 400px);
	display: flex;
	flex-direction: column;
}

#mainbody.timesheet.displaycolumn #id-right div.fiche form:not(.notoptoleftroright) {
	height: calc(100vh - 200px);
	display: flex;
	flex-direction: column;
}

#mainbody.feuilledetemps #id-right div.fiche.tab #feuilleDeTempsForm div.div-table-responsive {
	display: flex;
}

/* #feuilleDeTempsForm .div-table-responsive {
	overflow-x: unset;
} */

#observationFDT {
	max-height: 130px;
}



/* Définition des couleurs de fond pour chaque cases du tableau des feuilles de temps (weekend, anticipé, différents types de congés, fériés, ...) */

#tablelines_fdt td {
	background-color: #ffffff;
}

#tablelines_fdt td.public_holiday {
	background-color: #f4eede !important;
}

#tablelines_fdt .conges1allday {
	background-color: #f9e79f !important;
}

#tablelines_fdt .conges1morning,
#tablelines_fdt .conges1afternoon {
	background-color: #f9e79f !important;
}

#tablelines_fdt .conges2allday {
	background-color: #aed6f1 !important;
}

#tablelines_fdt .conges2morning,
#tablelines_fdt .conges2afternoon {
	background-color: #aed6f1 !important;
}

#tablelines_fdt .conges3allday {
	background-color: #abebc6 !important;
}

#tablelines_fdt .conges3morning,
#tablelines_fdt .conges3afternoon {
	background-color: #abebc6 !important;
}

#tablelines_fdt .conges6allday {
	background-color: #aed6f1 !important;
}

#tablelines_fdt .conges6morning,
#tablelines_fdt .conges6afternoon {
	background-color: #aed6f1 !important;
}

#tablelines_fdt .conges5allday {
	background-color: #f5b7b1 !important;
}

#tablelines_fdt .conges5morning,
#tablelines_fdt .conges5afternoon {
	background-color: #f5b7b1 !important;
}

#tablelines_fdt .conges4allday {
	background-color: #566573 !important;
}

#tablelines_fdt .conges4morning,
#tablelines_fdt .conges4afternoon {
	background-color: #566573 !important;
}

#tablelines_fdt td.before {
	background-color: #ebdef0 !important;
}

#tablelines_fdt td.before.weekend {
	background-color: #dacce1 !important;
}

#tablelines_fdt td.weekend {
	background-color: #eeeeee !important;
}

th.daycolumn {
	background-color: var(--colorbacktitle1);
}

tr.conges th.statut1, td.statut1 {
	border: red 4px solid !important;
}

tr.conges th.statut2, td.statut2 {
	border: #0087ff 4px solid !important;
}

tr.conges th.statut3, td.statut3 {
	border: #0087ff 4px solid !important;
}


/* Définition des couleurs des bords de cases et des cases à cocher (heures sup, autres types d'heures) */

td > input.hs25 {
	border: 1px solid #3d85c6;
	margin-top: 2px;
	max-width: 37px;
	background-color: white;
}

td > input.hs50 {
	border: 1px solid #d97a00;
	margin-top: 2px;
	margin-left: 2px;
	max-width: 37px;
	background-color: white;
}

td > div > input.heure_compagnonnage {
	border: 1px solid red;
	margin-top: 2px;
	margin-left: 2px;
	background-color: white;
}

td > div > input.heure_nuit {
	border: 1px solid black;
	margin-top: 2px;
	margin-left: 2px;
	background-color: white;
}

td > div > input.heure_route {
	accent-color: blue;
	margin-top: 2px;
	margin-left: 2px;
	height: 17px;
	width: 17px;
}

td > div > input.heure_epi {
	border: 1px solid green;
	margin-top: 2px;
	margin-left: 2px;
	background-color: white;
}

#div_otherhour > input[name="heure_nuit_chkb"]:checked {
	accent-color: black;
}

#div_otherhour > input[name="port_epi_chkb"]:checked {
	accent-color: green;
}

#div_otherhour > input[name="port_epi"] {
	margin-left: 1em;
}

#div_otherhour {
	margin-top: 0.3em;
}




/* Définition des couleurs de texte pour l'historique des feuilles de temps (weekend, anticipé, différents types de congés, fériés, ...) */

.txt_hs25 {
	color: #3d85c6;
}

.txt_hs50 {
	color: #d97a00;
}

.txt_heure_compagnonnage {
	color: red;
}

.txt_heure_nuit {
	color: black;
}

.txt_heure_route {
	color: blue;
}

.txt_heure_epi {
	color: green;
}

.txt_before {
	color: #dacce1 !important;
}

.txt_ferie {
	color: #f4eede !important;
}

.txt_conges_brouillon {
	color: #f9e79f;
}

.txt_conges_valide {
	color: #aed6f1;
}

.txt_conges_approuve1 {
	color: #aed6f1;
}

.txt_conges_approuve2 {
	color: #abebc6;
}

.txt_conges_refuse {
	color: #f5b7b1;
}

.txt_conges_annule {
	color: #566573;
}





/* Css pour les notes https://www.w3schools.com/howto/howto_css_modals.asp */

.modal {
	display: none;
	/* Hidden by default */
	position: fixed;
	/* Stay in place */
	z-index: 11;
	/* Sit on top */
	left: 0;
	top: 0;
	width: 100%;
	/* Full width */
	height: 100%;
	/* Full height */
	overflow: auto;
	/* Enable scroll if needed */
	background-color: rgb(0, 0, 0);
	/* Fallback color */
	background-color: rgba(0, 0, 0, 0.4);
	/* Black w/ opacity */
}

.modal-content {
	background-color: #fefefe;
	margin: 15% auto;
	/* 15% from the top and centered */
	padding: 5px;
	border: 1px solid #888;
	width: 400px;
	/* Could be more or less, depending on screen size */
}

.close {
	color: #aaa;
	float: right;
	font-size: 28px;
	font-weight: bold;
}

.close:hover,
.close:focus {
	color: black;
	text-decoration: none;
	cursor: pointer;
}





/* Lignes fixes du tableau */

.feuilledetemps .fixed {
	z-index: 1;
	position: sticky;
}

/* .feuilledetemps tr > td:nth-child(2).fixed,
tr > th:nth-child(2).fixed {
	left: 167px;
} */

.feuilledetemps tr > td:nth-child(1).fixed,
.feuilledetemps tr > th:nth-child(1).fixed {
	left: 0;
	border-right: 1px solid var(--colortopbordertitle1);
}

.feuilledetemps tr > td:last-child.fixed,
tr > th:last-child.fixed {
	right: 0;
}

.feuilledetemps thead {
	position: sticky;
    top: 0;
	z-index: 2;
}

.feuilledetemps .fixedcolumn2 {
	z-index: 1;
	position: sticky;
	left: 97px;
}

.feuilledetemps .fixedcolumn3 {
	z-index: 1;
	position: sticky;
	left: 213px;
}

.feuilledetemps .fixedcolumn4 {
	z-index: 1;
	position: sticky;
	left: 329px;
}

.feuilledetemps .fixedcolumn5 {
	z-index: 1;
	position: sticky;
	left: 492px;
}

.feuilledetemps .fixedcolumn6 {
	z-index: 1;
	position: sticky;
	left: 713px;
}

.feuilledetemps .fixedcolumn7 {
	z-index: 1;
	position: sticky;
	left: 784px;
}

.feuilledetemps .fixedcolumn8 {
	z-index: 1;
	position: sticky;
	left: 900px;
}

.feuilledetemps .fixedcolumn9 {
	z-index: 1;
	position: sticky;
	left: 976px;
}

.feuilledetemps .fixedcolumn10 {
	z-index: 1;
	position: sticky;
	left: 1032px;
}



/* Gestion des bordures */

.feuilledetemps [class^="liste_total_semaine"] {
	border-top: 1px solid var(--colortopbordertitle1);
}

.feuilledetemps [class^="liste_total_semaine"]:not(.liste_total_semaine_1):not(.totalweekcolumn) {
	border-left: 1px solid var(--colortopbordertitle1);
}

.feuilledetemps .total_title, 
.feuilledetemps .total_week, 
.feuilledetemps .total_holiday {
	border-left: 1px solid var(--colortopbordertitle1);
}

#tablelines_fdt>tbody > tr > td.liste_total_task,
#tablelines_fdt>tbody > tr > td.liste_total:last-child {
	border-left: 1px solid var(--colortopbordertitle1);
}

.feuilledetemps div#filtre {
	border-bottom: 1px solid var(--colortopbordertitle1);
	display: inline-table;
	width: 100%
}

#tablelines_fdt > tbody > tr > td.totalweekcolumn {
	border-right: 1px solid var(--colortopbordertitle1);
	background-color: #f0f0f0;
	vertical-align: bottom
}

#tablelines_fdt td.totalweekcolumn.withsunday {
    border-bottom: 3px solid var(--colorblack);
}

#tablelines_fdt td.sunday, #tablelines_fdt th.sunday {
    border-bottom: 3px solid var(--colorblack);
}

#tablelines_fdt > tbody > tr:nth-last-child(8) > td.totalweekcolumn {
	border-bottom: unset;
}

#tablelines_fdt> tbody > tr > td.holidaycolumn {
	<!-- border-right: 1px solid rgb(82, 82, 82); -->
	border-bottom: none;
	background-color: #f0f0f0;
}

#tablelines_fdt> tbody > tr > td.holidaycolumnmultiple1 {
	border-right: 1px solid var(--colortopbordertitle1);
	border-bottom: none;
	background-color: #f0f0f0;
}

#tablelines_fdt> tbody > tr > td.holidaycolumnmultiple2 {
	<!-- border-right: 1px solid rgb(82, 82, 82); -->
	border-bottom: none;
	background-color: #f0f0f0;
}

#tablelines_fdt> thead > tr > th.columntitle {
	border-bottom: 1px solid var(--colortopbordertitle1);
}

#tablelines_fdt> tbody > tr > td.diffcolumn, #tablelines_fdt th.diffcolumn  {
	border-right: 1px solid rgb(82, 82, 82);
}





/* Gestion du tableau en full screen */

.feuilledetemps #fullscreenContainer {
	height: calc(100vh - 62px); 
	width: fit-content; 
	top: 53px; 
	margin: auto; 
	justify-self: anchor-center;
}

.feuilledetemps #fullscreenContainer #dialog-confirm {
	min-height: 0px; 
	max-height: none;
	padding: unset; 
	height: calc(-95px + 100vh); 
	max-width: calc(-9px + 100vw);
}

.feuilledetemps #fullscreenContainer #tableau #tablelines_fdt {
	max-height: calc(-101px + 100vh) !important;
}

.feuilledetemps #fullScreen {
    border: solid 1px #d7d7d7;
    border-radius: 5px;
	padding: 5px;
}

.feuilledetemps button#fullScreen {
	margin-right: 10px;
}

.feuilledetemps #fullScreen:hover {
	background-color: #d7d7d7;
}

.feuilledetemps tr.liste_totalcolumn th {
	background-color: var(--colorbacktitle1);
  	border-top: 1px solid var(--colortopbordertitle1);
}



/* Autres */

.feuilledetemps thead th {
	/* top: 0;
	position: sticky;
	min-height: 30px;
	height: 30px; */
	text-align: center;
	background-color: var(--colorbacktitle1);
}

#tablelines_fdt {
	overflow: auto;
	width: auto;
	max-width: 100%;
}

.feuilledetemps form[name="addtime"] {
	width: fit-content;
    margin: auto;
	max-width: 100%;
}

/*#tablelines_fdt.liste {
	display: inline-block;
    margin: 0;
}*/

.feuilledetemps td.liste_total_task {
	color: var(--listetotal);
	text-align: center;
}

.feuilledetemps .dropdown dd ul {
	z-index: 4;
}

.feuilledetemps input:disabled {
	background: var(--inputbackgroundcolordisabled) !important;
}

.feuilledetemps #sendMailContent {
	width: 100%;
	height: 200px;
}

.feuilledetemps .maxwidth80 {
	max-width: 80px;
}

.feuilledetemps .textarea_observation {
	margin: 2%;
	width: 96%;
	border: var(--butactionbg) 1px solid !important;
	height: 5rem;
	resize: block;
}

.feuilledetemps .info_fdt {
	padding-left: 5rem;
	width: 500px;
	font-size: medium;
	vertical-align: middle;
	color: rgb(226 0 13);
    font-weight: 800;
}

.feuilledetemps:not(.timesheet) .fiche:not(.tab) {
	position: sticky;
	top: 0px;
	z-index: 10;
	background: white;
}

.feuilledetemps div.tabsAction {
	padding: none;
	margin: 0;
}

.feuilledetemps #dragDropAreaTabBar {
	margin: 0;
	overflow: hidden;
}

.feuilledetemps .tabsAction.center {
	text-align: center;
}

#regulD1, #regulD2, #regulD3, #regulD4, #regulGD1, #regulGD2, #regulDOM,
#regulHeureRoute, #regulRepas1, #regulRepas2, #regulKilometres, #regulIndemniteTT, 
#HeureNuit50, #HeureNuit75, #HeureNuit100, #HS, #regulHeureSup00, #regulHeureSup25, #regulHeureSup50 {
	border: 1px solid grey;
    background-color: white;
	margin-left: 4px;
	max-width: 37px;
	float: right;
}

.feuilledetemps .regulTypeDeplacement {
	max-width: 211px;
	float: right;
}

.feuilledetemps #observation {
	height: 30px;
}

body.feuilledetemps .ui-widget.ui-widget-content {
	z-index: 10 !important;
}

.button-save-fdt {
	background: var(--textbutaction) !important;
    color: var(--butactionbg) !important;
	border: var(--butactionbg) solid 1px !important;
}

.feuilledetemps .tabsAction {
	width: fit-content;
}

.feuilledetemps .tabsAction a,input {
	margin-right: 0 !important;
}

.feuilledetemps input.smallpadd {
	min-width: 40px;
}

.feuilledetemps div.fiche > form > div.div-table-responsive {
	min-height: unset;
}

.feuilledetemps .div-table-responsive-no-min.compta {
	height: 150px;
    overflow: auto;
	width: 100%;
}

#exportObservationCompta, #exportFeuilleDeTemps, #exportTestFeuilleDeTemps {
	text-align: center;
}

form#exportFeuilleDeTemps #builddoc_generatebutton, form#exportTestFeuilleDeTemps #builddoc_generatebutton {
	visibility: hidden;
}

form#exportObservationCompta #builddoc_generatebutton {
	visibility: hidden;
}

.ml20 {
	margin-left: 20px;
}

#totalDeplacementPonctuel.noNull, #totalTypeDeplacement.noNull, #totalMoyenTransport.noNull, 
#totalHeureSup00.noNull, #totalHeureSup25.noNull, #totalHeureSup50.noNull, #totalHeureNuit.noNull, 
#totalHeureRoute.noNull, #totalKilometres.noNull, #totalIndemniteTT.noNull, #totalRepas.noNull {
	font-weight: bold;
	color: #0057dee8;
	font-size: medium;
}

input[name^="deplacement_ponctuel"].deplacement_holiday {
	accent-color: red;
}

select[name^="type_deplacement"].deplacement_holiday, select[name^="moyen_transport"].deplacement_holiday {
	border: red 2px solid;
}

.feuilledetemps .titlefield {
	min-width: unset !important;
 	width: fit-content;
}

#tablelines_fdt > tbody > tr > td > div.multipleLineColumn {
	margin-bottom: 4px;
  	margin-top: 4px;
}

.feuilledetemps .displaynone {
	display: none;
}

.feuilledetemps .visibilityhidden {
	visibility: hidden;
}

.feuilledetemps .mt0 {
	margin-top: 0px; !important
}

.feuilledetemps .ml0 {
	margin-left: 0px; !important
}

.feuilledetemps span.diffpositive {
	color: blue;
}

.feuilledetemps span.diffnegative {
	color: red;
}

.feuilledetemps tr.liste_totalcolumn {
	z-index: 1;
  	position: sticky;
  	bottom: 0;
}

#tablelines_fdt.liste.column {
	margin: 0 !important;
}

.minwidth80 {
	min-width: 80px;
}

.minwidth60 {
	min-width: 60px;
}

.minwidth55 {
	min-width: 55px;
}

.minwidth40 {
	min-width: 40px;
}

.height20 {
	height: 20px;
}

#tablelines_fdt.column .fas.fa-sticky-note {
	color: rgb(198,25,44);
}

td.affairecolumn span.select2-container {
    width: 100% !important;
}

.input-error {
    border: 2px solid #e74c3c !important;
    background-color: #fdecea !important;
    transition: background-color 0.3s ease, border-color 0.3s ease;
}

:root {
	--fdtcolorbefore: #dacce1;
	--fdtcolorferie:#f4eede;
	--fdtcolorholidaydraft: #f9e79f;
	--fdtcolorholidayvalidate: #aed6f1;
	--fdtcolorholidayapprove1: #aed6f1;
	--fdtcolorholidayapprove2: #abebc6;
}