@import url('https://fonts.googleapis.com/css2?family=Poppins:wght@200;400&display=swap');

 :root {
	--L0: #00B1DC;
	--L0b: #00B1DC33;
	--L1: #DC7500;
	--L1b: #DC750033;
	--L3: #00A40A;
	--L3b: #00A40A33;
	--L4: #A44100;
	--L4b: #A4410033;
	--L5: #F80505;
	--L5b: #F8050533;
	--L6: #A00098;
	--L6b: #A0009833;
	--L7: #004E14;
	--L7b: #004E1433;
	
	}




*{
box-sizing: border-box; 
font-family: 'Poppins', sans-serif;
}
body{padding:0; margin:0;
background : #f8f9fa;}

table
{
border-collapse: collapse; /* Les bordures du tableau seront collées (plus joli) */
padding:0px;
margin:0px;
background : white;
border-radius:10px;
}


a { 

text-decoration:none; 
}


.tableForecast{
width:100%;
border:1px solid black;	
font-weight:bold;
}

.tableForecast th{
	text-align:center;
	width:20%;
}

.tableForecast tr:nth-child(2){
	background-color:var(--L3b);
}

.tableForecast tr:nth-child(3){
	background-color:var(--L4b);
}

.tableForecast tr:nth-child(4){
	background-color:var(--L5b);
}

.tableForecast tr:nth-child(5){
	background-color:var(--L6b);
}

.tableForecast td{
	text-align:right;
border-right:1px solid black;
}

.tableForecast tr{
border:1px solid black;
}

.tableForecast div{
	font-size:16px !important;
}

.inputClassTxt1{
border:1px solid var(--charteColor1);
border-radius:3px;
height:30px;
}

.tableListV2 a{
	color:black;
}



.ligneLA{
	display:flex;
	FLEX-WRAP:wrap;
	ALIGN-ITEMS:flex-start;
	ALIGN-CONTENT:flex-start;
	justify-content : space-between;
	
	/* border:1px solid red; */
	height:80px;
	position:relative;
}

.ligneLA div:nth-child(2){
	display:flex;
	FLEX-WRAP:wrap;
	ALIGN-ITEMS:flex-start;
	ALIGN-CONTENT:flex-start;
	justify-content : space-between;	
}

#totalL7,#totalL6,#totalL5,#totalL4,#totalL3,#totalL1{position:relative;}
	
#totalL7 div:nth-child(1),#totalL6 div:nth-child(1),#totalL5 div:nth-child(1),#totalL4 div:nth-child(1),#totalL3 div:nth-child(1),#totalL1 div:nth-child(1){
	position:absolute;
	bottom:0px;
	right:0px;
	/* width:100%; */
	height:100%;
}

#totalL7 div:nth-child(1){background-color:var(--L7b);}
#totalL6 div:nth-child(1){background-color:var(--L6b);}
#totalL5 div:nth-child(1){background-color:var(--L5b);}
#totalL4 div:nth-child(1){background-color:var(--L4b);}
#totalL3 div:nth-child(1){background-color:var(--L3b);}
#totalL1 div:nth-child(1){background-color:var(--L1b);}

#totalL7 div:nth-child(2),#totalL6 div:nth-child(2),#totalL5 div:nth-child(2),#totalL4 div:nth-child(2),#totalL3 div:nth-child(2),#totalL1 div:nth-child(2){
	position:absolute;
	bottom:0px;
	right:0px;
	width:60%;
	height:100%;
	/* background-color:red; */
}

#totalL7 div:nth-child(3),#totalL6 div:nth-child(3),#totalL5 div:nth-child(3),#totalL4 div:nth-child(3),#totalL3 div:nth-child(3),#totalL1 div:nth-child(3){
	position:absolute;
	bottom:0px;
	right:60%;
	width:40%;
	height:100%;
	/* background-color:green; */
	text-align:center;
}

.scanJde{
	display:flex;
	/* FLEX-WRAP:wrap; */
	ALIGN-ITEMS:center;
	ALIGN-CONTENT:center;
	justify-content :left;
	/* border:1px solid red; */
	width:350px;
	padding-left:5px;
}

.scanJde div:nth-child(1){
	color:var(--charteColor1);
	font-size:1.2em;
	font-weight:bold;
	margin-left:30px;
}

.scanJde i{
	color:red;
	font-size:1.2em;
	margin-left:10px;
	
}

div>.inactif {
  pointer-events: none;
  opacity: 0.5; /* vous pouvez également ajuster l'opacité pour donner un effet visuel de désactivation */
}

.T1Div>input{font-weight:bold;}
.T2Div>input{font-weight:bold;}

.tableINT-L1-UP th{
	border:1px solid var(--charte_gris);
}
.tableINT-L1-UP td{
	border:1px solid var(--charte_gris);
	background-color:var(--charteGris2);
	text-align:center;
font-size:12px;
}

.tdT1_1,.tdT1_2{
background-color:white !important; 
font-weight:bold;
}

.tdT1_2
{
	width:35px;
}

/* ----------------------------attribution jde------------------------- */

.attributionOn{
color:white;
background-color:var(--charteColor1);
transition:0.3s;
}
.attibutionJdeMain:hover{
	background-color:var(--charteColor2);
	transition:0.3s;
	color:black;

}
.attibutionJdeMain{
	display:flex;
	FLEX-WRAP:wrap;
	ALIGN-ITEMS:flex-start;
	ALIGN-CONTENT:flex-start;
	/* justify-content :center; */
	
	width:100%;
	height:30px;
	
	border-bottom:1px solid var(--charte_gris);
	transition:0.3s;

	
}
.attibutionJdeMain div{
	padding-left:5px;
}

.attribution4{flex:1; font-weight:bold;}
.attribution1,.attribution2,.attribution5{width:110px;}
.attribution3{width:50px;}
.attribution6{width:150px;}

.attribTh{
	font-weight:bold;
}

/* ----------------------------attribution jde------------------------- */
/* ----------------------------investissements------------------------- */

.investCom{
	/* border:1px solid red; */
	display:flex;
	FLEX-WRAP:wrap;
	ALIGN-ITEMS:flex-start;
	ALIGN-CONTENT:flex-start;
	justify-content :left;
	width:50%;
	padding-left:30px;
	/* border:1px solid red; */
	
	
}


.investCom div{
	font-size:20px;
}

.investCom div:nth-child(3){
	width:100%;
	
}
.investCom textarea{
	width:100%;
	height:100px;
	font-weight:bold;
	border-radius:0px 10px 10px 10px;
}
.investCom i{
	color:var(--charteColor1);
	font-size:30px;
	margin-right:10px;
}


.sousFamilleMain{
		display:flex;
	/* FLEX-WRAP:wrap; */
	ALIGN-ITEMS:flex-start;
	ALIGN-CONTENT:flex-start;
	/* justify-content :center; */

	border-bottom:1px solid var(--charte_gris);
	border-radius:5px 5px 0px 0px;
	height:25px;
	background-color:white;
	margin-top:4px;
	
}
.sousFamilleMain div{
	display:flex;
	ALIGN-ITEMS:center;
	ALIGN-CONTENT:center;
	justify-content :center;

	width:50px;
	/* border-left:1px solid red; */
	height:100%;
	margin:0px;
	padding:0px;
}

.sfNom{
	flex:1;
	justify-content :left !important;
	padding-left:3px;
}

.sfMi1,.sfMi2,.sfMi3{
	width:100px !important;
	height:20px !important;
	padding-right:2px !important;
	margin-left:5px !important;
	border-left:1px solid var(--charteColor1);
	border-right:1px solid var(--charteColor1);
	background-color:var(--charteColor2);

	border-radius:5px;
	font-weight:bold;
	justify-content :left !important;
	/* margin:2px; */
	/* height:100% !important; */
}

.sfMi1 input,.sfMi2 input{
	width:calc(100% - 20px);
	border:0px solid red;
	text-align:right;
	font-size:1em;
	font-weight:bold;
}

.sfMi1{
	background-color:var(--charteRougeB);
	border-left:1px solid var(--charteRouge);
	border-right:1px solid var(--charteRouge);
}


.sfMi3{
	background-color:var(--charteVertB);
	border-left:1px solid var(--charteVert);
	border-right:1px solid var(--charteVert);
	color:#656565;
	font-style:italic;
}

.sfMi2{
	background-color:var(--charteOrangeB);
	border-left:1px solid var(--charteOrange);
	border-right:1px solid var(--charteOrange);
	
}



.sfMi3{
	justify-content :right !important;

}

.statsDiv{
	display:flex;
	FLEX-WRAP:wrap;
	ALIGN-ITEMS:center;
	ALIGN-CONTENT:flex-start;
	/* justify-content :center; */

	/* border:1px solid red; */
	padding:5px;
	position:relative;
}

.Ls3{
	position:relative;
}

.autoBoutonLs{
	position:absolute;
	top:35px;
	left:205px;
	border-top:1px solid black;
	width:100px;
	z-index:10;
}

.autoBoutonLs i:nth-child(1){
	font-size:40px;
	color:black;
	position:absolute;
	top:-10px;
	left:30px;
	cursor:pointer;
}

.statsDiv div{
	margin-left:10px;
	font-size:25px;
}

.statsDiv>div:nth-child(1){color:var(--L0);}
.statsDiv>div:nth-child(2){color:var(--L1);}
.statsDiv>div:nth-child(3){color:var(--L3);}
.statsDiv>div:nth-child(4){color:var(--L7);}
.statsDiv>div:nth-child(5){color:var(--L4);}
.statsDiv>div:nth-child(6){color:var(--L5);}
.statsDiv>div:nth-child(7){color:var(--L6);}

.investMain{
	width:100%;
	margin:5px;
	margin-top:20px;
	padding:5px;
	border-radius:10px;
	background-color:var(--charte_gris_blanc);
}

.investEntete{
	display:flex;
	FLEX-WRAP:wrap;
	ALIGN-ITEMS:flex-start;
	ALIGN-CONTENT:flex-start;
	/* background-color:red; */
	width:100%;
	height:30px;
}

.investEntete i{
	font-size:20px;
}
.investEntete>div{
padding:2px;
	display:flex;
	FLEX-WRAP:wrap;
	ALIGN-ITEMS:center;
	ALIGN-CONTENT:center;
	justify-content :center;
	/* border-right:1px solid red; */
	height:100%;
}

.investEntete option{background-color:white;}
.investEntete>div>select,
.investEntete>div>input
{

	height:120%;
	width:100%;
}

.OP1Div{

	width:40px;
}

.OP5Div{
		display:flex !important;
	ALIGN-ITEMS:center !important;
	ALIGN-CONTENT:center !important;
	justify-content :center !important;
	width:45px !important;
	height:45px !important;
	/* border:1px solid red; */
	font-size:2em;
	margin:5px;
	padding:5px;
}

.OP2Div,.OP3Div{
	width:150px;

}

 .OP2Div option{
	 /* text-align:left; */
	 /* color:red; */
 }
 
.OP2Div>select,.OP3Div>select{
	text-align:center;
	border-radius:5px 5px 0px 0px;
}

 .OP4Div{
	 width:150px;
 }
 .OP7Div{
	 flex:1;
 }
 
.OP4Div input,.OP7Div input,.T2Div input,.T1Div input,.T3Div input{
	border:1px solid var(--charte_gris);
	border-radius:5px 5px 0px 0px;
	text-align:center;
}



.OP4Div input{
	text-align:center;
	font-weight:bold;
}

.OP6Div{
	position:relative;
	display:flex;
	/* FLEX-WRAP:wrap; */
	ALIGN-ITEMS:center !important;
	ALIGN-CONTENT:center !important;
	justify-content :left !important;
	
	height:35px !important;
	
	border:1px solid var(--charteColor1);
	padding:5px;
	padding-left:10px;
	padding-right:10px;
	margin:5px;
	
	color:var(--charteColor1);
	background-color:var(--charteColor2);
	border-radius:5px;
	
	font-weight:bold;
}

.OP11Div{
	position:relative;
	display:flex;
	/* FLEX-WRAP:wrap; */
	ALIGN-ITEMS:center !important;
	ALIGN-CONTENT:center !important;
	justify-content :left !important;
	
	height:35px !important;
	
	border:1px solid var(--charteVert);
	padding:5px;
	padding-left:10px;
	padding-right:10px;
	margin:5px;
	
	color:var(--charteVert);
	background-color:var(--charteVertB);
	border-radius:5px;
	
	font-weight:bold;
}

.OP6Div:hover i,.OP11Div:hover i{
/* background-color:var(--charteColor1); */
color:white;
}

.OP6Div:hover {
background-color:var(--charteColor1);
color:white;
}

.OP11Div:hover {
background-color:var(--charteVert);
color:white;
}

.OP6Div i{
	padding-right:10px;
	font-size:1.5em;
	color:var(--charteColor1);

}
.OP11Div i{
	padding-right:10px;
	font-size:1.5em;
	color:var(--charteVert);

}

.OP4Button{
	/* border:1px solid red; */
	
	width:50px;
	margin:0px !important;
	padding:0px !important;
}



.OP4Button>button{
		display:flex;
	FLEX-WRAP:wrap;
	ALIGN-ITEMS:center;
	ALIGN-CONTENT:center;
	justify-content :center;
	width:100%;
	height:100%;
	margin:0px;
	padding:0px;
	
	color:var(--charteColor1);
}

 .OP2Div,
 .OP4Div,
 .OP3Div,
 .OP7Div,
 .T1Div,
 .T2Div,
 .T3Div{
	width:150px;
	position:relative;
 }
 
 .OP2Div div:nth-child(1),
 .OP3Div div:nth-child(1),
 .OP4Div div:nth-child(1),
 .T1Div div:nth-child(1),
 .T2Div div:nth-child(1),
 .OP7Div div:nth-child(1),
 .T3Div div:nth-child(1)
 {
	 position:absolute;
	 width:100%;
	 /* border:1px solid red; */
	 top:-30px;
	 left:0px;
	 text-align:center;
	 max-height:30px;
 }
 
 
 
.T2Div input{
	text-align:center;
 }
 

 
.gobalL{
	display:flex;
	FLEX-WRAP:wrap;
	ALIGN-ITEMS:flex-start;
	ALIGN-CONTENT:flex-start;
	/* justify-content :center; */
	/* margin-top:5px; */
}

.titre1{
	width:100%;
	font-size:20px;
	
}
.titreLs{
	display:block;
	text-overflow:ellipsis;
	overflow:hidden;
	white-space:nowrap;
	width:100px;
	border:1px solid var(--charteGris2);
	text-align:left;
	font-weight:bold;
	
}

.mois1{
	display:flex;
	ALIGN-ITEMS:center;
	ALIGN-CONTENT:center;
	justify-content :center;
	width:calc(5.12% - 8px);
	border:1px solid red;
	text-align:center;
	border:1px solid black;
	border-right:0px;
	height:27px;
	margin:0px;
	padding:0px;
	font-weight:bold;
	/* background-color:red; */
	font-size:14px;
}

.L3 input{
	font-weight:bold;
	font-size:12px;
	color:var(--L3);
}

.mois2{
		display:flex;
	ALIGN-ITEMS:center;
	ALIGN-CONTENT:center;
	justify-content :center;

	width:calc(2.56% - 2.56px);
	text-align:center;	
	border:1px solid black;
	border-left:0px;
	height:27px;
	font-size:12px;
	font-weight:bold;


}

.mois1 input{
	display: block;
	border:0px;
	text-align:center;
	width:100%;
	height:100%;
	/* border-radius:5px; */
	background-color:var(--charte_gris_blanc);
	
}

.mois2 input{
	display: block;
	border:0px;
	text-align:center;
	width:100%;
}

.LPT{
	flex:1;
	text-align:right;	
	border:1px solid black;
	height:27px;
	font-weight:bold;
	padding-right:5px ;
	font-size:14px;
}


.L0,.L0b{border:1px solid var(--L0); height:24px;}.L0b{background-color:var(--L0b);}
.L1,.L1b{border:1px solid var(--L1);}.L1b{background-color:var(--L1b);}
.L3,.L3b{border:1px solid var(--L3);}.L3b{background-color:var(--L3b);}
.L4,.L4b{border:1px solid var(--L4);}.L4b{background-color:var(--L4b);}
.L5,.L5b{border:1px solid var(--L5);}.L5b{background-color:var(--L5b);}
.L6,.L6b{border:1px solid var(--L6);}.L6b{background-color:var(--L6b);}
.L7,.L7b{border:1px solid var(--L7);}.L7b{background-color:var(--L7b);}

/* ----------------------------investissements------------------------ */
/* ----------------------------menu------------------------ */

#menuAction{
color:var(--charteColor1);	
position:absolute;
	left:15px;
	bottom:10px;
	z-index:3;
	font-size:25px;
	cursor:pointer;
	transform:rotate(45deg);
	
}

.menu:hover #menuAction {
  /* color: red !important; */
  	animation: punaise 2s linear infinite;

}


@keyframes punaise {
  0% {
    /* transform:rotate(45deg); */
	bottom:10px;
  }
  50% {
    transform:rotate(360deg);
	bottom:10px;
    
  }
  
  60% {
	bottom:0px;
  }
  
   70% {
    /* transform:rotate(360deg); */
	bottom:14px;
  }
  
   80% {
    /* transform:rotate(360deg); */
	bottom:10px;
    transform:rotate(360deg);
  }
  100% {
    transform:rotate(405deg);
  }
}

.menu{
	position:relative;
	border-right:1px solid silver;
	height:calc(100% - 5px);
	width:100%;
	background-color:white;
	}

.menuButton{
	display:flex;
	/* FLEX-WRAP:wrap; */
	width:calc(100% - margin);
    border:1px solid var(--charteColor1);
	border-radius:5px;
	padding:5px;
	ALIGN-ITEMS:center;
	/* ALIGN-CONTENT:flex-start; */
	margin:5px;
	margin-top:5px;
	cursor:pointer;
	
	transition:0.8s;
	/* border:1px solid blue; */
	}
	
.menuButton:hover{
	border:1px solid var(--charteColor1);
	background-color:var(--charteColor2);
	/* background-color:white; */
	transition:0.3s;
}



.menuButton>nav{
    padding-left:10px;
	display:block;
	text-overflow:ellipsis;
	overflow:hidden;
	white-space:nowrap;
	width:150px;
	/* border:1px solid red; */
	
}
.menuButton>i{
    color: var(--charteColor1);
	font-size:25px;
	padding-right:5px;
	width:25px;
	}
	
.titreMenu{
	position:relative;
	display:flex;
	/* border:1px solid red; */
	width:200px;
	padding-bottom:10px;
	padding-top:10px;
	ALIGN-ITEMS:center;
	ALIGN-CONTENT:center;
	JUSTIFY-CONTENT:center;
	}
	

/* ----------------------------menu------------------------ */

.main{
	display:flex;
	width:100%;
	height:100vh;
	
	FLEX-WRAP:wrap;
	ALIGN-ITEMS:flex-start;
	ALIGN-CONTENT:flex-start;
	
}

/* ----------------------------header ------------------------ */
.headerUser{
	display:flex;
	ALIGN-ITEMS:center;
	/* ALIGN-CONTENT:flex-start; */

	font-size:14px;
	/* border:1px solid black; */
	height:50px;
	margin-top:-5px;
	width:auto;
	}
.headerUser>div>i{
	font-size:30px;
	color:var(--charteColor1);
	}
.headerUser>div:nth-child(2){white-space: nowrap; text-align:left; color:var(--charteColor1);}

.headerUser>div{
	margin-right:5px;
	}
/* ----------------------------header ------------------------ */

.left{text-align:left;}
.center{text-align:center;}
.right{text-align:right;}

.T1Div,.T2Div,.T3Div
{
	width:100px !important;
}

.T3Div div:nth-child(1){
	/* color:red; */
	height:50px;
	/* border:1px solid red; */
	width:150px;
	text-align:left;
}

.button1{
	
}

.titre1U{

	justify-content :space-between!important;
	width:100%;
	margin:10px 10px 0px 10px;
	
}
.titre1U div{
	/* border:1px solid green; */
	color:var(--charteColor1);
	font-size:20px;
}