.espace-client { }

.compte-content { width:100%; }

.espace-client button {
	font-size: 14px;
	font-weight:600;
	padding: 5px 16px;
	background-color: #DBDCDD;
	color: white;
	margin: 0 10px 10px 0;
	width: fit-content;
	text-align: center;
}

.espace-client button.btn_disable {
	color: #000;
}

.espace-client button:hover { filter:brightness(1.05); }

.espace-client .Error_MSG {
	color:var(--bglogosalamandre);
	font-size: 18px;
	font-weight: bold;
}

.espace-client .content { padding:35px; max-width:1200px; width:100%; margin-bottom:30px; min-height: 50vh; }

.espace-client .EC_Form {
	display:flex;
	flex-direction:column;
	gap:10px;
}

.espace-client h1 {
	font-size:29px;
	font-weight:500;
	color:#000;
	margin-bottom:15px;
	text-transform:uppercase;
}

.espace-client fieldset {
	border:1px solid #B3B3B3;
	padding:20px;
	max-width:740px;
	width:100%;
	margin-bottom:10px;
	background-color:#F1F1F1;
}

.espace-client .step_content { display:none; }
.espace-client .step_content.current { display:block; }

.espace-client h2 {
	font-size:20px;
	font-weight:500;
	text-transform:uppercase;
	color:var(--color4);
	line-height:1;
}

.espace-client .grille {
	display:grid;
	grid-template-columns:330px 330px;
	column-gap:40px;
}

.espace-client .EC_Form label {
	display:flex;
	flex-direction:column;
	gap:6px;
	margin-top:12px;
	margin-bottom:6px;
}

.EC_Form p { font-size:14px; }

.EC_Form input[type="text"], .EC_Form input[type="email"], .EC_Form input[type="tel"], .EC_Form input[type="password"], .espace-client .EC_Form select, .espace-client .EC_Form textarea {
	outline:1px solid #D4D2C3;
	background-color: transparent;
	font:inherit;
	border:none;
	-webkit-appearance:none;
	appearance:none;
	padding:0 5px;
	margin:0;
	width:100%;
	font-family:inherit;
	font-size:inherit;
	cursor:inherit;
	line-height:inherit;
}

.espace-client .EC_Form input[type="text"] { text-transform:uppercase; }
.espace-client .EC_Form input[type="email"] { text-transform:lowercase; }

/* ------- */

.espace-client .sw_div { display:flex; align-items:center; justify-content:start; margin:20px 0; width:100%; }
.espace-client #adr_pro { display:none; }
.espace-client #adr_pro.active { display:block; }

.espace-client .switch {
	display: inline-block;
	position: relative;
	width: 40px;
	height: 20px;
	cursor: pointer;
	overflow: hidden;
	margin: 0 10px 0 0 !important;
}

.espace-client .switch input {
	position: absolute;
	top: -30px;
	width: 0;
	height: 0;
}

.espace-client .switch input + span {
	position: absolute;
	top: 0;
	bottom: 0;
	left: 0;
	right: 0;
	background: var(--color1);
	border-radius: 20px;
}

.espace-client .switch input + span:before {
	content: "";
	display: inline-block;
	position: absolute;
	top: 50%;
	left: 0px;
	width: 16px;
	height: 16px;
	background: white;
	border-radius: 50%;
	transform: translateY(-50%);
	transition: all .5s;
}

.espace-client .switch input:checked + span { background: var(--color3); }
.espace-client .switch input:checked + span:before { left: 24px; }

@media screen and (max-width:982px) {
	.compte-details { width: 100% !important; }
}

@media screen and (max-width:680px) {
	.compte-details .compte-switchs-bar { display:flex; flex-direction:column; }
	.espace-client .content { padding: 15px; }
}


/* ---- */

.espace-client .Valid_Button {
	background-color: var(--color6);
	color: black;
	padding: 4px 8px;
	margin-top:10px;
}

.espace-client .validation {
	display:flex;
	align-items: center;
	justify-content: center;
	flex-wrap:wrap;
	gap:20px;
}

.espace-client .validation button {
	font-weight: 600;
	color: #000;
	background-color: var(--color7);
	display: flex;
	justify-content: center;
	align-items: center;
	width: 170px;
	height: 30px;
}

.espace-client .validation #New_Loader img { max-width:50px; float:right; }

#Id_Pays { margin-bottom:10px; }

.espace-client a {
	color: green;
	background-color: var(--color6);
}

/*	----------- */

.table-orders thead {
  color: white;
  background-color: var(--color0b);
  font-size: 12px;
  line-height: 2;
}

.table-orders th { text-align:left; }
.table-orders th, td { padding:5px; }

.espace-client .article__quantite {
	font-weight: 500;
	white-space: nowrap;
	min-height: 65px;
	display: flex;
	align-items: center;
	justify-content: center;
	justify-self: center;
}

.espace-client .article__quantite span { display:none; }

.espace-client .facturation__selected, .espace-client .livraison__selected {
	font-size: 13px;
	letter-spacing: .7px;
}

.hide_empty { visibility:hidden; }
@media screen and (max-width:1170px) {
	.hide_empty { display:none; }
	.espace-client .article__quantite span { display:block; } 
}

/*	---------	*/

.espace-client #precisions__txtarea { height: calc(100% - 40px) !important; }
.espace-client .container-panier .coordonnees { margin-top:35px; margin-bottom:10px; }

/*	-----------	*/

.arrow-steps { width:100%; overflow:hidden; padding-right:17px; }

.arrow-steps .step {
	display:flex;
	align-items:center;
	justify-content:center;
	position: relative;
	float: left;
	padding: 10px 5px 10px 30px;
	font-size: 14px;
	font-weight:600;
	color: #FFF;
	background-color: var(--color1);
}

.arrow-steps .step:after, .arrow-steps .step:before {
	content: "";
	position: absolute;
	top: 0;
	right: -17px;
	width: 0;
	height: 0;
	border-top: 19px solid transparent;
	border-bottom: 19px solid transparent;
	z-index: 2;
}

.arrow-steps .step:after { border-left: 17px solid var(--color1); }

.arrow-steps .step:before {
	right: auto;
	left: 0;
	border-left: 17px solid #fff;
	z-index: 0;
}

.arrow-steps .step:first-child { padding: 10px 10px 10px 15px; }
.arrow-steps .step:first-child:before { border: none; }

.arrow-steps .step.done { background-color: var(--color3); }
.arrow-steps .step.done:after { border-left: 17px solid var(--color3); }

.arrow-steps .step.current { background-color: var(--color2); }
.arrow-steps .step.current:after { border-left: 17px solid var(--color2); }

/*	-----------	*/

.compte-details { margin-top:40px; width: calc(100vw - 520px); }

.compte-details .compte-switchs-bar {
	display: flex;
	text-align: center;
	border-bottom: 3px solid #B3B3B3;
	max-width: 745px;
	width:100%;
}

.compte-details .sw {
	font-size: 15px;
	font-weight: 600;
	padding: 18px 20px;
	text-transform: uppercase;
}

.compte-details .sw.active {
	color: var(--color11);
	background-color: #B3B3B3;
}

.compte-details .sw {
	color: #000;
	background-color: var(--color13);
}

.detail-bloc {
	grid-area: details;
	padding: 15px 0;
	font-size: 14px;
	display: none;
	white-space: normal;
}

.show_content { display: block; }

#Ville_SkillResult{ 
	list-style: none; 
	padding: 0px; 
	width: 250px; 
	position: relative; 
	margin: 0; 
}

#Ville_SkillResult li{ 
	background: #E5E5E5; 
	padding: 4px; 
	margin-bottom: 1px; 
}

#Ville_SkillResult li:nth-child(even){ 
	background: #BFBFBF; 
	color: white; 
}

#Ville_SkillResult li:hover{ cursor: pointer; }

#AL_Ville_SkillResult{ 
	list-style: none; 
	padding: 0px; 
	width: 250px; 
	position: relative; 
	margin: 0; 
}

#AL_Ville_SkillResult li{ 
	background: #E5E5E5; 
	padding: 4px; 
	margin-bottom: 1px; 
}

#AL_Ville_SkillResult li:nth-child(even){ 
	background: #BFBFBF; 
	color: white; 
}

#AL_Ville_SkillResult li:hover{ cursor: pointer; }

/*	-----------	*/

@media screen and (max-width:982px) {
	.content { margin:auto; }
	
	.espace-client .grille {
		display:grid;
		grid-template-columns:auto;
		column-gap: normal;
	}
}

@media screen and (max-width:380px) {
	.arrow-steps { padding-right:16px; }

	.arrow-steps .step {
		padding: 10px 5px 10px 25px;
		font-size: 12px;
	}

	.arrow-steps .step:after, .arrow-steps .step:before {
		right: -16px;
		border-top: 17px solid transparent;
		border-bottom: 17px solid transparent;
	}

	.arrow-steps .step:after { border-left: 16px solid var(--color1); }
	.arrow-steps .step:before { border-left: 16px solid #fff; }
	.arrow-steps .step:first-child { padding: 10px 5px 10px 10px }
	.arrow-steps .step.done:after { border-left: 16px solid var(--color3); }
	.arrow-steps .step.current:after { border-left: 16px solid var(--color2); }
}