/* css srhw_profil */

/* back-up Couleurs 
rgb(65,100,230)  : bleu Proges ou #4164e6 / #0b5ed7 / #0d6efd
rgb(41, 91, 125) : bleu foncé Proges ou rgb(44, 97, 134)
rgb (30,41,78) : bleu très foncé accueil #1e294e
rgb(242,100,48)  : orange ou #F26430
*/

/* Couleurs 
rgb(242,246,255) : gris clair / f2f6ff ou eaeff2 / rgb(224,229,233) / rgb(241,243,251)
rgb(24,143,143)  : bleu vert Texdécor ou #188F8F
rgb(0,0,0) : noir TexDécor ou rgb(0,0,0) #000000
rgb(135,100,184)  : violet TexDécor #8764B8 
rgb(255,255,255) : blanc 
*/



#page-profil {
	margin-bottom: 150px;
}

#bloc-gestion {
	margin-top: 70px;
}

#bloc-ancre {
	position: sticky;
	top: 20px;
	display: flex;
	flex-direction: column;
	height: 77vh;
	scrollbar-width: thin;
	scrollbar-color: rgb(65,100,230) transparent;
}

.espacement {
	padding-bottom : 10px;
	padding-left : 25px;
}

.form-control input:focus{
	border: none;
	outline: none;
}
.align-elem-vertical {
	width: 100%;
	display: flex;
	align-items: center;
}


.form-group  {
	display: inline;
}

#bloc-ancre::-webkit-scrollbar {
    width: 7px;
}


#bloc-ancre::-webkit-scrollbar-thumb {
    background: rgb(65,100,230) transparent;
}

.bg-light-blue {
	color: rgb(242,246,255);
}

.bloc-page-profil {
	border-radius: 15px;
	padding: 7px 5px;
	margin-bottom: 20px;
	background: white;
	margin-left: 450px;
	position: relative;
}
.rounded-circle {
	display: block;
	margin-left: auto;
	margin-right: auto;
}
.bloc-profil {
	border-radius: 15px;

}

.sous-titre-profil {
	display: block;
	margin-left: auto;
	margin-right: auto;
	color: black;
	text-align: center;
}


.image-container, .sous-titre-profil, .bloc-page-profil{
	margin: 15px;
}

.titre-bloc-profil {
	color: black;
	text-align: center;
}

.text-vis {
	color: black;
	font-size: 12px;
	font-weight: 300;
}

.tab-profil{
	width: 95%;
}

.bloc-profil li, .bloc-profil a{
	border-color: transparent;
}


.bloc-profil-right li, .bloc-profil-right a{ 
	border-color: rgb(65,100,230);
	background-color: white;
} 

.accordion-button-profil:focus {
	box-shadow:none;
	border:none;	
}

.accordion-item-profil:first-of-type, .accordion-item:last-of-type {
	border-radius:0px;
}

.accordion-item-profil:first-of-type .accordion-button, .accordion-item:last-of-type .accordion-button {
	border-radius:0px;
}

.accordion-item-profil {
	background-color: #fff;
	border:none;
}

.accordion-button-profil::after {
	background-image: url("../images/CloseBlueArrowIndex.svg");
	height: 12px;
}

.accordion-button-profil:not(.collapsed)::after {
	background-image: url("../images/OpenWhiteArrowIndex.svg") ! important;
	transform: none;
	height: 12px;
	background-color: rgb(65,100,230);
	color: rgb(255, 255, 255);
	border:none;		
}

.accordion-button-profil.collapsed {
	border:none;		
}

.accordion-button-profil:not(.collapsed) {
	background-color: transparent;
	color: rgb(255, 255, 255);
	border:none;	
	border-bottom: 1px solid #fff;
}

.accordion-button-profil {
	background-color: #fff;
	font-size: 17px;
	color: rgb(65,100,230);
}

.accordion-button-profil:hover {
	background-color: transparent;
	color: rgb(255, 255, 255);
}

.accordion-button-profil:hover:after {
	background-image: url("../images/CloseWhiteArrowIndex.svg");
	height: 12px;
}

.accordion-collapse {
	border:none;		
}

.accordion-body {
	border:none;		
}
#file {
  opacity: 0;
  width: 0.1px;
  height: 0.1px;
  position: absolute;
}

#button-mod-photo {
	padding-left:8px; 
	text-decoration:none;
	border: none;
	background: none;
	cursor: pointer;
}

#mod-photo {
	position: relative;
	width: 90px;
	height: 90px;
	object-fit:cover;
}

.icon-mod-photo {
	color: black;
	font-size: 25px;
}

.text-mod-photo {
	color: black;
	font-size: 13px;
	padding-left: 8px;
	text-decoration: underline;
}


.nom-champ {
	color: black;
	font-weight: 500;
	font-size:var(--bs-body-font-size);
}

.modif-info {
	border: 1px solid black;
	width: 100%;
	display: flex;
	flex-direction: row;
	align-items: center;
}

.modif-info[readonly] {
	border: none !important;
	box-shadow: none !important;
	width: 400px;
	display: flex;
	flex-direction: row;
	align-items: center;
}


.modif-info:hover, .modif-info:visited, .modif-info:link, .modif-info:active {
	text-decoration: none;
}

.champ-tab-profil {
	height: 30px;
	font-size: 0.9rem;
	border: 1px solid rgb(65,100,230);
	border-radius: 5px;
	background-color: white;
}

.champ-check-profil:checked {
	background-color: rgb(65,100,230);
	border: 1px solid rgb(65,100,230);
	border-radius: 5px;
	width: 26px;
	height: 26px;
}

.champ-check-profil:focus {
	text-decoration: none;
	box-shadow:none;
	border: 1px solid rgb(65,100,230);
}

.champ-check-profil {
	border: 1px solid rgb(65,100,230);
	width: 26px;
	height: 26px;
}

.ancre-s {
	font-weight:600;
	color: rgb(65,100,230);
	border: none;
}

.ancre-s, .ancre-s:visited, .ancre-s:focus{
	font-weight:600;
	color: rgb(65,100,230);
	text-decoration: none;
}

.ancre-s:hover {
	color: rgb(242,100,48);
	font-weight: bold;
	text-decoration:underline;
	background-color:white;	
	
}

#action-drop-car {
	padding-left:9px; 
	padding-right:9px;
	border:none;
	background-color:transparent;
}

#action-drop-car:hover {
	background-color: rgb(224,229,233);
}

#action-drop-car-1 {
	padding-left:9px; 
	padding-right:9px;
	border:none;
	background-color:transparent;
}

#action-drop-car-1:hover {
	background-color: rgb(224,229,233);
}

#action-drop-car-2 {
	padding-left:9px; 
	padding-right:9px;
	border:none;
	background-color:transparent;
}

#action-drop-car-2:hover {
	background-color: rgb(224,229,233);
}

#bloc-aide {
	border: 1px solid rgb(224,229,233);
	margin-right: 62px;
	padding-left: 10px;
	padding-right: 10px;
	border-radius: 15px;
	margin-left: 35px;
	margin-top:20px;
}

.rech-aide {
	font-size: 13px;
	border: none;
	background-color: #eaeff2;
	border-radius: 15px;
	margin-top: 3px;
	margin-bottom: 10px;
}

.un-rec {
	font-size: 17px;
	margin-bottom: 0px;
	padding-top: 8px;
	padding-bottom: 8px;
	cursor: pointer;
	padding-left: 12px;
	border-bottom: 1px solid rgb(65,100,230);
	display: grid;
	color: black;
}

.un-rec:hover {
	border-left: 4px solid rgb(65,100,230);
	background-color: #eaeff2;
}

#res {
	border: 3px solid rgb(224,229,233);
	border-radius: 15px;
	padding: 15px;
	margin-top: 15px;
	margin-bottom: 15px;
	max-height:250px;
	overflow-y: scroll;
	scrollbar-color: rgb(65,100,230) transparent;
	scrollbar-width: thin;
}


/* Responsive pour tout appareil medium et grand */

@media (max-width: 1170px) {

	.path-page{
		color: #8a8a8a;
		font-size: 10px;
		text-align: left;
		margin-bottom: 55px;
	}
	.page-cong {
		bottom: 0;
		left: 0;
		right: 0;
		top: auto;
		transform: translateY(0);
		flex-direction: row;
		justify-content: space-evenly;
		row-gap: 1px;
		padding: 10px;
		border-top: 1px solid hsl(200 100% 99% / 5%);
		margin-bottom: 5px;
	}
}
@media (max-width: 768px){
	.path-page{
		padding: 11px 0;
	}
	/*.align-elem-vertical,  .modif-info, .form-group{
		width: 100%;
		display: block;
	}*/
	.rounded-circle{
		width: auto !important;
	}

	.margin-bottom-150px{
		margin-bottom: 150px !important;
	}
}

@media (max-width: 820px){
	.path-page{
		padding: 11px 0;
	}
	
	/*.align-elem-vertical,  .modif-info, .form-group{
		width: 100%;
		display: block;
	}*/
}

@media (max-width: 1080px){
	.path-page{
		padding: 11px 0;
	}
	/*.align-elem-vertical,  .modif-info, .form-group{
		width: 100%;
		display: block;
	}*/
	.margin-bottom-150px{
		margin-bottom: 150px !important;
	}
}

@media (max-width: 1280px){
	.path-page{
		padding: 11px 0;
	}
	/*.align-elem-vertical,  .modif-info, .form-group{
		width: 100%;
		display: block;
	}*/
}

@media (max-width: 1380px){
	.path-page{
		padding: 11px 0;
	}
	/*.align-elem-vertical,  .modif-info, .form-group{
		width: 100%;
		display: block;
	}*/
}
@media (max-width: 1580px){
	.path-page{
		padding: 11px 0;
	}
	/*.align-elem-vertical,  .modif-info, .form-group{
		width: 100%;
		display: block;
	}*/
}

/*Responsive pour téléphone*/

@media (max-width: 370px){
	.path-page{
		min-height: 50px;
		padding: 8px 0
	}
	.align-elem-vertical,  .modif-info, .form-group{
		width: 100%;
		display: block;
	}

	.margin-right-40px{
		margin-right: 25px;
	}

	.col-8-rea {
        width: 100%;
    }

}

@media (max-width: 200px){
	.path-page{
		min-height: 400px;
		padding: 8px 0
	}
	.align-elem-vertical,  .modif-info, .form-group{
		width: 100%;
		display: block;
	}
}

@media only screen and (min-device-width:371px) and (max-width: 390px){
	.path-page{
		min-height: 400px;
		padding: 8px 0
	}
	.align-elem-vertical,  .modif-info, .form-group{
		width: 100%;
		display: block;
	}

	.margin-bottom-150px{
		margin-bottom: 150px !important;
	}

	.margin-right-40px{
		margin-right: 25px;
	}

	.heure_tmp {
        margin-right: 80px;
    }

	.margin-left-70px{
		margin-left: 70px;
	}

	.col-8-rea {
        width: 100%;
    }
}

@media only screen and (min-device-width:376px) and (max-width: 576px) {
	.col-5 {
		width: 100% !important;
	}

	.col-8-rea {
		width: 100%;
	}

	.margin-bottom-150px{
		margin-bottom: 150px !important;
	}

	.margin-right-40px{
		margin-right: 40px;
	}

	.heure_tmp {
        margin-right: 100px;
    }

	.text-center-mobile {
        margin-left: 70px !important;
    }

	.margin-left-70px{
		margin-left: 90px;
	}
}

@media (max-width: 412px){
	.path-page{
		padding: 11px 0;
	}
	.align-elem-vertical,  .modif-info, .form-group{
		width: 100%;
		display: block;
	}
}