/* --- General Style --- */
	:root{
	  	--bk-color: #f4f4f9;
	  	--menu-bar: #FFF;
	  	--font-dark: #191530;
	  	--font-light: #f5f5f5;
	  	--button-color: #ffcb29;
	  	--widget-color: #191530;
	}

	body{
		font-family: 'Montserrat', sans-serif;
		font-weight: 400;
		color: var(--font-dark, black);
		position: absolute;
		overflow: hidden;
		top: 0;
		left: 0;
		right: 0;
		bottom: 0;
		background-color: var(--bk-color, grey);
		margin: 0;
	}

	input:focus {
	    outline: none;
	}

	a{
		text-decoration: none;
		color: var(--font-dark, black);
	}

	H1::first-letter{
	   	text-transform:uppercase;
	}
	H2::first-letter{
	   	text-transform:uppercase;
	}
	H3::first-letter{
	   	text-transform:uppercase;
	}
	p::first-letter{
	   	text-transform:uppercase;
	}

	form {
	  max-width: 600px;
	  margin: auto;
	}

	label {
	  display: block;
	  margin-bottom: 10px;
	  font-weight: bold;
	  margin-top: 30px;
	}

	input,
	select {
	  display: block;
	  width: 100%;
	  padding: 8px;
	  border: 1px solid #ccc;
	  border-radius: 4px;
	  box-sizing: border-box;
	  margin-bottom: 20px;
	}

	textarea {
	  display: block;
	  width: 100%;
	  padding: 8px;
	  border: 1px solid #ccc;
	  border-radius: 4px;
	  box-sizing: border-box;
	  margin-bottom: 20px;
	  resize: vertical;
	  height: 150px;
	}
/* --- /General Style --- */


/* --- Login Page --- */
	#login_container{
		position: absolute;
		overflow: auto;
		height: 100vh;
		width: 100vw;
		top: 0;
		left: 0;
		right: 0;
		bottom: 0;
		background-color: var(--bk-color, grey);
	}

	#login_div{
		position: absolute;
		top: 15%;
		height: 650px;
		width: 400px;
		left: 50%;
		transform: translateX(-50%);
		background-color: var(--menu-bar, white);
		-webkit-box-shadow: 0px 0px 13px 0px rgba(80,80,80,0.10); 
		box-shadow: 0px 0px 13px 0px rgba(80,80,80,0.10);
		border-radius: 30px;
		transition: 0.4s;
	}

	#login_flightly_logo_div{
		position: absolute;
		top: 80px;
		left: 50%;
		height: 100px;
		width: 250px;
		transform: translateX(-50%);
	}

	#login_flightly_logo_img{
		display: block;
		position: absolute;
		top: 0;
		height: auto;
		width: 100%;
		left: 50%;
		transform: translateX(-50%);
	}

	#login_inputs_div{
		position: absolute;
		top: 180px;
		right: 50px;
		width: 300px;
		height: 360px;
		background-color: var(--menu-bar, white);
		z-index: 2;
		transition: 0.4s;
	}
	#subscribe_inputs_div{
		position: absolute;
		top: 180px;
		left: 50px;
		width: 300px;
		height: 360px;
		z-index: 1;
	}
	#login_user_input_div{
		position: absolute;
		top: 0;
		left: 0;
		height: 90px;
		width: 100%;
	}
	#login_password_input_div{
		position: absolute;
		top: 120px;
		left: 0;
		height: 90px;
		width: 100%;
	}
	#firstname_user_input_div{
		position: absolute;
		top: 0;
		left: 0;
		height: 90px;
		width: 100%;
	}
	#lastname_user_input_div{
		position: absolute;
		top: 120px;
		left: 0;
		height: 90px;
		width: 100%;
	}
	#cgu_checkbox{
		position: absolute;
		left: 0;
		bottom: 125px;
		transition: 0.4s;
		width: auto;
	}
	#cgu_checkbox_text{
		font-family: 'Montserrat', sans-serif;
		font-weight: 400;
		font-size: 0.6em;
		position: absolute;
		right: 0;
		bottom: 130px;
		width: 270px;
		transition: 0.4s;
	}
	.login_input_text{
		font-size: 1.1em;
		font-weight: 700;
		color: var(--font-dark, black);
		margin-top: 0;
	}
	.login_input_bar_div{
		position: relative;
		margin-top: 0;
		margin-left: 0;
		margin-right: 0;
		height: 40%;
		width: 100%;
		background-color: var(--bk-color, grey);
		border-radius: 50px;
		display: inline-block;
		-webkit-box-shadow: 0px 0px 13px 0px rgba(80,80,80,0.05); 
		box-shadow: 0px 0px 13px 0px rgba(80,80,80,0.05);
	}
	.login_input_bar{
		position: absolute;
		top: 0;
		left: 20px;
		height: 90%;
		border: none;
		font-family: 'Montserrat', sans-serif;
		background-color: var(--bk-color, grey);
		font-weight: 700;
		font-size: 0.8em;
	}
	.login_input_bar::placeholder{
		font-weight: 400;
		opacity: 0.8;
	}
	#login_inputs_checkbox{
		position: absolute;
		bottom: 6.5%;
		left: 0;
		font-family: 'Montserrat', sans-serif;
		font-weight: 400;
		font-size: 0.8em;
	}
	#login_inputs_checkbox_text{
		position: absolute;
		bottom: 7%;
		left: 8%;
		
	}
	#login_inputs_button{
		position: absolute;
		right: 0;
		bottom: 70px;
		height: 35px;
		width: 170px;
		background-color: rgb(0, 85, 249);
		border-radius: 10px;
		border: none;
		font-weight: 600;
		color: var(--menu-bar, white);
		font-size: 1em;
		cursor: pointer;
		transition: 0.3s;
		text-align: center;
		letter-spacing: 0.2px;
	}
	#login_inputs_button:hover{
		background-color: rgb(0, 64, 249);
	}
	#login_end_link{
		position: absolute;
		top: 570px;
		left: 12.5%;
		width: 75%;
		transition: 0.3s;
	}
	.login_end_link_a{
		font-family: 'Montserrat', sans-serif;
		font-weight: 400;
		font-size: 0.8em;
		text-decoration: underline;
		display: block;
		text-align: center;
		line-height: 25px;
	}
	#login_user_input{
		border: 0px;
	}
	#signUp_inputs_button{
		position: absolute;
		right: 0;
		bottom: 0;
		height: 35px;
		width: 170px;
		background-color: #f4f4f9;
		border-radius: 10px;
		border: none;
		font-weight: 600;
		color: black;
		font-size: 1em;
		cursor: pointer;
		transition: 0.3s;
		text-align: center;
		letter-spacing: 0.2px;
	}
	#signUp_inputs_button:hover{
		background-color: #eaeaf0;
	}
	#subscribe_text{
		position: absolute;
		top: 50%;
		left: 50%;
		text-align: center;
		color: var(--font-dark, black);
		transform: translate(-50%, -50%);
	}
/* --- /Login Page --- */


/* --- Style All Pages --- */
	.div_container{
		position: absolute;
		top: 0;
		left: 0;
		right: 0;
		bottom: 0;
		margin-left: 50px;
		margin-right: 50px;
		margin-top : 20px;
		margin-bottom: 20px;
		overflow: auto;
		min-width: 900px;
	}
	.div_right_container{
		position: relative;
		display: block;
		margin-left: 250px;
		width: calc(100% - 250px);
		height: auto;
		overflow-y: auto;
		overflow-x: hidden;
	}
	.div_little_container{
		position: relative;
		overflow: auto;
		display: block;
	}
	#div_profil_button_bubble{
		position: absolute;
		top: 15px;
		right: 0;
		height: 60px;
		width: 60px;
		border-radius: 50%;
		background-color: var(--font-dark, black);
		-webkit-box-shadow: 0.2px 0px 13px 0px rgba(80,80,80,0.15); 
		box-shadow: 0.2px 0px 13px 0px rgba(80,80,80,0.15);
		cursor: pointer;
		display: flex;
		justify-content: center;
		align-items: center;
		z-index: 99;
	}
	#img_profil_button_bubble{
		height: 100%;
		width: 100%;
		object-fit: cover;
		border-radius: 50%;
		z-index: 99;
	}
	#div_profil_menu{
		position: absolute;
		top: 70px;
		right: 0;
		width: 250px;
		border-radius: 15px;
		background-color: var(--font-dark, black);
		-webkit-box-shadow: 0.2px 0px 13px 0px rgba(80,80,80,0.15); 
		box-shadow: 0.2px 0px 13px 0px rgba(80,80,80,0.15);
		color: var(--menu-bar, white);
		z-index: 98;
		padding: 15px;
		transition: 0.3s;
		opacity: 0;
	}
	#text_profil_menu_title{
		font-size: 1em;
		font-weight: 600;
		margin-top: 0;
		display: inline;
	}
	#text_profil_menu_profil_name{
		font-size: 0.8em;
		font-weight: 600;
		margin-top: 0;
	}
	#div_profil_menu_switch_app_button{
		position: absolute;
		top: 10px;
		right: 10px;
		font-size: 0.8em;
		font-weight: 600;
		margin-top: 0;
		cursor: pointer;
		background-color: white;
		color: black;
		border-radius: 10px;
		padding-left: 10px;
		padding-right: 10px;
	}
	#indicator_profil_menu_title{
		height: 10px;
		width: 10px;
		border-radius: 50%;
		background-color: #2ecc71;
		margin-left: 15px;
		display: inline-block;
	}
	.text_profil_menu_profils{
		margin-top: 0;
		margin-bottom: 5px;
		cursor: pointer;
		font-size: 0.9em;
	}

	.h1_container_title{
		position: relative;
		font-weight: 700;
		font-size: 2em;
		letter-spacing: 2px;
		color: var(--font-dark, black);
	}
	.h2_container_subtitle{
		position: relative;
		font-weight: 500;
		font-size: 1.2em;
		color: var(--font-dark, black);
	}
	.h2_div_container{
		margin-top: 5px;
		margin-left: 5px;
		margin-bottom: 10px;
	}

	#div_menu_bar{
		position: absolute;
		top: 0;
		left: 0;
		width: 120px;
		background-color: var(--menu-bar, white);
		-webkit-box-shadow: 0.2px 0px 13px 0px rgba(80,80,80,0.05); 
		box-shadow: 0.2px 0px 13px 0px rgba(80,80,80,0.05);
		color: var(--font-dark, black);
		border-radius: 15px;
		margin: 20px;
		overflow: auto;
	}

	#div_menu_bar_logo{
		position: relative;
		width: 80%;
		height: 60px;
		margin-left: auto;
		margin-right: auto;
		margin-top: 30px;
		margin-bottom: 30px;
	}

	#img_menu_bar_logo{
		position: absolute;
		top: 0;
		width: 100%;
		left: 50%;
		transform: translateX(-50%);
	}

	.div_menu_bar_inputs{
		position: relative;
		height: 55px;
		width: 55px;
		background-color: var(--bk-color, grey);
		border-radius: 50%;
		margin-left: auto;
		margin-right: auto;
		margin-top: 45px;
		cursor: pointer;
		-webkit-box-shadow: 0px 0px 13px 0px rgba(80,80,80,0.05); 
		box-shadow: 0px 0px 13px 0px rgba(80,80,80,0.05);
	}

	.img_menu_bar_input_images{
		position: absolute;
		top: 25%;
		height: 50%;
		width: auto;
		left: 50%;
		transform: translateX(-50%);
	}

	.p_menu_bar_input_titles{
		position: absolute;
		text-align: center;
		margin-top: 120%;
		font-size: 0.7em;
		font-weight: 600;
		width: 180%;
		margin-left: -40%;
	}
	#add_new_flight_button{
		margin-bottom: 30px;
	}

	.div_widget{
		background-color: white;
		color: var(--font-dark, black);
		border-radius: 15px;
		position: relative;
		min-width: 150px;
		min-height: 40px;
		transition: 0.2s;
		padding: 15px;
	}
	.img_widget_icon{
		top: 10px;
		right: 10px;
		height: 27px;
		width: auto;
		position: absolute;
	}
	.p_widget_text{
		color: black;
		margin-left: 5px;
		font-size: 1.1em;
		font-weight: 600;
		margin-top: 7px;
		margin-bottom: 0;
	}
	.p_widget_title{
		color: black;
		font-size: 0.9em;
		font-weight: 600;
		z-index: 3;
		margin: 0;
		margin-right: 20px;
	}
	#calendar_add_div{
		position: absolute;
		top: 15px;
		right: 80px;
		height: 60px;
		width: 60px;
		cursor: pointer;
		z-index: 99;
		display: none;
	}
	#calendar_add_img{
		position: absolute;
		top: 20%;
		left: 50%;
		height: 60%;
		width: auto;
		transform: translateX(-50%);
	}
	#div_return_button{
		position: relative;
		height: 45px;
		width: 45px;
		background-color: white;
		border-radius: 50%;
		cursor: pointer;
		-webkit-box-shadow: 0px 0px 13px 0px rgba(80,80,80,0.05); 
		box-shadow: 0px 0px 13px 0px rgba(80,80,80,0.05);
	}

	.div_sub_menu_page{
		position: relative;
		width: 100%;
		background-color: white;
		color: var(--font-dark, black);
		border-radius: 15px;
		display: flex;
		overflow-y: hidden;
		overflow-x: auto;
		-ms-overflow-style: none;  /* IE and Edge */
		scrollbar-width: none;  /* Firefox */
		user-select: none;
		-webkit-user-select: none;
	}
	/* Hide scrollbar for Chrome, Safari and Opera */
	.div_sub_menu_page::-webkit-scrollbar {
		display: none;
	}
	.div_sub_menu_page_item{
		display: inline-block;
		margin: auto;
		transition: 0.3s;
		cursor: pointer;
		text-align: center;
		padding-left: 15px;
		padding-right: 15px;
		min-width: 80px;
		border-radius: 15px;
		background-color: none;
		font-weight: 500;
		font-size: 0.9em;
	}
	.div_sub_menu_page_item:hover{
		background-color: rgba(25, 21, 48, 0.8);
		color: var(--font-light, white);
	}
	.div_sub_menu_page_item_hover{
		background-color: var(--font-dark, black);
		color: var(--font-light, white);
		font-weight: 600;
	}
	.div_section{
		position: relative;
		top: 0;
		left: 0;
		right: 0;
		overflow: auto;
	}


	#div_pilot_resum{
		position: relative;
		display: grid;
		grid-template-columns: 1fr;
		grid-template-rows: auto auto;
		grid-row-gap: 40px;
	}

	#div_pilot_balance{
		position: relative;
		display: grid;
		grid-template-columns: 1fr;
	}

	#div_pilot_statistics{
		position: relative;
		display: grid;
		grid-template-columns: 1fr;
		grid-template-rows: auto;
		grid-column-gap: 20px;
		grid-row-gap: 20px;
	}

	#div_widget_export_logbook_button{
		height: 30px;
		border-radius: 10px;
		cursor: pointer;
		background-color: #f4f4f9;
		color: black;
		font-weight: 600;
		text-align: center;
		letter-spacing: 0.2px;
		white-space: nowrap;
		padding-left: 10px;
		padding-right: 10px;
		margin-top: 15px;
		width: 150px;
		margin-left: auto;
		margin-right: auto;
		user-select: none;
		-webkit-user-select: none;
	}
	#div_widget_export_logbook_button:hover{
		background-color: #eaeaf0;
	}

	#div_pilot_files{
		position: relative;
		display: grid;
		grid-template-columns: 1fr;
		grid-template-rows: auto auto auto;
		grid-row-gap: 30px;
	}

	#div_pilot_files_widgets_container{
		position: relative;
		display: grid;
		grid-template-columns: repeat(3, max-content);
		grid-column-gap: 20px;
		grid-row-gap: 20px;
	}

	#div_pilot_balance_widgets_container{
		position: relative;
		display: grid;
		grid-template-columns: repeat(5, auto);
		grid-template-rows: auto;
		grid-column-gap: 20px;
		grid-row-gap: 20px;
		overflow-x: auto;
	}

	#div_pilot_resum_widgets_container{
		position: relative;
		display: grid;
		grid-template-columns: repeat(4, auto);
		grid-template-rows: auto;
		grid-column-gap: 20px;
		grid-row-gap: 20px;
	}

	#div_pilot_statistics_widgets_container{
		position: relative;
		display: grid;
		grid-template-columns: repeat(4, auto);
		grid-template-rows: auto;
		grid-column-gap: 20px;
		grid-row-gap: 20px;
	}
	.div_qualifications_element{
		position: relative;
		background-color: var(--font-dark, black);
		color: var(--font-light, white);
		border-radius: 15px;
		padding: 15px;
		width: auto;
		transition: 0.2s;
		display: grid;
		cursor: pointer;
		grid-column-gap: 30px;
		grid-row-gap: 10px;
	}
	.div_qualifications_element:hover{
		background-color: #2ecc71;
	}
	.div_files_element{
		position: relative;
		background-color: white;
		border-radius: 15px;
		padding: 15px;
		min-width: 150px;
		transition: 0.2s;
		display: grid;
		cursor: pointer;
		grid-column-gap: 30px;
		grid-row-gap: 10px;
	}
	.div_files_element:hover{
		background-color: #2ecc71;
	}
	.div_other_files_element{
		position: relative;
		background-color: rgb(234, 234, 240);
		color: var(--font-light, white);
		border-radius: 15px;
		padding: 15px;
		width: 120px;
		transition: 0.2s;
		display: grid;
		cursor: pointer;
	}
	.div_other_files_element:hover{
		background-color: #eaeaf0;
	}
	.img_div_files_upload_icon{
		position: absolute;
		top: 10px;
		right: 10px;
		height: 30px;
		width: auto;
	}
	.img_div_files{
		max-height: 40px;
		width: 40px;
		margin: auto;
	}
	.img_div_generics_files{
		max-height: 80px;
		width: 80px;
		margin: auto;
	}
	.p_div_files_label{
		font-size: 0.7em;
		font-weight: 600;
		margin: 0;
		margin-top: 10px;
		text-align: center;
		word-wrap: anywhere;
		color: black;
	}
	.p_div_generics_files_label{
		font-size: 0.9em;
		font-weight: 600;
		margin: 0;
		margin-top: 10px;
		text-align: center;
		word-wrap: anywhere;
	}
	#div_pilot_qualifications_list_container{
		background-color: white;
		border-radius: 15px;
		padding: 15px;
		position: relative;
		height: 200px;
		min-width: 200px;
	}
	#div_pilot_qualifications_list{
		display: grid;
		grid-template-columns: repeat(1, 1fr);
		margin-top: 50px;
		grid-row-gap: 15px;
		overflow: auto;
		position: relative;
		max-height: 150px;
		overflow: auto;
	}
	#div_pilot_licenses_list_container{
		background-color: white;
		border-radius: 15px;
		padding: 15px;
		position: relative;
		height: 200px;
		min-width: 200px;
	}
	#div_pilot_licenses_list{
		position: relative;
		display: grid;
		grid-template-columns: repeat(1, 1fr);
		margin-top: 50px;
		grid-row-gap: 15px;
		overflow: auto;
		max-height: 150px;
		overflow: auto;
	}
	#div_pilot_contributions_list_container{
		background-color: white;
		border-radius: 15px;
		padding: 15px;
		position: relative;
		height: 200px;
		min-width: 200px;
	}
	#div_pilot_contributions_list{
		position: relative;
		display: grid;
		grid-template-columns: repeat(1, 1fr);
		margin-top: 50px;
		grid-row-gap: 15px;
		overflow: auto;
		max-height: 150px;
		overflow: auto;
	}
	#div_pilot_generics_files_list{
		position: relative;
		display: grid;
		grid-template-columns: repeat(5, 1fr);
		grid-column-gap: 30px;
		grid-row-gap: 30px;
		min-height: 150px;
		overflow: auto;
	}

	.div_files_others_documents{
		background-color: white;
		border-radius: 15px;
		position: relative;
		display: grid;
		grid-template-columns: 270px auto;
		min-height: 350px;
		overflow: hidden;
	}
	.div_files_others_documents_menu{
		position: relative;
		border-right: 2px solid rgba(0, 0, 0, 0.3);
		display: grid;
		padding: 15px;
		grid-template-columns: 1fr;
		grid-row-gap: 10px;
		margin-top: 15px;
		margin-bottom: 15px;
	}
	.div_files_others_documents_menu_element{
		cursor: pointer;
		padding: 8px;
		background-color: #f4f4f9;
		border-radius: 10px;
		transition: 0.4s;
	}
	.div_files_others_documents_menu_element:hover{
		background-color: #eaeaf0;
	}
	.p_files_others_documents_menu_element_text{
		margin: 0;
		font-weight: 600;
		text-align: left;
	  	letter-spacing: 0.2px;
		color: rgba(0, 0, 0, 0.8);
		line-height: 20px;
		margin-left: 4px;
	}
	.div_files_others_documents_menu_element_add{
		height: 35px;
		border-radius: 10px;
		cursor: pointer;
		background-color: rgb(0, 85, 249);
		color: white;
		font-weight: 600;
		text-align: center;
	  	letter-spacing: 0.2px;
		margin-top: 20px;
	}
	.div_files_others_documents_menu_element_add:hover{
		background-color: rgb(0, 64, 249);
	}

	.div_files_others_documents_menu_element_add_file{
		height: 35px;
		border-radius: 10px;
		cursor: pointer;
		background-color: rgb(0, 85, 249);
		color: white;
		font-weight: 600;
		text-align: center;
	  	letter-spacing: 0.2px;
		margin-top: 20px;
		padding-left: 15px;
		padding-right: 15px;
	}
	.div_files_others_documents_menu_element_add_file:hover{
		background-color: rgb(0, 64, 249);
	}

	.div_files_others_documents_menu_element_generate_file{
		height: 35px;
		border-radius: 10px;
		cursor: pointer;
		background-color: rgb(41, 41, 41);
		color: white;
		font-weight: 600;
		text-align: center;
	  	letter-spacing: 0.2px;
	}
	.div_files_others_documents_menu_element_generate_file:hover{
		background-color: rgb(81, 81, 81);
	}
	#div_files_others_documents_mosaic_container_add{
		grid-template-columns: 1fr;
		max-width: 550px;
	}

	.div_files_others_documents_mosaic{
		padding: 15px;
	}
	.div_files_others_documents_mosaic_container{
		display: flex;
		flex-wrap: wrap;
		gap: 10px;
		width: 100%;
	}
	#div_school_files_others_documents_mosaic_container{
		grid-template-columns: repeat(3, 1fr);
	}
	#div_school_files_others_documents_mosaic_container_validated{
		grid-template-columns: repeat(3, 1fr);
	}
	#div_school_files_others_documents_mosaic_container_expired{
		grid-template-columns: repeat(3, 1fr);
	}
	.h2_files_others_documents_mosaic_title{
		margin-bottom: 4px;
	}
	.h3_files_others_documents_mosaic_subtitle{
		margin-top: 0;
		font-weight: 600;
		font-size: 0.8em;
		opacity: 0.8;
	}

	.p_div_files_others_documents{
		font-size: 1.2em;
		font-weight: 600;
		margin-top: 0;
		position: absolute;
		top: 15px;
		left: 15px;
	}
	.p_div_qualifs_licenses_label{
		font-size: 0.8em;
		font-weight: 600;
		margin: 0;
		line-height: 15px;
		text-align: left;
		word-wrap: anywhere;
	}

	/* Conteneur principal de la checkbox */
	.checkbox-container {
		display: flex;
		align-items: center;
		font-family: Arial, sans-serif;
		font-size: 16px;
		color: #333;
		cursor: pointer;
		user-select: none;
		-webkit-user-select: none;
	}

	/* Texte associé à la checkbox */
	.checkbox-label {
		margin-left: 10px;
		color: #333;
	}

	/* Masquer la case par défaut */
	.checkbox-container input[type="checkbox"] {
		display: none;
	}

	/* Style pour la boîte customisée */
	.checkbox-custom {
		width: 24px;
		height: 24px;
		border: 2px solid #007bff;
		border-radius: 15px;
		display: flex;
		align-items: center;
		justify-content: center;
		transition: background-color 0.3s ease;
	}

	/* Style pour le checkmark (caché par défaut) */
	.checkbox-custom::before {
		content: "";
		width: 12px;
		height: 12px;
		background-color: #007bff;
		border-radius: 15px;
		opacity: 0;
		transform: scale(0);
		transition: opacity 0.2s ease, transform 0.2s ease;
	}

	/* État activé de la checkbox */
	.checkbox-container input[type="checkbox"]:checked + .checkbox-custom::before {
		opacity: 1;
		transform: scale(1);
	}

	/* Hover pour la boîte */
	.checkbox-container:hover .checkbox-custom {
		background-color: #f0f8ff;
	}
/* --- /Style Pages --- */



/* --- List flights Element --- */
	.div_container_flights_list{
		background-color: var(--font-light, white);
		border-radius: 15px;
	}
	#div_list_vols{
		overflow-y: scroll;
	}
	#div_list_transactions{
		max-height: calc(100% - 89px);
		overflow-y: scroll;
	}
	#div_list_transactions_time_flight{
		max-height: calc(100% - 89px);
		overflow-y: scroll;
	}
	#div_list_transactions_time_brief{
		max-height: calc(100% - 89px);
		overflow-y: scroll;
	}
	#div_list_transactions_time_class{
		max-height: calc(100% - 89px);
		overflow-y: scroll;
	}
	#div_list_transactions_time_nb_landing{
		max-height: calc(100% - 89px);
		overflow-y: scroll;
	}
	.transaction-item {
		display: flex;
		justify-content: space-between;
		padding: 12px;
		background-color: white;
		border-radius: 15px;
		margin-top: 7px;
		margin-bottom: 7px;
		font-weight: 500;
		align-items: center;
		font-size: 0.9em;
	}
	.transaction-item span {
		flex: 1;
		text-align: center;
		cursor: pointer;
	}

	.flight-item {
		display: flex;
		justify-content: space-between;
		padding: 12px;
		background-color: white;
		border-radius: 15px;
		margin-top: 7px;
		margin-bottom: 7px;
		font-weight: 500;
		align-items: center;
		font-size: 0.9em;
	}
	.flight-item span {
		flex: 1;
		text-align: center;
		cursor: pointer;
	}
	.header {
		background-color: var(--font-dark, black);
		color: var(--font-light, white);
		border-radius: 15px;
		font-weight: 600;
	}

	.flight-item span:nth-child(1) {
		width: 15%;
	}
	.flight-item span:nth-child(2) {
		width: 15%;
	}
	.flight-item span:nth-child(3) {
		width: 25%;
	}
	.flight-item span:nth-child(4) {
		width: 20%;
	}
	.flight-item span:nth-child(5) {
		width: 10%;
	}
	.flight-item span:nth-child(6) {
		width: 15%;
	}
/* --- /List flights Element --- */


.div_container_transactions_list{
		background-color: var(--font-light, white);
		border-radius: 15px;
		position: relative;
	}


/* --- Flight Page --- */
	.flight_basic_details_container {
		grid-area: 1 / 1 / 4 / 6;
		background-color: var(--font-light, white);
		border: 1px solid #ddd;
		border-radius: 5px;
		color: var(--font-dark, black);
		-webkit-box-shadow: 0.2px 0px 13px 0px rgba(80,80,80,0.05); 
		box-shadow: 0.2px 0px 13px 0px rgba(80,80,80,0.05);
		padding: 20px;
		min-height: 350px;
	}
	.flight_basic_details {
		display: flex;
		flex-wrap: wrap;
		margin: -10px;
	}
	.flight_basic_details_row {
		flex-basis: calc(50% - 20px);
		margin: 10px;
	}
	.flight_basic_details_label {
		font-weight: bold;
	}
	.flight_basic_details_value {
		margin-left: 5px;
	}
	#div_widget_instructeur_vol{grid-area: 4 / 4 / 5 / 4; text-decoration: underline; cursor: pointer;}
	#div_widget_conditions_vol{grid-area: 5 / 1 / 6 / 2;}
	#div_widget_evaluation_vol{grid-area: 4 / 3 / 5 / 4;}
	#div_widget_notes_vol{grid-area: 4 / 1 / 5 / 3; min-width: 250px}
	#div_widget_suite_vol{grid-area: 5 / 3 / 6 / 4;}
	#div_widget_pictures{grid-area: 5 / 4 / 6 / 5;}
	#div_widget_signature_vol{grid-area: 5 / 2 / 6 / 3; cursor: pointer; min-width: 150px;}
	#div_widget_mini_map{grid-area: 4 / 5 / 6 / 6;}
	.div_widget_vol{
		background-color: var(--font-light, white);
		color: var(--font-dark, black);
		border-radius: 15px;
		border: 1px solid #ddd;
		padding: 20px;
	}

	#img_widget_signature_vol{
		width: 100%;
		height: auto;
		vertical-align: middle;
		max-height: 120px;
	}
	#img_big_signature_vol{
		max-height: 100%;
		width: auto;
		position: absolute;
		top: 50%;
		left: 50%;
		transform: translate(-50%, -50%);
		max-width: 70%;
	}

	.div_widget_vol {
		padding: 20px;
		border: 1px solid #ddd;
		border-radius: 8px;
		margin-bottom: 20px;
	}

	#photo-upload-container {
		display: flex;
		align-items: center;
		margin-top: 10px;
		margin-bottom: 15px;
	}

	#div_big_widget_flight_pictures{
		margin-top: 60px;
		height: 100%;
		width: 100%;
	}	

	#existing-photo-preview-container {
		width: 400px;
		overflow-x: auto;
		white-space: nowrap;
		padding: 10px;
		margin-top: 15px;
		cursor: pointer;
		height: 140px;
	}
	#existing-photo-preview{
		height: 100%;
		width: 100%;
	}

	.photo-preview img {
		height: 100%;
		margin-right: 10px;
		border: 2px solid #ddd;
		border-radius: 8px;
		object-fit: cover;
		cursor: pointer;
	}

	.mosaic {
		display: flex;
		flex-wrap: wrap;
		gap: 10px;
		padding: 20px;
		margin-right: 60px;
	}

	.mosaic img {
		max-width: 200px;
		max-height: 200px;
		object-fit: cover;
		border: 2px solid #ddd;
		border-radius: 8px;
		box-shadow: 2px 2px 8px rgba(0, 0, 0, 0.1);
	}

	.mosaic img:hover {
		transform: scale(1.05);
		transition: transform 0.3s;
	}

	.nav_button {
		position: absolute;
		top: 50%;
		transform: translateY(-50%);
		background-color: rgba(0, 0, 0, 0.5);
		color: white;
		border: none;
		padding: 10px;
		cursor: pointer;
		z-index: 10;
	}

	#prevButton {
		left: 10px;
	}

	#nextButton {
		right: 10px;
	}

	.control_button {
		position: absolute;
		background-color: rgba(0, 0, 0, 0.3);
		color: white;
		border: none;
		padding: 10px;
		cursor: pointer;
		z-index: 10;
	}

	#control_button_return{
		top: -50px;
		left: 15px;
	}
	#control_button_download{
		left: 15px;
		bottom: 20px;
	}
	#control_button_delete{
		right: 15px;
		bottom: 20px;
	}
	.img_control_button{
		height: 50px;
		width: auto;
		position: absolute;
		bottom: 15px;
		padding: 5px;
		border-radius: 15px;
		transition: 0.2s;
	}
	.img_control_button:hover{
		background-color: rgba(0, 0, 0, 0.3);
	}


	#div_big_image_display_bottom_buttons{
		position: relative;
		display: grid;
		grid-template-columns: 1fr 1.5fr;
		grid-column-gap: 10px;
		margin-top: 40px;
		margin-bottom: 0;
	}
	#div_big_image_display_bottom_left_button{
		height: 35px;
		border-radius: 10px;
		cursor: pointer;
		background-color: rgb(41, 41, 41);
		color: white;
		font-weight: 600;
		text-align: center;
	  letter-spacing: 0.2px;
	}
	#div_big_image_display_bottom_left_button:hover{
		background-color: rgb(81, 81, 81);
	}
	#div_big_image_display_bottom_right_button{
		height: 35px;
		border-radius: 10px;
		cursor: pointer;
		background-color: rgb(0, 85, 249);
		color: white;
		font-weight: 600;
		text-align: center;
	  letter-spacing: 0.2px;
	}
	#div_big_image_display_bottom_right_button:hover{
		background-color: rgb(0, 64, 249);
	}


	#div_big_image_display_signature_infos{
		position: relative;
		display: grid;
		grid-template-columns: 1fr;
		margin-top: 20px;
		margin-bottom: 0;
	}
	#div_big_image_display_signature_button{
		height: 35px;
		border-radius: 10px;
		cursor: pointer;
		background-color: rgb(0, 85, 249);
		color: white;
		font-weight: 600;
		text-align: center;
	  	letter-spacing: 0.2px;
		margin-top: 10px;
	}
	#div_big_image_display_signature_button:hover{
		background-color: rgb(0, 64, 249);
	}


	#big_image {
		max-width: 80%;
		max-height: 80%;
		margin: auto;
		display: block;
		top: 50%;
		left: 50%;
		transform: translate(-50%, -50%);
		position: absolute;
	}
	#big_image_pdf {
		max-width: 80%;
		min-width: 600px;
		height: 80%;
		margin: auto;
		display: block;
		top: 50%;
		left: 50%;
		transform: translate(-50%, -50%);
		position: absolute;
		overflow: hidden;
	}

	#div_big_image_display_filename{
		display: flex; 
		align-items: center; 
		margin-bottom: 20px; 
		column-gap: 10px;
	}
	
	#div_filename{
		height: 30px;
		width: calc(100% - 50px);
	}
	#input_filename{
		height: 100%;
		width: 100%;
		border-radius: 15px;
		border: none;
		padding-left: 10px;
		padding-right: 10px;
	}

	#div_big_image_display{
		position: grid;
		height: 100%;
		width: 100%;
		margin: auto;
		top: 0px;
		grid-template-columns: auto 350px;
		grid-template-rows: auto;
		transition: 0.3s ease;
	}

	#div_big_image_display_left{
		position: relative;
		background-color: white;
		grid-area: 1 / 1 / 2 / 2;
	}
	#div_big_image_display_right{
		position: relative;
		background-color: #f5f5f7;
		padding: 25px;
		padding-top: 80px;
		overflow: auto;
		grid-area: 1 / 2 / 2 / 3;
	}

	#div_big_image_display_open_infos_button{
		display: none;
		font-weight: 600;
	}

	#div_upload_button{
		position: absolute;
		right: 10px;
		margin-top: 0;
		top: 10px;
		height: 30px;
		width: 30px;
		cursor: pointer;
	}
	#div_upload_button_2{
		position: absolute;
		left: 10px;
		margin-top: 0;
		top: 10px;
		height: 50px;
		width: 50px;
		cursor: pointer;
	}

	.div_add_button{
		position: absolute;
		right: 10px;
		margin-top: 0;
		top: 10px;
		height: 30px;
		width: 30px;
		cursor: pointer;
	}
	.img_upload_button{
		height: 100%;
		width: auto;
		margin: auto;
	}
	#div_big_image_display_infos{
		position: relative;
	}

	#div_filename_update_button{
		height: 30px;
		width: 30px;
		cursor: pointer;
		background-color: rgb(0, 85, 249);
		border-radius: 15%;
		position: relative
	}
	#div_filename_update_button:hover{
		background-color: rgb(0, 64, 249);
	}
	#div_big_image_display_infos_expiration_date_update_button{
		height: 30px;
		width: 30px;
		cursor: pointer;
		background-color: rgb(0, 85, 249);
		border-radius: 15%;
		position: relative
	}
	#div_big_image_display_infos_expiration_date_update_button:hover{
		background-color: rgb(0, 64, 249);
	}
	.img_filename_update_button{
		height: 70%;
		width: auto;
		position: absolute;
		top: 50%;
		left: 50%;
		transform: translate(-50%, -50%);
	}


	#div_little_container_flight{
		width: 800px;
		margin: auto;
		grid-column-gap: 0px;
		grid-template-rows: none;
		display: grid;
		grid-row-gap: 20px;
	}

	#div_flight_travel_airports{
		min-height: 210px;
		position: relative;
		background-color: white;
		border-radius: 15px;
		grid-area: 1 / 1 / 2 / 6;
	}
	#div_flight_travel_airports_container{
		position: relative;
	}

	#div_flight_share_button{
		height: 30px;
		border-radius: 10px;
		cursor: pointer;
		background-color: rgb(0, 85, 249);
		color: white;
		font-weight: 600;
		text-align: center;
		letter-spacing: 0.2px;
		white-space: nowrap;
		padding-left: 10px;
		padding-right: 10px;
		margin-top: 15px;
		width: 100px;
		margin-left: auto;
		margin-right: 25px;
	}
	#div_flight_share_button:hover{
		background-color: rgb(0, 64, 249);
	}

	.h1_flight_travel_airports{
		font-size: 3em;
		font-weight: 800;
		position: absolute;
		top: 20px;
		margin: 0;
	}
	.h2_flight_travel_airports_name{
		position: absolute;
		top: 60px;
		font-size: 1.4em;
	}
	#h2_flight_travel_airports_name_left{
		left: 25px;
	}
	#h2_flight_travel_airports_name_right{
		right: 25px;
	}
	#h1_flight_travel_airports_left{
		left: 25px;
	}
	#h1_flight_travel_airports_right{
		right: 25px;
	}

	#div_flight_travel_airports_line{
		border-top: 10px dotted #191530;
		position: absolute;
		top: 45px;
		left: 50%;
		transform: translateX(-50%);
		width: 340px;
	}
	.div_flight_travel_airports_point{
		height: 25px;
		width: 25px;
		border-radius: 50%;
		background-color: #191530;
		position: absolute;
		top: -17.5px;
	}
	#div_flight_travel_airports_point_left{
		left: -5px;
	}
	#div_flight_travel_airports_point_right{
		right: -5px;
	}
	#div_flight_travel_airports_icon{
		position: absolute;
		top: 10px;
		height: 80px;
		width: 80px;
		left: 50%;
		transform: translateX(-50%);
	}
	.img_flight_travel_airports_icon{
		height: 100%;
		width: auto;
		position: absolute;
		top: 0;
		left: 50%;
		transform: translateX(-50%);
	}
	#h2_flight_travel_type_flight{
		position: absolute;
		top: 120px;
		margin: 0;
		left: 25px;
		font-size: 1em;
		font-weight: 500;
	}
	#flight_travel_flight_mode{
		position: absolute;
		top: 150px;
		margin: 0;
		left: 25px;
		font-size: 1em;
		font-weight: 500;
	}
	#text_solo_supervised_flight{
		position: absolute;
		bottom: 15px;
		margin: 0;
		left: 25px;
		font-size: 1em;
		font-weight: 700;
	}
	#div_flight_travel_steps{
		position: absolute;
		top: 100px;
		left: 50%;
		transform: translateX(-50%);
		width: 300px;
		height: 140px;
		overflow: scroll;
		-ms-overflow-style: none;  /* IE and Edge */
		scrollbar-width: none;  /* Firefox */
	}
	/* Hide scrollbar for Chrome, Safari and Opera */
	#div_flight_travel_steps::-webkit-scrollbar {
		display: none;
	}
	#h2_flight_travel_steps_title{
		margin-top: 0;
		margin-bottom: 5px;
		font-size: 1em;
		font-weight: 800;
		text-align: center;
	}
	.p_flight_travel_steps_text{
		font-size: 1em;
		font-weight: 600;
		margin: 5px;
		text-align: center;
	}

	#div_flight_pilots{
		position: relative;
		background-color: white;
		border-radius: 15px;
		grid-area: 2 / 1 / 3 / 6;
		min-height: 125px;
	}
	.div_flight_pilots_icon{
		position: absolute;
		top: 25px;
		height: 70px;
		width: 70px;
	}
	#div_flight_pilots_icon_left{
		left: 25px;
	}
	#div_flight_pilots_icon_right{
		right: 25px;
	}
	.img_flight_pilots_icon{
		height: 100%;
		width: auto;
		position: absolute;
		top: 5px;
		left: 50%;
		transform: translateX(-50%);
	}
	.h1_flight_pilots{
		position: absolute;
		top: 40px;
		margin: 0;
		font-size: 1.3em;
	}
	#h1_flight_pilots_left{
		left: 105px;
	}
	#h1_flight_pilots_right{
		right: 105px;
	}
	.h2_flight_pilots_status{
		position: absolute;
		top: 70px;
		margin: 0;
		font-size: 1.1em;
		font-weight: 500;
	}
	#h2_flight_pilots_status_left{
		left: 105px;
	}
	#h2_flight_pilots_status_right{
		right: 105px;
	}

	#div_flight_widgets{
		position: relative;
		display: grid;
		grid-row-gap: 30px;
		grid-column-gap: 30px;
		grid-area: 3 / 1 / 6 / 6;
	}

	#div_flight_widgets_info{
		position: relative;
		background-color: white;
		border-radius: 15px;
		min-width: 290px;
		grid-area: 1 / 1 / 2 / 2;
		display: grid;
		grid-template-columns: 1fr;
	}
	.little_div_flight_widget_info{
		position: relative;
		width: 100%;
		padding-top: 12px;
		height: 35px;
		padding-bottom: 12px;
	}
	.div_flight_infos_icon{
		position: absolute;
		left: 15px;
		height: 35px;
		width: 35px;
	}
	.img_flight_infos_icon{
		height: 100%;
		width: auto;
		position: absolute;
		top: 0;
		left: 50%;
		transform: translateX(-50%);
	}
	.p_flight_infos_text{
		font-size: 1em;
		font-weight: 800;
		position: relative;
		left: 60px;
		margin: 0;
		margin-top: 10px;
	}

	.div_create_new_flight_bloc_bloc{
		display: inline-block; 
		width: 180px;
	}
	#div_create_new_flight_end_bloc{
		padding-left: 30px;
	}

	.div_create_new_flight_flight_flight{
		display: inline-block; 
		width: 180px;
	}
	#div_create_new_flight_end_flight{
		padding-left: 30px;
	}


	#div_flight_widgets_map{
		min-height: 320px;
		position: relative;
		background-color: white;
		border-radius: 15px;
		grid-area: 1 / 2 / 2 / 6;
		z-index: 0;
	}

	#div_flight_widgets_notes{
		position: relative;
		background-color: white;
		border-radius: 15px;
		grid-area: 2 / 1 / 4 / 2;
		min-height: 200px;
		padding: 15px;
	}
	#h3_flight_widgets_notes_title{
		margin: 0;
	}
	#p_flight_widgets_notes_text{
		margin-top: 5px;
		margin-bottom: 10px;
		font-size: 0.9em;
	}

	#div_flight_widgets_plane{
		position: relative;
		background-color: white;
		border-radius: 15px;
		grid-area: 2 / 2 / 3 / 6;
		min-height: 80px;
		padding: 15px;
		cursor: pointer;
	}
	#h3_flight_widgets_plane_title{
		margin: 0;
	}
	.div_flight_plane_icon{
		position: absolute;
		left: 15px;
		height: 35px;
		width: 35px;
		top: 50px;
	}
	.img_flight_plane_icon{
		height: 100%;
		width: auto;
		position: absolute;
		top: 0;
		left: 50%;
		transform: translateX(-50%);
	}
	#p_flight_plane_text{
		font-size: 1em;
		font-weight: 800;
		position: absolute;
		left: 60px;
		margin: 0;
		top: 60px;
	}

	#div_flight_widgets_pictures{
		position: relative;
		background-color: white;
		border-radius: 15px;
		grid-area: 3 / 2 / 5 / 6;
		min-height: 200px;
		padding: 15px;
		cursor: pointer;
		overflow: hidden;
	}
	#h3_flight_widgets_pictures_title{
		margin: 0;
	}

	#div_flight_widgets_school{
		position: relative;
		background-color: white;
		border-radius: 15px;
		grid-area: 4 / 1 / 6 / 2;
		min-height: 100px;
		padding: 15px;
		cursor: pointer;
	}
	.div_flight_school_icon{
		position: absolute;
		left: 15px;
		height: 35px;
		width: 35px;
	}
	.img_flight_school_icon{
		height: 100%;
		width: auto;
		position: absolute;
		top: 0;
		left: 50%;
		transform: translateX(-50%);
	}
	.p_flight_school_text{
		font-size: 1em;
		font-weight: 800;
		position: absolute;
		left: 60px;
		margin: 0;
	}
	#div_flight_school_icon_evaluation{
		top: 15px;
	}
	#p_flight_school_text_evaluation{
		top: 25px;
	}
	#div_flight_school_icon_next_flight{
		top: 70px;
	}
	#p_flight_school_text_next_flight{
		top: 80px;
	}

	#div_flight_widgets_creator{
		position: relative;
		background-color: white;
		border-radius: 15px;
		grid-area: 5 / 2 / 6 / 6;
		min-height: 60px;
		padding: 15px;
		cursor: pointer;
	}
	#p_flight_widgets_creator_text{
		margin: 0;
	}
	#p_flight_widgets_notes_sign{
		margin: 0;
		margin-top: 10px;
		font-weight: 700;
		font-size: 0.7em;
		text-decoration: underline;
		cursor: pointer;
	}


	#select_flight_travel_type_flight_name{
		position: absolute;
		top: 120px;
		left: 25px;
		width: 100px;
	}
	#select_flight_travel_school_flight{
		position: absolute;
		top: 120px;
		left: 150px;
		width: 100px;
	}
	#input_p_flight_infos_text_start_date{
		position: absolute;
		top: 15px;
		left: 65px;
		width: 130px;
	}
	#input_p_flight_infos_text_end_date{
		position: absolute;
		top: 60px;
		left: 65px;
		width: 130px;
	}
	#input_p_flight_infos_text_time_takeoff{
		position: absolute;
		top: 15px;
		left: 65px;
		width: 130px;
	}
	#input_p_flight_infos_text_time_landing{
		position: absolute;
		top: 15px;
		left: 65px;
		width: 130px;
	}
	#input_p_flight_infos_text_time_engine_hours_before{
		position: absolute;
		top: 15px;
		left: 65px;
		width: 60px;
	}
	#input_p_flight_infos_text_time_engine_hours_after{
		position: absolute;
		top: 55px;
		left: 65px;
		width: 60px;
	}
	#input_p_flight_infos_text_time_engine_2_hours_before{
		position: absolute;
		top: 95px;
		left: 65px;
		width: 100px;
	}
	#input_p_flight_infos_text_time_engine_2_hours_after{
		position: absolute;
		top: 135px;
		left: 65px;
		width: 100px;
	}
	#input_p_flight_infos_text_time_brief{
		position: absolute;
		top: 15px;
		left: 120px;
		width: 50px;
	}
	#input_p_flight_infos_text_nb_landing_number{
		position: absolute;
		top: 15px;
		left: 65px;
		width: 100px;
	}
	#div_update_landing_fees{
		position: relative;
	}
	.div_update_landing_fees_step{
		position: relative;
		height: 30px;
	}
	.label_input_landing_fees{
		font-size: 1em;
		font-weight: 800;
		position: relative;
		left: 60px;
		margin: 0;
		margin-top: 5px;
		padding-top: 5px;
		margin-bottom: 5px;
	}
	.input_landing_fees{
		position: absolute;
		top: 0px;
		left: 150px;
		width: 60px;
	}
	#input_p_flight_infos_text_cost{
		position: absolute;
		top: 15px;
		left: 65px;
		width: 100px;
	}
	#input_p_flight_infos_text_fuel_before_value{
		position: absolute;
		top: 15px;
		left: 65px;
		width: 50px;
	}
	#input_p_flight_infos_text_fuel_after_value{
		position: absolute;
		top: 15px;
		left: 130px;
		width: 50px;
	}
	#flight_basic_details_cost_alert_message{
		position: absolute;
		display: block;
		left: 20px;
		margin-right: 10px;
		font-size: 0.7em;
		margin-top: 0;
	}

	#select_h1_flight_pilots_left{
		position: absolute;
		top: 40px;
		left: 100px;
		width: 30%;
	}
	#select_h1_flight_pilots_right{
		position: absolute;
		top: 40px;
		right: 100px;
		width: 30%;
	}
	#input_p_flight_widgets_notes_text{
		position: absolute;
		top: 45px;
		width: 250px;
	}
	#select_p_flight_plane_text{
		position: absolute;
		top: 60px;
		left: 65px;
		width: 200px;
	}
	#input_p_flight_school_text_next_flight{
		position: absolute;
		top: 70px;
		left: 65px;
		width: 200px;
	}


	#div_landing_fees_details{
		position: absolute;
		top: 50px;
		left: 15px;
		width: 200px;
		background-color: #191530;
		color: white;
		padding: 10px;
		padding-left: 15px;
		border-radius: 15px;
		transition: 0.3s;
		font-weight: 600;
	}
	#img_landing_fees_details_close_icon{
		position: absolute;
		top: 10px;
		right: 10px;
		height: 20px;
		width: auto;
		cursor: pointer;
		display: none;
	}

	#div_METAR_details{
		position: absolute;
		top: 50px;
		left: 15px;
		width: 250px;
		background-color: #191530;
		color: white;
		padding: 10px;
		padding-left: 15px;
		border-radius: 15px;
		transition: 0.3s;
		font-weight: 600;
	}
	#img_METAR_details_close_icon{
		position: absolute;
		top: 10px;
		right: 10px;
		height: 20px;
		width: auto;
		cursor: pointer;
		display: none;
	}

	#p_flight_state_text{
		margin-top: -23px;
		text-align: center;
		font-size: 0.9em;
		font-weight: 600;
		color: #191530
	}

	#p_flight_violation_text{
		margin-top: -53px;
		text-align: center;
		font-size: 0.9em;
		font-weight: 600;
		color: #191530
	}
/* --- /Flight Page --- */



/* --- Class Page --- */
	#div_little_container_class{
		width: 800px;
		margin: auto;
		grid-column-gap: 0px;
		grid-template-rows: none;
	}

	#div_class_pilots{
		position: relative;
		background-color: white;
		border-radius: 15px;
		grid-area: 2 / 1 / 3 / 6;
		min-height: 120px;
	}
	#h2_class_pro{
		position: absolute;
		top: 120px;
		margin: 0;
		left: 25px;
		font-size: 1em;
		font-weight: 500;
	}

	#div_class_widgets{
		position: relative;
		display: grid;
		grid-row-gap: 30px;
		grid-column-gap: 30px;
		grid-area: 3 / 1 / 6 / 6;
	}
	#div_class_widgets_info{
		position: relative;
		background-color: white;
		border-radius: 15px;
		min-width: 290px;
		grid-area: 1 / 1 / 2 / 2;
		display: grid;
		grid-template-columns: 1fr;
	}
	#div_class_widgets_notes{
		position: relative;
		background-color: white;
		border-radius: 15px;
		grid-area: 1 / 2 / 2 / 6;
		min-height: 200px;
		padding: 15px;
	}
	#div_class_widgets_pictures{
		position: relative;
		background-color: white;
		border-radius: 15px;
		grid-area: 2 / 2 / 4 / 6;
		min-height: 200px;
		padding: 15px;
		cursor: pointer;
		overflow: hidden;
	}
	#div_class_widgets_school{
		position: relative;
		background-color: white;
		border-radius: 15px;
		grid-area: 2 / 1 / 3 / 2;
		min-height: 100px;
		padding: 15px;
		cursor: pointer;
	}
	#div_class_widgets_creator{
		position: relative;
		background-color: white;
		border-radius: 15px;
		grid-area: 3 / 1 / 4 / 2;
		min-height: 60px;
		padding: 15px;
		cursor: pointer;
	}
/* --- /Class Page --- */



/* --- SGS Page --- */
#div_widget_sgs_violation_pilots{
	cursor: pointer;
	grid-area: 1 / 2 / 2 / 3;
}
#div_widget_sgs_nb_open_reports{
	cursor: pointer;
	grid-area: 1 / 1 / 2 / 2;
}
#div_widget_sgs_nb_violation_flights{
	cursor: pointer;
	grid-area: 1 / 3 / 2 / 4;
}
#div_container_security_messages_list{
	background-color: var(--menu-bar, white);
	color: var(--font-dark, black);
	border-radius: 15px;
	position: relative;
	padding-left: 25px;
	padding-right: 25px;
	padding-bottom: 1px;
	padding-top: 1px;
	height: auto;
	grid-area: 2 / 4 / 6 / 6;
	padding: 25px;
	overflow: auto;
}
#div_reports_container{
	grid-template-rows: 100px auto;
	grid-template-columns: 250px auto;
	grid-column-gap: 20px;
	grid-row-gap: 20px;
	display: grid;
}
#div_container_reports_list{
	background-color: var(--menu-bar, white);
	color: var(--font-dark, black);
	border-radius: 15px;
	position: relative;
	padding-left: 25px;
	padding-right: 25px;
	padding-bottom: 1px;
	padding-top: 1px;
	height: auto;
	grid-area: 2 / 1 / 6 / 6;
	padding: 25px;
	overflow: auto;
}

#button_add_new_report{
	position: absolute;
	top: 20px;
	right: 25px;
	width: 150px;
}

#div_list_reports{
	overflow-x: hidden;
	overflow-y: auto;
}
.report-item {
	display: flex;
	justify-content: space-between;
	padding: 12px;
	border-bottom: 1px solid #ccc;
	background-color: var(--bk-color, grey);
	border-radius: 15px;
	margin-bottom: 10px;
	border: none;
	font-weight: 600;
	border-right: 15px solid var(--bk-color, grey);
	cursor: pointer;
	position: relative;
	border-left-width: 15px;
	border-left-style: solid;
	transition: border-left-width 0.3s ease;
	font-size: 0.9em;
	gap: 5px;
	align-items: center;
}
.report-item:hover {
	border-left-width: 100px;
}
.report-item span {
	text-align: left;
}
.report-item span:nth-child(1) {
	width: 0px;
}
.report-item span:nth-child(2) {
	margin-left: 5px;
	width: 30px;
}
.report-item span:nth-child(3) {
	width: 120px;
}
.report-item span:nth-child(4) {
	width: auto;
	margin-right: auto;
}
.report-item span:nth-child(5) {
	max-width: 120px;
	margin-right: 20px;
}
.report-item span:nth-child(6) {
	max-width: 200px;
}
.div_report_item_status_name {
	position: absolute;
	top: 50%;
	transform: translateY(-50%);
	left: -90px;
	font-weight: 600;
	color: white;
}
.p_report_item_status_name_text{
	margin: 0;
	padding: 0;
	font-size: 0.9em;
	text-align: center;
}

#div_big_widget_report_details_container {
	background-color: var(--menu-bar, white);
	color: var(--font-dark, black);
	border-radius: 15px;
	position: relative;
	top: 0;
	left: 0;
	right: 0;
	bottom: 0;
	padding-left: 25px;
	padding-right: 25px;
	padding-bottom: 1px;
	padding-top: 1px;
	display: grid;
	grid-template-columns: repeat(2, 1fr);
	grid-column-gap: 20px;
	grid-row-gap: 20px;
	padding: 25px;
	overflow: auto;
}
	#div_big_widget_report_details_infos {
		grid-area: 1 / 1 / 2 / 3;
		display: grid;
		grid-column-gap: 20px;
		grid-row-gap: 30px;
		grid-template-rows: 50px 60px 130px auto;
		grid-template-columns: 150px 100px 100px 140px auto auto;
	}
		#div_big_widget_report_details_number_and_title{
			grid-area: 1 / 1 / 2 / 5;
			display: flex;
		}
		#h2_big_widget_report_details_title_text{
			margin-left: 5px;
		}
		#p_big_widget_report_details_status_title{
			font-weight: 800;
			font-size: 1em;
			margin: 0;
			text-align: left;
		}
		#div_big_widget_report_details_status{
			grid-area: 2 / 4 / 3 / 5;
		}
		#div_big_widget_report_details_status_container{
			background-color: rgb(244, 244, 249);
			border-radius: 50px;
			height: 30px;
			width: auto;
			position: relative;
			margin-top: 10px;
		}
		#div_big_widget_report_details_status_indicator {
			border-radius: 50%;
			background-color: #f4f4f9;
			display: grid;
			margin: 0;
			margin-top: 6px;
			margin-left: 6px;
			height: 17px;
			width: 17px;
			position: absolute;
		}
		#p_big_widget_report_details_status_text{
			text-align: left;
			letter-spacing: 1px;
			font-weight: 600;
			margin: 0;
			margin-left: 25px;
			width: 150px;
		}
		
		#div_big_widget_report_details_status_button_container{
			grid-area: 1/6/2/7;
			margin-right: 140px;
			display: block;
		}
		#div_big_widget_report_details_status_button{
			height: 30px;
			border-radius: 10px;
			cursor: pointer;
			background-color: rgb(0, 85, 249);
			color: white;
			font-weight: 600;
			text-align: center;
			letter-spacing: 0.2px;
			grid-area: 2/ 2 / 3 / 3;
			line-height: 28px;
			max-width: 150px;
			margin-left: auto;
			padding-left: 10px;
			padding-right: 10px;
		}
		#div_big_widget_report_details_status_button:hover{
			background-color: rgb(0, 64, 249);
		}
		#div_big_widget_report_details_type {
			grid-area: 2 / 1 / 3 / 2;
		}
		#p_big_widget_report_details_type_title{
			font-weight: 800;
			font-size: 1em;
			margin: 0;
			text-align: left;
		}
		#p_big_widget_report_details_type_text{
			font-weight: 600;
			font-size: 1.5em;
			margin: 0;
			padding: 10px;
			text-align: left;
		}
		#div_big_widget_report_details_plane_infos {
			grid-area: 3 / 1 / 4 / 3;
			display: grid;
			grid-template-columns: 70px 1fr;
			grid-column-gap: 20px;
			position: relative;
			padding-top: 35px;
		}
			#div_big_widget_report_details_plane_title{
				position: absolute;
			}
			#div_big_widget_report_details_plane_no_plane{
				display: grid;
				grid-template-rows: 40px 30px;
				grid-template-columns: 120px 100px auto;
				grid-column-gap: 20px;
				height: 100%;
				position: absolute;
				top: 25px;
				left: 0;
			}
			#p_big_widget_report_details_plane_no_plane_text{
				font-weight: 500;
				font-size: 1em;
				margin: 0;
				padding: 10px;
				padding-left: 0;
				text-align: left;
				grid-area: 1/1/2/3;
			}
			#select_big_widget_report_details_plane_no_plane_select{
				width: 120px;
				height: 30px;
				border-radius: 10px;
				border: 1px solid #ccc;
				font-weight: 600;
				grid-area: 2/1/3/2;
			}
			#div_big_widget_report_details_plane_no_plane_select_button{
				height: 30px;
				border-radius: 10px;
				cursor: pointer;
				background-color: rgb(0, 85, 249);
				color: white;
				font-weight: 600;
				text-align: center;
				letter-spacing: 0.2px;
				grid-area: 2/ 2 / 3 / 3;
				line-height: 15px;
			}
			#div_big_widget_report_details_plane_no_plane_select_button:hover{
				background-color: rgb(0, 64, 249);
			}
			#div_big_widget_report_details_plane_picture{
				height: 70px;
				width: 70px;
				background-color: #191530;
				display: flex;
				justify-content: center;
				align-items: center;
				position: relative;
				border-radius: 50%;
			}
			#img_big_widget_report_details_plane_picture {
				width: 100%;
				height: 100%;
				object-fit: cover;
				border-radius: 50%;
			}
			#p_big_widget_report_details_plane_registration{
				font-weight: 800;
				font-size: 2em;
				margin-top: 0;
				margin-bottom: 0;
			}
			#p_big_widget_report_details_plane_model{
				font-weight: 600;
				font-size: 1.2em;
				margin-top: 0px;
			}
		#div_big_widget_report_details_manager_and_creator {
			grid-area: 2 / 5 / 4 / 7;
			position: relative;
		}	
			#div_big_widget_report_details_manager_title{
				width: 320px; 
				margin-left: auto;
			}
			#div_big_widget_report_details_manager_no_manager{
				display: grid;
				grid-template-rows: 40px 30px;
				grid-template-columns: auto 200px 100px;
				grid-column-gap: 20px;
				height: 100%;
				position: absolute;
				top: 0;
				right: 0;
				margin-top: 25px;
			}
			#p_big_widget_report_details_manager_no_manager_text{
				font-weight: 500;
				font-size: 1em;
				margin: 0;
				padding: 10px;
				padding-left: 0;
				text-align: left;
				grid-area: 1/2/2/4;
			}
			#select_big_widget_report_details_manager_no_manager_select{
				width: 200px;
				height: 30px;
				border-radius: 10px;
				border: 1px solid #ccc;
				font-weight: 600;
				grid-area: 2/2/3/3;
			}
			#div_big_widget_report_details_manager_no_manager_select_button{
				height: 30px;
				border-radius: 10px;
				cursor: pointer;
				background-color: rgb(0, 85, 249);
				color: white;
				font-weight: 600;
				text-align: center;
				letter-spacing: 0.2px;
				grid-area: 2/ 3 / 3 / 4;
				line-height: 15px;
			}
			#div_big_widget_report_details_manager_no_manager_select_button:hover{
				background-color: rgb(0, 64, 249);
			}
			#div_big_widget_report_details_manager{
				display: grid;
				grid-template-columns: 70px 230px;
				grid-template-rows: 1fr;
				grid-column-gap: 20px;
				position: absolute;
				top: 30px;
				right: 0;
			}
				#div_big_widget_report_details_manager_picture{
					height: 70px;
					width: 70px;
					background-color: #191530;
					display: flex;
					justify-content: center;
					align-items: center;
					position: relative;
					border-radius: 50%;
				}
				#img_big_widget_report_details_manager_picture {
					width: 100%;
					height: 100%;
					object-fit: cover;
					border-radius: 50%;
				}
				#p_big_widget_report_details_manager_text{
					font-weight: 600;
					font-size: 1.2em;
					margin: 0;
					padding: 10px;
					text-align: left;
					line-height: 45px;
				}
			#div_big_widget_report_details_creator_container{
				margin-top: 120px;
				position: absolute;
				top: 0;
				right: 0;
			}
				#div_big_widget_report_details_creator_title{
					width: 320px; 
					margin-left: auto;
				}
				#div_big_widget_report_details_creator{
					display: grid;
					grid-template-columns: 70px 230px;
					grid-template-rows: 1fr;
					grid-column-gap: 20px;
					position: absolute;
					top: 30px;
					right: 0;
				}
				#div_big_widget_report_details_creator_picture{
					height: 70px;
					width: 70px;
					background-color: #191530;
					display: flex;
					justify-content: center;
					align-items: center;
					position: relative;
					border-radius: 50%;
				}
				#img_big_widget_report_details_creator_picture {
					width: 100%;
					height: 100%;
					object-fit: cover;
					border-radius: 50%;
				}
				#p_big_widget_report_details_creator_text{
					font-weight: 600;
					font-size: 1.2em;
					margin: 0;
					padding: 10px;
					text-align: left;
					line-height: 45px;
				}

			#div_big_widget_report_details_severity{
				grid-area: 2 / 2 / 3 / 3;
			}
			#p_big_widget_report_details_severity_title{
				font-weight: 800;
				font-size: 1em;
				margin: 0;
				text-align: left;
			}
			#p_big_widget_report_details_severity_text{
				text-align: left;
				font-weight: 800;
				font-size: 1.5em;
				margin-top: 5px;
				line-height: 20px;
				padding: 10px;
			}
			#select_big_widget_report_details_severity_select{
				margin-top: 17px;
			}
			#div_big_widget_report_details_frequency{
				grid-area: 2 / 3 / 3 / 4;
			}
			#p_big_widget_report_details_frequency_title{
				font-weight: 800;
				font-size: 1em;
				margin: 0;
				text-align: left;
			}
			#p_big_widget_report_details_frequency_text{
				text-align: left;
				font-weight: 800;
				font-size: 1.5em;
				margin-top: 5px;
				line-height: 20px;
				padding: 10px;
			}
			#select_big_widget_report_details_frequency_select{
				margin-top: 17px;
			}
			#select_big_widget_report_details_frequency_select{
				margin-top: 17px;
			}
		#div_big_widget_report_details_notes {
			grid-area: 4 / 1 / 5 / 4;
			background-color: #f4f4f9;
			border-radius: 15px;
			padding: 15px;
			overflow-y: auto;
		}
		#h3_div_big_widget_report_details_notes_title{
			margin: 0;
		}
		#p_big_widget_report_details_notes_text{
			margin-top: 5px;
			font-size: 0.9em;
		}

		#div_big_widget_report_details_actions {
			grid-area: 4 / 4 / 5 / 7;
			position: relative;
			border-radius: 15px;
			padding: 15px;
			overflow-y: auto;
		}
		#div_big_widget_report_details_actions_indicator_bar_container{
			position: absolute;
			top: 15px;
			left: 110px;
			height: 20px;
			width: 100px;
			background-color: #dfdfe6;
			border-radius: 15px;
		}
		#div_big_widget_report_details_actions_indicator_bar{
			height: 100%;
			border-radius: 15px;
			width: 0%;
			transition: width 0.3s ease;
		}
		#p_big_widget_report_details_actions_indicator_bar_text{
			position: absolute;
			top: 1px;
			left: 110px;
			margin: 0;
			width: 50px;
			font-weight: 700;
		}
		#div_big_widget_report_details_actions_list{
			overflow: auto;
			max-height: 350px;
			margin-top: 15px;
		}

		#div_big_widget_report_details_actions_add_button{
			position: absolute;
			right: 10px;
			margin-top: 0;
			top: 10px;
			height: 30px;
			width: 30px;
			cursor: pointer;
		}
		#div_big_widget_report_details_actions_save_button{
			position: absolute;
			right: 40px;
			margin-top: 0;
			top: 10px;
			height: 30px;
			width: 30px;
			cursor: pointer;
		}

		.button_new_action_delete{
			margin-top: 0;
			height: 30px;
			width: 30px;
			cursor: pointer;
		}
		.new_report_action_item{
			position: relative;
			display: flex;
			justify-content: space-between;
			padding: 12px;
			border-bottom: 1px solid #ccc;
			background-color: var(--bk-color, grey);
			border-radius: 15px;
			margin-bottom: 10px;
			border: none;
			font-weight: 600;
			cursor: pointer;
		}
		.input_new_action_content{
			width: calc(100% - 40px);
			margin: 0;
		}

		.report-action-item {
			display: flex;
			justify-content: space-between;
			padding: 12px;
			border-bottom: 1px solid #ccc;
			background-color: var(--bk-color, grey);
			border-radius: 15px;
			margin-bottom: 10px;
			border: none;
			font-weight: 600;
			border-right: 15px solid var(--bk-color, grey);
			cursor: pointer;
			border-left-width: 15px;
			border-left-style: solid;
			transition: border-left-width 0.3s ease;
			font-size: 0.9em;
		}
		.report-action-item span {
			text-align: left;
		}
		.report-action-item span:nth-child(1) {
			width: calc(100% - 180px - 50px - 20px);
			margin-right: auto;
			line-height: 30px;
		}
		.report-action-item span:nth-child(2) {
			width: 180px;
			margin-right: 10px;
			margin-left: 10px;
			text-align: right;
			display: flex;
		}
		.report-action-item span:nth-child(3) {
			width: 50px;
		}
		.div_action_creator_picture{
			height: 30px;
			width: 30px;
			background-color: #191530;
			display: flex;
			justify-content: center;
			align-items: center;
			position: relative;
			border-radius: 50%;
			margin-right: 10px;
		}
		.img_action_creator_picture{
			object-fit: cover;
			border-radius: 50%;
			width: 100%;
			height: 100%;	
		}
		.div_action_creator_name{
			text-align: left;
			line-height: 30px;
		}

		.div_action_button_icon{
			height: 30px;
			width: 30px;
			display: flex;
			justify-content: center;
			align-items: center;
			position: relative;
			border-radius: 50%;
			margin-right: 10px;
		}

		.img_action_button_icon{
			object-fit: cover;
			border-radius: 50%;
			width: 100%;
			height: 100%;	
		}

		

	#div_big_widget_report_details_pictures {
		grid-area: 2 / 1 / 3 / 2;
		background-color: #f4f4f9;
		border-radius: 15px;
		padding: 15px;
		overflow-y: auto;
		position: relative;
		min-height: 200px;
	}
	#div_big_widget_report_details_comments {
		grid-area: 2 / 2 / 3 / 3;
	}
	#div_big_widget_report_details_comments_list{
		overflow: auto;
		max-height: 350px;
	}

	.report-comment-item {
		display: flex;
		justify-content: space-between;
		padding: 12px;
		border-bottom: 1px solid #ccc;
		background-color: var(--bk-color, grey);
		border-radius: 15px;
		margin-bottom: 10px;
		border: none;
		font-weight: 600;
		cursor: pointer;
	}
	.report-comment-item span {
		text-align: left;
	}
	.report-comment-item span:nth-child(1) {
		width: calc(100% - 150px - 160px - 20px);
		margin-right: auto;
	}
	.report-comment-item span:nth-child(2) {
		width: 150px;
		margin-right: 10px;
		margin-left: 10px;
		text-align: right;
	}
	.report-comment-item span:nth-child(3) {
		width: 160px;
	}
/* --- /SGS Page --- */


/* --- Pilot Page --- */
	#div_pilot_informations{grid-area: 2 / 2 / 3 / 3; min-height: 50px;}
	#div_widget_solde_pilote_2{grid-area: 1 / 1 / 2 / 2; max-width: 250px;}
	#div_widget_solde_pilot_time_flights{max-width: 250px;}
	#div_widget_solde_pilot_time_briefings{max-width: 250px;}
	#div_widget_solde_pilot_time_class{max-width: 250px;}
	#div_widget_solde_pilot_time_nb_landing{max-width: 250px;}
	#div_widget_link_user{grid-area: 2 / 5 / 3 / 6;}

	.div_container_flights_list{grid-area: 3 / 1 / 6 / 4; overflow: hidden; min-width: 600px;}
	.div_container_transactions_list{grid-area: 2 / 1 / 6 / 4; overflow: hidden; min-width: 400px;min-height: 300px;}
	.div_container_slots_list{
		min-width: 0; 
		overflow: auto; 
		min-height: 180px;
		max-width: 600px;
	}

	.div_widget_big_progression_pilot{
		height: 10px;
		width: 70%;
		background-color: var(--font-light, white);
		z-index: 1;
		margin-left: 15px;
		margin-bottom: 20px;
		position: relative;
		border-radius: 15px;
		overflow: hidden;
	}
	.div_widget_progression_pilot{
		height: 100%;
		background-color: #2ecc71;
		position: absolute;
		top: 0;
		left: 0;
	}
	.p_widget_progression_pilot{
		position: relative;
		font-size: 1.2em;
		color: black;
		font-weight: 600;
		margin-left: 15px;
		margin-bottom: 7px;
		margin-top: 10px;
	}

	#div_pilot_training_widgets_container{
		position: relative;
		display: flex;
		column-gap: 20px;
		max-height: 200px;
		min-height: 100px;
		overflow: auto;
		grid-area: 1 / 1 / 2 / 4;
	}
	
	#div_pilot_training{
		grid-template-rows: auto;
		grid-column-gap: 30px;
		grid-row-gap: 30px;
	}

	.img_add_training_button{
		top: 50%;
		left: 50%;
		transform: translate(-50%, -50%);
		width: auto;
		object-fit: cover;
		position: absolute;
		height: 60%;
	}

	#div_pilot_training_widgets_status_selector{
		position: absolute;
		top: 55px;
		left: 15px;
		background-color: #191530;
		border-radius: 30px;
		height: 30px;
		display: grid;
		grid-template-columns: 1fr 1fr 1fr 1fr;
		grid-column-gap: 5px;
		padding: 7px;
	}

	.div_pilot_training_status_selector{
		position: relative;
		border-radius: 50%;
		transition: 0.3s;
		height: 30px;
		width: 30px;
	}
	
	.div_pilot_training_status_selector:hover {
		background-color: #2ecc71;
	}
	
	.div_pilot_training_status_selector.active {
		background-color: #2ecc71;
	}

	.img_pilot_training_status_selector{
		height: 20px;
		width: auto;
		margin-top: 5px;
		margin-bottom: 5px;
		position: absolute;
		left: 50%;
		transform: translateX(-50%);
		cursor: pointer;
	}

	#div_pilot_training_widget_details{
		grid-area: 2 / 1 / 6 / 4; 
		margin: 0; 
		margin-top: 10px; 
		max-width: none;
		background-color: white;
		border-radius: 15px;
		position: relative;
		padding: 20px;
		overflow-y: auto;
	}

	#pilot_training_widget_details_title{
		font-size: 1.2em;
		font-weight: 700;
		margin: 0;
		position: absolute;
		top: 15px;
		left: 15px;
	}


	.div_step_state{
        height: 100%;
        transition: 0.4s;
        position: absolute;
        top: 0;
        line-height: 40px;
        text-align: center;
		font-weight: 700;
    }
    #div_step_state_left{
        left: 0;
        cursor: pointer;
    }
    #div_step_state_right{
        right: 0;
        cursor: pointer;
    }

	#div_pilot_training_widget_classes{
		grid-area: 2 / 4 / 3 / 6; 
		margin: 0; 
		margin-top: 10px; 
		max-width: none;
		border-radius: 15px;
		position: relative;
		padding-left: 20px;
		padding-right: 20px;
		overflow-y: auto;
	}
	#div_classes_list{
		max-height: calc(100% - 89px);
		overflow-y: scroll;
	}

	#button_add_transaction{
		position: absolute;
		top: 20px;
		right: 10px;
		height: 25px;
		width: 120px;
		background-color: var(--font-dark, black);
		color: var(--font-light, white);
		border-radius: 15px;
		font-weight: 600;
		text-align: center;
		padding-top: 7px;
		cursor: pointer;
		transition: 0.2s;
		margin-bottom: 0;
	}
	#button_add_transaction:hover{
		background-color: #2ecc71;
	}
	#div_big_widget_create_transaction{
		margin: 30px;
	}
	#div_big_widget_update_transaction{
		margin: 30px;
	}

	#button_goto_training_reporting{
		position: absolute;
		top: 15px;
		right: 15px;
		width: 110px; 
		margin: 0;
		transform: translateX(0%);
	}
	#div_big_widget_create_new_slot{
		margin: 30px;
	}
	#div_big_widget_signature_vol{
		height: 300px;
    	width: 350px;
	}

	#div_big_widget_training_program{
		margin: 30px;
	}

	#h2_slot_details_title{
		font-size: 1em;
		margin-right: 20px;
	}
	#div_big_widget_slot_details{
		margin: 30px;
	}
	#div_big_widget_link_training_program{
		margin: 30px;
	}
	#div_big_widget_new_post{
		margin: 30px;
	}
	#div_big_widget_followers_list{
		margin: 30px;
		min-height: 100px;
	}
	#div_big_widget_following_list{
		margin: 30px;
		min-height: 100px;
	}
	#div_big_widget_common_followers_list{
		margin: 30px;
		min-height: 100px;
	}
	#div_big_widget_post_likes_list{
		margin: 30px;
		min-height: 100px;
	}
	#div_big_widget_post_actions{
		margin: 30px;
		min-height: 100px;
		min-width: 150px;
	}
	#div_big_widget_page_actions{
		margin: 30px;
		min-height: 100px;
		min-width: 150px;
	}

	#div_big_widget_new_report{
		margin: 30px;
	}
	#div_widget_training{
		transition: 0.2s;
	}
	#h1_title_big_widget_training_program{
		font-size: 1.5em;
		font-weight: 700;
		margin: 0;
		position: absolute;
		top: 0;
		left: 0;
	}
	#div_big_widget_pilot_statistics_flex{
		grid-template-columns: repeat(4, 1fr); 
		grid-column-gap: 20px;
		grid-row-gap: 20px; 
		display: grid;
		width: 100%;
		margin-left: auto;
		margin-right: auto;
		margin-bottom: 25px;
		margin-top: 15px;
	}
	#div_pilot_flights_statistics_table{
		position: relative;
		grid-area: 2 / 1 / 3 / 3;
		background-color: white;
		border-radius: 15px;
	}
	#table_widget_pilot_statistics{
		height: 90%;
		max-width: 80%;
		margin-left: auto;
		margin-right: auto;
		margin-top: 25px;
		margin-bottom: 25px;
		font-size: 0.9em;
	}
	#div_pilot_flights_statistics_nb_hours_by_plane_table{
		position: relative;
		grid-area: 2 / 3 / 3 / 5;
		background-color: white;
		border-radius: 15px;
	}
	#table_widget_pilot_nb_hours_by_plane {
		max-width: 80%;
		margin-left: auto;
		margin-right: auto;
		margin-top: 25px;
		margin-bottom: 25px;
		font-size: 0.9em;
	}
	#div_pilot_flights_statistics_graph_container{
		grid-area: 1 / 1 / 2 / 5;
		position: relative;
		background-color: white;
		border-radius: 15px;
		height: auto;
		padding: 20px;
		display: flex;
		font-weight: 500;
		gap: 10px;
		width: calc(100% - 40px);
		overflow-y: scroll;
	}
	#div_pilot_flights_statistics_graph{
		width: 100%;
		white-space: nowrap;
		display: flex;
		align-items: flex-end;
		height: 100%;
		min-width: 760px;
	}
	.div_pilot_flights_statistics_graph_month{
		position: relative;
		height: 400px;
		width: 100%;
		margin-left: 10px;
		margin-right: 10px;
		display: inline-block;
	}
	.div_pilot_flights_statistics_graph_month_bar{
		position: absolute;
		margin-bottom: 20px;
		bottom: 0;
		height: 0%;
		width: 100%;
		transition: 0.5s;
		background-color: #2ecc71;
		border-bottom: 3px solid #191530;
	}
	.div_pilot_flights_statistics_graph_month_title{
		position: absolute;
		bottom: 0;
		margin: 0;
		font-size: 0.7em;
		font-weight: 600;
		text-align: center;
		left: 50%;
		transform: translateX(-50%);
	}
	#div_big_widget_create_license{
		margin: 30px;
	}
	#div_big_widget_create_qualification{
		margin: 30px;
	}
	#div_big_widget_update_license{
		margin: 30px;
	}
	#div_big_widget_update_qualification{
		margin: 30px;
	}
	#div_big_widget_update_contribution{
		margin: 30px;
	}
	#div_big_widget_new_payment{
		margin: 30px;
		max-width: 400px;
	}
	#div_big_widget_new_payment_status{
		margin: 30px;
	}
	#div_big_widget_new_plane{
		margin: 30px;
	}

	#div_display_new_payment_button{
		height: 30px;
		border-radius: 10px;
		cursor: pointer;
		background-color: rgb(0, 85, 249);
		color: white;
		font-weight: 600;
		text-align: center;
		letter-spacing: 0.2px;
		white-space: nowrap;
		padding-left: 10px;
		padding-right: 10px;
		margin-top: 15px;
		width: 100px;
		margin-left: auto;
		margin-right: auto;
	}
	#div_display_new_payment_button:hover{
		background-color: rgb(0, 64, 249);
	}

	#div_big_widget_new_payment_amount{
		position: relative;
		display: grid;
		grid-template-columns: auto 120px;
		grid-template-rows: 30px;
		grid-column-gap: 10px;
	}

	#div_new_payment_button{
		height: 30px;
		border-radius: 10px;
		cursor: pointer;
		background-color: rgb(0, 85, 249);
		color: white;
		font-weight: 600;
		text-align: center;
		letter-spacing: 0.2px;
		white-space: nowrap;
		padding-left: 10px;
		padding-right: 10px;
		margin-top: 0;
	}
	#div_new_payment_button:hover{
		background-color: rgb(0, 64, 249);
	}
	
	#div_big_widget_new_payment_status_button{
		height: 30px;
		border-radius: 10px;
		cursor: pointer;
		background-color: rgb(0, 85, 249);
		color: white;
		font-weight: 600;
		text-align: center;
		letter-spacing: 0.2px;
		white-space: nowrap;
		padding-left: 10px;
		padding-right: 10px;
		margin-top: 0;
		width: 120px;
		margin-left: auto;
		margin-right: auto;
	}
	#div_big_widget_new_payment_status_button:hover{
		background-color: rgb(0, 64, 249);
	}
	#text_new_payment_status{
		line-height: 100px;
		text-align: center;
		font-size: 1em;
		font-weight: 600;
	}

	#input_new_payment_amount{
		height: 35px;
		border-radius: 10px;
		padding-left: 15px;
		border: none;
	}

	#div_big_widget_new_payment_amount_text{
		display: block;
		background-color: rgb(0, 85, 249);
		color: white;
		padding: 1px;
		margin-top: 30px;
		border-radius: 10px;
	}

	#text_new_payment_amount{
		font-weight: 700;
		text-align: center;
		font-size: 0.9em;
	}

	/* Couleur principale du bouton */
	.PaylineWidget .pl-btn, .PaylineWidget .pl-collect-btn, .PaylineWidget .pl-pay-btn {
		background-color: rgb(0, 85, 249) !important;
		border-color: rgb(0, 85, 249) !important;
		font-family: 'Montserrat', sans-serif !important;
		font-weight: 600 !important;
	}

	/* Si tu veux aussi le hover */
	.PaylineWidget .pl-btn:hover, .PaylineWidget .pl-collect-btn:hover, .PaylineWidget .pl-pay-btn:hover {
		background-color: rgba(0, 85, 249, 0.9) !important;
	}

	#PaylineWidget .pl-card-logos-container {
		display: none !important;
	}

	.PaylineWidget.pl-container-default .pl-pmContainer {
		border: none !important;
		background-color: white !important;
	}
	.PaylineWidget.pl-container-default .pl-pmContainer:hover {
		background-color: white !important;
	}
	.PaylineWidget label {
		margin-top: 0 !important;
		font-family: 'Montserrat', sans-serif !important;
	}

	.PaylineWidget .pl-wallet-layout .pl-wallets .pl-pay-btn-container .pl-pay-btn {
		font-size: 0.9em !important;
		margin-top: 10px !important;
	}

	.PaylineWidget input[type=checkbox], .PaylineWidget input[type=radio] {
		display: inline-block !important;
		width: 20px !important;
	}

	.PaylineWidget .pl-form-container .pl-input {
		border: 1px solid #dcdcdc !important;
	}



/* --- /Pilot Page --- */

/* --- Pilot params Page --- */
	#div_user_settings_container{
		position: relative;
		display: grid;
		grid-template-columns: 1fr;
		grid-template-rows: auto auto;
		grid-column-gap: 30px;
		background-color: white;
		border-radius: 15px;
		padding: 20px;
		margin-bottom: 20px;
		grid-row-gap: 30px;
	}
	#div_user_settings_profils_container{
		position: relative;
		display: grid;
		grid-template-columns: 1fr;
		grid-template-rows: auto auto;
		grid-column-gap: 30px;
		background-color: white;
		border-radius: 15px;
		padding: 20px;
		margin-bottom: 20px;
		grid-row-gap: 20px;
	}
	#div_user_settings_planes_container{
		position: relative;
		display: grid;
		grid-template-columns: 1fr;
		grid-template-rows: auto auto;
		grid-column-gap: 30px;
		background-color: white;
		border-radius: 15px;
		padding: 20px;
		margin-bottom: 10px;
		grid-row-gap: 20px;
	}
	#div_user_settings_footer{
		position: relative;
		display: grid;
		grid-template-columns: 1fr;
		grid-template-rows: auto auto;
		grid-column-gap: 30px;
		background-color: white;
		border-radius: 15px;
		padding: 20px;
		margin-bottom: 10px;
		grid-row-gap: 20px;
	}
	#div_update_user_infos{
		position: relative;
		display: block;
		max-width: 300px;
	}
	.input_text_user_setting{
		font-size: 0.9em;
	}
	#div_user_update_validation_button{
		margin-left: auto;
		width: 120px;
		height: 30px;
		border-radius: 10px;
		cursor: pointer;
		background-color: #0055f9;
		color: white;
		font-weight: 600;
		text-align: center;
		letter-spacing: 0.2px;
		user-select: none;
		-webkit-user-select: none;
	}
	#div_user_update_validation_button:hover{
		background-color: rgb(0, 64, 249);
	}

	.input_text_user_update{
		border-radius: 10px;
		border: 1px solid rgba(100,100,100, 0.2);
		padding: 10px;
		font-size: 0.8em;
		font-weight: 400;
		height: 35px;
		resize: none;
		outline: none;
		box-shadow: none;
		cursor: text;
	}
	.div_user_settings_header{
		position: relative;
		display: grid;
		grid-template-columns: auto 120px;
		grid-template-rows: 1fr;
		grid-column-gap: 10px;
	}
	#text_user_settings_title{
		font-size: 1.2em;
		font-weight: 700;
		margin: 0;
		line-height: 35px;
	}

	#div_user_settings_profils_list{
		position: relative;
		display: grid;
		grid-template-columns: 1fr;
		grid-row-gap: 15px;
		padding-left: 20px;
		padding-right: 20px;
		max-height: 600px;              /* Hauteur max */
		overflow-y: auto;               /* Scroll au-delà */
	}
	.div_user_settings_profil_item{
		position: relative;
		display: grid;
		grid-template-columns: 150px auto;
		grid-column-gap: 10px;
		cursor: pointer;
		border-radius: 15px;
		padding: 15px;
		background-color: #f4f4f9;
	}
	.text_user_profil_school_name{
		position: relative;
		font-size: 0.9em;
		font-weight: 600;
		margin-top: 0;
		margin-bottom: 0;
		cursor: pointer;
	}
	.text_user_profil_status_name{
		position: relative;
		font-size: 0.9em;
		font-weight: 600;
		margin-top: 0;
		margin-bottom: 0;
		cursor: pointer;
	}
	#div_user_settings_display_plane_button{
		margin-left: auto;
		width: 120px;
		height: 30px;
		border-radius: 10px;
		cursor: pointer;
		background-color: #0055f9;
		color: white;
		font-weight: 600;
		text-align: center;
		letter-spacing: 0.2px;
		user-select: none;
		-webkit-user-select: none;
	}
	#div_user_settings_display_plane_button:hover{
		background-color: rgb(0, 64, 249);
	}
	#div_user_settings_add_plane_button{
		margin-left: auto;
		margin-right: auto;
		margin-top: 20px;
		width: 120px;
		height: 30px;
		border-radius: 10px;
		cursor: pointer;
		background-color: #0055f9;
		color: white;
		font-weight: 600;
		text-align: center;
		letter-spacing: 0.2px;
		user-select: none;
		-webkit-user-select: none;
	}
	#div_user_settings_add_plane_button:hover{
		background-color: rgb(0, 64, 249);
	}
	
	#div_user_settings_planes_list{
		position: relative;
		display: grid;
		overflow: auto;
		grid-template-columns: repeat(2, 300px);
		grid-template-rows: auto;
		grid-column-gap: 20px;
		grid-row-gap: 20px;  
		margin-top: 20px;    
	}
	.flotte {
		color: var(--font-dark, black);
		position: relative;
		min-height: 200px;
	}
	.div_flotte_container_img {
		background-color: var(--widget-color, black);
		-webkit-box-shadow: 0.2px 0px 13px 0px rgba(80,80,80,0.35); 
		box-shadow: 0.2px 0px 13px 0px rgba(80,80,80,0.35);
		border-radius: 15px;
		justify-content: center;
		align-items: center;
		cursor: pointer;
		position: absolute;
		height: 80%;
		width: 100%;
		overflow: hidden;
	}
	.img_flotte{
		top: 50%;
		left: 50%;
		transform: translate(-50%, -50%);
		width: auto;
		object-fit: cover;
		position: absolute;
	}
	.plane_name{
		position: absolute;
		top: 83%;
		height: 12%;
		width: 100%;
		text-align: center;
		white-space: nowrap;
		overflow: hidden;
		text-overflow: ellipsis;
		font-weight: 500;
	}

	#div_plane_resum{
		position: relative;
		overflow: auto;
		display: grid;
		grid-template-columns: repeat(5, 1fr);
		grid-template-rows: repeat(5, auto);
		grid-column-gap: 20px;
		grid-row-gap: 20px;
	}

	#div_plane_statistics{
		position: relative;
		overflow: auto;
		display: grid;
		grid-template-columns: repeat(5, 1fr);
		grid-template-rows: repeat(5, auto);
		grid-column-gap: 20px;
		grid-row-gap: 20px;
	}

	#div_plane_management{
		position: relative;
		overflow: auto;
		display: grid;
		grid-template-columns: repeat(5, 1fr);
		grid-template-rows: repeat(5, auto);
		grid-column-gap: 20px;
		grid-row-gap: 20px;
	}

	#div_modify_pilot_picture {
		width: 100%;
		height: 100%;
		position: absolute;
		top: 0;
		left: 0;
		border-radius: 50%;
		background-color: rgba(0, 0, 0, 0.0);
		transition: 0.5s;
		cursor: pointer;
	}

	#div_modify_pilot_picture:hover {
		background-color: rgba(0, 0, 0, 0.5);
	}

	#button_modify_pilot_picture {
		position: absolute;
		top: 95%;
		left: 50%;
		transform: translateX(-50%);
		cursor: pointer;
		font-size: 1em;
		font-weight: 400;
	}
	#button_delete_pilot_picture{
		position: absolute;
		top: 112%;
		left: 50%;
		transform: translateX(-50%);
		cursor: pointer;
		font-size: 0.8em;
		font-weight: 400;
	}
/* --- /Pilot params Page --- */
	
/* --- Widget hide background Element --- */
	#div_big_widget_container{
		position: absolute;
		height: 100vh;
		width: 100vw;
		top: 0;
		left: 0;
		right: 0;
		bottom: 0;
		display: block; 
		z-index: 105;
	}
	.div_big_widget_hidden{
		position: absolute;
		top: 0;
		left: 0;
		right: 0;
		height: 100%;
		width: 100%;
		backdrop-filter: blur(5px);
		background-color: rgba(0, 0, 0, 0.3);
	}
	.div_big_widget{
		position: relative;
		background-color: var(--font-light, white);
		border-radius: 15px;
		overflow: auto;
		margin: auto;
		height: auto;
		width: auto;
		max-height: calc(100vh - 40px);
		max-width: calc(100vw - 40px);
		min-width: 300px;
		transition: 0.3s;
	}
	.div_big_widget_fullscreen_mobile{
		height: auto;
		width: auto;
		max-height: calc(100vh - 40px);
		max-width: calc(100vw - 40px);
		border-radius: 15px;
	}
	.div_big_widget_fullscreen_allways{
		height: 100vh;
		width: 100vw;
		max-width: none;
		max-height: none;
		border-radius: 0;
	}
	.close_big_widget{
		position: absolute;
		top: 10px;
		right: 10px;
		height: 40px;
		width: 40px;
		cursor: pointer;
		z-index: 100;
	}
/* --- /Widget hide background Element --- */

/* --- Loading Page background Element --- */
	#div_loading_container{
		position: absolute;
		height: 100vh;
		width: 100vw;
		top: 0;
		left: 0;
		display: grid; 
		grid-template-columns: repeat(3, 1fr); 
		grid-template-rows: repeat(3, 1fr); 
		grid-column-gap: 0px;
		grid-row-gap: 0px; 

	}
	#div_loading{
		position: absolute;
		top: 50%;
		left: 50%;
		transform: translate(-50%,-50%);
		-webkit-box-shadow: 0.5px 0px 25px 5px rgba(80,80,80,0.4); 
		box-shadow: 0.5px 0px 25px 5px rgba(80,80,80,0.4);
		height: 200px;
		width: 200px;
		background-color: white;
		border-radius: 15px;
	}
	#img_loading{
		height: 80%;
		width: auto;
		position: absolute;
		top: 15%;
		left: 50%;
		transform: translateX(-50%);
	}
	#text_loading{
		text-align: center;
		font-size: 1.2em;
		font-weight: 600;
		color: white;
		margin-top: 220px;
	}
/* --- /Loading Page background Element --- */

/* --- Link User Page --- */
	#link_user_container{
		position: absolute;
		overflow: auto;
		height: 100vh;
		width: 100vw;
		top: 0;
		left: 0;
		right: 0;
		bottom: 0;
		background-color: var(--bk-color, grey);
	}
	#link_user_title{
		position: absolute;
		top: 120px;
		left: 50%;
		transform: translateX(-50%);
		text-align: center;
	}
	#link_user_subtitle{
		position: absolute;
		top: 180px;
		left: 50%;
		transform: translateX(-50%);
		text-align: center;
	}
	#profil_pilot_link_div{
		position: absolute;
		top: 280px;
		height: 300px;
		width: 400px;
		left: 50%;
		transform: translateX(-50%);
		background-color: var(--menu-bar, white);
		-webkit-box-shadow: 0px 0px 13px 0px rgba(80,80,80,0.10); 
		box-shadow: 0px 0px 13px 0px rgba(80,80,80,0.10);
		border-radius: 30px;
		text-align: center;
	}
	#link_user_icon_div{
		position: absolute;
		top: 30px;
		left: 50%;
		height: 100px;
		width: 100px;
		transform: translateX(-50%);
		background-color: var(--font-dark, black);
		border-radius: 50%;
	}
	#link_user_icon_img{
		position: absolute;
		top: 15%;
		height: 70%;
		width: auto;
		left: 50%;
		transform: translateX(-50%);
	}
	#profil_pilot_link_name{
		position: absolute;
		top: 150px;
		left: 50%;
		transform: translateX(-50%);
		font-size: 1.2em;
		font-weight: 800;
		text-align: center;
	}
	#profil_pilot_link_status{
		position: absolute;
		top: 200px;
		left: 50%;
		transform: translateX(-50%);
		font-size: 1em;
		font-weight: 500;
		text-align: center;
	}
	#profil_pilot_link_school{
		position: absolute;
		top: 230px;
		left: 50%;
		transform: translateX(-50%);
		font-size: 1.2em;
		font-weight: 500;
		text-align: center;
	}
	#link_user_link_button{
		position: absolute;
		left: 50%;
		transform: translateX(-50%);
		top: 650px;
		height: 50px;
		width: 170px;
		background-color: var(--font-dark, black);
		border-radius: 50px;
		border: none;
		font-weight: 700;
		color: var(--menu-bar, white);
		font-size: 1em;
		cursor: pointer;
		transition: 0.3s;
	}
	#link_user_link_button:hover{
		-webkit-box-shadow: 0px 0px 13px 0px rgba(80,80,80,0.20); 
		box-shadow: 0px 0px 13px 0px rgba(80,80,80,0.20);
		background-color: #2ecc71;
	}
/* --- /Link User Page --- */


/* --- Book slot Page --- */
	#div_book_slot_container{
		position: relative;
		height: auto;
		margin-left: auto;
		margin-right: auto;
		width: 780px;
		background-color: var(--menu-bar, white);
		border-radius: 30px;
		transition: 0.4s;
		overflow: auto;
	}
	.div_create_new_book_slot{
		position: relative;
		display: grid;
		grid-template-columns: auto auto;
		column-gap: 30px;
		row-gap: 30px;
	}

	.div_create_new_book_slot_school_option{
		font-size: 0.7em;
		font-weight: 500;
		background-color: #191530;
		color: #F5F5F5;
		-webkit-box-shadow: 0px 0px 13px 0px rgba(80,80,80,0.10); 
		box-shadow: 0px 0px 13px 0px rgba(80,80,80,0.10);
		border-radius: 15px;
		height: 50px;
		text-align: center;
		line-height: 50px;
		cursor: pointer;
	}
	.p_create_new_book_slot_school_option_text{
		font-size: 1em;
		font-weight: 600;
		margin: 0;
		line-height: 50px;
	}

	.plane_model_item{
		font-size: 0.7em;
		font-weight: 500;
		background-color: #191530;
		color: #F5F5F5;
		-webkit-box-shadow: 0px 0px 13px 0px rgba(80,80,80,0.10); 
		box-shadow: 0px 0px 13px 0px rgba(80,80,80,0.10);
		border-radius: 15px;
		height: 50px;
		text-align: center;
		line-height: 50px;
		cursor: pointer;
	}
	.instructor_item{
		font-size: 0.7em;
		font-weight: 500;
		background-color: #191530;
		color: #F5F5F5;
		-webkit-box-shadow: 0px 0px 13px 0px rgba(80,80,80,0.10); 
		box-shadow: 0px 0px 13px 0px rgba(80,80,80,0.10);
		border-radius: 15px;
		height: 50px;
		text-align: center;
		line-height: 50px;
		cursor: pointer;
	}

	#div_create_new_book_slot_list{
		position: relative;
		overflow: auto;
	}
	.slot_item_book_slot{
		font-size: 0.7em;
		font-weight: 500;
		background-color: #191530;
		color: #F5F5F5;
		-webkit-box-shadow: 0px 0px 13px 0px rgba(80,80,80,0.10); 
		box-shadow: 0px 0px 13px 0px rgba(80,80,80,0.10);
		border-radius: 15px;
		height: 50px;
		text-align: center;
		line-height: 50px;
		cursor: pointer;
	}
	.slot_item_book_slot:hover{
		background-color: #45a049;
	}

	#div_create_new_book_slot_container{
		display: grid;
		grid-template-columns: 1fr;
		grid-template-rows: auto auto;
		column-gap: 30px;
		row-gap: 20px;
		padding: 20px;
	}

	#div_book_slot_type_select_container{
		position: relative;
		display: grid;
		grid-template-columns: auto auto auto;
		grid-template-rows: auto;
		grid-column-gap: 20px;
		justify-content: space-around;
		align-items: center;
		max-width: 500px;
		margin: auto;
		height: 200px;
	}

	.div_book_slot_type_select{
		position: relative;
		display: grid;
		grid-template-columns: 1fr;
		grid-template-rows: auto auto;
		grid-column-gap: 0px;
		grid-row-gap: 15px;
		cursor: pointer;
		background-color: white;
		border-radius: 15px;
		transition: 0.3s;
		padding: 20px 30px;
		margin-bottom: 20px;
	}
	.div_book_slot_type_select:hover{
		background-color: #f4f4f9
	}
	.div_book_slot_type_select_icon{
		position: relative;
		height: 60px;
		width: 60px;
		margin-left: auto;
		margin-right: auto;
	}
	.img_book_slot_type_select_icon{
		height: auto;
		width: 100%;
	}
	.p_book_slot_type_select_text{
		position: relative;
		font-size: 1em;
		font-weight: 600;
		margin: 0;
		text-align: center;
	}
	.timeline-resource-label{
		font-size: 0.9em;
		font-weight: 600;
	}

	#div_create_new_book_slot_date_container{
		position: relative;
		display: grid;
		grid-template-columns: auto 200px auto;
		grid-template-rows: auto;
		grid-column-gap: 20px;
		justify-content: space-around;
		align-items: center;
		max-width: 700px;
		margin: auto;
	}
	.th_create_new_book_slot_list_day{
		text-align:center; 
		padding:10px; 
		border-bottom:1px solid #e5e7eb;
		font-size: 0.9em;
	}
	.th_create_new_book_slot_list_title{
		position: sticky; 
		left: 0; 
		background:#fff; 
		z-index: 2; 
		text-align:left; 
		padding: 10px; 
		border-bottom: 1px solid #e5e7eb;
	}
	.th_create_new_book_slot_list_label{
		position: sticky; 
		left: 0; 
		background:#fff; 
		z-index: 1; 
		padding: 8px 10px; 
		border-bottom: 1px solid #f1f2f6; 
		white-space: nowrap;
	}

	#timeline_controls{
		position: relative;
		display: grid;
		grid-template-columns: auto;
		grid-row-gap: 20px;
		justify-content: space-around;
		align-items: center;
		margin: auto;
		margin-top: 20px;
	}
	#timeline_title{
		font-size: 1.2em;
		font-weight: 700;
		margin: 0;
		text-align: center;
	}
	#timeline_preview_buttons{
		position: relative;
		display: grid;
		grid-template-columns: auto auto;
		grid-column-gap: 20px;
		justify-content: center;
		align-items: center;
		margin: auto;
	}
	#btn_timeline_back{
		height: 30px;
		border-radius: 10px;
		cursor: pointer;
		background-color: rgb(41, 41, 41);
		color: white;
		font-weight: 600;
		text-align: center;
		letter-spacing: 0.2px;
		white-space: nowrap;
		padding-left: 10px;
		padding-right: 10px;
		margin-top: 0;
	}
	#btn_timeline_back:hover{
		background-color: rgb(81, 81, 81);
	}
	#btn_timeline_confirm{
		height: 30px;
		border-radius: 10px;
		cursor: pointer;
		background-color: rgb(0, 85, 249);
		color: white;
		font-weight: 600;
		text-align: center;
		letter-spacing: 0.2px;
		white-space: nowrap;
		padding-left: 10px;
		padding-right: 10px;
		margin-top: 0;
	}
	#btn_timeline_confirm:hover{
		background-color: rgb(0, 64, 249);
	}
	/* cellule sélectionnée dans la grille (écrase la couleur dispo) */
	.grid-cell-box.selected-cell { background:#3B82F6 !important; }

	/* label de ressource sélectionnée (colonne de gauche) */
	.th_create_new_book_slot_list_label.selected-label { font-weight:700; }
	#button_create_new_book_slot{
		height: 30px;
		border-radius: 10px;
		cursor: pointer;
		background-color: rgb(0, 85, 249);
		color: white;
		font-weight: 600;
		text-align: center;
		letter-spacing: 0.2px;
		white-space: nowrap;
		padding-left: 10px;
		padding-right: 10px;
		margin-top: 0;
		width: 150px;
		margin-left: auto;
		margin-right: auto;
		margin-bottom: 20px;
	}
	#button_create_new_book_slot:hover{
		background-color: rgb(0, 64, 249);
	}
	#timeline_rows{
		position: relative;
		overflow-y: auto;
		max-width: 100%;
	}

	.week_button_calendar_book_slot{
		position: relative;
		height: 50px;
		background-color: #191530;
		border-radius: 10px;
		color: white;
		cursor: pointer;
		line-height: 0;
		border: none;
		transition: 0.3s;
	}
	.week_button_calendar_book_slot:hover{
		background-color: #45a049;
	}
	.timeline_control_button{
		position: relative;
		display: grid;
		grid-template-columns: auto 30px auto 30px;
		grid-column-gap: 10px;
		justify-content: center;
		align-items: center;
		margin: auto;
	}

	#return_button{
		position: absolute;
		height: 50px;
		border-radius: 10px;
		color: white;
		top: 15px;
		left: 50px;
		background-color: white;
		cursor: pointer;
		line-height: 0;
		border: none;
		transition: 0.3s;
	}
	.img_return_button{
		position: absolute;
		top: 15%;
		height: 70%;
		width: auto;
		left: 50%;
		transform: translateX(-50%);
	}

	#previous_week_button_book_slot{
		left: 0;
		width: 50px;
	}
	#next_week_button_book_slot{
		right: 0;
		width: 50px;
	}
	.img_week_button_calendar_book_slot{
		position: absolute;
		top: 25%;
		height: 50%;
		width: auto;
		left: 50%;
		transform: translateX(-50%);
	}

	#div_create_new_book_slot_date{
		line-height: 30px;
		text-align: center;
		margin: 0;
		font-size: 1.2em;
		font-weight: 600;
	}

	#slot_duration_buttons{
		position: absolute;
		top: 200px;
		left: 0;
		height: 50px;
		width: 100%;
	}
	.slot_duration_button{
		height: 50px;
		width: 50px;
		background-color: #191530;
		border: none;
		position: absolute;
		transition: 0.3s;
	}
	.slot_duration_button:hover{
		background-color: #45a049;
	}
	#more_slot_duration_button{
		border-top-right-radius: 50%;
		border-bottom-right-radius: 50%;
		right: 50%;
		transform: translateX(125px);
	}
	#less_slot_duration_button{
		border-top-left-radius: 50%;
		border-bottom-left-radius: 50%;
		left: 50%;
		transform: translateX(-125px);
	}

	.img_slot_duration_button{
		height: 50%;
		width: auto;
		position: absolute;
		top: 25%;
		left: 50%;
		transform: translateX(-50%);
	}

	#div_slot_duration{
		position: absolute;
		top: 0;
		left: 50%;
		height: 50px;
		line-height: 100%;
		transform: translateX(-50%);
		background-color: #191530;
		width: 150px;
		margin-top: 0;
		text-align: center;
	}
	#slot_duration_text{
		font-size: 1.2em;
		font-weight: 600px;
		color: white;
		margin-top: 0;
		line-height: 50px;
	}
	#slot_hours{
		position: absolute;
		top: 0;
		left: 50%;
		text-align: center;
		font-weight: 700;
		font-size: 2em;
		transform: translateX(-50%);
		width: 100%;
		margin-top: 100px;
	}
	#slot_hours_confirm1{
		text-align: center;
		font-weight: 700;
		font-size: 1.2em;
		margin-top: 10px;
	}
	#slot_hours_confirm2{
		text-align: center;
		font-weight: 700;
		font-size: 1.2em;
		margin-top: 10px;
	}
	#slot_ressources_select_container{
		position: absolute;
		top: 25px;
		left: 0;
		right: 0;
		background-color: #191530;
		border-radius: 15px;
		padding: 15px;
		height: 35px;
	}
	.slot_ressources_select{
		height: 35px;
		width: 180px;
	}
	#plane_select{
		position: absolute;
		top: 15px;
		left: 25%;
		transform: translateX(-50%);
	}
	#instructor_select{
		position: absolute;
		top: 15px;
		right: 25%;
		transform: translateX(50%);
	}
	#div_create_new_book_slot_filters_container{
		position: absolute;
		top: 0;
		left: 0;
		width: 100%;
		height: 90px;
		overflow-x: auto;
		overflow-y: hidden;
		-ms-overflow-style: none;  /* IE and Edge */
	  	scrollbar-width: none;  /* Firefox */
	}
	/* Hide scrollbar for Chrome, Safari and Opera */
	#div_create_new_book_slot_filters_container::-webkit-scrollbar {
		display: auto;
	}
	#plane_filters_div{
		position: absolute;
		top: 0;
		left: 0;
		height: 40px;
		overflow-x: auto;
		overflow-y: hidden;
		display: flex;
	}
	#instructor_filters_div{
		position: absolute;
		top: 50px;
		left: 0;
		height: 40px;
		overflow-x: auto;
		overflow-y: hidden;
		display: flex;
	}
	.filter_item {
		width: 100px;
		height: 30px;
		margin: 5px;
		text-align: center;
		line-height: 30px;
		cursor: pointer;
		border: 2px solid #191530;
		display: inline-block;
		border-radius: 15px;
		padding-left: 5px;
		padding-right: 5px;
	}
	
	.filter_item.selected {
		background-color: #191530;
		color: white;
	}
	
	.filter_item.deselected {
		background-color: white;
		color: #191530;
	}
	
	.filter_item.unavailable {
		background-color: gray;
		border-color: gray;
		color: white;
	}
	
	.filter_item.unavailable.selected {
		background-color: gray;
		border-color: gray;
		color: white;
	}
	
	.filter_item.unavailable.deselected {
		background-color: white;
		border-color: gray;
		color: gray;
	}

	#slot_training_fields{
		display: block;
		position: relative;
		width: 200px;
		height: 50px;
		margin-left: auto;
		margin-right: auto;
	}



	/* === Capacity grid refresh === */
	.capacity-table {
		width: 100%;
		margin: 0 auto;
		table-layout: auto;
	}

	.capacity-table thead th {
		position: sticky;
		top: 0;
		background: #fff;
		z-index: 3;
		border: 2px solid #eaeaf0 !important; /* bordure légère */
	}

	.th_create_new_book_slot_list_title {
		position: sticky;
		left: 0;
		z-index: 4;
		background: #fff;
		/* plus de bordure lourde */
		border-bottom: none;
		font-weight: 700;                   /* toujours gras */
		padding: 12px 10px;
	}

	.th_create_new_book_slot_list_day {
		text-align: center;
		padding: 10px 8px 14px;
		border-bottom: none;
		font-size: 0.9em;
		color: #334155;
	}

	/* Lignes "cartes" : fond, ombre, arrondi (sauf la row de section) */
	.capacity-table tbody tr:not(.group-row) {
		background: #fff;
		box-shadow: 0 1px 2px rgba(16,24,40,.04), 0 2px 10px rgba(16,24,40,.06);
		border-radius: 12px;
	}

	/* On change les bordures pour des lignes plus légères */
	.capacity-table tbody tr:not(.group-row) td {
		border: 2px solid #eaeaf0 !important;
	}
	.capacity-table tbody tr:not(.group-row) td.grid-cell {
		border: 2px solid #eaeaf0 !important;
	}

	/* cellule label à gauche (sticky, sans gros cadre) */
	.th_create_new_book_slot_list_label {
		position: sticky;
		left: 0;
		z-index: 2;
		background: linear-gradient(90deg, #fff 80%, rgba(255,255,255,0)); /* fondu propre vers la grille */
		padding: 10px 12px;
		border-bottom: none;
		white-space: nowrap;
		font-weight: 600;     /* plus lisible par défaut */
	}

	/* pastilles de disponibilité : rondes + discrètes */
	.grid-cell {
		padding: 1px 5px !important;
		border-bottom: none !important;
	}
	.grid-cell-box {
		height: 25px !important;
		max-width: 72px !important;
		margin: 4px auto !important;
		border-radius: 10px;                /* pilule */
	}

	/* sélection utilisateur (déjà ajoutée) */
	.grid-cell-box.selected-cell { background: #3B82F6 !important; }
	.th_create_new_book_slot_list_label.selected-label { font-weight: 800; }

	/* hover léger pour compréhension de clic */
	td.grid-cell:hover .grid-cell-box { filter: brightness(0.95); }

	/* Titre de section (évite la ligne “vide” d’avant) */
	.group-row .group-title {
		font-weight: 800;
		font-size: 0.95em;
		color: #0f172a;
		padding: 8px 6px;
		background: transparent;
		border: none;
	}

	/* supprime le contour du tableau “old school” */
	#div_create_new_book_slot_list table { border: 0 !important; }

	/* header jours plus “badge” */
	.th_create_new_book_slot_list_day {
		text-align: center;
		vertical-align: bottom;     
	}
	.th_create_new_book_slot_list_day::after {
		content: "";
		display: block;            
		width: 28px;
		height: 3px;
		border-radius: 2px;
		background: #e2e8f0;
		margin: 6px auto 0;        
	}

	.capacity-table tbody tr:not(.group-row):nth-child(2n) { background: #fcfcff; }

	/* --- Timeline smooth expand/collapse --- */
	#timeline_preview {
		overflow: hidden;
		max-height: 0;          /* fermé */
		opacity: 0;
		transform: translateY(-4px);
		transition: max-height .3s ease, opacity .3s ease, transform .3s ease;
	}

	/* état ouvert (max-height en JS = scrollHeight en px) */
	#timeline_preview.open {
		opacity: 1;
		transform: translateY(0);
	}

	/* Rien d’obligatoire ici, mais ça aide à adoucir le parent */
	#div_book_slot_container {
		transition: padding .3s ease, background-color .3s ease, box-shadow .3s ease;
	}

	/* Accessibilité : si l’utilisateur réduit les animations */
	@media (prefers-reduced-motion: reduce) {
		#timeline_preview { transition: none; }
		#div_book_slot_container { transition: none; }
	}

	
/* --- /Book slot Page --- */



/* --- Calendar Page --- */
	#calendar_container{
		position: absolute;
		top: 100px;
		left: 0px;
		right: 0;
		bottom: 0;
		background-color: #F5F5F5;
		border-radius: 15px;
		overflow: auto;
		display: grid; 
		grid-template-columns: 0.5fr 1fr 1fr 1fr 1fr 1fr 1fr 1fr;
		grid-template-rows: repeat(65, 1fr);
	}
	#div_time_sunset_sunrise_container{
		position: absolute;
		top: 57.5px;
		left: 0;
		width: 100%;
		height: 35px;
	}
	#div_time_sunrise_image{
		position: absolute;
		top: 0;
		left: 105px;
		height: 100%;
	}
	#div_time_sunset_image{
		position: absolute;
		top: 0;
		right: 105px;
		height: 100%;
	}
	.img_time_sunset_sunrise{
		height: 100%;
		width: auto;
		position: relative;
	}
	.p_time_sunset_sunrise{
		position: absolute;
		top: 0;
		line-height: 35px;
		margin-top: 0;
		font-weight: 600;
		font-size: 1.2em;
	}
	#p_time_aviation_sunrise{
		left: 40px;
	}
	#p_time_sunrise{
		left: 150px;
	}
	#p_time_sunset{
		right: 150px;
	}
	#p_time_aviation_sunset{
		right: 40px;
	}


	.slot_item {
		text-align: center;
		cursor: pointer;
		position: relative;
		background-color: #c8c8c8;
	}
	.slot_item:hover{
		background-color: #7391A1;
	}

	.slot_bis_item{
		text-align: center;
		cursor: pointer;
		position: relative;
		background-color: #c8c8c8;
		min-width: 15px;
		border: 0.1px solid rgba(0,0,0,0.1);
	}
	.slot_bis_item:hover{
		background-color: #7391A1;
	}

	/* Style de l'en-tête */
	.slot_header {
		text-align: center;
		font-weight: bold;
		background-color: #191530;
		padding-top: 25px;
		padding-bottom: 30px;
		color: #F5F5F5;
		position: sticky;
		top: 0;
		z-index: 20;
	}

	.hour_item{
		font-weight: bold;
		background-color: #191530;
		height: 45px;
		padding-top: 10px;
		text-align: center;
		font-weight: bold;
		color: #F5F5F5;
		border-bottom: 2px solid white;
	}

	.hour_bis_item{
		font-weight: bold;
		background-color: #191530;
		padding-top: 10px;
		padding-bottom: 10px;
		text-align: center;
		font-weight: bold;
		color: #F5F5F5;
		border-left: 1px solid #F5F5F5;
	}

	.ressource_item{
		font-weight: bold;
		background-color: #191530;
		padding-top: 12px;
		padding-bottom: 12px;
		text-align: center;
		font-weight: bold;
		color: #F5F5F5;
		border-bottom: 1px solid #F5F5F5;
		min-width: 150px;
		padding-left: 20px;
		padding-right: 20px;
	}

	.first_item{
		background-color: #191530;
		position: sticky;
		top: 0;
		z-index: 1;
	}

	.first_bis_item{
		background-color: #191530;
		position: sticky;
		top: 0;
		z-index: 1;
		border-bottom: 1px solid #F5F5F5;
	}

	.slot_div{
		position: relative;
		background-color: #164863;
		border-radius: 10px;
		margin-right: 15px;
		cursor: pointer;
		color: white;
	}

	.slot_overview {
		position: absolute;
		z-index: 999; 
		background: rgba(0,0,0,0.8);
		color: #fff;
		padding: 6px 10px;
		border-radius: 4px;
		top: 0;      
		left: 50%; 
		transform: translateX(-50%);
		width: 150px;
		font-size: 0.9em;
		pointer-events: none;
	}
	

	.slot_unavaibility_div{
		position: relative;
		background-color: rgba(200, 20, 20, 0.7);
		border-radius: 10px;
		margin-right: 15px;
		cursor: pointer;
		color: white;
	}

	.slot_title{
		position: absolute;
		top: 15px;
		left: 5px;
		font-size: 0.6em;
		font-weight: 600;
	}

	.slot_subtitle{
		position: absolute;
		top: 25px;
		left: 5px;
		font-size: 0.8em;
		font-weight: 400;
	}

	.slot_date_text{
		position: absolute;
		top: 5px;
		left: 5px;
		font-size: 0.8em;
		font-weight: 300;
		margin-top: 0;
	}

	.week_button_calendar{
		position: absolute;
		height: 50px;
		background-color: #191530;
		border-radius: 10px;
		color: white;
		top: 0;
		cursor: pointer;
		line-height: 0;
		border: none;
		transition: 0.3s;
	}
	.week_button_calendar:hover{
		background-color: #45a049;
	}

	#previous_week_button{
		left: 35px;
		width: 40px;
		transform: translateX(0%);
	}
	#previous_week_button_2{
		left: 0;
		width: 30px;
		transform: translateX(0%);
	}
	#today_week_button{
		left: 80px;
		width: 130px;
		transform: translateX(0%);
	}
	#next_week_button{
		left: 215px;
		width: 40px;
		transform: translateX(0%);
	}
	#next_week_button_2{
		left: 260px;
		width: 30px;
		transform: translateX(0%);
	}

	#week_displayed{
		position: absolute;
		top: 0;
		left: 50%;
		transform: translateX(-50%);
		font-weight: 700;
		font-size: 1.5em;
		margin-top: 0;
	}
	#day_displayed{
		position: absolute;
		top: 0;
		left: 50%;
		transform: translateX(-50%);
		font-weight: 700;
		font-size: 1.5em;
		margin-top: 0;
	}
	.img_week_button_calendar{
		position: absolute;
		top: 25%;
		height: 50%;
		width: auto;
		left: 50%;
		transform: translateX(-50%);
	}
	#print_create_new_slot{
		position: absolute;
		right: 0;
		width: 80px;
		text-align: center;
		cursor: pointer;
		background-color: var(--font-dark, black);
		color: white;
		padding: 5px 13px;
		line-height: 0;
		border: none;
		border-radius: 30px;
		transition: 0.3s;
		font-weight: 700;
	}
	#print_create_new_slot:hover{
		background-color: #45a049;
	}
	#print_filters{
		position: absolute;
		right: 120px;
		width: 80px;
		cursor: pointer;
		text-align: center;
		background-color: var(--font-dark, black);
		color: white;
		padding: 5px 13px;
		line-height: 0;
		border: none;
		border-radius: 30px;
		transition: 0.3s;
		font-weight: 700;
	}
	#print_filters:hover{
		background-color: #45a049;
	}

	.new_slot_type_selector_container {
		display: flex;
		justify-content: space-between;
		margin-bottom: 50px;
	}
	.slot_type_selector {
		position: relative;
		width: 4rem;
		height: 4rem;
		background-color: var(--font-dark, black);
		border-radius: 0.5rem;
		cursor: pointer;
		display: flex;
		justify-content: center;
		align-items: center;
	}
	.slot_type_selector_text {
		position: absolute;
		bottom: -30px;
		left: 50%;
		transform: translateX(-50%);
		font-size: 0.8em;
		font-weight: 500;
		text-align: center;
	}
	.slot_type_selector_img{
		position: absolute;
		top: 20%;
		height: 60%;
		width: auto;
		left: 50%;
		transform: translateX(-50%);
	}
	.slot_type_selector.selected {
	background-color: #2ecc71;
	}
	#new_slot_pilot_fields {
		position: relative;
		display: inline-block;
		width: 100%;
	}

	#div_filters_calendar{
		position: absolute;
		top: 100px;
		height: 200px;
		left: 0px;
		width: 100px;
		border-radius: 15px;
		padding: 10px;
		font-size: 0.7em;
		overflow: auto;
		background-color: #191530;
		color: white;
		z-index: 99;
	}

	.hidden-column {
		display: none;
	}

/* --- /Calendar Page --- */



/* --- Create New Flight Page --- */
	.div_create_new_flight_container{
		background-color: var(--menu-bar, white);
		border-radius: 15px;
		color: var(--font-dark, black);
		-webkit-box-shadow: 0.2px 0px 13px 0px rgba(80,80,80,0.05); 
		box-shadow: 0.2px 0px 13px 0px rgba(80,80,80,0.05);
		overflow-y: auto;
		padding-left: 30px;
		padding-right: 30px;
		padding-bottom: 30px;
		grid-area: 1 / 2 / 6 / 5;
	}
	.search-container {
		position: relative;
		display: inline-block;
		width: 100%;
	}
	#piloteList {
		position: absolute;
		z-index: 1;
		top: 100%;
		left: -15px;
		width: 100%;
		background-color: var(--font-dark, black);
		color: var(--menu-bar, white);
		border-radius: 15px;
		border-top: none;
		padding-left: 15px;
		padding-right: 15px;
		margin-top: 0;
		list-style-type: none;
	}
	#piloteList li {
		padding: 12px 12px;
		cursor: pointer;
	}

	#piloteList li:hover {
		background-color: #d2d2d2;
	}

	.p_engine_hours_motor_indicator_text{
		display: inline;
		width: 120px;
	}
	#p_engine_right_hours_motor_before_indicator_text{
		margin-right: 22px;
	}
	#p_engine_right_hours_motor_after_indicator_text{
		margin-right: 22px;
	}

	.input_engine_hours{
		width: 30%;
		display: inline-block;
		padding: 8px;
		border: 1px solid #ccc;
		border-radius: 4px;
		box-sizing: border-box;
		margin-bottom: 20px;
	}
	.input_flight_hours{
		width: 100%;
		display: inline-block;
		padding: 8px;
		border: 1px solid #ccc;
		border-radius: 4px;
		box-sizing: border-box;
		margin-bottom: 20px;
	}
	#button_send_new_x{
		height: 30px;
		border-radius: 10px;
		cursor: pointer;
		background-color: rgb(0, 85, 249);
		color: white;
		font-weight: 600;
		text-align: center;
		letter-spacing: 0.2px;
		white-space: nowrap;
		padding-left: 10px;
		padding-right: 10px;
		margin-top: 0;
	}
	#button_send_new_x:hover{
		background-color: rgb(0, 64, 249);
	}
	.button_send_new_x{
		height: 30px;
		border-radius: 10px;
		cursor: pointer;
		background-color: rgb(0, 85, 249);
		color: white;
		font-weight: 600;
		text-align: center;
		letter-spacing: 0.2px;
		white-space: nowrap;
		padding-left: 10px;
		padding-right: 10px;
		margin-top: 0;
	}
	.button_send_new_x:hover{
		background-color: rgb(0, 64, 249);
	}
	.error {
		color: red;
		font-weight: bold;
		margin-bottom: 10px;
	}
	.signature-container {
		position: relative;
		width: 100%;
		max-width: 500px;
		height: 200px;
		margin: 20px auto;
		box-sizing: border-box;
		background-color: var(--font-light, white);
		padding: 25px;
		border-radius: 15px;
	}

	#signature-pad{
		width: 100%;
		height: 100%;
	}	


	.signature-buttons {
		position: absolute;
		bottom: 0;
		right: 0;
		margin-left: 10px;
		font-size: 16px;
		font-weight: 500;
		border-radius: 5px;
		padding: 5px 10px;
		cursor: pointer;
	}
	.selecteur_nature_vol_container {
		display: flex;
		justify-content: space-between;
		margin-bottom: 50px;
	}

	.selecteur_meteo_container {
		display: flex;
		justify-content: space-between;
		margin-bottom: 50px;
	}

	.selecteur_evaluation_container {
		display: flex;
		justify-content: space-between;
		margin-bottom: 50px;
	}

	.selecteur_nature_vol {
		position: relative;
		width: 5rem;
		height: 5rem;
		background-color: var(--font-dark, black);
		border-radius: 0.5rem;
		cursor: pointer;
		display: flex;
		justify-content: center;
		align-items: center;
	}
	.selecteur_meteo {
		position: relative;
		width: 5rem;
		height: 5rem;
		background-color: var(--font-dark, black);
		border-radius: 0.5rem;
		cursor: pointer;
		display: flex;
		justify-content: center;
		align-items: center;
	}

	.selecteur_evaluation {
		position: relative;
		width: 5rem;
		height: 5rem;
		background-color: var(--font-dark, black);
		border-radius: 0.5rem;
		cursor: pointer;
		display: flex;
		justify-content: center;
		align-items: center;
	}

	.selecteur_nature_vol img {
	width: 3rem;
	height: 3rem;
	}

	.selecteur_nature_vol.selected {
	background-color: #2ecc71;
	}

	.selecteur_meteo img {
	width: 3rem;
	height: 3rem;
	}

	.selecteur_meteo.selected {
	background-color: #48cd66;
	}

	.selecteur_evaluation img {
	width: 3rem;
	height: 3rem;
	}

	.selecteur-A.selected {
	background-color: #2ecc71;
	}
	.selecteur-B.selected {
	background-color: #f1c40f;
	}
	.selecteur-C.selected {
	background-color: #e67e22;
	}
	.selecteur-D.selected {
	background-color: #c0392b;
	}

	.selecteur-cavok.selected {
	background-color: #2ecc71;
	}
	.selecteur-moyen.selected {
	background-color: #f1c40f;
	}
	.selecteur-difficile.selected {
	background-color: #e67e22;
	}
	.selecteur-vent.selected {
	background-color: #c0392b;
	}
	.selecteur-vent-face.selected {
	background-color: #f1c40f;
	}
	.selecteur-vent-travers.selected {
	background-color: #c0392b;
	}

	.texte_selecteur {
	position: absolute;
	bottom: -30px;
	left: 50%;
	transform: translateX(-50%);
	font-size: 1em;
	font-weight: 500;
	text-align: center;
	}

	#apprentissage-fields{
		margin-top: 50px;
	}

	.p_sub_label_create_new_flight{
		margin-top: 5px;
		margin-bottom: 5px;
		font-weight: 500;
	}


	table {
		border-collapse: collapse;
		width: 100%;
		max-width: 800px;
		margin: 20px auto;
	}
	th, td {
		border: 3px solid #191530;
		padding: 8px;
	}
	th {
		background-color: #ddd;
	}
	.check {
		display: inline-block;
		width: 20px;
		height: 20px;
		margin-right: 10px;
		border: 1px solid black;
		vertical-align: middle;
		cursor: pointer;
	}

	#acquired_fields_button{
		background-color: var(--font-dark, black);
		color: white;
		padding: 12px 20px;
		border: none;
		border-radius: 4px;
		cursor: pointer;
		margin-top: 40px;
		margin-bottom: 30px;
		margin-left: 50%;
		transform: translateX(-50%);
		text-align: center;
	}

	#div_airports_create_new_flight{
		border-left: 5px solid #191530;
	}

	.div_point_airport_create_new_flight{
		position: absolute;
		top: 5px;
		left: -12.5px;
		height: 20px;
		width: 20px;
		border-radius: 50%;
		background-color: #191530;
	}

	.div_point_2_airport_create_new_flight{
		position: absolute;
		top: 0px;
		left: -32.5px;
		height: 20px;
		width: 20px;
		border-radius: 50%;
		background-color: #191530;
	}
	.div_select_mvt_airport_create_new_flight{
		position: absolute;
		top: 0px;
		right: 30px;
		height: 20px;
		width: 130px;
		margin-top: 20px;
		margin-bottom: 0;
	}
/* --- /Create New Flight Page --- */


/* --- Pilot APP --- */
	.div_main_container{
		position: absolute;
		top: 0;
		left: 0;
		right: 0;
		bottom: 0;
		overflow: auto;
		z-index: 1;
	}

	#div_pilot_app_container{
		overflow: auto;
		position: relative;
		display: grid;
		grid-template-columns: 1fr;
		grid-template-rows: 60px 50px auto;
		grid-row-gap: 40px;
		padding: 40px;
		width: calc(100% - 330px);
		height: auto;
	}

	#div_pilot_app_top_container{
		position: relative;
		display: grid;
		grid-template-columns: auto min-content;
		grid-template-rows: 1fr;
		grid-column-gap: 10px;
	}

	#div_profil_button{
		height: 30px;
		border-radius: 10px;
		cursor: pointer;
		background-color: white;
		color: rgb(0, 85, 249);
		font-weight: 600;
		text-align: center;
		letter-spacing: 0.2px;
		white-space: nowrap;
		padding-left: 10px;
		padding-right: 10px;
		margin-top: 0;
	}
	#div_profil_button:hover{
		background-color: #e0e0e0;
	}

	#div_pro_button{
		height: 30px;
		width: 55px;
		border-radius: 10px;
		cursor: pointer;
		background-color: rgb(0, 85, 249);
		color: white;
		font-weight: 600;
		text-align: left;
		letter-spacing: 0.2px;
		margin-top: 0px;
		padding-left: 10px;
		transition: 0.2s;
	}
	#text_pro_button{
		font-size: 0.8em;
	}
	#div_pro_button:hover{
		background-color: rgb(0, 64, 249);
		width: 65px;
		border-top-right-radius: 20px;
		border-bottom-right-radius: 20px;
	}
	#img_pro_button{
		height: 17px;
		width: auto;
		position: absolute;
		top: 49%;
		transform: translateY(-50%) rotate(180deg);
		right: 5px;
	}

	#div_profils_container{
		position: absolute;
		top: 45px;
		right: 0px;
		width: 250px;
		border-radius: 15px;
		background-color: white;
		-webkit-box-shadow: rgba(80, 80, 80, 0.15) 0.2px 0px 13px 0px;
		box-shadow: rgba(80, 80, 80, 0.15) 0.2px 0px 13px 0px;
		color: black;
		z-index: 98;
		padding: 15px;
		transition: 0.3s;
		opacity: 0;
	}

	#div_profils_list_container{
		margin-top: 15px;
		padding-top: 15px;
		border-top: 1px solid rgb(220, 220, 220);
	}
	#div_profils_list{
		display: grid;
		grid-template-columns: 1fr;
		grid-row-gap: 7px;
	}

	#text_div_profil_title{
		margin: 0;
		font-size: 1em;
	}

	#div_pilot_app_flight_container{
		overflow: auto;
		position: relative;
		display: grid;
		grid-template-columns: 1fr;
		grid-template-rows: 60px auto;
		grid-row-gap: 40px;
		padding: 40px;
		width: calc(100% - 330px);
		height: auto;
	}

	#div_top_container_left{
		display: grid;
		grid-template-columns: 45px auto;
		grid-column-gap: 10px;
	}

/* --- /Pilot APP --- */



/* --- APP lateral menu --- */
	#div_lateral_menu_container{
		position: fixed;
		top: 0;
		left: 0;
		width: 250px;
		height: 100%;
		background-color: white;
		overflow-y: auto;
		z-index: 99;
		display: grid;
		grid-template-columns: 1fr;
		grid-template-rows: 100px auto;
		border-right: 0.2px solid rgba(220, 220, 220, 0.5);
	}
	#div_lateral_menu_flightly_logo{
		position: relative;
		display: block;
		width: 120px;
		height: auto;
		margin-top: 50px;
		margin-left: 25px;
	}
	#div_lateral_menu_flightly_logo_img{
		display: block;
		position: absolute;
		top: 0;
		height: auto;
		width: 100%;
		left: 50%;
		transform: translateX(-50%);
	}
	#div_lateral_menu_flightly_logo_img_small{
		display: none;
		position: absolute;
		top: 0;
		height: auto;
		width: 40px;
		left: 50%;
		transform: translateX(-50%);
	}
	#div_lateral_menu_content{
		display: grid;
		margin-left: 10px;
		margin-right: 10px;
		grid-template-columns: 1fr;
		grid-template-rows: min-content min-content min-content min-content auto;
		grid-row-gap: 7px;
		grid-column-gap: 20px;
		font-weight: 500;
		font-size: 1.2em;
		margin-top: 30px;
		user-select: none;
		-webkit-user-select: none;
	}

	.div_lateral_menu_content_item{
		position: relative;
		display: grid;
		grid-template-columns: 30px auto;
		grid-template-rows: 30px;
		grid-column-gap: 10px;
		cursor: pointer;
		padding: 15px;
		border-radius: 15px;
		transition: 0.3s;
	}
	.div_lateral_menu_content_item:hover{
		background-color: rgb(244, 244, 249);
	}
	.div_lateral_menu_item_icon{
		position: relative;
		height: 30px;
		width: 30px;
		display: flex;
		justify-content: center;
		align-items: center;
	}
	.img_lateral_menu_item{
		width: 100%;
		height: auto;
	}
	.text_lateral_menu_item{
		line-height: 30px;
		margin: 0;
		cursor: pointer;
		font-size: 0.8em;
		font-weight: 600;
	}
	.text_lateral_add_menu_item{
		line-height: 30px;
		margin: 0;
		cursor: pointer;
		font-size: 0.9em;
		font-weight: 600;
	}
	#div_lateral_menu_item_icon_page{
		background-color: #191530;
		border-radius: 50%;
	}
	#img_lateral_menu_item_page{
		height: 100%;
		width: 100%;
		object-fit: cover;
		border-radius: 50%;
		z-index: 99;
	}
	.div_lateral_menu_item_icon_page_active{
		border: 2px solid #191530;
		height: 26px;
		width: 26px;
	}
	.text_lateral_menu_item_active{
		font-weight: 700;
	}
	#div_lateral_menu_add_button{
		background-color: rgb(0, 85, 249);
		position: relative;
		height: 50px;
		width: 50px;
		border-radius: 15px;
		margin-left: auto;
		margin-right: auto;
		margin-top: auto;
		margin-bottom: 25px;
		cursor: pointer;
		-webkit-box-shadow: 0px 0px 13px 0px rgba(80,80,80,0.05);
		box-shadow: 0px 0px 13px 0px rgba(80,80,80,0.05);
		grid-area: auto;
		user-select: none;
		-webkit-user-select: none;
	}
	#img_lateral_menu_add_button{
		position: absolute;
		top: 20%;
		height: 60%;
		width: auto;
		left: 50%;
		transform: translateX(-50%);
	}
	#div_lateral_menu_item_search{
		display: none;
	}
	#div_lateral_menu_item_notifications{
		display: grid;
	}

	#div_lateral_menu_add_container{
		position: absolute;
		bottom: 80px;
		left: 0;
		transform: translateX(0%);
		z-index: 100;
		display: grid;
		grid-template-columns: 1fr;
		grid-row-gap: 15px;
		padding: 10px;
		background-color: rgb(0, 85, 249);
		color: white;
		border-radius: 15px;
		margin-bottom: 10px;
		margin-left: 10px;
		width: 210px;
		transition: 0.3s;
		opacity: 0;
		user-select: none;
		-webkit-user-select: none;
	}
	.div_lateral_menu_add_item{
		position: relative;
		display: grid;
		grid-template-columns: 30px auto;
		grid-column-gap: 10px;
		text-align: left;
		cursor: pointer;
	}
/* --- /APP lateral menu --- */


/* --- Social Feed --- */
	#div_feed_container{
		position: relative;
		display: flex;
		flex-direction: column;
		overflow-y: auto;
		overflow-x: hidden;
		width: 600px;
		margin-top: 10px;
		margin-left: auto;
		margin-right: auto;
	}
	#div_feed_header_container{
		position: fixed;
		top: 0;	
		left: 50%;
		transform: translateX(-50%);
		width: calc(600px - 50px);
		display: none;
		grid-template-columns: auto 25px 25px;
		grid-column-gap: 20px;
		align-items: center;
		padding-top: 10px;
		padding-bottom: 10px;
		padding-left: 25px;
		padding-right: 25px;
		overflow: hidden;
		background-color: white;
		z-index: 100;
		border-radius: 15px;
		margin-top: 10px;
		box-shadow: rgba(0, 0, 0, 0.04) 0px 3px 5px;
	}
	#div_feed_header_flightly_logo{
		position: relative;
		display: block;
		width: 120px;
		height: auto;
		cursor: pointer;
	}
	#img_feed_header_flightly_logo{
		display: block;
		position: relative;
		height: auto;
		width: 100%;
	}
	#div_feed_header_notifications_button{
		position: relative;
		display: block;
		width: 25px;
		height: 25px;
		cursor: pointer;
		margin-left: auto;
	}
	#img_feed_header_notifications_button{
		display: block;
		position: relative;
		height: 90%;
		width: auto;
		margin: auto;
		margin-top: 5%;
	}
	#div_feed_header_messages_button{
		position: relative;
		display: block;
		width: 25px;
		height: 25px;
		cursor: pointer;
		margin-left: auto;
	}
	#img_feed_header_messages_button{
		display: block;
		position: relative;
		height: 100%;
		width: auto;
	}

	/* Banner container */
	.flightly-notif-banner {
		position: fixed;
		left: 50%;
		bottom: 16px;
		transform: translateX(-50%) translateY(20px);
		background: #191530;
		color: #fff;
		padding: 10px 14px;
		border-radius: 12px;
		box-shadow: 0 8px 20px rgba(0,0,0,.25);
		z-index: 9999;
		display: flex;
		gap: 12px;
		align-items: center;
		opacity: 0;
		transition: transform .15s ease, opacity .15s ease;
	}

	.flightly-notif-banner.is-visible {
		transform: translateX(-50%) translateY(0);
		opacity: 1;
	}
	.flightly-notif-banner.is-leaving {
		transform: translateX(-50%) translateY(10px);
		opacity: 0;
	}

	.flightly-notif-banner__actions { display: flex; gap: 8px; }

	.flightly-notif-banner__btn {
		border: 0;
		border-radius: 8px;
		padding: 6px 10px;
		cursor: pointer;
		font: inherit;
	}
	.flightly-notif-banner__btn--primary { background: #fff; color: #191530; }
	.flightly-notif-banner__btn--ghost   { background: transparent; color: #fff; border: 1px solid rgba(255,255,255,.35); }

	.flightly-notif-banner__close {
		margin-left: 4px;
		background: transparent;
		color: #fff;
		border: 0;
		font-size: 18px;
		line-height: 1;
		cursor: pointer;
	}



	.div_publication_container{
		position: relative;
		background-color: white;
		border-radius: 15px;
		display: grid;
		grid-template-columns: 1fr;
		grid-row-gap: 20px;
		margin-top: 10px;
		margin-bottom: 10px;
		padding: 20px;
	}
	.div_publication_container_media_only{
		grid-template-rows: 50px auto auto;
	}
	.div_publication_container_text_only{
		grid-template-rows: 50px auto auto;
	}
	.div_publication_container_flight_only{
		grid-template-rows: 50px auto;
	}
	.div_publication_container_flight_and_media{
		grid-template-rows: 50px auto auto;
	}

	.div_publication_header{
		position: relative;
		display: grid;
		grid-template-columns: 50px auto 30px;
		grid-column-gap: 10px;
	}

	.div_publication_profil_picture{
		position: relative;
		height: 50px;
		width: 50px;
		border-radius: 50%;
		cursor: pointer;
		display: flex;
		justify-content: center;
		align-items: center;
	}
	.img_publication_profil_picture{
		height: 100%;
		width: 100%;
		object-fit: cover;
		border-radius: 50%;
		z-index: 99;
	}
	.div_publication_header_infos{
		position: relative;
		display: grid;
		grid-template-columns: 1fr;
		grid-template-rows: 23px 20px;
		margin-top: 5px;
		margin-bottom: 5px;
	}
	.text_publication_profil_name{
		position: relative;
		font-size: 1em;
		font-weight: 600;
		margin: 0;
		line-height: 25px;
		cursor: pointer;
	}
	.text_publication_profil_name::first-letter {
		text-transform: none;
	}
	.text_publication_date{
		position: relative;
		font-size: 0.8em;
		font-weight: 400;
		margin: 0;
		line-height: 15px;
	}
	.div_publication_header_buttons{
		position: relative;
		display: flex;
		justify-content: flex-end;
	}
	.img_publication_more{
		position: relative;
		height: 30px;
		width: auto;
		cursor: pointer;
	}

	.div_publication_content{
		position: relative;
		display: grid;
		grid-template-columns: 1fr;
		grid-row-gap: 20px;
	}
	.div_publication_content_media_only{
		grid-template-rows: auto;
	}
	.div_publication_content_text_only{
		grid-template-rows: auto;
	}
	.div_publication_content_flight_only{
		grid-template-rows: auto;
	}
	.div_publication_content_flight_and_media{
		grid-template-rows: auto auto;
	}

	.div_publication_content_description{
		position: relative;
		display: grid;
		grid-template-columns: 1fr;
		grid-template-rows: auto auto auto;
		grid-row-gap: 10px;
		background-color: rgba(0,0,0,0.9);
		border-radius: 15px;
		padding: 15px;
	}
	.div_publication_content_description_top{
		position: relative;
		display: grid;
		grid-template-columns: min-content auto min-content;
		grid-column-gap: 0px;
	}
	.div_publication_content_description_top_airport_box{
		height: 50px;
		width: max-content;
		border-radius: 15px;
		border: 6px solid #FFCD28;
		padding-left: 10px;
		padding-right: 10px;
	}
	#div_publication_content_description_top_airport_box_left{
		margin-right: auto;
	}
	#div_publication_content_description_top_airport_box_right{
		margin-left: auto;
	}
	.text_publication_content_description_top_airport_oaci{
		color: #FFCD28;
		font-size: 1.5em;
		font-weight: 700;
		margin: 0;
		line-height: 50px;
		text-align: center;
		width: max-content;
	}
	#div_publication_content_description_top_middle{
		position: relative;
		display: block;
		height: 62px;
	}
	#div_publication_content_description_top_time_box{
		height: 29px;
		width: 100%;
		border-top: 3px dotted #FFCD28;
		margin-top: 30px;
	}
	.text_publication_content_description_top_time{
		text-align: center;
		line-height: 25px;
		color: rgba(255,255,255, 0.9);
		margin: 4px;
		font-size: 1.2em;
		font-weight: 400;
	}
	.div_publication_content_description_middle{
		position: relative;
		display: grid;
		grid-template-columns: auto auto;
		grid-column-gap: 10px;
		color: rgba(255,255,255, 0.9);
	}
	.text_publication_content_description_top_airport_full_name{
		font-size: 1em;
		font-weight: 500;
		margin: 0;
	}
	#text_publication_content_description_top_airport_full_name_right{
		text-align: right;
	}
	
	.text_publication_content_description_flight_plane{
		position: relative;
		font-size: 1.2em;
		font-weight: 500;
		margin-top: 0;
		margin-bottom: 0;
		line-height: 30px;
		color: rgba(255,255,255, 0.9);
	}
	.div_publication_content_description_plane{
		position: relative;
		display: grid;
		grid-template-columns: 30px max-content;
		grid-column-gap: 5px;
		margin: auto;
	}
	.div_publication_content_description_plane_icon{
		position: relative;
		height: 30px;
		width: 30px;
		display: flex;
		justify-content: center;
		align-items: center;
		opacity: 0.9;
	}
	.img_publication_content_description_plane_icon{
		width: 80%;
		height: auto;
		object-fit: cover;
	}

	.div_publication_content_images_container{
		position: relative;
		display: block;
	}

	.div_publication_content_images{
		display:flex;
		gap:8px;
		overflow-x:auto;
		scroll-snap-type:x mandatory;
		-ms-overflow-style: none;
		align-items: stretch;
	}
	.div_publication_content_images::-webkit-scrollbar {
		display: none; /* Masque la barre de défilement */
	}
	  
	.post_media_item{
		flex: 0 0 100%;              /* 1 slide = 100% de la largeur du conteneur */
		aspect-ratio: var(--post-aspect, 1); /* nombre (1, 0.8, 1.25) fourni en inline */
		position:relative;
		border-radius:10px;
		overflow:hidden;
		scroll-snap-align:center;
		max-height: 700px;
		height: auto;
		min-height: 0;
	}
	.post_media_item > img,
	.post_media_item > video{
		width:100%;
		height:100%;
		object-fit: cover;           /* couvre la frame sans déformer */
		display:block;
	}

	/* Dans le carrousel uniquement, on enlève le cap sur le média lui-même */
	.div_publication_content_images .img_publication_content_image,
	.div_publication_content_images .video_publication_content{
		height: 100% !important;
		max-height: none !important;
		object-fit: cover !important;
		border-radius: 0; /* le radius est déjà sur .post_media_item */
	}

	  
	.img_publication_content_image{
		flex: 0 0 100%;
		scroll-snap-align: start;
		width: 100%;
		height: auto;
		object-fit: contain;
		border-radius: 10px;
	}
	.video_publication_content {
		width: 100%;
		height: auto;
		object-fit: contain;
		border-radius: 10px;
		display: block;
		scroll-snap-align: start;
		min-width: 100%;
		flex-shrink: 0;
	}
	
	.video_publication_content,
	.post_media_item {          
		background:#f4f4f9;     
		object-fit:cover;     
	}
	

	.div_publication_content_images_dots_indicator_container{
		position: absolute;
		bottom: 10px;
		left: 50%;
		transform: translateX(-50%);
		display: flex;
		justify-content: center;
		align-items: center;
		gap: 5px;
	}
	.post_dot_indicator{
		position: relative;
		width: 8px;
		height: 8px;
		border-radius: 50%;
		background-color: white;
		opacity: 0.5;
		transition: 0.3s ease;
	}
	.post_dot_indicator.active{
		opacity: 0.9;
	}

	.div_publication_content_images_arrow_left{
		position: absolute;
		top: 50%;
		left: 10px;
		transform: translateY(-50%);
		cursor: pointer;
	}
	.div_publication_content_images_arrow_right{
		position: absolute;
		top: 50%;
		right: 10px;
		transform: translateY(-50%);
		cursor: pointer;
	}
	.img_publication_content_images_arrow{
		width: 30px;
		height: 30px;
		object-fit: cover;
	}
	

	.text_publication_content_big{
		font-size: 1em;
		font-weight: 500;
		margin: 0;
	}

	.div_publication_footer{
		position: relative;
		display: grid;
		grid-template-columns: 1fr;
		grid-template-rows: 25px auto;
		grid-column-gap: 10px;
		grid-row-gap: 10px;
	}

	.div_publication_footer_buttons{
		position: relative;
		display: grid;
		grid-template-columns: 25px 25px 25px;
		grid-column-gap: 13px;
	}

	.div_publication_like_picture{
		position: relative;
		height: 25px;
		width: 25px;
		display: flex;
		justify-content: center;
		align-items: center;
		cursor: pointer;
	}
	.img_publication_like{
		width: 100%;
		height: 100%;
		object-fit: cover;
	}
	.div_publication_comment_like_picture{
		position: relative;
		height: 20px;
		width: 20px;
		display: flex;
		justify-content: center;
		align-items: center;
		cursor: pointer;
	}

	.div_publication_comment_picture{
		position: relative;
		height: 25px;
		width: 25px;
		display: flex;
		justify-content: center;
		align-items: center;
		cursor: pointer;
	}

	.img_publication_comment{
		width: 100%;
		height: 100%;
		object-fit: cover;
	}

	.div_publication_share_picture{
		position: relative;
		height: 25px;
		width: 25px;
		display: flex;
		justify-content: center;
		align-items: center;
		cursor: pointer;
		display: none;
	}

	.img_publication_share{
		width: 100%;
		height: 100%;
		object-fit: cover;
	}

	.div_publication_footer_text{
		position: relative;
	}

	.div_publication_like_and_comment_count{
		position: relative;
		display: grid;
		grid-template-columns: auto auto;
		width: fit-content;
		grid-column-gap: 15px;
	}
	.text_publication_like_count{
		position: relative;
		font-size: 0.9em;
		font-weight: 700;
		margin-top: 0px;
		margin-bottom: 0;
	}
	.text_publication_comment_count{
		position: relative;
		font-size: 0.9em;
		font-weight: 700;
		margin-top: 0px;
		margin-bottom: 0;
	}

	#div_big_widget_post_actions_container{
		position: relative;
		display: grid;
		grid-template-columns: 1fr;
		grid-template-rows: auto;
		grid-row-gap: 0px;
		margin-bottom: 15px;
	}
	.div_big_widget_post_action{
		font-weight: 600;
		font-size: 1em;
		cursor: pointer;
	}

	#h2_big_widget_new_post_title{
		font-weight: 700;
		font-size: 1em;
	}
	#div_big_widget_new_post_content{
		width: auto;
	}
	#div_big_widget_new_post_content_container{
		position: relative;
		display: grid;
		grid-template-columns: 1fr;
		grid-template-rows: 50px 80px auto auto 35px;
		grid-row-gap: 20px;
		margin-bottom: 30px;
	}
	#div_big_widget_new_post_content_add{
		position: relative;
		background-color: #dbdbdb;
		border-radius: 15px;
		width: 250px;
		min-height: 200px;
		height: auto;
		margin-left: auto;
		margin-right: auto;
		display: grid;
		cursor: pointer;
	}
	#img_big_widget_new_post_content_add{
		position: relative;
		height: 50px;
		width: 50px;
		margin: auto;
		opacity: 0.6;
	}

	#textarea_big_widget_new_post_content{
		border-radius: 15px;
		border: none;
		background-color: white;
		padding: 15px;
		font-size: 0.8em;
		font-weight: 600;
		height: 80px;
		resize: none;
		outline: none;
		box-shadow: none;
		min-width: 400px;
	}

	.div_new_post_content_images {
		display: flex;
		overflow-x: auto;
		scroll-snap-type: x mandatory;
		gap: 10px;
		scroll-behavior: smooth;
		max-width: 540px; 
	}
	
	.div_new_post_content_images > * {
		flex: 0 0 55%; 
		scroll-snap-align: start;
		border-radius: 10px;
		object-fit: cover;
		height: auto; 
		max-width: 300px;
	}

	#div_big_widget_new_post_header{
		position: relative;
		display: grid;
		grid-template-columns: 50px auto;
		grid-column-gap: 10px;
	}

	#div_big_widget_new_post_profil_picture{
		position: relative;
		height: 50px;
		width: 50px;
		border-radius: 50%;
		display: flex;
		justify-content: center;
		align-items: center;
	}
	#img_big_widget_new_post_profil_picture{
		height: 100%;
		width: 100%;
		object-fit: cover;
		border-radius: 50%;
		z-index: 99;
	}
	#text_big_widget_new_post_profil_name{
		position: relative;
		font-size: 1em;
		font-weight: 600;
		margin-top: 0;
		margin-bottom: 0;
		line-height: 50px;
	}

	#div_big_widget_new_post_flight_container{
		position: relative;
		display: flex;
		flex-direction: row;
		gap: 10px;
		overflow-x: auto;
		overflow-y: hidden;
		scroll-snap-type: x mandatory;
		scroll-behavior: smooth;
		width: 540px;
		-ms-overflow-style: none;  /* IE and Edge */
		scrollbar-width: none;  /* Firefox */
		margin-top: 10px;
	}
	#div_big_widget_new_post_flight_container::-webkit-scrollbar {
		display: none; /* Chrome, Safari, and Opera */
	}
	#text_big_widget_new_post_flight_title{
		margin: 0;
		font-size: 1em;
		font-weight: 500;
	}
	.div_big_widget_new_post_flight_item{
		position: relative;
		display: grid;
		background-color: white;
		border-radius: 15px;
		padding: 15px;
		grid-template-rows: 20px 20px;
		width: max-content;
		grid-row-gap: 5px;
		cursor: pointer;
		border: 3px solid white;
		transition: border 0.3s;
	}
	.div_big_widget_new_post_flight_item:hover{
		border: 3px solid #191530;
		box-shadow: 0px 0px 13px 0px rgba(80,80,80,0.05);
	}
	.div_big_widget_new_post_flight_item_top{
		position: relative;
		display: grid;
		grid-template-columns: auto auto; 
		grid-column-gap: 10px;
		font-size: 0.8em;
		font-weight: 600;
		width: 200px;
	}
	.div_big_widget_new_post_flight_item_bottom{
		font-size: 0.8em;
		font-weight: 600;
	}
	#div_big_widget_new_post_flight_details{
		position: relative;
		background-color: white;
		border-radius: 15px;
		padding: 15px;
		width: calc(100% - 30px);
		cursor: pointer;
		transition: border 0.3s;
		margin-top: 10px;
		display: grid;
		grid-template-columns: 1fr;
		grid-template-rows: 30px 30px;
		grid-row-gap: 10px;
	}

	#div_big_widget_new_post_flight_details_top{
		position: relative;
		display: grid;
		grid-template-columns: 30px 1fr;
		grid-column-gap: 10px;
	}
	#div_big_widget_new_post_flight_details_map_icon{
		position: relative;
		height: 30px;
		width: 30px;
		display: flex;
		justify-content: center;
		align-items: center;
	}
	#img_big_widget_new_post_flight_details_map_icon{
		width: 100%;
		height: 100%;
		object-fit: cover;
	}
	#div_big_widget_new_post_flight_details_text{
		position: relative;
		display: grid;
		grid-template-columns: repeat(3, auto);
		grid-template-rows: 1fr;
		grid-column-gap: 11px;
		margin-right: auto;
	}
	#text_big_widget_new_post_flight_details_airport{
		position: relative;
		font-size: 1.2em;
		font-weight: 800;
		margin-top: 0;
		margin-bottom: 0;
		line-height: 30px;
	}
	#text_big_widget_new_post_flight_details_flight_time{
		position: relative;
		font-size: 1.2em;
		font-weight: 500;
		margin-top: 0;
		margin-bottom: 0;
		line-height: 30px;
	}
	#text_big_widget_new_post_flight_details_plane{
		position: relative;
		font-size: 1.2em;
		font-weight: 500;
		margin-top: 0;
		margin-bottom: 0;
		line-height: 30px;
	}
	#text_big_widget_new_post_flight_details_flight_type{
		position: relative;
		font-size: 1.2em;
		font-weight: 500;
		margin-top: 0;
		margin-bottom: 0;
		line-height: 30px;
	}
	#div_big_widget_new_post_flight_details_plane{
		position: relative;
		display: grid;
		grid-template-columns: 30px 1fr;
		grid-column-gap: 10px;
	}
	#div_big_widget_new_post_flight_details_plane_icon{
		position: relative;
		height: 30px;
		width: 30px;
		display: flex;
		justify-content: center;
		align-items: center;
	}
	#img_big_widget_new_post_flight_details_plane_icon{
		width: 100%;
		height: 100%;
		object-fit: cover;
	}

	#div_big_widget_new_post_buttons{
		display: grid;
		align-items: center;
		column-gap: 10px;
		grid-template-columns: 1fr 1fr;
		grid-column-gap: 10px;
	}
	#button_big_widget_new_post_cancel{
		height: 35px;
		border-radius: 10px;
		cursor: pointer;
		background-color: rgb(41, 41, 41);
		color: white;
		font-weight: 600;
		text-align: center;
	  letter-spacing: 0.2px;
	}
	#button_big_widget_new_post_cancel:hover{
		background-color: rgb(81, 81, 81);
	}
	#button_big_widget_new_post_publish{
		height: 35px;
		border-radius: 10px;
		cursor: pointer;
		background-color: rgb(0, 85, 249);
		color: white;
		font-weight: 600;
		text-align: center;
	  letter-spacing: 0.2px;
	}
	#button_big_widget_new_post_publish:hover{
		background-color: rgb(0, 64, 249);
	}

	
	/* ===== Cropper ===== */
	#cropper_container{
		display:flex; flex-direction:column; align-items:center; gap:12px;
		padding:16px;
		max-height:calc(100vh - 160px);
		overflow:auto;
	}
	#cropper_image{
		max-width: 96%;
		max-height: 62vh;      /* ↓ pour ne pas pousser les boutons hors écran */
		object-fit: contain;
		display:block;
		background:#000;
		border-radius:8px;
	}
	.cropper_buttons{
		position: sticky; bottom: 0;
		display:flex; gap:10px; justify-content:center;
		padding:8px 10px; border-radius:8px;
		background:rgba(255,255,255,0.9);
		backdrop-filter: blur(3px);
	}
	.cropper_buttons button{
		padding:8px 12px; background:#191530; color:#fff; border:none; border-radius:5px; cursor:pointer;
	}
	.cropper_buttons button:hover{ background:#2e2e5e; }
    
	/* ===== Préviews upload ===== */
	#new_post_media_container{
		display:flex; gap:10px; overflow-x:auto; scroll-snap-type:x mandatory;
	}

	.media_item{
		position:relative; flex:0 0 280px; scroll-snap-align:center;
	}

	.media_wrapper{
		width:100%;
		aspect-ratio: 1 / 1; /* surchargé en JS selon mono/multi */
		border-radius:10px; background:#000; overflow:hidden;
		display:flex; align-items:center; justify-content:center;
	}

	.media_wrapper img, .media_wrapper video{
		width:100%; height:100%; object-fit: cover; display:block;
	}

	/* Actions overlay */
	.media_actions{
		position:absolute; top:6px; right:6px; display:flex; gap:6px; z-index:2;
	}
	.btn_icon{
		background: rgba(0,0,0,0.55); color:#fff; border:none; border-radius:5px;
		padding:6px 8px; font-size:12px; cursor:pointer;
	}
	.btn_icon:hover{ background: rgba(0,0,0,0.75); }

	
	/* wrapper vidéo + bouton son */
	.post_video_wrapper{
		position: relative;
		width: 100%;
		height: 100%;
	}

	.post_video_wrapper > video.video_publication_content{
		width: 100%;
		height: 100%;
		object-fit: cover;
		display: block;
	}

	/* bouton toggle son */
	.video_sound_toggle{
		position: absolute;
		right: 10px;
		bottom: 10px;
		width: 38px;
		height: 38px;
		border-radius: 999px;
		background: rgba(0,0,0,.55);
		color: #fff;
		border: 3px solid rgba(255,255,255,.45);
		display: flex;
		align-items: center;
		justify-content: center;
		cursor: pointer;
		z-index: 2;
		user-select: none;
		font-size: 16px;
		line-height: 1;
	}
	.video_sound_toggle.is-on{ background: rgba(0,0,0,.8); }
	.video_sound_toggle:focus{ outline: 2px solid rgba(255,255,255,.65); outline-offset: 2px; }
	.video_sound_toggle img{ width:18px; height:18px; display:block; }



	.ratio-toolbar{
		display:flex; 
		align-items:center; 
		gap:8px;
	}

	.ratio-btn{
		display:flex; align-items:center; justify-content:center;
		width:36px; height:36px;
		border:none; border-radius:8px;
		background:#E9E9EE; /* gris quand OFF */
		cursor:pointer;
		transition: background .2s ease;
		outline:none;
		margin-left: auto; 
		margin-right: auto;
	}
	.ratio-btn img{
		width:20px; height:20px; display:block;
		pointer-events:none;
	}

	.ratio-btn.is-active{
		background:#191530; /* fond noir quand ON */
	}


	.div_publication_comment_container{
		position: relative;
		margin-top: 10px;
	}
	.input_publication_comment{
		border-radius: 15px;
		border: 1px solid rgba(100,100,100, 0.2);
		background-color: white;
		padding: 15px;
		font-size: 0.8em;
		font-weight: 400;
		height: 35px;
		resize: none;
		outline: none;
		box-shadow: none;
		cursor: text;
	}
	.div_publication_comment_input{
		display: grid;
		grid-template-rows: auto;
	}

	.button_publication_comment_send{
		height: 35px;
		border-radius: 50px;
		cursor: pointer;
		background-color: #0055f9;
		color: black;
		font-weight: 600;
		text-align: center;
	  	letter-spacing: 0.2px;
		user-select: none;
		-webkit-user-select: none;
	}
	.button_publication_comment_send:hover{
		background-color: rgb(0, 64, 249);
	}
	.img_publication_comment_send{
		position: relative;
		height: 100%;
		width: auto;
		object-fit: cover;
		margin: auto;
	}

	.div_publication_comments{
		position: relative;
		margin-top: 15px;
		display: grid;
		grid-row-gap: 10px;
	}
	.div_publication_comment{
		position: relative;
		width: 100%;
		display: grid;
		grid-template-columns: 40px auto;
		grid-column-gap: 10px;
	}
	.div_publication_comment_content{
		position: relative;
	}
	.div_publication_comment_content_text{
		display: grid;
		grid-template-columns: min-content auto;
		grid-column-gap: 10px;
	}
	.text_publication_comment_profil_name{
		font-weight: 600;
		margin-top: 3px;
		margin-bottom: 3px;
		font-size: 0.9em;
		cursor: pointer;
	}
	.text_publication_comment_content{
		margin-top: 3px;
		margin-bottom: 3px;
		font-size: 0.9em;
		font-weight: 500;
	}
	.text_publication_comment_date{
		margin-top: 3px;
		margin-bottom: 0px;
	}

	.div_publication_comment_input_container{
		display: grid;
		grid-template-columns: auto 75px;
		grid-column-gap: 20px;
		grid-template-rows: 35px;
	}
	.div_publication_comment_response_message{
		position: relative;
		margin-top: 0;
		margin-bottom: 10px;
		font-size: 1em;
		font-weight: 600;
		color: #0055f9;
	}

	.div_publication_comment_right{
		display: grid;
		grid-template-columns: 1fr;
		grid-template-rows: auto auto;
		grid-row-gap: 2px;
	}
	.div_publication_comment_top{
		position: relative;
		display: grid;
		grid-template-columns: auto 20px;
		grid-column-gap: 10px;
		align-items: center;
	}
	.div_publication_comment_bottom{
		display: grid;
		grid-template-columns: auto auto auto auto;
		margin-right: auto;
		width: fit-content;
		grid-column-gap: 20px;
		font-size: 0.9em;
		font-weight: 500;
	}
	.text_publication_comment_date{
		font-weight: 500;
		font-size: 0.9em;
		margin: 0;
	}
	.text_publication_comment_like_count{
		cursor: pointer;
		font-weight: 500;
		font-size: 0.9em;
		margin: 0;
	}
	.text_publication_comment_response_button{
		cursor: pointer;
		font-weight: 500;
		font-size: 0.9em;
		margin: 0;
	}
	.div_publication_comment_actions_button{
		cursor: pointer;
		position: relative;
		height: 20px;
		width: auto;
		display: block;
		justify-content: center;
		align-items: center;
		overflow: hidden;
	}
	.img_publication_comment_actions_button{
		height: 30px;
		width: auto;
		object-fit: cover;
		transform: translateY(-5px);
	}
	.text_publication_comment_print_response_button{
		position: relative;
		cursor: pointer;
		font-weight: 600;
		font-size: 0.7em;
		margin-top: 5px;
		margin-bottom: 0;
	}
	.div_publication_comment_responses_container{
		position: relative;
		margin-top: 15px;
		display: grid;
		margin-bottom: 15px;
		grid-row-gap: 15px;
	}
	.div_publication_comment_profil_picture{
		position: relative;
		height: 40px;
		width: 40px;
		display: flex;
		justify-content: center;
		align-items: center;
		cursor: pointer;
		border-radius: 50%;
	}
	.img_publication_comment_profil_picture{
		height: 100%;
		width: 100%;
		object-fit: cover;
		border-radius: 50%;
		z-index: 99;
	}


	#div_search_bar_container{
		position: relative;
		display: grid;
		grid-template-columns: 1fr;
		grid-template-rows: auto auto;
		background-color: white;
		border-radius: 15px;
		width: 600px;
		margin-left: auto;
		margin-right: auto;
		margin-top: 20px;
		margin-bottom: 10px;
		overflow: hidden;
		transition: height 0.3s ease;
	}
	#div_feed_search_bar_container{
		position: relative;
		display: grid;
		grid-template-columns: 1fr;
		grid-template-rows: 35px auto;
		background-color: white;
		border-radius: 15px;
		width: 600px;
		margin-left: auto;
		margin-right: auto;
		margin-top: 20px;
		margin-bottom: 10px;
		overflow: hidden;
		transition: height 0.3s ease;
	}
	#search_input{
		border-radius: 15px;
		border: none;
		background-color: white;
		padding: 15px;
		font-size: 0.8em;
		font-weight: 400;
		width: auto;
		height: 35px;
		resize: none;
		outline: none;
		cursor: text;
		margin-bottom: 0;
	}
	#div_search_results_list{
		position: relative;
		display: grid;
		grid-template-columns: 1fr;
		grid-row-gap: 20px;
		padding: 20px;
		max-height: 600px;              /* Hauteur max */
		overflow-y: auto;               /* Scroll au-delà */
		transition: all 0.3s ease;      /* Douce transition */
	}
	.div_search_results_item{
		position: relative;
		display: grid;
		grid-template-columns: 50px auto;
		grid-template-rows: 50px;
		grid-column-gap: 10px;
		cursor: pointer;
	}
	.div_search_results_picture{
		position: relative;
		height: 50px;
		width: 50px;
		border-radius: 50%;
		display: flex;
		justify-content: center;
		align-items: center;
	}
	.img_search_results_picture{
		height: 100%;
		width: 100%;
		object-fit: cover;
		border-radius: 50%;
		z-index: 99;
	}
	.text_search_results_name{
		position: relative;
		font-size: 1em;
		font-weight: 600;
		margin-top: 0;
		margin-bottom: 0;
		line-height: 50px;
		cursor: pointer;
	}
	.text_search_results_list_empty{
		position: relative;
		font-size: 1em;
		font-weight: 500;
		margin-top: 20px;
		margin-bottom: 20px;
		text-align: center;
		color: #888;
	}
/* --- /Social Feed --- */


/* --- Plane Page --- */
	#table_widget_plane_specs{
		color: var(--font-dark, black);
		margin-left: 10px;
		margin-right: 10px;
		margin-bottom: 10px;
		width: 200px;
	}

	#plane_picture_config{grid-area: 1 / 1 / 3 / 2;}

	#plane_picture_config {
		width: 250px;
		height: 250px;
		display: flex;
		justify-content: center;
		align-items: center;
		position: relative;
		margin-right: 40px;
		border-radius: 50%;
		background-color: var(--font-dark, black);
	}

	#img_plane_picture_config {
		width: 100%;
		height: 100%;
		object-fit: cover;
		border-radius: 50%;
	}

	#div_big_widget_plane_statistics_flex{
		grid-template-columns: repeat(2, 1fr); 
		grid-column-gap: 20px;
		grid-row-gap: 20px; 
		display: grid;
		width: 100%;
		margin-left: auto;
		margin-right: auto;
		margin-bottom: 25px;
		margin-top: 15px;
		grid-area: 2 / 1 / 6 / 6;
	}
	#div_plane_flights_statistics_table{
		position: relative;
		grid-area: 2 / 1 / 3 / 3;
		background-color: white;
		border-radius: 15px;
	}
	#table_widget_plane_statistics{
		height: 90%;
		max-width: 350px;
		margin-left: auto;
		margin-right: auto;
		margin-top: 25px;
		margin-bottom: 25px;
	}
	#div_plane_generics_files_list{
		grid-area: 1 / 1 / 2 / 6;
		position: relative;
		display: grid;
		grid-template-columns: repeat(5, 1fr);
		padding-bottom: 50px;
		grid-column-gap: 30px;
		grid-row-gap: 30px;
		min-height: 150px;
		overflow: auto;
	}
	#div_plane_files_others_documents{
		grid-area: 2 / 1 / 3 / 6;
	}
	#div_plane_files_others_documents_menu{
		height: 140px;
	}
/* --- /Plane Page --- */


/* --- Social Page --- */
	#div_page_container{
		position: relative;
		display: flex;
		flex-direction: column;
		overflow-y: auto;
		overflow-x: hidden;
		width: 600px;
		margin-top: 60px;
		margin-left: auto;
		margin-right: auto;
	}

	#div_page_header_page_select_container{
		position: relative;
		display: grid;
		grid-column-gap: 7px;
		cursor: pointer;
		grid-template-columns: max-content 20px;
		margin-right: auto;
	}

	#div_page_header_page_select{
		position: relative;
		height: 22px;
		width: 22px;
		align-self: center;
	}
	#img_page_header_page_select{
		position: relative;
		height: 100%;
		width: 100%;
		object-fit: cover;
		transform: rotate(-90deg);
	}


	#div_page_follow_management{
		position: relative;
		display: grid;
		grid-template-columns: auto auto;
		grid-template-rows: auto;
		grid-row-gap: 10px;
		grid-column-gap: 30px;
		background-color: white;
		border-radius: 15px;
		padding: 20px;
		margin-bottom: 20px;
	}
	#text_page_follow_management_title{
		position: relative;
		font-size: 1em;
		font-weight: 500;
		margin-top: 0;
		margin-bottom: 0;
		line-height: 30px;
		color: black;
	}
	#div_page_follow_management_buttons_container{
		display: grid;
		grid-template-columns: 1fr 1fr;
		grid-template-rows: auto;
		grid-column-gap: 10px;
		position: relative;
	}
	#div_page_follow_management_accept_button{
		height: 30px;
		border-radius: 10px;
		cursor: pointer;
		background-color: #0055f9;
		color: white;
		font-weight: 600;
		text-align: center;
		letter-spacing: 0.2px;
		user-select: none;
		-webkit-user-select: none;
	}
	#div_page_follow_management_accept_button:hover{
		background-color: rgb(0, 64, 249);
	}
	#div_page_follow_management_refuse_button{
		height: 30px;
		border-radius: 10px;
		cursor: pointer;
		background-color: #f4f4f9;
		color: black;
		font-weight: 600;
		text-align: center;
		letter-spacing: 0.2px;
		user-select: none;
		-webkit-user-select: none;
	}
	#div_page_follow_management_refuse_button:hover{
		background-color: #e0e0e0;
	}
	.div_page_header_title_container{
		position: relative;
		display: grid;
		grid-template-columns: min-content auto 30px;
		grid-column-gap: 10px;
		align-items: center;
		background-color: none;
    	padding: 20px;
	}
	.text_page_header_title_container{
		font-size: 1em;
		font-weight: 800;
		margin: 0;
		line-height: 35px;
	}
	.text_page_header_title_container::first-letter {
		text-transform: none;
	}
	#div_page_header{
		position: relative;
		display: grid;
		grid-template-columns: 1fr;
		grid-template-rows: auto auto;
		grid-column-gap: 30px;
		background-color: white;
		border-radius: 15px;
		padding: 20px;
		margin-bottom: 10px;
	}
	#div_page_header_picture_and_infos_container{
		position: relative;
		display: grid;
		grid-template-columns: 150px auto;
		grid-column-gap: 20px;
		grid-template-rows: auto;
	}

	#div_page_header_return_button{
		position: relative;
		height: 45px;
		width: 45px;
		border-radius: 50%;
		cursor: pointer;
	}

	#div_page_header_user_pages_select_container{
		position: absolute;
		top: 40px;
		left: -15px;
		min-width: 150px;
		border-radius: 15px;
		background-color: white;
		-webkit-box-shadow: rgba(80, 80, 80, 0.15) 0.2px 0px 13px 0px;
		box-shadow: rgba(80, 80, 80, 0.15) 0.2px 0px 13px 0px;
		color: black;
		z-index: 100;
		padding: 15px;
		transition: 0.3s;
		opacity: 0;
		grid-row-gap: 10px;
	}
	#div_page_header_user_pages_select_personal_page_container{
		position: relative;
		padding-bottom: 10px;
		border-bottom: 0.8px solid rgb(220, 220, 220);
	}
	#div_page_header_user_pages_select_others_pages_container{
		position: relative;
		display: grid;
		grid-template-columns: 1fr;
		grid-row-gap: 10px;
		max-height: 300px;
		overflow-y: auto;
		width: fit-content;
		-ms-overflow-style: none;  /* IE and Edge */
		scrollbar-width: none;  /* Firefox */
	}
	.div_page_header_user_pages_select_item{
		position: relative;
		display: grid;
		grid-template-columns: 30px auto;
		grid-column-gap: 10px;
		cursor: pointer;
	}
	.div_page_header_user_pages_select_item_icon{
		position: relative;
		height: 30px;
		width: 30px;
		border-radius: 50%;
		display: flex;
		justify-content: center;
		align-items: center;
	}
	.img_page_header_user_pages_select_item{
		height: 100%;
		width: 100%;
		object-fit: cover;
		border-radius: 50%;
		z-index: 99;
	}
	.text_page_header_user_pages_select_item{
		line-height: 30px;
		margin: 0;
		cursor: pointer;
		font-size: 0.9em;
		font-weight: 600;
	}

	#div_page_header_user_actions_container{
		position: absolute;
		top: 60px;
		right: 10px;
		width: 190px;
		border-radius: 15px;
		background-color: white;
		-webkit-box-shadow: rgba(80, 80, 80, 0.15) 0.2px 0px 13px 0px;
		box-shadow: rgba(80, 80, 80, 0.15) 0.2px 0px 13px 0px;
		color: black;
		z-index: 100;
		padding: 15px;
		transition: 0.3s;
		opacity: 0;
		grid-row-gap: 15px;
	}
	#div_page_header_user_actions_button{
		position: relative;
		height: 30px;
		width: 30px;
		cursor: pointer;
	}
	#img_page_header_user_actions_button{
		position: absolute;
		height: 100%;
		width: 100%;
		object-fit: cover;
	}
	.div_page_header_user_actions_item{
		position: relative;
		display: grid;
		grid-template-columns: 30px auto;
		grid-column-gap: 10px;
		text-align: left;
		cursor: pointer;
	}

	#div_page_header_picture{
		position: relative;
		height: 150px;
		width: 150px;
		border-radius: 50%;
		display: flex;
		justify-content: center;
		align-items: center;
		margin-top: auto;
		margin-bottom: auto;
		margin-left: auto;
		margin-right: auto;
	}
	#img_page_header_picture{
		height: 100%;
		width: 100%;
		object-fit: cover;
		border-radius: 50%;
		z-index: 99;
	}

	#div_page_header_slug_container{
		position: relative;
		display: grid;
		grid-template-columns: auto 100px;
		grid-column-gap: 20px;
		width: 100%;
	}

	#div_page_header_infos{
		position: relative;
		display: grid;
		grid-template-columns: 1fr;
		grid-template-rows: 40px auto auto;
		margin-top: 10px;
	}

	#div_page_header_name_container{
		position: relative;
		display: grid;
		grid-template-columns: auto 100px;
		grid-column-gap: 10px;
		width: 100%;
	}

	#div_page_header_common_followers{
		position: relative;
		display: grid;
		grid-template-columns: min-content auto;
		grid-column-gap: 10px;
		align-items: center;
		font-size: 0.8em;
		margin-top: 15px;
		cursor: pointer;
	}
	#div_big_widget_common_followers_list_container{
		position: relative;
		display: grid;
		grid-template-columns: 1fr;
		grid-row-gap: 20px;
		background-color: white;
		border-radius: 15px;
		padding: 20px;
		margin-bottom: 10px;
	}
	#div_page_header_common_followers_pictures_container{
		position: relative;
		display: grid;
		grid-template-columns: 15px 15px 15px;
		grid-column-gap: 0px;
		margin-right: 25px;
	}
	.div_page_header_common_follower_picture{
		position: relative;
		height: 40px;
		width: 40px;
		border-radius: 50%;
		border: 2px solid white;
		display: flex;
		justify-content: center;
		align-items: center;
	}
	.img_page_header_common_follower_picture{
		height: 100%;
		width: 100%;
		object-fit: cover;
		border-radius: 50%;
		z-index: 99;
	}
	#text_page_header_common_followers{
		margin: 0;
		font-size: 0.9em;
		font-weight: 500;
	}

	#div_page_header_follow_button{
		height: 30px;
		border-radius: 10px;
		cursor: pointer;
		background-color: #0055f9;
		color: white;
		font-weight: 600;
		text-align: center;
		letter-spacing: 0.2px;
		user-select: none;
		-webkit-user-select: none;
	}
	#div_page_header_follow_button:hover{
		background-color: rgb(0, 64, 249);
	}

	.div_publication_follow_button{
		height: 30px;
		border-radius: 10px;
		cursor: pointer;
		background-color: #0055f9;
		color: white;
		font-weight: 600;
		text-align: center;
		letter-spacing: 0.2px;
		user-select: none;
		-webkit-user-select: none;
		padding-left: 10px;
		padding-right: 10px;
	}
	.div_publication_follow_button:hover{
		background-color: rgb(0, 64, 249);
	}

	#text_page_header_name{
		margin: 0;
		font-size: 1.1em;
		font-weight: 600;
		line-height: 30px;
	}

	#div_page_header_follows_infos_container{
		display: grid;
		grid-template-columns: auto auto auto;
		grid-column-gap: 10px;
		width: 100%;
		font-weight: 400;
		font-size: 1em;
		margin-top: 10px;
	}
	.div_page_header_follows_infos_item{
		display: grid;
		grid-template-columns: min-content min-content;
		grid-column-gap: 5px;
		cursor: pointer;
	}
	.text_page_header_followers_label{
		margin: 0;
		line-height: 20px;
		font-size: 0.9em;
		cursor: pointer;
		font-weight: 400;
	}
	#text_page_header_website{
		margin-top: 0px;
		margin-bottom: 10px;
	}
	#text_page_header_website::first-letter {
		text-transform: none;
	}
	#text_page_header_description{
		margin: 0;
		font-size: 0.9em;
		font-weight: 400;
	}
	#text_page_header_followers_count{
		margin: 0; 
		line-height: 20px;
		font-size: 0.9em;
		font-weight: 600;
	}
	#text_page_header_following_count{
		margin: 0; 
		line-height: 20px;
		font-size: 0.9em;
		font-weight: 600;
	}
	#text_page_header_posts_count{
		margin: 0; 
		line-height: 20px;
		font-size: 0.9em;
		font-weight: 600;
	}

	#div_page_header_pilot_statistics{
		position: relative;
		display: grid;
		grid-template-columns: 1fr;
		grid-row-gap: 15px;
		margin-top: 20px;
	}
	#text_page_header_pilot_statistics_status{
		margin: 0;
		line-height: 20px;
		font-size: 1em;
		font-weight: 500;
	}

	#div_page_header_pilot_statistics_flight_hours_and_frequency{
		position: relative;
		display: grid;
		grid-template-columns: 1fr 1fr 1fr;
		grid-template-rows: auto;	
		grid-column-gap: 20px;
	}
	.div_page_header_pilot_statistics_flight_hours_and_frequency_item{
		position: relative;
		display: grid;
		grid-template-columns: 1fr;
		grid-template-rows: 40px 20px;
		background-color: #f4f4f9;
		border-radius: 15px;
		padding: 10px;
		text-align: center;
	}
	#text_page_header_pilot_statistics_flight_hours{
		margin: 0;
		line-height: 40px;
		font-size: 1.4em;
		font-weight: 700;
	}
	#text_page_header_pilot_statistics_flight_hours_title{
		margin: 0;
		font-size: 0.8em;
		font-weight: 500;
		line-height: 20px;
	}

	#text_page_header_pilot_statistics_flight_frequency{
		margin: 0;
		line-height: 40px;
		font-size: 1.4em;
		font-weight: 700;
	}
	#text_page_header_pilot_statistics_flight_frequency_title{
		margin: 0;
		font-size: 0.8em;
		font-weight: 500;
		line-height: 20px;
	}
	#text_page_header_pilot_statistics_last_flight{
		margin: 0;
		line-height: 40px;
		font-size: 1.4em;
		font-weight: 700;
	}
	#text_page_header_pilot_statistics_last_flight_title{
		margin: 0;
		font-size: 0.8em;
		font-weight: 500;
		line-height: 20px;
	}
	#input_text_page_header_pilot_statistics_status{
		max-width: 150px;
	}
	#div_page_header_pilot_statistics_infos_container{
		position: relative;
		display: grid;
		grid-template-columns: 1fr;
		grid-row-gap: 15px;
	}
	#div_page_header_pilot_statistics_school_container{
		position: relative;
		display: grid;
		grid-template-columns: 25px auto;
		grid-column-gap: 10px;
	}
	#div_page_header_pilot_statistics_school_icon{
		position: relative;
		height: 25px;
		width: 25px;
		display: flex;
		justify-content: center;
		align-items: center;
	}
	#img_page_header_pilot_statistics_school_icon{
		width: 100%;
		height: 100%;
		object-fit: cover;
	}
	#div_page_header_pilot_statistics_school_text{
		position: relative;
		display: block;
		margin-right: auto;
	}
	#text_page_header_pilot_statistics_school{
		position: relative;
		font-size: 1em;
		font-weight: 600;
		margin-top: 0;
		margin-bottom: 0;
		line-height: 25px;
	}

	#div_page_header_pilot_statistics_licenses_selected_container{
		position: relative;
		display: flex;
		flex-wrap: wrap;
		gap: 10px;
		margin-bottom: 15px;
	}
	#div_page_header_pilot_statistics_licenses{
		position: relative;
		display: flex;
		flex-wrap: wrap;
		gap: 10px;
	}
	.div_page_header_pilot_statistics_licenses_selected_item{
		position: relative;
		display: grid;
		grid-template-columns: 1fr;
		grid-template-rows: auto max-content;
		grid-row-gap: 3px;
		background-color: #f4f4f9;
		border-radius: 10px;
		padding-top: 5px;
		padding-bottom: 5px;
		padding-left: 10px;
		padding-right: 10px;
		text-align: center;
		cursor: default;
	}
	.text_page_header_pilot_statistics_licenses_selected_item_label{
		position: relative;
		font-size: 0.7em;
		font-weight: 600;
		margin: 0;
		text-align: center;
	}
	.div_page_header_pilot_statistics_licenses_selected_item_icon{
		position: relative;
		height: 20px;
		width: 20px;
		display: flex;
		justify-content: center;
		align-items: center;
		margin-left: auto;
		margin-right: auto;
	}
	.img_page_header_pilot_statistics_licenses_selected_item_icon_img{
		height: 100%;
		width: auto;
		object-fit: cover;
		z-index: 99;
	}
	.img_page_header_pilot_statistics_licenses_selected_item_remove_icon{
		position: absolute;
		top: 5px;
		right: 5px;
		height: 20px;
		width: 20px;
		cursor: pointer;
	}
	#div_page_header_pilot_statistics_licenses_select{
		position: relative;
		display: grid;
		grid-template-columns: 1fr 120px;
		grid-column-gap: 10px;
		align-items: baseline;
	}
	#div_page_header_pilot_statistics_licenses_select_add_button{
		height: 30px;
		width: 120px;
		border-radius: 10px;
		cursor: pointer;
		background-color: #0055f9;
		color: white;
		font-weight: 600;
		text-align: center;
		letter-spacing: 0.2px;
		user-select: none;
		-webkit-user-select: none;
	}
	#div_page_header_pilot_statistics_licenses_select_add_button:hover{
		background-color: rgb(0, 64, 249);
	}


	#div_page_header_pilot_statistics_airport_container{
		position: relative;
		display: grid;
		grid-template-columns: 25px auto;
		grid-column-gap: 10px;
	}
	#div_page_header_pilot_statistics_map_icon{
		position: relative;
		height: 25px;
		width: 25px;
		display: flex;
		justify-content: center;
		align-items: center;
	}
	#img_page_header_pilot_statistics_map_icon{
		width: 100%;
		height: 100%;
		object-fit: cover;
	}
	#div_page_header_pilot_statistics_airport_text{
		position: relative;
		display: block;
		margin-right: auto;
	}
	#text_page_header_pilot_statistics_base_airport{
		position: relative;
		font-size: 1em;
		font-weight: 600;
		margin-top: 0;
		margin-bottom: 0;
		line-height: 25px;
	}
	#div_page_header_pilot_statistics_plane_container{
		position: relative;
		display: grid;
		grid-template-columns: 25px auto;
		grid-column-gap: 10px;
	}
	#div_page_header_pilot_statistics_plane_icon{
		position: relative;
		height: 25px;
		width: 25px;
		display: flex;
		justify-content: center;
		align-items: center;
	}
	#img_page_header_pilot_statistics_plane_icon{
		width: 100%;
		height: 100%;
		object-fit: cover;
	}
	#text_page_header_pilot_statistics_plane{
		position: relative;
		font-size: 1em;
		font-weight: 600;
		margin-top: 0;
		margin-bottom: 0;
		line-height: 25px;
	}

	#div_feed_page_container{
		position: relative;
		display: flex;
		flex-direction: column;
		overflow-y: auto;
		overflow-x: hidden;
		width: 600px;
		margin-left: auto;
		margin-right: auto;
	}

	#div_big_widget_following_list_container{
		position: relative;
		display: grid;
		grid-template-columns: 1fr;
		grid-row-gap: 20px;
		background-color: white;
		border-radius: 15px;
		padding: 20px;
		margin-bottom: 10px;
	}
	#div_big_widget_followers_list_container{
		position: relative;
		display: grid;
		grid-template-columns: 1fr;
		grid-row-gap: 20px;
		background-color: white;
		border-radius: 15px;
		padding: 20px;
		margin-bottom: 10px;
	}
	#div_big_widget_post_likes_list_container{
		position: relative;
		display: grid;
		grid-template-columns: 1fr;
		grid-row-gap: 20px;
		background-color: white;
		border-radius: 15px;
		padding: 20px;
		margin-bottom: 10px;
	}
	.div_big_widget_follower_item{
		position: relative;
		display: grid;
		grid-template-columns: 50px auto 130px;
		grid-template-rows: 50px;
		grid-column-gap: 10px;
		cursor: pointer;
	}
	.div_big_widget_follower_picture{
		position: relative;
		height: 50px;
		width: 50px;
		border-radius: 50%;
		display: flex;
		justify-content: center;
		align-items: center;
	}
	.div_big_widget_follower_picture::first-letter {
		text-transform: none;
	}

	.div_big_widget_follower_button{
		height: 30px;
		border-radius: 10px;
		cursor: pointer;
		background-color: #0055f9;
		color: white;
		font-weight: 600;
		text-align: center;
		letter-spacing: 0.2px;
		margin-top: auto;
		margin-bottom: auto;
		user-select: none;
		-webkit-user-select: none;
		margin-left: 30px;
	}
	.img_big_widget_follower_picture{
		height: 100%;
		width: 100%;
		object-fit: cover;
		border-radius: 50%;
		z-index: 99;
	}
	.text_big_widget_follower_name{
		position: relative;
		font-size: 1em;
		font-weight: 600;
		margin-top: 0;
		margin-bottom: 0;
		line-height: 50px;
		cursor: pointer;
	}
	.text_big_widget_followers_list_empty{
		position: relative;
		font-size: 1em;
		font-weight: 500;
		margin-top: 20px;
		margin-bottom: 20px;
		text-align: center;
		color: #888;
	}


	#div_update_page_header_infos{
		position: relative;
		display: block;
		margin-top: 10px;
	}
	#div_page_header_update_picture_button{
		height: 30px;
		border-radius: 10px;
		cursor: pointer;
		background-color: #f4f4f9;
		color: black;
		font-weight: 600;
		text-align: center;
		letter-spacing: 0.2px;
		margin-top: 15px;
		user-select: none;
		-webkit-user-select: none;
	}
	#div_page_header_update_picture_button:hover{
		background-color: #e0e0e0;
	}

	#div_page_header_delete_picture_button{
		height: 30px;
		border-radius: 10px;
		cursor: pointer;
		background-color: #f4f4f9;
		color: #c0392b;
		font-weight: 600;
		text-align: center;
		letter-spacing: 0.2px;
		margin-top: 15px;
		user-select: none;
		-webkit-user-select: none;
	}
	#div_page_header_delete_picture_button:hover{
		background-color: #e0e0e0;
	}

	#div_page_header_update_validation_button{
		height: 30px;
		border-radius: 10px;
		cursor: pointer;
		background-color: #0055f9;
		color: white;
		font-weight: 600;
		text-align: center;
		letter-spacing: 0.2px;
		user-select: none;
		-webkit-user-select: none;
	}
	#div_page_header_update_validation_button:hover{
		background-color: rgb(0, 64, 249);
	}

	#input_text_page_header_slug{
		border-radius: 10px;
		border: 1px solid rgba(100,100,100, 0.2);
		padding: 10px;
		font-size: 0.8em;
		font-weight: 400;
		height: 35px;
		resize: none;
		outline: none;
		box-shadow: none;
		cursor: text;
	}
	#input_text_page_header_name{
		border-radius: 10px;
		border: 1px solid rgba(100,100,100, 0.2);
		padding: 10px;
		font-size: 0.8em;
		font-weight: 400;
		height: 35px;
		resize: none;
		outline: none;
		box-shadow: none;
		cursor: text;
	}
	#div_text_page_header_slug_message{
		font-size: 0.8em;
		margin-top: 5px;
		display: none;
		position: relative;
		height: 20px;
		font-weight: 500;
	}
	#input_text_page_header_website{
		border-radius: 10px;
		border: 1px solid rgba(100,100,100, 0.2);
		padding: 10px;
		font-size: 0.8em;
		font-weight: 400;
		height: 35px;
		resize: none;
		outline: none;
		box-shadow: none;
		cursor: text;
	}
	#textarea_page_header_description{
		border-radius: 10px;
		border: 1px solid rgba(100,100,100, 0.2);
		padding: 10px;
		font-size: 0.8em;
		font-weight: 400;
		height: 80px;
		resize: none;
		outline: none;
		box-shadow: none;
		cursor: text;
	}

	#input_page_header_pilot_statistics_plane{
		border-radius: 10px;
		border: 1px solid rgba(100,100,100, 0.2);
		padding: 10px;
		font-size: 0.8em;
		font-weight: 400;
		height: 35px;
		resize: none;
		outline: none;
		box-shadow: none;
		cursor: text;
	}
	#div_page_header_pilot_page_visibility{
		position: relative;
		display: grid;
		grid-template-columns: 30px auto;
		grid-column-gap: 10px;	
	}
	#div_page_header_pilot_page_same_school_visibility{
		position: relative;
		display: grid;
		grid-template-columns: 30px auto;
		grid-column-gap: 10px;	
	}

	#text_feed_page_message{
		position: relative;
		font-size: 0.9em;
		font-weight: 500;
		margin-top: 20px;
		margin-bottom: 20px;
		text-align: center;
		color: #888;
		padding: 10px;
	}

	#div_page_header_disable_page_button_container{
		position: relative;
		display: grid;
		grid-template-columns: 1fr;
		grid-template-rows: auto;
		margin-top: 20px;
	}
	#div_page_header_disable_page_button{
		height: 30px;
		width: 200px;
		margin: auto;
		border-radius: 10px;
		cursor: pointer;
		background-color: #f4f4f9;
		color: black;
		font-weight: 600;
		text-align: center;
		letter-spacing: 0.2px;
		user-select: none;
		-webkit-user-select: none;
	}
	#div_page_header_disable_page_button:hover{
		background-color: #e0e0e0;
	}

	#div_page_actions_button{
		cursor: pointer;
		position: relative;
		width: auto;
		height: 35px;
		display: block;
		justify-content: center;
		align-items: center;
		overflow: hidden;
	}
	#img_page_actions_button{
		width: auto;
		height: 35px;
		object-fit: cover;
	}

	#div_feed_page_recommendations{
		position: relative;
		margin-bottom: 10px;
	}
	.div_feed_reco_block{
		position: relative;
		margin-bottom: 10px;
		margin-left: 15px;
		margin-right: 15px;
		overflow: hidden;
	}
	#div_feed_page_recommendations_container{
		position: relative;
		display: flex;
		flex-direction: row;
		gap: 10px;
	}
	.div_feed_page_recommendations_container_inline{
		position: relative;
		display: flex;
		flex-direction: row;
		gap: 10px;
		overflow-x: auto;
	}
	.div_feed_page_reco_item{
		display: grid;
		grid-template-columns: 1fr;
		grid-template-rows: 56px 58px 30px;
		align-items: center;
		gap: 10px;
		padding: 10px 12px;
		background-color: white;
		border-radius: 15px;
		transition: transform 0.12s;
		justify-items: center;
		width: 130px;
		min-width: 130px;
		cursor: pointer;
	}
	.div_feed_page_reco_picture{
		height: 56px;
		width: 56px;
		border-radius: 50%;
		display: flex;
		justify-content: center;
		align-items: center;
	}
	.img_feed_page_reco_picture{
		height: 100%;
		width: 100%;
		object-fit: cover;
		border-radius: 50%;
		z-index: 99;
	}

	.div_feed_page_reco_center{
		display: flex;
		flex-direction: column;
		align-items: center;
		text-align: center;
		gap: 5px;
		margin-bottom: auto;
	}

	.text_feed_page_reco_slug {
		margin: 0;
		font-weight: 600;
		color: black;
		font-size: 0.9em;
		white-space: nowrap;
		overflow: hidden;
		text-overflow: ellipsis;
		max-width: 130px;
	}
	.div_feed_page_reco_follow_btn{
		height: 30px;
		border-radius: 10px;
		cursor: pointer;
		background-color: #0055f9;
		color: white;
		font-weight: 600;
		text-align: center;
		letter-spacing: 0.2px;
		user-select: none;
		-webkit-user-select: none;
		padding-left: 15px;
    	padding-right: 15px;
	}
	.div_feed_page_reco_follow_btn:hover{
		background-color: rgb(0, 64, 249);
	}

	/* Chips "raisons" */
	.div_feed_page_reco_reasons {
		display: flex;
		flex-wrap: wrap;
		gap: 6px;
	}

	.chip_feed_page_reco_reason {
		display: inline-flex;
		align-items: center;
		gap: 6px;
		padding: 4px 8px;
		border-radius: 999px;
		background: #f4f4f9;
		color: #30323a;
		font-size: 0.78rem;
		line-height: 1;
		border: 1px solid #e7e9ee;
		user-select: none;
	}
	

/* --- /Social Page --- */



/* --- Bannière ajout PWA --- */
	.flightly-a2hs-banner{
		position:fixed; left:50%; bottom:16px; transform:translateX(-50%) translateY(20px);
		background:#191530; color:#fff; padding:12px 14px; border-radius:12px;
		box-shadow:0 8px 20px rgba(0,0,0,.25); z-index:9999;
		display:flex; gap:12px; align-items:center; opacity:0;
		transition:transform .15s ease, opacity .15s ease;
		max-width: 92vw;
	}
	.flightly-a2hs-banner.is-visible{ transform:translateX(-50%) translateY(0); opacity:1; }
	.flightly-a2hs-banner.is-leaving{ transform:translateX(-50%) translateY(10px); opacity:0; }

	.flightly-a2hs-banner__text{ font-size:.95em; }
	.flightly-a2hs-banner__actions{ display:flex; gap:8px; align-items:center; }

	.flightly-a2hs-btn{
		border:0; border-radius:8px; padding:6px 10px; cursor:pointer; font:inherit;
	}
	.flightly-a2hs-btn--primary{ background:#fff; color:#191530; }
	.flightly-a2hs-btn--ghost{ background:transparent; color:#fff; border:1px solid rgba(255,255,255,.35); }

	.flightly-a2hs-banner__hint{ font-size:.9em; opacity:.9; }
/* --- /Bannière ajout PWA --- */


@media screen and (max-width: 1475px) {
	#div_pilot_balance_widgets_container{
		grid-template-columns: repeat(4, auto);
	}

	#div_plane_resum{
		grid-template-columns: repeat(4, 1fr);
	}
	#div_plane_statistics{
		grid-template-columns: repeat(4, 1fr);
	}
	#div_big_widget_plane_statistics_flex{
		grid-area: 2 / 1 / 6 / 5;
	}
}

@media screen and (max-width: 1300px) {
	#div_pilot_training_widgets_container{
		grid-area: 1 / 1 / 2 / 6;
	}
	#div_pilot_training_widget_details{
		grid-area: 2 / 1 / 3 / 6;
		max-height: 400px;
	}
	#div_pilot_training_widget_classes{
		grid-area: 3 / 1 / 4 / 6;
		max-height: 400px;
	}
	#div_plane_resum{
		grid-template-columns: repeat(3, 1fr);
	}
	#div_plane_statistics{
		grid-template-columns: repeat(3, 1fr);
	}
	#div_big_widget_plane_statistics_flex{
		grid-area: 3 / 1 / 6 / 4;
	}
}

@media screen and (min-width: 1125px) and (max-width: 1300px) {
	.h1_container_title{
		font-size: 1.5em;
	}
	.h2_container_subtitle {
		font-size: 0.9em;
	}
	.p_widget_text{
		font-size: 1em;
	}

	/* --- SGS Page --- */
		#button_add_new_report{
			height: 25px;
			width: 100px;
			font-size: 0.8em;
		}
	/* --- /SGS Page --- */

	/* --- Plane Page --- */
		#div_plane_maintenance{
			grid-template-columns: repeat(2, 1fr);
			grid-column-gap: 20px;
			grid-row-gap: 20px;
		}
		#div_container_maintenance_infos{
			grid-area: 1 / 1 / 2 / 3;
			min-height: 250px;
		}
		#div_container_list_maintenance_operations{
			grid-area: 2 / 1 / 3 / 3;
			min-height: 250px;
		}
		#div_maintenance_operation_details_container{
			grid-area: 3 / 1 / 4 / 3;
		}
		#button_add_maintenance_operation{
			top: 12.5px;
			height: 25px;
			width: 100px;
			font-size: 0.8em;
		}
	/* --- /Plane Page --- */

	#div_pilot_files_widgets_container{
		grid-template-columns: repeat(2, max-content);
	}
}

@media screen and (max-width: 1125px) {
/* --- General Style --- */
	body{
		margin: 0;
	}
	.div_container{
		min-width: 300px;
		margin-left: 20px;
		margin-right: 20px;
		left: 0;
		bottom: 10px;
	}
	#div_menu_bar {
	    bottom: 0;
	    top: auto;
	    left: 0;
	    width: 100%;
	    height: 80px;
	    display: flex;
	    justify-content: space-around;
	    align-items: center;
	    border-radius: 0;
	    margin: 0;
	}

	#div_menu_bar_logo {
		display: none;
	}

	.div_menu_bar_inputs {
		margin-top: 0;
		height: 45px;
		width: 45px;
	}
	.p_menu_bar_input_titles {
		display: none;
	}
	#add_new_flight_button{
		margin-bottom: 0px;
	}
	.h1_container_title{
		font-size: 1.2em;
		margin: 0;
	}
	.h2_container_subtitle{
		font-size: 0.8em;
		margin: 0;
	}
	#div_profil_button_bubble{
		height: 40px;
		width: 40px;
		top: 5px;
	}
	label{
		font-size: 1em;
	}
	h2{
		font-size: 1.2em;
	}
	.img_widget_icon{
		height: 20px;
		top: 10px;
	}
	.close_big_widget{
		height: 40px;
		width: 40px;
	}
	#div_return_button {
		top: 0px;
		height: 35px;
		width: 35px;
	}
	#div_page_header_return_button{
		top: 0px;
		height: 35px;
		width: 35px;
	}

	.img_control_button{
		height: 40px;
		top: 60px;
	}
	#big_image_pdf {
		max-width: 80%;
		min-width: 80%;
		height: 70%;
	}
	#div_settings_files_container{
		grid-column-gap: 20px;
		grid-row-gap: 20px;
	}
	.p_div_files_others_documents{
		font-size: 0.9em;
	}
	.h2_files_others_documents_mosaic_title{
		font-size: 0.9em;
	}
	.div_files_element{
		min-width: 80px;
		grid-row-gap: 5px;
	}
	.img_div_files{
		max-height: 40px;
		width: 40px;
	}
	.img_div_files_upload_icon{
		top: 5px;
		right: 5px;
		height: 20px
	}
	.div_other_files_element{
		min-width: 80px;
		grid-row-gap: 5px;
	}
/* --- /General Style --- */

/* --- Plane Page --- */
	#plane_picture_config{
		height: 120px;
		width: 120px;
		margin: auto;
		margin-bottom: 50px;
	}
	#button_modify_pilot_picture{top: 85%;}
	#button_delete_pilot_picture{top: 115%;}
	#div_plane_management{
		grid-template-columns: repeat(1, 1fr);
	}
	#div_plane_management_data{
		margin-top: 50px;
	}

	#table_widget_plane_specs{
		width: auto;
	}

	#div_plane_maintenance{
		grid-template-columns: repeat(2, 1fr);
		grid-column-gap: 20px;
		grid-row-gap: 20px;
	}
	#div_container_maintenance_infos{
		grid-area: 1 / 1 / 2 / 3;
		min-height: 250px;
	}
	#div_container_list_maintenance_operations{
		grid-area: 2 / 1 / 3 / 3;
		min-height: 250px;
	}
	#div_maintenance_operation_details_container{
		grid-area: 3 / 1 / 4 / 3;
	}
	#button_add_maintenance_operation{
		top: 12.5px;
		height: 25px;
		width: 100px;
		font-size: 0.8em;
	}
/* --- /Plane Page --- */

/* --- Pilot Page --- */
	#div_pilot_management{
		grid-template-columns: repeat(1, 1fr);
		max-width: 400px;
		margin: auto;
	}
	#div_pilot_management_data{
		margin-top: 50px;
	}

	#pilot_picture_config{
		grid-area: 1 / 1 / 2 / 2;
		height: 120px;
		width: 120px;
		margin: auto;
		margin-bottom: 50px;
	}
	
	#div_pilot_informations{grid-area: 2 / 1 / 3 / 2;}
	#div_widget_link_user{grid-area: 5 / 1 / 6 / 2;}
	#div_widget_training_2{grid-area: 1 / 1 / 2 / 2;}

	.div_container_flights_list{grid-area: 6 / 1 / 7 / 3; overflow: hidden; min-width: 0px; max-width: 100%;}
	.div_container_transactions_list{
		grid-area: 4 / 1 / 8 / 3; 
		overflow: hidden; 
		min-width: 0px; 
		max-width: 100%;
		max-height: 50vh;
	}
	.div_container_slots_list{min-width: 0; overflow: auto;}

	#div_list_vols{
		overflow-y: scroll;
	}
	#div_list_transactions{
		max-height: calc(100% - 89px);
		overflow-y: scroll;
	}

	#div_big_widget_training_program{
		margin-left: 20px;
		margin-right: 20px;
		font-size: 0.8em;
		padding-bottom: 20px;
	}
	.flight-item{
		font-size: 0.6em;
	}

	#div_pilot_statistics_widgets_container{
		grid-template-columns: repeat(2, auto);
	}
	#div_pilot_flights_statistics_table{
		grid-area: 2 / 1 / 3 / 5;
	}
	#table_widget_pilot_statistics{
		font-size: 0.8em;
	}
	#table_widget_pilot_nb_hours_by_plane{
		font-size: 0.8em;
	}
	#div_pilot_flights_statistics_nb_hours_by_plane_table{
		grid-area: 3 / 1 / 4 / 5;
	}

	.div_sub_menu_page_item{
		min-width: 40px;
		font-size: 0.8em;
		padding-left: 10px;
		padding-right: 10px;
	}
/* --- /Pilot Page --- */


/* --- Pilot params Page --- */

/* --- /Pilot params Page --- */


/* --- Flight Page --- */
	#div_widget_instructeur_vol{grid-area: 6 / 2 / 7 / 3;}
	#div_widget_conditions_vol{grid-area: 4 / 2 / 5 / 3;}
	#div_widget_evaluation_vol{grid-area: 6 / 1 / 7 / 2;}
	#div_widget_notes_vol{grid-area: 4 / 1 / 5 / 2; min-width: 100px}
	#div_widget_suite_vol{grid-area: 7 / 1 / 8 / 2;}
	#div_widget_pictures{grid-area: 5 / 2 / 6 / 3;}
	#div_widget_signature_vol{grid-area: 7 / 2 / 8 / 3; cursor: pointer; min-width: 100px;}
	#div_widget_mini_map{grid-area: 5 / 1 / 6 / 2;}
	.flight_basic_details_container {grid-area: 1 / 1 / 4 / 3;}

	h3{
		font-size: 0.9em;
	}

	p{
		font-size: 0.7em;
	}
	.flight_basic_details_label{
		font-size: 0.9em;
	}
	.flight_basic_details_value{
		font-size: 0.7em;
	}

	#div_little_container_flight{
		width: 100%;
		grid-row-gap: 15px;
	}
	.h1_flight_travel_airports{
		font-size: 1.3em;
		top: 55px;
	}
	.h2_flight_travel_airports_name{
		font-size: 0.9em;
		top: 75px;
	}
	#div_flight_travel_airports_line{
		top: 27px;
		width: 80%;
	}
	#div_flight_travel_airports_icon{
		height: 42.5px;
		width: 42.5px;
	}
	#div_flight_travel_steps{
		margin-top: 70px;
		height: 70px;
	} 

	#div_flight_pilots{
		min-height: 160px;
	}
	.div_flight_pilots_icon{
		height: 50px;
		width: 50px;
	}
	#div_flight_pilots_icon_right{
		right: 15px;
		top: 85px;
	}
	#div_flight_pilots_icon_left{
		left: 15px;
	}
	#h1_flight_pilots_left{
		left: 70px;
		font-size: 1em;
	}
	#h2_flight_pilots_status_left{
		left: 70px;
		top: 65px;
		font-size: 0.8em;
	}
	#h1_flight_pilots_right{
		right: 70px;
		top: 100px;
		font-size: 1em;
	}
	#h2_flight_pilots_status_right{
		right: 70px;
		top: 125px;
		font-size: 0.8em;
	}

	#div_flight_widgets{
		grid-row-gap: 15px;
		grid-column-gap: 15px;
	}

	#div_flight_widgets_info{
		min-width: max(200px, 40vw);
	}
	.div_flight_infos_icon{
		height: 25px;
		width: 25px;
	}
	.p_flight_infos_text{
		font-size: 0.8em;
		left: 50px;
	}
	
	.div_flight_plane_icon{
		height: 25px;
		width: 25px;
		left: initial;
		right: 10px;
		top: 10px;
	}
	#p_flight_plane_text{
		font-size: 0.8em;
		left: 15px;
	}
	.p_flight_school_text{
		font-size: 0.8em;
	}

	#div_flight_widgets_creator{
		min-height: 110px;
	}

	#input_p_flight_infos_text_start_date{
		top: 15px;
		left: 55px;
	}
	#input_p_flight_infos_text_end_date{
		top: 55px;
		left: 55px;
	}
	#input_p_flight_infos_text_time_engine_hours_before{
		top: 15px;
		left: 55px;
	}
	#input_p_flight_infos_text_time_engine_hours_after{
		top: 55px;
		left: 55px;
	}
	#input_p_flight_infos_text_time_engine_2_hours_before{
		top: 95px;
		left: 55px;
	}
	#input_p_flight_infos_text_time_engine_2_hours_after{
		top: 135px;
		left: 55px;
	}
	#input_p_flight_infos_text_nb_landing_number{
		top: 15px;
		left: 55px;
	}
	#input_p_flight_infos_text_cost{
		top: 15px;
		left: 55px;
	}
	#flight_basic_details_cost_alert_message{
		font-size: 0.6em;
	}

	#select_h1_flight_pilots_left{
		top: 40px;
		left: 65px;
	}
	#select_h1_flight_pilots_right{
		top: 40px;
		right: 65px;
	}
	#input_p_flight_widgets_notes_text{
		top: 45px;
		width: 150px;
	}
	#select_p_flight_plane_text{
		top: 45px;
		left: 15px;
		width: 140px;
	}
	#input_p_flight_school_text_next_flight{
		left: 55px;
		width: 100px;
	}

	#div_landing_fees_details{
		padding-top: 20px;
	}
	#img_landing_fees_details_close_icon{
		display: block;
	}
	#div_METAR_details{
		padding-top: 20px;
	}
	#img_METAR_details_close_icon{
		display: block;
	}

	#p_engine_right_hours_motor_before_indicator_text{
		margin-right: 17px;
	}
	#p_engine_right_hours_motor_after_indicator_text{
		margin-right: 17px;
	}
/* --- /Flight Page --- */

/* --- CLass Page --- */
	#div_little_container_class{
		width: 100%;
		grid-row-gap: 20px;
	}
	#div_class_widgets{
		grid-row-gap: 20px;
		grid-column-gap: 20px;
	}
	#div_class_widgets_info{
		min-width: max(200px, 40vw);
	}

	#div_class_widgets_creator{
		min-height: 110px;
	}
	#div_class_pilots{
		min-height: 160px;
	}
/* --- /Class Page --- */



/* --- SGS Page --- */
	#div_container_security_messages_list{
		grid-area: 4 / 1 / 6 / 4;
	}
	#div_container_reports_list{
		grid-area: 2 / 1 / 4 / 4;
	}
	#p_big_widget_report_details_plane_registration{
		font-size: 1.5em;
	}
	#div_big_widget_report_details_plane_infos{
		grid-template-columns: 70px 1fr;
	}
	#div_big_widget_report_details_plane_picture{
		height: 70px;
		width: 70px;
	}
	#existing-photo-preview-container{
		height: 90px;
	}
	.div_big_widget_report_details_status_item{
		font-size: 0.7em;
	}
	.report-comment-item{
		font-size: 0.7em;
	}
	#div_big_widget_report_details_notes{
		grid-area: 4/1/5/7;
	}
	#div_big_widget_report_details_actions{
		grid-area: 5/1/6/7;
	}
	#div_big_widget_report_details_manager_and_creator{
		grid-area: 3/3/4/7;
	}
	#div_big_widget_report_details_pictures{
		grid-area: 2/1/3/3;
	}
	#div_big_widget_report_details_comments{
		grid-area: 3/1/4/3;
	}
	#div_big_widget_report_details_infos {
		grid-template-rows: 50px 60px 230px auto;
		grid-template-columns: 120px 70px 90px 140px 0px auto;
	}
	#h2_big_widget_report_details_title_text{
		font-size: 1em;
	}
	#h2_big_widget_report_details_number_text{
		font-size: 1em;
	}
	#p_big_widget_report_details_type_text{
		font-size: 1em;
	}

/* --- /SGS Page --- */


/* --- Link User Page --- */
	#link_user_title{
		top: 40px;
		font-size: 1.2em;
		width: 80%;
	}
	#link_user_subtitle{
		top: 100px;
		left: 50%;
		font-size: 0.8em;
		width: 80%;
	}
	#profil_pilot_link_div{
		top: 200px;
		width: 80%;
		max-width: 400px;
	}
	#link_user_link_button{
		top: 550px;
	}
/* --- /Link User Page --- */


/* --- Book slot Page --- */
	#div_book_slot_container{
		width: 100%;
	}
	#h1_book_slot_title{
		font-size: 1.2em;
		padding-left: 70px;
		padding-right: 70px;
		margin-top: 30px;
	}
	#slot_hours{
		font-size: 2em;
		margin-top: 140px;
	}
	#slot_duration_buttons{
		top: 210px;
	}
	#plane_select{
		width: 90%;
		left: 5%;
		transform: translateX(0);
	}
	#slot_ressources_select_planes_list{
		width: 100%;
	}
	#instructor_select{
		width: 90%;
		top: 55px;
		right: 5%;
		transform: translateX(0);
	}
	#slot_ressources_select_instructors_list{
		width: 100%;
	}
/* --- /Book slot Page --- */



/* --- Calendar Page --- */
	.week_button_calendar{
		margin-top: 10px;
		height: 35px;
	}
	#previous_week_button{
		left: 50%;
		transform: translateX(-110px);
		width: 35px;
	}
	#today_week_button{
		left: 50%;
		transform: translateX(-50%);
		width: 130px;
	}
	#next_week_button{
		left: 50%;
		transform: translateX(75px);
		width: 35px;
	}
	#previous_week_button_2{
		left: 50%;
		transform: translateX(-150px);
	}
	#next_week_button_2{
		left: 50%;
		transform: translateX(120px);
	}
	#calendar_container{
		top: 150px;
	}
	#div_time_sunset_sunrise_container{
		top: 110px;
		height: 30px;
	}
	#p_time_aviation_sunrise{
		left: 0;
	}
	#div_time_sunrise_image{
		left: 60px;
	}
	#p_time_sunrise{
		left: 95px;
	}
	#p_time_aviation_sunset{
		right: 0;
	}
	#div_time_sunset_image{
		right: 60px
	}
	#p_time_sunset{
		right: 95px;
	}
	.p_time_sunset_sunrise{
		line-height: 30px;
	}
	#div_filters_calendar{
		top: 150px;
	}
	#print_create_new_slot{
		top: 70px;
		width: 40px;
	}
	#print_filters{
		top: 70px;
		display: block;
		right: 80px;
		width: 40px;
	}
	.slot_header{
		padding-top: 15px;
		padding-bottom: 15px;
	}
	.hour_item{
		height: 30px;
	}
	.ressource_item{
		font-size: 0.7em;
		padding-left: 10px;
		padding-right: 10px;
		min-width: auto;
	}
	#week_displayed{
		top: 70px;
		left: 0;
		transform: translateX(-0%);
	}
	#day_displayed{
		top: 80px;
		left: 0;
		font-size: 1em;
		transform: translateX(-0%);
	}
	.slot_type_selector {
		width: 3rem;
		height: 3rem;
	}
	.slot_type_selector_text {
		font-size: 0.6em;
	}
/* --- /Calendar Page --- */


	.div_create_new_flight_container{
		grid-area: 1 / 1 / 6 / 6;
	}
	.texte_selecteur{
		font-size: 0.8em;
	}
	.p_sub_label_create_new_flight{
		font-size: 1.5em;
	}
	.selecteur_nature_vol_container {
	  justify-content: space-around;
	}
	.selecteur_meteo_container {
	  justify-content: space-around;
	}
	.selecteur_evaluation_container {
	  justify-content: space-around;
	}
	.selecteur_nature_vol {
	  width: 3.5rem;
	  height: 3.5rem;
	}
	.selecteur_meteo {
	  width: 3.5rem;
	  height: 3.5rem;
	}

	.selecteur_evaluation {
	  width: 3.5rem;
	  height: 3.5rem;
	}

	.selecteur_nature_vol img {
	  width: 2rem;
	  height: 2rem;
	}
	.selecteur_meteo img {
	  width: 2rem;
	  height: 2rem;
	}
	.selecteur_evaluation img {
	  width: 2rem;
	  height: 2rem;
	}
	#div_airports_create_new_flight{
		margin-left: 10px;
	}


	#pilots_list{
		grid-template-columns: repeat(4, 1fr); 
		grid-column-gap: 20px;
		grid-row-gap: 20px; 
	}
	.pilote {
		min-width: 50px;
		font-size: 8px;
	}
	.pilote-icon {
		width: 60px;
		height: 60px;
	}
	.pilote-name{
		max-width: 150%;
	}

	.flotte {
		color: var(--font-dark, black);
		position: relative;
	}

	.div_create_new_flight_container{
		grid-area: 1 / 1 / 6 / 6;
	}
	.texte_selecteur{
		font-size: 0.8em;
	}
	.p_sub_label_create_new_flight{
		font-size: 1.5em;
	}
	.selecteur_nature_vol_container {
	  justify-content: space-around;
	}
	.selecteur_meteo_container {
	  justify-content: space-around;
	}
	.selecteur_evaluation_container {
	  justify-content: space-around;
	}
	.selecteur_nature_vol {
	  width: 3.5rem;
	  height: 3.5rem;
	}
	.selecteur_meteo {
	  width: 3.5rem;
	  height: 3.5rem;
	}

	.selecteur_evaluation {
	  width: 3.5rem;
	  height: 3.5rem;
	}

	.selecteur_nature_vol img {
	  width: 2rem;
	  height: 2rem;
	}
	.selecteur_meteo img {
	  width: 2rem;
	  height: 2rem;
	}
	.selecteur_evaluation img {
	  width: 2rem;
	  height: 2rem;
	}
	#div_airports_create_new_flight{
		margin-left: 10px;
	}

	.div_select_mvt_airport_create_new_flight{
		width: 30px;
	}


	#pilots_list{
		grid-template-columns: repeat(4, 1fr); 
		grid-column-gap: 20px;
		grid-row-gap: 20px; 
	}
	.pilote {
		min-width: 50px;
		font-size: 8px;
	}
	.pilote-icon {
		width: 60px;
		height: 60px;
	}
	.pilote-name{
		max-width: 150%;
	}

	.flotte {
		color: var(--font-dark, black);
		position: relative;
	}

	#div_page_container{
		margin-bottom: 30px;
	}

	#div_pilot_app_container{
		padding: 20px;
		height: auto;
		margin-left: 80px;
		width: calc(100% - 120px);
		row-gap: 20px;
		grid-template-rows: 50px 40px auto;
	}
	#div_pilot_app_flight_container{
		padding: 20px;
		height: auto;
		margin-left: 80px;
		width: calc(100% - 120px);
		grid-row-gap: 20px;
	}

	.div_right_container{
		margin-left: 80px;
		width: calc(100% - 80px);
	}


/* --- APP lateral menu --- */
	#div_lateral_menu_container{
		width: 80px;
		grid-template-columns: auto;
	}
	
	.div_lateral_menu_content_item{
		grid-template-columns: auto;	
		grid-template-rows: auto;
		justify-self: center;
	}
	.text_lateral_menu_item{
		display: none;
	}

	#div_lateral_menu_add_button{
		height: 40px;
		width: 40px;
	}

	#div_lateral_menu_content{
		margin-left: 0;
		margin-right: 0;
		grid-column-gap: 0;
	}

	#div_lateral_menu_flightly_logo_img_small{
		display: block;
	}
	#div_lateral_menu_flightly_logo_img{
		display: none;
	}
	#div_lateral_menu_flightly_logo{
		width: 100%;
		margin-left: 0;
	}
	#div_top_container_left{
		grid-template-columns: 35px auto;
	}

/* --- /APP lateral menu --- */


	.div_files_others_documents{
		grid-template-columns: 200px auto;
	}

	#div_big_widget_pilot_statistics_flex{
		grid-template-columns: 1fr;
	}
	#div_pilot_flights_statistics_table{
		grid-area: 2 / 1 / 3 / 2;
	}
	#div_pilot_flights_statistics_nb_hours_by_plane_table{
		grid-area: 3 / 1 / 4 / 2;
	}
	#div_pilot_flights_statistics_graph_container{
		grid-area: 1 / 1 / 2 / 2;
	}

	.report-item {
		font-size: 0.8em;
	}


	.th_create_new_book_slot_list_day{
		padding: 8px 3px; 
		font-size: 0.7em;
	}
	.th_create_new_book_slot_list_title{
		padding: 8px 3px; 
		font-size: 0.7em;
	}
	.th_create_new_book_slot_list_label{
		padding: 8px 3px; 
		font-size: 0.7em;
	}
}

@media screen and (max-width: 1000px) {
	#div_pilot_files_widgets_container{
		grid-template-columns: repeat(2, max-content);
	}
}

@media screen and (max-width: 900px) {
	#div_pilot_resum_widgets_container{
		grid-template-columns: repeat(3, auto);
	}

	#div_pilot_app_container{
		margin-left: 0;
		padding: 20px;
		width: calc(100% - 40px);
		height: calc(100% - 140px);
	}
	#div_pilot_training{
		gap: 20px;
	}
	#div_pilot_app_flight_container{
		margin-left: 0;
		padding: 20px;
		width: calc(100% - 40px);
		height: calc(100% - 140px);
	}

	.div_right_container{
		margin-left: 0;
		width: 100%;
		height: calc(100% - 86px);
	}

	.p_widget_title{
		font-size: 0.7em;
	}
	.img_widget_icon{
		height: 17px;
		top: 8px;
	}
	.div_widget{
		padding: 10px;
	}
	.p_widget_text{
		font-size: 0.8em;
	}


	/* --- APP lateral menu --- */
		#div_lateral_menu_container{
			grid-template-columns: 200px auto;
			grid-template-rows: 1fr;
			bottom: 0;
			top: auto;
			height: 60px;
			width: 100%;
			grid-template-columns: auto;
			border-top: 0.8px solid rgb(220, 220, 220);
			border-right: none;
			padding-bottom: 25px;
		}

		#div_lateral_menu_content{
			grid-template-columns: repeat(5, 1fr);
			grid-template-rows: 60px;
			margin-top: 0;
			align-items: center;
		}
		.div_lateral_menu_content_item{
			justify-self: center;
		}
		.div_lateral_menu_content_item:hover{
			background-color: white;
		}
		#div_lateral_menu_flightly_logo{
			display: none;
		}
		.text_lateral_menu_item{
			display: none;
		}

		#div_lateral_menu_add_container{
			left: 50%;
			transform: translateX(-50%);
			bottom: 70px;
		}

		#div_lateral_menu_add_button{
			height: 35px;
			width: 35px;
			margin-bottom: auto;
			grid-area: 1/3/2/4;
		}
		#div_lateral_menu_item_search{
			display: grid;
		}
		#div_lateral_menu_item_notifications{
			display: none;
		}

		#div_lateral_menu_content{
			margin-left: 0;
			margin-right: 0;
			grid-column-gap: 0;
		}

		#div_lateral_menu_flightly_logo_img_small{
			display: block;
		}

	/* --- /APP lateral menu --- */

	#div_feed_search_bar_container{
		display: none;
	}

	#div_feed_header_container{
		display: grid;
	}
	#div_feed_container{
		margin-top: 60px;
	}

	#div_pilot_balance_widgets_container{
		grid-template-columns: repeat(3, auto);
	}

	.img_div_generics_files{
		max-height: 40px;
		width: 40px;
	}
	.p_div_generics_files_label{
		font-size: 0.7em;
	}

	.text_big_widget_follower_name{
		font-size: 0.7em;
	}


	/* --- Login Page --- */
		#login_container{
			background-color: var(--menu-bar, white);
		}
		#login_div{
			top: 0;
			height: 100%;
			width: 100%;
			max-width: 400px;
			background-color: var(--menu-bar, white);
			-webkit-box-shadow: 0px 0px 0px 0px rgba(80,80,80,0); 
			box-shadow: 0px 0px 0px 0px rgba(80,80,80,0);
			border-radius: 0;
		}
		#login_password_input_div{
			top: 110px;
		}
		#lastname_user_input_div{
			top: 110px;
		}
		#login_flightly_logo_div{
			top: 100px;
			width: 150px;
		}
		#login_flightly_logo_img{
			top: 0;
		}
		#login_inputs_div{
			top: 180px;
		}
		#subscribe_inputs_div{
			top: 180px;
		}
		#login_end_link{
			top: 570px;
		}
	/* --- /Login Page --- */
}

@media screen and (max-width: 800px) {
	#div_big_image_display_open_infos_button{
		display: block;
	}
	#div_big_image_display{
		grid-template-columns: auto;
		grid-template-rows: 100px auto;
	}

	#div_big_image_display_left{
		grid-area: 2 / 1 / 3 / 2;
	}
	#div_big_image_display_right{
		grid-area: 1 / 1 / 2 / 2;
		padding-top: 25px;
	}
	#div_big_image_display_filename{
		margin-right: 40px;
	}


	#div_user_settings_planes_list{
		grid-template-columns: repeat(1, auto); 
		grid-row-gap: 10px;
	}


/* --- SGS Page --- */
	#div_big_widget_report_details_manager{
		grid-template-columns: 70px 150px;
	}
	#p_big_widget_report_details_manager_text{
		font-size: 0.8em;
	}
	#div_big_widget_report_details_manager_title{
		width: 230px;
	}
	#div_big_widget_report_details_creator{
		grid-template-columns: 70px 150px;
	}
	#p_big_widget_report_details_creator_text{
		font-size: 0.8em;
	}
	#div_big_widget_report_details_creator_title{
		width: 230px;
	}
	#div_big_widget_report_details_manager_no_manager{
		grid-template-columns: auto 150px 60px;
	}
	#p_big_widget_report_details_manager_no_manager_text{
		font-size: 0.8em;
	}
	#select_big_widget_report_details_manager_no_manager_select{
		width: 150px;
	}
	#div_big_widget_report_details_plane_no_plane{
		grid-template-columns: auto 120px 60px;
	}
	#p_big_widget_report_details_plane_no_plane_text{
		font-size: 0.8em;
	}
	#select_big_widget_report_details_plane_no_plane_select{
		width: 120px;
	}

	#div_big_widget_report_details_manager_and_creator{
		grid-area: 4/1/5/4;
	}
	#div_big_widget_report_details_status_button_container{
		grid-area: 1 / 3 / 2 / 6;
	}
	#div_big_widget_report_details_number_and_title{
		grid-area: 1 / 1 / 2 / 3;
	}
	#div_big_widget_report_details_infos{
		grid-template-rows: 50px 60px 100px 230px 150px auto;
		grid-template-columns: 120px 80px 100px 120px 0px auto;
	}
	#div_big_widget_report_details_container {
		padding: 15px;
	}
	#h2_big_widget_report_details_title_text{
		font-size: 0.9em;
	}
	#h2_big_widget_report_details_number_text{
		font-size: 0.9em;
	}
	#p_big_widget_report_details_type_title{
		font-size: 0.8em;
	}
	#p_big_widget_report_details_severity_title{
		font-size: 0.8em;
	}
	#p_big_widget_report_details_status_title{
		font-size: 0.8em;
	}
	#p_big_widget_report_details_frequency_title{
		font-size: 0.8em;
	}
	#p_big_widget_report_details_type_text{
		font-size: 0.9em;
	}
	#div_big_widget_report_details_notes{
		grid-area: 5/1/6/7;
	}
	#div_big_widget_report_details_actions{
		grid-area: 6/1/7/7;
	}
	#div_big_widget_report_details_manager_title{
		margin-left: 0;
	}
	#div_big_widget_report_details_manager{
		left: 0;
		right: auto;
	}
	#div_big_widget_report_details_creator_container{
		left: 0;
		right: auto;
	}
	#div_big_widget_report_details_creator{
		right: auto;
	}

	.div_big_widget_fullscreen_mobile{
		height: 100vh;
		width: 100vw;
		max-width: none;
		max-height: none;
		border-radius: 0;
	}

/* --- /SGS Page --- */


	#div_plane_resum{
		grid-template-columns: repeat(2, 1fr);
	}
	#div_plane_statistics{
		grid-template-columns: repeat(2, 1fr);
	}
	#div_big_widget_plane_statistics_flex{
		grid-area: 3 / 1 / 6 / 3;
	}
	#plane_picture_config{
		grid-area: 1 / 1 / 3 / 3;
	}

	#div_big_widget_new_post_flight_container{
		width: calc(100vw - 40px);
	}

	.div_new_post_content_images{
		max-width: 100%;
	}

	#div_big_widget_new_post_content{
		width: calc(100vw - 40px);
	}

	#textarea_big_widget_new_post_content{
		max-width: auto;
	}


	#timeline_rows{
		max-width: calc(100vw - 80px);
	}
}

@media screen and (max-width: 680px) {
	#div_pro_button{
		width: 20px;
	}
	#text_pro_button{
		font-size: 0;
	}
	#div_pro_button:hover{
		background-color: rgb(0, 85, 249);
		width: 20px;
		border-radius: 10px;
	}

	#div_page_container{
		width: 100%;
		margin-top: 0;
	}
	#div_page_header{
		border-radius: 0px;
		padding-top: 0;
	}
	.div_page_header_title_container{
		background-color: white;
		padding-left: 15px;
		padding-right: 15px;
		margin-bottom: 0px;
		padding-top: 15px;
		padding-bottom: 5px;
	}
	#div_feed_container{
		width: 100%;
		margin-top: 45px;
	}
	#div_feed_header_container{
		width: calc(100% - 50px);
		border-radius: 0px;
		margin-top: 0px;
	}
	#div_feed_page_container{
		width: 100%;
	}
	#div_big_widget_new_post{
		margin-left: 20px;
		margin-right: 20px;
	}

	#button_big_widget_new_post_publish{
		height: 35px;
		font-size: 0.8em;
	}
	#button_big_widget_new_post_cancel{
		height: 35px;
		font-size: 0.8em;
	}
	.div_big_widget_new_post_flight_item{
		padding: 10px;
	}
	.div_big_widget_new_post_flight_item_top{
		min-width: 120px;	
	}
	#div_big_widget_new_post_flight_details_top{
		grid-template-columns: 20px auto;
	}
	#div_big_widget_new_post_flight_details_map_icon{
		height: 20px;
		width: 20px;
	}
	#div_big_widget_new_post_flight_details_plane{
		grid-template-columns: 20px auto;
	}
	#div_big_widget_new_post_flight_details_plane_icon{
		height: 20px;
		width: 20px;
	}
	#text_big_widget_new_post_flight_details_plane{
		font-size: 0.9em;
	}
	#text_big_widget_new_post_flight_details_airport{
		font-size: 0.9em;
	}
	#text_big_widget_new_post_flight_details_flight_time{
		font-size: 0.9em;
	}
	#text_big_widget_new_post_flight_details_flight_type{
		font-size: 0.9em;
	}
	.div_publication_container{
		border-radius: 0px;
		padding: 15px;
		margin-top: 0;
		margin-bottom: 0px;
		border-bottom: 1px solid rgb(220, 220, 220);
	}

	#div_page_header_return_button{
		display: block;
	}

	.text_publication_content_description_airport{
		font-size: 1em;
	}
	.text_publication_content_description_flight_time{
		font-size: 1em;
	}
	.text_publication_content_description_flight_plane{
		font-size: 1em;
	}

	#div_page_header_picture{
		height: 120px;
		width: 120px;
	}	
	#div_page_header_picture_and_infos_container{
		grid-template-columns: 120px auto;
	}

	#div_page_header_user_actions_container{
		top: 55px;
		right: 20px;
	}
	#text_page_header_name{
		font-size: 0.9em;
	}

	#text_page_header_pilot_statistics_flight_hours{
		font-size: 1.2em;
	}
	#text_page_header_pilot_statistics_flight_hours_title{
		font-size: 0.7em;
	}
	#text_page_header_pilot_statistics_flight_frequency{
		font-size: 1.2em;
	}
	#text_page_header_pilot_statistics_flight_frequency_title{
		font-size: 0.7em;
	}
	#text_page_header_pilot_statistics_last_flight{
		font-size: 1.2em;
	}
	#text_page_header_pilot_statistics_last_flight_title{
		font-size: 0.7em;	
	}
	#div_page_header_follows_infos_container{
		font-size: 0.8em;
	}

	#div_search_bar_container{
		border-radius: 0px;
		width: 100%;
		margin-top: 0px;
		padding-top: 15px;
	}
	#search_input{
		background-color: rgb(244, 244, 249);
		border-radius: 10px;
		margin: 20px;
	}
	#text_page_follow_management_title{
		font-size: 0.8em;
	}
	#div_page_follow_management{
		grid-template-columns: auto;
		grid-template-rows: auto auto;
		grid-row-gap: 0px;
		margin-bottom: 0;
		border-radius: 0px;
	}

	#div_pilot_resum_widgets_container{
		grid-template-columns: repeat(2, auto);
		grid-row-gap: 10px;
		grid-column-gap: 10px;
	}

	#div_pilot_files_widgets_container{
		grid-template-columns: 1fr;
	}
	#div_big_widget_new_post_content_container{
		margin-bottom: 50px;
	}

	.div_sub_menu_page_item{
		font-size: 0.7em;
		padding-left: 7px;
		padding-right: 7px;
	}
	.div_sub_menu_page_item:hover{
		background-color: var(--font-dark, black);
	}

	#div_big_widget_container{
		grid-template-columns: 0 100% 0;
		grid-template-rows: 0 auto 0;
	}
	.div_big_widget{
		max-height: 100%;
		min-width: auto;
	}

	#div_pilot_balance_widgets_container{
		grid-template-columns: repeat(2, auto);
	}

	.div_files_others_documents{
		grid-template-columns: auto;
		grid-template-rows: auto auto;
		row-gap: 20px;
	}
	.div_files_others_documents_menu{
		max-width: 300px;
		border-right: none;
	}

	.report-item {
		font-size: 0.7em;
	}
	.report-item span:nth-child(1) {
		width: 0px;
	}
	.report-item span:nth-child(2) {
		margin-left: 5px;
		width: 15px;
	}
	.report-item span:nth-child(3) {
		width: 80px;
	}
	.report-item span:nth-child(4) {
		width: auto;
		margin-right: auto;
	}
	.report-item span:nth-child(5) {
		max-width: 100px;
		margin-right: 5px;
	}
	.report-item:hover {
		border-left-width: 15px;
	}
	#div_big_widget_report_details_infos{
		grid-template-columns: 100px 60px 90px 80px auto;
	}
	#div_big_widget_report_details_plane_infos{
		grid-area: 3 / 1 / 4 / 5;
	}
	.report-action-item{
		font-size: 0.7em;
	}

	.input_text_user_setting{
		font-size: 0.8em;
	}

	#div_loading{
		height: 150px;
		width: 150px;
	}

	.div_create_new_flight_bloc_bloc{
		width: 100%;
	}
	#div_create_new_flight_end_bloc{
		padding-left: 0;
	}

	.div_create_new_flight_flight_flight{
		width: 100%;
	}
	#div_create_new_flight_end_flight{
		padding-left: 0;
	}
	.input_engine_hours {
    	width: calc(50% - 10px);
	}

	.div_page_header_follows_infos_item{
		grid-template-columns: 1fr;
		grid-template-rows: min-content min-content;
		grid-row-gap: 0px;
	}
	#text_page_header_followers_count{
		font-size: 1.2em;
	}
	#text_page_header_following_count{
		font-size: 1.2em;
	}
	#text_page_header_posts_count{
		font-size: 1.2em;
		font-weight: 600;
	}
	#div_page_header_infos{
		grid-row-gap: 5px;
	}	

	.transaction-item span:first-child {
		display: none;
	}

	.flight-item {
		font-size: 0.8em;
	}
	.transaction-item {
		font-size: 0.8em;
	}


	#div_book_slot_type_select_container{
		grid-template-columns: auto;
		grid-column-gap: 10px;
		grid-row-gap: 10px;
		height: auto;
	}

	#div_create_new_book_slot_date_container{
		grid-template-columns: auto auto auto;
	}
	#previous_week_button_book_slot{
		width: 30px;
	}
	#next_week_button_book_slot{
		width: 30px;
	}
	.week_button_calendar_book_slot{
		height: 30px;
	}
	#div_create_new_book_slot_date{
		font-size: 0.9em;
	}
	#timeline_title{
		font-size: 0.9em;
	}
}


@media screen and (max-width: 600px) {
	#div_time_sunset_sunrise_container{
		top: 130px;
	}
	#calendar_container{
		top: 170px;
	}
	#print_filters{
		padding: 2px 13px;
		top: 95px;
		right: 0px;
	}
	#print_create_new_slot{
		padding: 2px 13px;
		top: 60px;
	}



	/* --- APP lateral menu --- */
		

	/* --- /APP lateral menu --- */


	.div_widget{
		min-width: auto;
		min-height: auto;
	}
}


@media screen and (max-width: 550px){

	#div_page_header_picture{
		height: 100px;
		width: 100px;
	}	
	#div_page_header_picture_and_infos_container{
		grid-template-columns: 100px auto;
	}


	.div_publication_content_description_top_airport_box{
		height: 40px;
	}
	.text_publication_content_description_top_airport_oaci{
		font-size: 1.2em;
		line-height: 40px;
	}

	#div_publication_content_description_top_middle{
		height: 52px;
	}
	#div_publication_content_description_top_time_box{
		height: 26px;
		margin-top: 23px;
	}
	.text_publication_content_description_top_time{
		font-size: 1em;
	}
	.text_publication_content_description_top_airport_full_name{
		font-size: 0.8em;
	}
}
	

@media screen and (max-width: 450px) {
	#text_page_header_pilot_statistics_flight_hours_title{
		font-size: 0.5em;
	}
	#text_page_header_pilot_statistics_flight_frequency_title{
		font-size: 0.5em;
	}
	#text_page_header_pilot_statistics_last_flight_title{
		font-size: 0.5em;
	}
	#text_page_header_pilot_statistics_flight_hours{
		font-size: 0.9em;
	}
	#text_page_header_pilot_statistics_flight_frequency{
		font-size: 0.9em;
	}
	#text_page_header_pilot_statistics_last_flight{
		font-size: 0.9em;
	}
	#text_page_header_description{
		font-size: 0.8em;
	}
	#div_page_header_follows_infos_container{
		font-size: 0.7em;
	}
	#div_page_header_pilot_statistics_flight_hours_and_frequency{
		grid-column-gap: 10px;
	}
	.div_page_header_pilot_statistics_flight_hours_and_frequency_item{
		padding: 5px;
	}
}

@media screen and (max-width: 400px) {
	#div_page_header_picture_and_infos_container{
		grid-template-columns: 1fr;
	}
	#div_page_header_infos{
		grid-template-rows: auto auto auto;
	}	
}