/* @import url(root.css);
@import url(components.css); */

/* ===================================================== */
/* ====================== GLOBAL ======================= */
/* ===================================================== */

* {
	outline: none !important;
}

body {
	/* margin-top: -20px; */
	overflow-x: hidden !important;
	overflow-y: overlay !important;
	text-rendering: optimizeLegibility !important;

	background: #EAECEC;
	/* background: linear-gradient(180deg, var(--clr-main) 70px, rgba(234,236,236,1) 25%); */
	background: linear-gradient(180deg, var(--clr-main) 70px, rgba(255,255,255,1) 25%);
}

.ui-autocomplete {
	z-index: 10000 !important;
}

.ui-front {
	z-index: 10000 !important;
}

.dev-warning {
	position: absolute;
	top: -15px;
	right: -15px;
	padding: 20px;
	height: 80px;
	width: 150px;
	z-index: 8;
	background: #FFA737;
	color: white;
	font-weight: 900;
	font-size: 18px;
	text-align: center;
	display: flex;
	align-items: flex-end;
	justify-content: center;
	transform: translateX(35px) translateY(0px) rotate(45deg);
}

*[data-for-mobile] {
	display: none;
}

/* ===================================================== */
/* ======================= LOGIN ======================= */
/* ===================================================== */

.main-login {
	position: relative;

	height: 100%;
	width: 100%;
	top: 0;
	left: 0;

	display: flex;
	align-items: center;
	justify-content: center;

	background: url("../img/login_grey.jpg");
	background-size: cover;
}

.main-login-background {
	position: absolute;

	height: 100%;
	width: 100%;

	backdrop-filter: blur(4px);
	background: linear-gradient(145deg, rgba(48,48,48,0) 40%, var(--clr-main) 100%);

	z-index: 0;
}

.main-login-logo {
	position: absolute;
	top: 30px;
	left: 30px;
	width: 220px;

	z-index: 1;
}

.main-login-logo > img {
	width: 100%;
}

.main-login-form {
	position: fixed;

	display: flex;
	align-items: center;
	justify-content: center;

	border-radius: 16px;
	background: white;

	z-index: 1;
	overflow: hidden;

	box-shadow: rgba(0, 0, 0, 0.3) 0px 19px 38px, rgba(0, 0, 0, 0.22) 0px 15px 12px;
}

.main-login-form > form {
	width: 400px;

	flex: 1;

	display: flex;
	flex-direction: column;
}

.main-login-form > form > .login-header {
	min-height: 80px;
	padding: 10px;

	border-bottom: 1px solid var(--clr-border);

	display: flex;
	align-items: center;
	justify-content: center;
}

.login-header > h3 {
	margin: 0;
	padding: 0;
}

.main-login-form > form > .login-body {
	height: 270px;
	padding: 20px 40px;

	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	row-gap: 10px;
}

.login-body .form-group {
	width: 100%;
}

.login-body input {
	height: 40px !important;
	border-radius: 8px;
}

.main-login-form > form > .login-footer {
	padding: 20px;
	border-top: 1px solid var(--clr-border);

	display: flex;
	align-items: center;
	column-gap: 15px;
}

.main-login-form > form > .login-footer > img {
	height: 25px;
}

.login-footer > .btn {
	height: 40px !important;
	width: 100%;
	font-size: 15px;
	font-weight: 600;
}

/* ===================================================== */
/* ======================= MAIN ======================== */
/* ===================================================== */

.div_main_container
{
	display: flex;
	height: calc(100vh - 50px);
}

@media screen and (max-width: 992px)
{
	.main-login-form > form {
		width: 320px;
	}

	.main-login-form > form > .login-body {
		height: auto;
		padding: 20px;
	}
}

.main-container {
	width: 100%;
	padding: 0;
	overflow: auto;
	overflow-x: hidden;
}

/* ===================================================== */
/* ====================== LANDING ====================== */
/* ===================================================== */

/* .home_landing_page {
	height: 100%;
	width: 100%;

	position: absolute;
	top: 0;
	left: 0;

	display: flex;
	flex-direction: row;

	background-color: #FFFFFF;
	z-index: 7;
} */

.home_landing_page {
	height: calc(100% + 0px);
	width: 100%;

	position: absolute;
	top: 0;
	left: 0;

	display: flex;
	flex-direction: row;

	background-color: #FFFFFF;
	z-index: 7;
}

.home_landing_page.home_landing_page_cockpit {
	flex-direction: column;
	background-color: #EAECEC;
	z-index: 10;
	overflow: auto;
}

.home_landing_page > .landing_page_background {
	position: absolute;
	height: 100%;
	width: 100%;

	opacity: .03;

	background-image: url('../img/societes/1/logo.png');
	background-repeat: no-repeat;
	background-size: 60%;
	background-position: center;
	z-index: -1;
}

.home_landing_page > .landing_page_left {
	height: 100%;
	max-height: 100vh;
	width: 50%;
	padding: 50px;

	display: flex;
	align-items: center;
	justify-content: center;
}

.landing_page_left > .landing_page_message {
	display: flex;
	flex-direction: column;
}

.landing_page_message > h1
{
	font-size: 55px;
	color: var(--clr-main);
	font-weight: bold;
}

.landing_page_message > p {
	display: none;
	padding: 30px 0;
	text-align: justify;
}

.landing_page_message > button {
	height: 40px;
	width: 100%;
}

.home_landing_page > .landing_page_right {
	height: 100%;
	max-height: 100vh;
	width: 50%;
	padding: 16px;

	display: flex;
	flex-direction: column;
	/* align-items: center; */
	/* justify-content: center; */

	/* border-radius: 80% 0 0 40%; */
	border-left: 1px solid var(--clr-border);

	background-color: #FAFAFA;
	overflow: auto;
}

.landing_page_right > .landing-page-header {
	margin-bottom: 16px;

	display: flex;
	align-items: center;
	column-gap: 16px;
}

.landing-page-header > h1 {
	margin: 0;
}

.landing_page_right > img {
	width: 60%;
}

.information-container {
	display: flex;
	flex-direction: column;
	row-gap: 8px;
}

.information-content {
	border-radius: 8px;
	border: 1px solid var(--clr-border);
	overflow: hidden;
}

.information-content-title {
	padding: 8px;

	display: flex;
	align-items: center;
	column-gap: 8px;

	background-color: var(--clr-border);
}

.information-content[data-state="unread"] > .information-content-title::before {
	content: '';
	width: 10px;
	height: 10px;
	display: inline-block;
	border-radius: 10px;
	background: var(--clr-main);
}

.information-content-title > span {
	font-size: 1.8rem;
}

.information-content-body {
	padding: 16px;
}

.information-content-footer {
	padding: 8px;
	padding-top: 0;

	display: flex;
	justify-content: end;
}

.information-content[data-state="read"] > .information-content-footer {
	display: none;
}

/* ===== MODAL ===== */

.modal-information-version-body {
	display: flex;
	column-gap: 16px;
}

.information-version-modal-form,
.information-version-modal-list {
	width: 50%;

	display: flex;
	flex-direction: column;
	row-gap: 8px;
}

.modal-information-version-body > hr {
	height: auto;
	width: 1px;
	margin: 0;
	background: var(--clr-border);
}

.information-version-modal-service-list {
	margin-top: 8px;
	display: flex;
	flex-wrap: wrap;
	gap: 8px;
	padding: 8px;
	border-radius: 8px;
	border: 1px solid var(--clr-border);
}

.information-version-modal-service-list:empty {
	display: none !important;
}

.information-version-modal-service-list > .modal-service-item {
	padding: 4px;

	border-radius: 8px;

	color: white;
	background: var(--clr-main);
}

.information-version-modal-list {
	display: flex;
	flex-direction: column;
	row-gap: 8px;
}

.information-modal-item {
	padding: 8px;
	display: flex;
	align-items: center;
	column-gap: 8px;
	border-radius: 8px;
	border: 1px solid var(--clr-border);
	background: #FAFAFA;
}

.information-modal-item-title {
	flex-shrink: 0;
	font-weight: 600;
}

.information-modal-item-content {
	display: flex;
	align-items: center;

	overflow: hidden;
	white-space: nowrap;
	text-overflow: ellipsis;
}

.information-modal-item-content p {
	margin: 0;
}

.information-modal-item-content img,
.information-modal-item-content video,
.information-modal-item-content iframe {
	display: none;
}

.information-modal-item > button {
	margin-left: auto;
}

.information-version-alert {
	padding: 4px 8px;
	border-radius: 50px;
	font-size: 1rem;
	background: lime;
	cursor: pointer;
}

.information-version-alert[data-new-alert="false"] {
	display: none;
}

.information-version-alert[data-new-alert="true"] {
	display: block;
}

/* ===================================================== */
/* ======================== MENU ======================= */
/* ===================================================== */

.navbar-toggler,
#navbar_mobile_deco {
	height: 30px;
	width: 30px;
	margin-top: 10px;
	margin-left: 10px;
	float: left;

	display: flex;
	align-items: center;
	justify-content: center;

	text-decoration: none;
	border-radius: 8px;
	border: none;

	font-size: 20px;
	color: var(--clr-main);
	background-color: #FFFFFF;

	border: none;
}

@media screen and (max-width: 767px) {
	.container-fluid > .navbar-collapse,
	.container-fluid > .navbar-header,
	.container > .navbar-collapse,
	.container > .navbar-header {
		margin-left: 0 !important;
		margin-right: 0 !important;
	}

	.nav.navbar-nav {
		display: inline !important;
	}
}

@media screen and (min-width: 768px) {
	.navbar-toggler,
	#navbar_mobile_deco {
		display: none !important;
	}
}

.container-fluid {
	padding: 0;
}

.navbar-inverse .navbar-collapse, .navbar-inverse .navbar-form {
	padding: 0;
	border-color: #FFFFFF;
	overflow: overlay;
}

.btn-open-menu {
	width: 55px;
	margin: 0 10px;

	display: flex;
	align-items: center;
	justify-content: center;
}

/* ===================================================== */
/* ==================== VERTICAL MENU ================== */
/* ===================================================== */

@keyframes expand {
	0% {
		width: 55px;
	}
	100% {
		width: 230px;
	}
}

.menu-gauche {
	position: absolute;
	flex-shrink: 0;
	
	height: -webkit-fill-available;
	height: -moz-available;
	height: fill-available;
	
	margin: 10px;
	margin-top: 0;
	padding: 20px 0;
	
	display: flex;
	flex-direction: column;
	row-gap: 5px;
	
	border-radius: 8px;
	
	background-color: #FFFFFF;
	box-shadow: rgba(0, 0, 0, 0.2) 0px 3px 8px;
	z-index: 10;
}

.menu-gauche[data-state="collapse"] {
	width: 55px;

	transition: width .15s ease-out;
}

.menu-gauche[data-state="expanded"] {
	width: 300px;
	box-shadow: rgba(0, 0, 0, 0.1) 0px 10px 50px;
	transition: width .15s ease-out;
}

.menu-gauche .btn-menu {
	height: 35px;
	width: 100%;
	padding: 10px 0;

	border: none;

	display: flex;
	align-items: center;
	justify-content: flex-start;

	font-size: 16px;

	background: transparent;
	transition: padding-left .1s;
}

.menu-gauche[data-state="expanded"] .btn-menu:hover {
	padding-left: 6px;

	transition: padding-left .1s;
}

.btn-menu > i {
	height: 35px;
	width: 35px;
	margin: 0 10px;

	display: flex;
	align-items: center;
	justify-content: center;
	flex-shrink: 0;

	border-radius: 8px;
	font-size: 16px;

	transition: all .15s;
}

.btn-menu:hover > i {
	background: var(--clr-main);
	color: var(--clr-text-clear);
	transition: all .1s;
}

.menu-gauche .btn-menu-text {
	font-size: 14px;
	white-space: nowrap;
	opacity: 0;
	pointer-events: none;

	transition: opacity .15s linear;
}

.menu-gauche[data-state="expanded"] .btn-menu-text {
	opacity: 1;
	pointer-events: all;
	transition: opacity .1s linear .1s;
}

.menu-gauche[data-state="collapse"] .menu-gauche-img {
	width: 100%;
	margin-top: auto;
	padding: 0 10px;

	opacity: 0;

	transition: opacity .1s linear ;
}

.menu-gauche[data-state="expanded"] .menu-gauche-img {
	width: 100%;
	margin-top: auto;
	padding: 0 20px;

	opacity: 1;

	transition: opacity .1s linear .1s;
}

.submenu-container > .submenu {
	position: absolute;
	width: 320px;
	padding: 20px;
	top: 0;
	left: 0;

	display: flex;
	flex-direction: column;
	row-gap: 10px;

	border-radius: 8px;
	border: 1px solid var(--clr-border);

	background-color: #FFFFFF;
	box-shadow: rgba(50, 50, 93, 0.25) 0px 13px 27px -5px, rgba(0, 0, 0, 0.3) 0px 8px 16px -8px;

	z-index: 10;
}

.submenu > .form-control {
	height: 34px !important;
}

.submenu::before {
	position: absolute;
	content: '';

	top: 10px;
	left: -7px;
	height: 12px;
	width: 12px;
	transform: rotate(45deg);

	border-left: 1px solid var(--clr-border);
	border-bottom: 1px solid var(--clr-border);
	border-bottom-left-radius: 4px;

	background: #FFFFFF;
}

/* .menu_gauche {
	display: none;
	height: 100%;
	width: 350px;
	position: absolute;
	flex-shrink: 0;

	padding: 15px;
	text-align: center;

	background-color: #FAFAFA;
	box-shadow: 0 10px 20px rgba(0,0,0,0.19), 0 6px 6px rgba(0,0,0,0.23);

	z-index: 100;
}

@media screen and (min-width: 1367px) {
	.menu_gauche {
		display: block;
		height: inherit;
		width: 250px;
		position: relative;
		flex-shrink: 0;

		padding: 15px;
		text-align: center;

		background-color: #FAFAFA;
		border-right: 1px solid lightgrey;
		box-shadow: none;

		z-index: 100;
	}
}

@media screen and (min-width: 768px) {
	.navbar-toggler {
		display: none !important;
	}
}

#menu_gauche_open,
#navbar_mobile_deco {
	height: 30px;
	width: 30px;
	margin-top: 10px;

	border: none;

	font-size: 20px;

	color: #FFFFFF;
	background-color: transparent;
	outline: none;
}

#menu_gauche_open {
	float: left;
}

#navbar_mobile_deco {
	display: flex;
	align-items: center;
	justify-content: center;

	float: right;
	margin-right: 10px;

	text-decoration: none;

	border-radius: 5px;
	color: var(--clr-main);
	background-color: #FFFFFF;
}

@media screen and (min-width: 1367px) {
	#menu_gauche_open,
	#navbar_mobile_deco {
		display: none;
	}
}

.menu_gauche > #menu_gauche_close {
	position: absolute;
	right: 15px;
	border-radius: 2px;
	border: none;
	font-weight: bold;
	font-size: 20px;
	color: #000000;
	background-color: transparent;
	outline: none;
}

@media screen and (min-width: 1367px) {
	.menu_gauche > #menu_gauche_close {
		display: none;
	}
}

.menu_gauche > hr {
	background-color: #000000;
}

.bouton_menu {
	margin: 10px;
	display	: flow-root;

	width: fill-available;
	width: -webkit-fill-available;
	width: -moz-available;
} */

/* ===================================================== */
/* ====================== EDITION ====================== */
/* ===================================================== */

.col-edition-container {

}

.col-edition-container > h3 {
	margin-top: 0;
	text-align: left;
}

.edition_btn_container {
	display: flex;
	flex-direction: row;
	gap: 10px;
	/* padding: 0 10px; */
	padding-bottom: 10px;
}

.edition_btn_container > .bouton_menu_edition {
	display	: flow-root;

	width: fill-available;
	width: -webkit-fill-available;
	width: -moz-available;
}

.edition_btn_container > i {
	width: 34px;
	line-height: 34px;

	font-size: 17px;
	border-radius: 8px;

	color: #FFFFFF;
	background-color: #7cb342;
}

.edition_btn_container > i.ok {
	background-color: #7cb342;
}

.edition_btn_container > i.partial {
	background-color: #fb8c00;
}

.edition_btn_container > i.partial2 {
	background-color: #fdd835;
}

.edition_btn_container > i.not {
	background-color: var(--clr-main);
}

/* ===================================================== */
/* ======================= HEADER ====================== */
/* ===================================================== */

.div-header {
	padding: 0;
	margin: 10px;
	margin-top: 0;
	margin-left: 75px;
	background: #FFFFFF;
	width: -webkit-fill-available;
	border-radius: 8px;
	box-shadow: rgba(0, 0, 0, 0.2) 0px 3px 8px;
	flex-shrink: 0;
}

.div-client {
	padding: 10px;
	color: #000000;
}

.div-client-expandable {}

.div-client-expandable::before {
	content: '';
}

.expandable-content.shrinked {}

.expandable-content.expanded {}

.div-immatriculation {
	margin-bottom: 10px;
	display: flex;
	align-items: center;
	column-gap: 8px;
}

.div-immatriculation > .btn-petit  {
	height: 30px;
	width: 30px;
	padding: 0;
	flex-shrink: 0;
}

.dossier-immatriculation-container {
	flex: 1;
	display: flex;
}

#dossier_immatriculation {
	height: 30px!important;
	width: 20%;
	min-width: 105px;
	float: left;

	flex-shrink: 0;

	border: 2px solid #000000 !important;
	border-right: 0 !important;
	border-left: 0 !important;
	border-top-right-radius: 0;
	border-bottom-right-radius: 0;
	border-radius: 0;

	text-align: center;
	font-weight: bold;

	background-color: #FFFFFF;
	color: #000000;
}

.dossier_immatriculation_left,
.dossier_immatriculation_right {
	width: 17px;
	min-width: 17px;
	height: 30px;

	display: flex;
	align-items: center;
	justify-content: center;

	font-size: 10px;
	font-weight: bold;

	border: 2px solid #000000;

	color: #FFFFFF;
	background-color: #0080C5;
}

.dossier_immatriculation_left {
	border-top-left-radius: 8px;
	border-bottom-left-radius: 8px;
	border-right: 0;
}

.dossier_immatriculation_right {
	border-top-right-radius: 8px;
	border-bottom-right-radius: 8px;
	border-left: 0;
}

.dossier-model-vehicule-container {
	width: 100%;
	display: flex;
}

.dossier-model-vehicule-container > #model_vehicule {
	flex: 1;
	height: 30px !important;
	padding: 0 12px;

	display: flex;
	align-items: center;

	border-top-left-radius: 8px;
	border-bottom-left-radius: 8px;
	border: 1px solid var(--clr-border);
	border-left: 1px solid var(--clr-border);
	border-right: 0;

	color: #424C55;
	background-color: #FFFFFF;

	cursor: not-allowed;
}

.dossier-model-vehicule-container > #model_vehicule > p {
	margin: 0;
	white-space: nowrap;
	overflow: hidden;
	text-overflow: ellipsis;
}

.dossier-montants {

}

.dossier-montants > .col-xs-6 {
	padding: 0;
}

.dossier-societe-container {
	width: 100%;
	text-align: center;
	margin-top: 20px;
	font-weight: bold;
	font-size: 17px;
}

.div_dossier {
	border-style: solid;
	border-width: thin;
	border-color: var(--clr-main);
	border-radius: 8px;
	color: #000000;
	margin-top: 5px;
}

.div-client span {
	color: #000000;
	font-weight: bold;
}

.div-client > .col-md-4 {
	padding: 0;
}

.div_client_buttons {
	border-bottom: 1px solid var(--clr-border);
	display: flex;
	flex-direction: row;
	column-gap: 8px;
}

.div_client_buttons > .div-client-button-column {
	padding: 0;
	padding-bottom: 10px;
	display: flex;
	justify-content: center;
	column-gap: 6px;

	flex-wrap: wrap;
	row-gap: 6px;
}

.div-client-button-column > .btn:not(.btn-square) {
	flex: 1;
	max-width: 240px;
}

.div_navigation {
	padding: 10px;
	display: flex;
	align-items: center;
	justify-content: center;
}

.navigation {
	display: flex;
	align-items: center;
	column-gap: 25px;

	font-size: 20px;
	color: var(--clr-main);

	z-index: 5;
}

.navigation > .main-navigation {
	display: flex;
	align-items: center;
	justify-content: center;
	column-gap: 25px;
}

.navigation i {
	cursor: pointer;
}

@media screen and (max-width: 992px) {
	.navigation {
		position: relative !important;
	}
}

.centre_menu {
	height: 34px;
	margin: 10px;

	border-radius: 8px;
	border-style: solid;
	border-width: thin;

	font-size: 16px;
	line-height: 34px;
}

/* ===================================================== */
/* ======================= NAVBAR ====================== */
/* ===================================================== */

.nav.navbar-nav {
	display: flex;
	align-items: center;
}

.navbar-inverse {
	border-radius: 0;
	background-color: var(--clr-main);
	background-image: url("../img/banner.webp");
	background-size: cover;
	background-position: center;
	border: none;
	margin: 0;
}

.navbar-inverse .navbar-nav > li > a {
	color: #FFFFFF;
}

.navbar-inverse .navbar-nav > li > a:focus,
.navbar-inverse .navbar-nav > li > a:hover {
	color: var(--clr-border);
	background-color: transparent;
}

.navbar-inverse .navbar-nav > .open > a,
.navbar-inverse .navbar-nav > .open > a:focus,
.navbar-inverse .navbar-nav > .open > a:hover {
	color: var(--clr-text-clear);
	background-color: var(--clr-main-dark);
}

.navbar-centre {
	line-height: 20px;
	position: relative;
	display: block;
	padding: 15px;
	color: #FFFFFF;
}

/* ===================================================== */
/* ===================== PWD CHANGE ==================== */
/* ===================================================== */

#change_password_form {
	gap: 10px;
}

#change_password_form > input {
	height: 38px !important;
}

#change_password_form > input[type="submit"] {
	height: 38px !important;
	width: 50%;
	align-self: flex-end;
}

/* ===================================================== */
/* ==================== LIST DOSSIER =================== */
/* ===================================================== */

.fen {
	height: 35px;
	width: 35px;
	max-width: 90%;
	bottom: 20px;
	right: 20px;

	position: fixed;

	border-radius: 8px;

	background-color: #FFFFFF;
	box-shadow: rgba(50, 50, 93, 0.25) 0px 13px 27px -5px, rgba(0, 0, 0, 0.3) 0px 8px 16px -8px;
	z-index: 9;
	overflow: hidden;
}

.fen a {
	line-height: 20px;
}

.entete_fen {
	width: 100%;
	height: 35px;
	padding: 0 10px;
	display: flex;
	align-items: center;
	background-color: var(--clr-main);
	color: #FFFFFF;
	line-height: 28px;
	border: 1px solid white;
	border-radius: 8px;
	border-bottom: 0;
}

.entete_fen > .entete_fen_option {
	display: flex;
	margin-left: 20px;
	column-gap: 15px;
}

.entete_fen > .entete_fen_option > .entete_fen_option_item {
	cursor: pointer;
}

.content_fen {
	background-color: #FFFFFF;
	color: #000000;
	height: 0px;
	padding: 2px;
}

.maximise,
.minimise {
	margin-left: auto;
}

.maximise:hover,
.minimise:hover {
	cursor: pointer;
}

.ui-state-active,
.ui-widget-content
.ui-state-active,
.ui-widget-header .ui-state-active,
a.ui-button:active,
.ui-button:active,
.ui-button.ui-state-active:hover {
	border: 1px solid var(--clr-border) !important;
	background: var(--clr-border) !important;
	font-weight: normal;
	color: #FFFFFF;
}

/* ===================================================== */
/* ======================= DIV BAS ===================== */
/* ===================================================== */

.div_content {
	height: -webkit-fill-available;
	width: -webkit-fill-available;
	margin: 10px;
	margin-top: 0;
	margin-left: 75px;
	padding: 10px;
	border-radius: 8px;

	display: flex;

	background: #FFFFFF;
	box-shadow: rgba(0, 0, 0, 0.2) 0px 3px 8px;
	overflow: hidden;
}

.bas-tabs {
	margin-top: 0px;
	padding: 0;
	overflow-y: auto;
	overflow-x: hidden;
}

.bas-tabs > .tabs-grilles {
	position: sticky;
	top: 0;

	background: #FFFFFF;
	z-index: 1;
}

.nav-tabs {
	margin-bottom: -1px;

	display: flex;
	flex-direction: row;
	justify-content: flex-start;
	flex-wrap: wrap;
}

.nav-tabs::before,
.nav-tabs::after {
	display: inherit;
	content: none;
}

.grilles_bas {
	padding: 0;
	padding-top: 10px;
}

.nav-tabs > li.active > a,
.nav-tabs > li.active > a:focus,
.nav-tabs > li.active > a:hover {
	color: var(--clr-main);
	font-weight: 600;
}

.nav-tabs > li > a {
	padding: 10px;
	border-radius: 8px 8px 0 0;
	color: #999999;
}

.doc_row {
	min-height: 25px;
	gap: 5px;

	display: flex;
	align-items: center;
}

.doc_row > a {
	text-overflow: ellipsis;
	white-space: nowrap;
	overflow: hidden;

	font-size: 15px;
}

@media screen and (max-width: 992px) {
	.doc_row {
		height: 45px;
		gap: 20px;
		display: flex;
		align-items: center;
	}

	.doc_row > a {
		font-size: 18px;
	}

	.doc_row > i {
		font-size: 1.5em;
	}
}

.add_ligne_or_header {
	height: 70px;
	padding: 15px;

	display: flex;
	flex-direction: row;
	align-items: center;
	justify-content: space-evenly;
	flex-shrink: 0;

	background-color: #F9F9F9;
	border: 1px solid var(--clr-border);
}

#add_ligne_or,
#add_ligne_facture {
	height: 450px;
	max-height: 450px;
	display: flex;
	flex-direction: column;
	overflow: auto;
}

#add_ligne_or > .add_ligne_or_row,
#add_ligne_facture > .add_ligne_or_row {
	padding: 15px;
	display: flex;
	flex-direction: row;
	align-items: center;
	justify-content: space-evenly;
	flex-shrink: 0;
}

#add_ligne_or > .add_ligne_or_row:nth-child(odd),
#add_ligne_facture > .add_ligne_or_row:nth-child(odd) {
	height: 55px;
	background-color: #FFFFFF;
	border-bottom: 1px solid var(--clr-border);
	transition: all .1s;
}

#add_ligne_or > .add_ligne_or_row:nth-child(even),
#add_ligne_facture > .add_ligne_or_row:nth-child(even) {
	height: 55px;
	background-color: #FCFCFC;
	border-bottom: 1px solid var(--clr-border);
	transition: all .1s;
}

#add_ligne_or > .add_ligne_or_row:hover,
#add_ligne_facture > .add_ligne_or_row:nth-child(even) {
	background-color: rgba(0,0,0,.05);
	transition: all .1s;
}

.add_ligne_or_header > p,
.add_ligne_or_row > p {
	margin: 0;
	text-align: left !important;
}

.add_ligne_or_header > p:last-child {
	text-align: center !important;
}

#jsgrid_or_btn {
	margin-top: 10px;
}

.adresse-intervention-container {
	height: 100%;
	width: 50%;
	padding: 15px;
	background-color: var(--clr-lightgray);
	border: 1px solid var(--clr-border);
	border-radius: 8px;
}

.adresse-intervention-container > h3 {
	margin-top: 0;
	margin-bottom: 20px;
	text-align: left;
	color: var(--clr-main);
}

/* ===================================================== */
/* ====================== DOCUMENTS ==================== */
/* ===================================================== */

.bas-docs {
	height: -webkit-fill-available;
	margin-top: 0px;
	display: flex;
	flex-direction: column;
}

.bas-docs > h3 {
	line-height: 42px;
	margin-top: 0;
	margin-bottom: 0;
}

.bas-docs > .bas-docs-form {
	height: calc(100% - 42px);
	display: flex;
	flex-direction: column;
}

.dossier-docs {
	max-height: 500px;
	width: 100%;
	padding: 15px;
	border: 1px solid var(--clr-border);
	border-radius: 8px;
	background-color: var(--clr-lightgray);
	overflow: auto;
}

.dossier-docs-btn {
	width: 100%;
	margin-top: 10px;
}

/* ===================================================== */
/* ========================= APP ======================= */
/* ===================================================== */

.app-loading-screen {
	position: absolute;

	top: 0;
	left: 0;

	height: 100%;
	width: 100%;

	display: flex;
	align-items: center;
	justify-content: center;

	background: white;

	z-index: 9999;
}

#appBtnInformation[data-new-alert="true"] {
	background: limegreen !important;
	border: 1px solid limegreen !important;
}

.div_app {
	height: 100vh;
	padding: 0;

	display: flex;
}

.div_app h3 {
	display: flex;
	flex-direction: row;
	align-items: center;

	margin-top: 16px !important;
	margin-bottom: 8px !important;

	font-size: 2.2rem;
}

.div_app h3:first-of-type {
	margin-top: 0 !important;
}

.div_app h3 > .app_update_dossier_btn {
	height: 30px;
	width: 30px;
	margin: 0 10px;
	padding: 0;

	font-size: 15px;
	color: #FFFFFF;

	border: none;
	border-radius: 8px;
	background-color: var(--clr-main);
}

.div_app h3 > button {
	margin-left: auto;
}

#appForm {
	display: flex;
	flex-direction: row;
	flex: 1;
}

#appForm > .form_step {
	height: 100%;
	width: 100%;
	padding: 10px;
	display: flex;
	flex-direction: column;
	flex-shrink: 0;
}

.form_step > .form-step-header-bck {
	position: absolute;
	top: 0;
	left: 0;

	height: 160px;
	width: 100%;

	background: var(--clr-main);
	z-index: 0;
}

.form_step > .form-step-header {
	height: 50px;
	width: calc(100% + 20px);
	padding: 0 10px;

	margin-left: -10px;
	margin-top: -10px;

	display: flex;
	align-items: center;
	justify-content: space-between;

	background: var(--clr-main);
	z-index: 1;
}

.form-step-header > img {
	width: 90px;
	display: block;
	object-fit: contain;
}

.form-step-header > h3 {
	font-size: 20px;
	margin: 0 !important;

	color: var(--clr-text-clear);
}

.form_step > .form-group {
	margin-bottom: 10px;
}

.form-step-header-logout {
	width: 90px;
	display: flex;
	align-items: center;
	justify-content: center;
}

.form-step-header-logout > a {
	height: 30px;
	width: 30px;
	margin: 0;
	padding: 0;

	border: none;
	border-radius: 8px;

	line-height: 30px;
	text-align: center;
	font-size:15px;

	color: var(--clr-main);
	background-color: #FFFFFF;
}

.form-step-my-selling-point {
	padding: 10px;
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	row-gap: 10px;
	border-radius: 16px;
	margin-top: 10px;
	background-color: #FFFFFF;
	z-index: 1;
	box-shadow: rgba(0, 0, 0, 0.2) 0px 3px 8px;
}

.centre_point_vente {
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
}

.form_step .progress {
	margin-top: 5px;
}

.form_step > .centre_point_vente {
	margin-top: 15px;

	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
}

.form_step > #app_section_centre_doss_container > .dossiers_container {
	height: auto;
	width: 100%;
	margin-top: 10px;
}

.form_step > #app_section_centre_doss_container > .dossiers_container:first-of-type {
	margin-top: 0;
}

.dossiers_container > .dossiers_container_header {
	height: 40px;
	width: 100%;

	padding: 0 10px;

	display: flex;
	flex-direction: row;
	align-items: center;
	gap: 10px;

	border-radius: 8px;

	background-color: var(--clr-main);
}

.dossiers_container > .dossiers_container_header > h4 {
	text-transform: lowercase;
	font-variant: small-caps !important;
	color: #FFFFFF;
}

.dossiers_container > .dossiers_container_header > .app_comment_nmbr {
	height: 20px;
	width: 20px;

	margin-right: 10px;

	display: flex;
	align-items: center;
	justify-content: center;

	border-radius: 8px;
	background-color: #FFFFFF;
}

.dossiers_container > .dossiers_container_header > .app_comment_nmbr > span {
	text-transform: lowercase;
	font-weight: bold;
	color: var(--clr-main);
}

.dossiers_container > .dossiers_container_header > .cl_op_btn {
	height: auto;
	width: auto;

	margin-bottom: 0;
	margin-right: 10px;
	margin-left: auto;

	border: none;
	outline: none;

	font-size: 17px;
	text-align: center;
	color: var(--clr-text-clear);

	background-color: transparent;
}

.dossiers_container > .dossiers_rows_container {
	display: flex;
	flex-direction: column;
	border-radius: 8px;
}

.dossiers_rows_container > .dossier_row {
	height: auto;
	margin-top: 5px;
	display: flex;
	flex-direction: column;
	align-items: center;

	border-radius: 8px;

	background-color: #FFFFFF;
}

.dossier_row > .dossier_row_top,
.dossier_row > .dossier_row_bottom {
	height: auto;
	width: 100%;
	padding: 8px;

	display: flex;
	flex-direction: row;
	align-items: center;
}

.dossier_row > .dossier_row_bottom {
	padding-top: 0;
}

.dossier_row_top > p,
.dossier_row_bottom > p,
.dossier_row_top > a {
	margin-bottom: 0 !important;
	flex-shrink: 0;
}

.dossier_row_top > p {
	font-weight: bold;
	color: #424242;
}

.dossier_row_top > .home_client_nom {
	text-transform: uppercase;
	white-space: nowrap;
	overflow: hidden;
	text-overflow: ellipsis;
	margin-right: 5px;
}

.dossier_row_bottom > .app_custom_input {
	-webkit-appearance: none;
	-moz-appearance: none;

	height: 30px !important;
	width: 100%;
	padding: 0 5px;
	margin-right: 5px;

	border: 1px solid #757575;
	border-radius: 8px;
	background-color: #FFFFFF;

}

.dossier_row_bottom > .app_custom_input:disabled {
	height: 30px !important;
	width: 100%;
	padding: 0 5px;

	border: none;
	background-color: #F5F5F5;
}

.dossier_row_top > button,
.dossier_row_bottom > button {
	height: 30px;
}

.dossier_row_top > button {
	width: 85px;
	margin-left: auto;
}

.dossier_row_bottom > button {
	width: 40px;
	margin-right: 5px;
	flex-shrink: 0;

	border: none;
}

.dossier_row_bottom > .home_annule_dossier {
	background-color: var(--clr-main);
}

.dossier_row_bottom > .home_add_rappel {
	background-color: #29b6f6;
}

.dossier_row_bottom > .home_comment_display {
	background-color: #29b6f6;
}

.dossier_row_bottom > .home_client_tel {
	height: 30px;
	min-width: 0;
	width: 40px;

	display: flex;
	align-items: center;
	justify-content: center;
	flex-shrink: 0;

	text-decoration: none;

	border-radius: 8px;
	color: var(--clr-text-clear);
	background-color: #8bc34a;
}

.dossier_row_bottom > .home_comment_display:disabled,
.dossier_row_bottom > .home_add_rappel:disabled,
.dossier_row_bottom > .home_save_rappel:disabled {
	display: none;
}

.dossiers_rows_container > .dossier_row:last-child {
	border-bottom: none;
}

.form_step > .button_step {
	/* margin: 15px 0; */
	padding: 8px 0;
	margin-top: auto;
	display: flex;
	flex-wrap: wrap;
	flex-direction: row;
	justify-content: space-between;
	row-gap: 8px;
}

.button_step > button {
	min-width: 30%;
	padding: 6px;
}

.button_step > input[type="submit"] {
	height: 34px !important;
}

.form-group > .inline-row {
	display: -webkit-flex;
	flex-direction: row;
	align-items: center;
}

.form-group > .inline-row > .inline-row-col {
	width: 33%;
	display: -webkit-flex;
	flex-direction: row;
	align-items: center;
	justify-content: center;
}

.form-control {
	border-radius: 8px;
}

.inline-row > label,
.form-group > .inline-row > .inline-row-col > label {
	width: auto;
	margin-bottom: inherit !important;
	flex-shrink: 0;
	color: var(--clr-main-dark);
}

.inline-row.app-inline-row-grid {
	display: grid;
	grid-template-columns: 1fr 35px 1fr 35px;
}

.inline-row > .label_modal_vehicule {
	width: 30%;
}

.inline-row > .label_margin {
	width: 20px;
}

.inline-row > input {
	width: 50% !important;
}

.inline-row > input[type="date"] {
	width: fill-available !important;
	width: -webkit-fill-available !important;
	width: -moz-available !important;

	padding: 0 10px;
	line-height: normal;
}

.inline-row > input[type="time"] {
	width: 150px !important;
}

.inline-row > input[type="radio"],
.inline-row > input[type="checkbox"] {
	flex-shrink: 0;

	height: 13px !important;
	width: 13px !important;
	margin: 0px 10px 0px 4px !important;
}

.app_warning {
	color: orange !important;
}

.app-photos-container {
	overflow: auto;
}

.form_step .app_media_container {
	height: auto;
	width: 100%;
	display: grid;
	grid-template-columns: repeat(auto-fill, 99%);
	/* grid-auto-rows: 360px; */
	justify-content: space-between;
	row-gap: 5px;
}

.app_media_container > .app_img_container {
	position: relative;
}

.app_media_container > .app_img_container > img {
	height: 100%;
	width: 100%;
	object-fit: contain;
	object-position: center;
	border-radius: 8px;
}

.app_media_container > .app_img_container > button {
	height: 30px;
	width: 30px;
	margin: 0 !important;
	padding: 0 !important;

	position: absolute;
	right: 5px;
	bottom: 5px;
}

.app_media_container > .app_img_container > p {
	height: 100%;
	width: 100%;
	gap: 5px;
	display: flex;
	align-items: center;
	justify-content: center;
	border: 3px solid #000000;
	border-radius: 8px;
}

.app_media_container > .app_img_container > p > i {
	font-size: 35px;
}

.form_step > .form_commentaire_container {
	height: auto;
	width: 100%;
	margin-top: 5px;
	display: flex;
	flex-direction: column;
	overflow: scroll;
}

.form_commentaire_container > .form_commentaire {
	margin-top: 5px;
}

.form_commentaire_container > .form_commentaire:first-child {
	margin-top: inherit;
}

.form_commentaire_container > .form_commentaire:last-child {
	margin-bottom: 10px;
}

.form_commentaire > label > .commentaire_from {
	font-weight: bold;
	color: #0086c3;
}

.form_commentaire > label > .commentaire_date {
	font-weight: 100;
}

.form_commentaire > .commentaire_bubble {
	height: auto;
	min-height: 46px;
	width: auto;
	margin-left: 10px;

	display: flex;
	align-items: center;

	border-top-right-radius: 16px;
	border-bottom-left-radius: 16px;
	border-bottom-right-radius: 16px;

	background-color: #29b6f6;
}

.commentaire_bubble > p {
	padding: 10px;
	margin: 0;
	color: #FFFFFF;
}

.commentaire_bubble > .delete_commentaire_btn {
	flex-shrink: 0;

	height: 30px;
	width: 30px;
	margin-left: auto;
	margin-right: 10px;

	border: none;
	border-radius: 50px;

	color: var(--clr-main);
	background-color: #FFFFFF;
}

.form-vehicule {
	margin-bottom: 5px;
}

.appStaticAssuTable {
	width: 100%;
}

.appStaticAssuTable > .appStaticAssuRow {
	margin-bottom: 5px;

	display: flex;
	flex-direction: column;
}

.appStaticAssuRow > .appStaticAssuRowHeader {
	padding: 10px;
	display: flex;
	justify-content: space-between;
	background-color: lightgrey;
}

.appStaticAssuRow > .appStaticAssuRowContent {
	display: flex;
	flex-direction: row;
}

.appStaticAssuRowContent > span {
	min-height: 70px;
	padding: 5px;

	display: flex;
	align-items: center;

	border-right: 1px solid var(--clr-border);
	border-bottom: 1px solid var(--clr-border);
}

.appStaticAssuRowContent > span:first-of-type {
	width: 100%;
	border-left: 1px solid var(--clr-border);
}

.appStaticAssuRowContent > span:last-of-type {
	width: 100px;
	flex-shrink: 0;
}

/* ===================================================== */
/* ====================== RGL CHEQUE =================== */
/* ===================================================== */

.chequeListContainer,
.especeListContainer {
	height: auto;
	width: 100%;

	display: flex;
	flex-direction: column;
}

.chequeListContainer > .chequeListHeader,
.especeListContainer > .especeListHeader {
	margin-top: 15px;
	padding: 15px;

	display: flex;
	flex-direction: row;
	align-items: center;
	justify-content: space-between;

	border: 1px solid var(--clr-border);
	background-color: #F9F9F9;

	overflow-x: auto;
}

.chequeListContainer > .chequeListHeader:first-child,
.especeListContainer > .especeListHeader:first-child {
	margin-top: 0;
}

.chequeListContainer > .chequeListHeader > h3,
.chequeListContainer > .chequeListHeader > label,
.especeListContainer > .especeListHeader > h3,
.especeListContainer > .especeListHeader > label {
	width: 50%;

	display: flex;
	align-items: center;

	font-size: 15px;
}

.chequeListContainer > .chequeListHeader > h3,
.especeListContainer > .especeListHeader > h3 {
	margin: 0;
	padding: 0;
	justify-content: flex-start;
}

.chequeListContainer > .chequeListHeader > label,
.especeListContainer > .especeListHeader > label {
	margin: 0;
	padding: 0;
	justify-content: flex-end;
}

.chequeListContainer > .chequeList
.especeListContainer > .epseceList {
	height: auto;
	width: 100%;

	display: flex;
	flex-direction: column;
}

.chequeListContainer > .chequeList > .chequeRow,
.especeListContainer > .especeList > .especeRow {
	padding: 10px 50px;

	display: flex;
	flex-direction: row;
	align-items: center;
	justify-content: space-between;

	border: 1px solid var(--clr-border);
	border-top: none;
}

.chequeListContainer > .chequeList > .chequeRow > p,
.especeListContainer > .especeList > .especeRow > p {
	width: 200px;

	padding: 0 !important;
	margin: 0 !important;
}

/* ===================================================== */
/* ==================== HISTO STATUT =================== */
/* ===================================================== */

.histo_container {
	height: 100%;
	display: flex;
	flex-direction: row;
}

.histo_container > .histo_bar {
	height: auto;
	width: 4px;
	flex-shrink: 0;
	border-radius: 8px;
	background-color: var(--clr-main);
}

.histo_container > .histo_row_container {
	height: 100%;
	width: 100%;
	margin-left: 10px;
	display: flex;
	flex-direction: column;
}

.histo_container > .histo_row_container > .histo_row::before {
	content: '\2022';
	position: absolute;
	left: -20px;
	display: flex;
	align-items: center;
	height: 100%;
	font-size: 45px;
	color: var(--clr-main);
}

.histo_container > .histo_row_container > .histo_row {
	position: relative;
	margin-bottom: 10px;

	display: flex;
	flex-direction: column;

	border-radius: 8px;

	background-color: #F9F9F9;
}

.histo_row:last-child {
	margin-bottom: 0 !important;
}

.histo_row > .histo_row_header {
	height: 35px;
	width: 100%;
	padding: 5px 15px;

	display: flex;
	flex-direction: row;
	align-items: center;

	border-top-left-radius: 8px;
	border-top-right-radius: 8px;

	font-weight: bold;

	color: #FFFFFF;
	background-color: #424C55;
}

.histo_row_header > i {
	padding: 0 15px;
}

.histo_row > .histo_row_content {
	min-height: 40px;

	display: flex;
	flex-direction: row;
	align-items: center;

	padding: 5px;

	border-bottom-left-radius: 8px;
	border-bottom-right-radius: 8px;

	border-left: 1px solid var(--clr-border);
	border-right: 1px solid var(--clr-border);
	border-bottom: 1px solid var(--clr-border);
}

.histo_row_content > .histo_row_inline {
	width: 50%;
}

.histo_row > .histo_row_header > p,
.histo_row > .histo_row_content > p {
	margin: 0 !important;
}

.histo_row_content > p {
	width: 50%;
	text-align: center;
}

.histo_row_content > .histo_row_inline > p {
	width: 100%;
	margin-bottom: 10px !important;

	text-align: center;
}

.histo_row_content > .histo_row_inline > p:last-child {
	margin: 0 !important;
}

.ui-accordion .ui-accordion-content {
	padding: 1em !important;
	height: auto !important;
}

.ui-accordion-content > div {
	margin-bottom: 2px;
	padding: 0 5px;
}

.ui-accordion-content a:hover {
	background-color: aliceblue;
	color: #000000 !important;
}

/* ===================================================== */
/* ================ REPORTING FULL PAGE ================ */
/* ===================================================== */

.repotingFullPage {
	min-height: 100vh;
	height: 100vh;
	width: 100vw;

	display: flex;

	position: fixed;
	top: 0;
	left: 0;

	background-color: #FFFFFF;

	z-index: 200;
}

.reportingFullPageMenu {
	overflow: auto;
	height: 100%;
	width: 250px;
	padding: 15px;

	flex-shrink: 0;

	background-color: #FAFAFA;
	box-shadow: 0 1px 3px rgb(0 0 0 / 12%), 0 1px 2px rgb(0 0 0 / 24%);
}

.reportingFullPageMenu > .reportingFullPageMenuHeader {
	margin-bottom: 30px;
}

.reportingFullPageMenu > .reportingFullPageMenuContent {
	padding: 0;
}

.reportingFullPageMenu > .reportingFullPageMenuContent > .bouton_reporting_menu {
	margin: 10px 0;
	display: flow-root;
	width: fill-available;
	width: -webkit-fill-available;
	width: -moz-available;
}

.reportingFullPageMenu > .reportingFullPageMenuHeader > #reportingFullPageClose {
	height: 35px;
	width: 35px;

	border: none;
	border-radius: 8px;

	color: #FFFFFF;
	background-color: var(--clr-main);
}

.reportingFullPageMenu > .reportingFullPageMenuHeader > #reportingFullPagehide {
	height: 35px;
	width: 35px;

	border: none;
	border-radius: 8px;

	color: #FFFFFF;
	background-color: var(--clr-main);;

	float: right;
}

.reportingFullPageContentWrap {
	min-height: 100%;

	width: fill-available;
	width: -webkit-fill-available;
	width: -moz-available;

	padding: 15px;

	overflow: auto;
}

.reportingFullPageContentWrap > .reportingFullPageContentHeader {
	margin-bottom: 30px;
}

.reportingFullPageContentWrap > .reportingFullPageContentHeader > h1 {
	margin: 0 !important;
}

.reportingFullPageContentWrap > .reportingFullPageContent {
	min-height: calc(100% - 70px);
	display: flex;
	align-items: flex-start;
}

.reportingFullPageContent > section {
	display: flex;
	flex-direction: column;
	align-items: center;
	flex: 1;
	overflow-x: hidden;
}

.reportingChartBox {
	width: calc(33.33% - 20px);
	min-width: 450px;
	margin: 10px;

	height: fit-content;

	border-radius: 8px;
	background-color: var(--clr-lightgray);

	box-shadow: rgba(99, 99, 99, 0.2) 0px 2px 8px 0px;
}

.reportingChartBox > .chartBoxTitle {
	padding: 10px;
	margin: 0 !important;

	display: flex;
	align-items: center;

	border-top-left-radius: 8px;
	border-top-right-radius: 8px;

	background-color: var(--clr-main);
	color: #FFFFFF;
}

.chartBoxTitle > span {
	margin: 0 5px;

	font-size: 15px;
	font-weight: bold;
}

.chartBoxTitle > button {
	height: 20px;
	width: 20px;
	margin-left: auto;
	padding: 0;

	display: flex;
	align-items: center;
	justify-content: center;

	border-radius: 8px;
	border: none;

	font-size: 12px;

	background-color: rgba(0,0,0,0.3);
	transition: all .07s;
}

.chartBoxTitle > button:hover {
	background-color: rgba(0,0,0,0.5);
	transition: all .07s;
}

/* ===================================================== */
/* ================ PLANNING APPEL ASSU ================ */
/* ===================================================== */

.calendarEventList {
	padding: 15px;

	display: flex;
	flex-direction: column;

	border-radius: 8px;
	background-color: #2C3E50;
	box-shadow: rgba(0, 0, 0, 0.2) 0px 3px 8px;
}

.calendarDragEvent {
	height: 35px;
	width: 100%;
	padding: 0 10px;
	margin-bottom: 5px;

	line-height: 35px;

	border-radius: 8px;

	color: #FFFFFF;
	background-color: #3788D8;
}

.calendarDeleteEvent,
.calendarTakeEvent,
.calendarGoToEvent {
	height: 18px;
	width: 25px;
	right: 2px;
	bottom: 2px;
	padding: 0;
	top: -2px;

	border: none;
	border-radius: 2px;

	font-size: 15px;
	background-color: #FFFFFF;
	position: absolute;
}

.calendarDeleteEvent {
	color: var(--clr-main);
}

.calendarTakeEvent {
	color: #0288d1;
}

.calendarGoToEvent {
	right: 29px;
	color: #4caf50;
}

.userPlanningList {
	padding: 15px;

	display: flex;
	flex-direction: column;

	border-radius: 8px;
	background-color: #2C3E50;
	box-shadow: rgba(0, 0, 0, 0.2) 0px 3px 8px;
}

.userPlanningList > button {
	margin-bottom: 5px;
}

.userPlanningList > button:last-child {
	margin-bottom: 0;
}

.fc-timegrid-event {
	border-width: 3px !important;
}

.calendarAssurance {
	width: calc(66.66% - 20px);
	margin: 0 10px;
	padding: 10px;

	border-radius: 8px;

	background: #FFFFFF;
	box-shadow: rgba(0, 0, 0, 0.2) 0px 3px 8px;
}

/* ===================================================== */
/* ================= PLANNING AUDIENCE ================= */
/* ===================================================== */

.calendar-audiences {
	width: calc(66.66% - 20px);
	margin: 0 10px;
	padding: 8px;

	border-radius: 8px;

	background: #FFFFFF;
	box-shadow: rgba(0, 0, 0, 0.2) 0px 3px 8px;
}

.planning-audience-dossier-draggable,
.planning-audience-event-type-draggable {
	padding: 8px;

	display: flex;
	align-items: center;
	column-gap: 8px;

	border-radius: 8px;

	background: var(--clr-main);
	cursor: move;
}

.planning-audience-dossier-draggable > span,
.planning-audience-event-type-draggable > span {
	color: #FFFFFF;
	pointer-events: none;
}

.planning-audience-dossier-draggable > span.planning-audience-dossier-id {
	font-weight: bold;
}

.planning-audience-dossier-draggable > span.planning-audience-client {}

.planning-audience-dossier-draggable > span.planning-audience-date {
	margin-left: auto;
}

.calendar-events-list,
.user-planning-audience-list {
	height: 100%;
	padding: 10px;

	display: flex;
	flex-direction: column;
	row-gap: 8px;

	border-radius: 8px;

	background: #FFFFFF;
	box-shadow: rgba(0, 0, 0, 0.2) 0px 3px 8px;
}

.calendar-events-list > .calendar-audience-liste-dossier {
	display: flex;
	flex-direction: column;
	flex: 1;

	overflow: hidden;
}

.calendar-events-list > .calendar-audience-liste-type-evenement {
	flex-shrink: 0;
	max-height: 33.33%;
}

.calendar-audience-liste-dossier > .calendar-audience-liste-dossier-title,
.calendar-audience-liste-type-evenement > .calendar-audience-liste-type-evenement-title {
	padding: 8px;
	color: #FFFFFF;
	background: var(--clr-border);

	border-radius: 8px;
	border-bottom-left-radius: 0;
	border-bottom-right-radius: 0;

	font-size: 1.4rem;
	font-weight: bold;
}

.calendar-audience-liste-dossier > .calendar-audience-liste-dossier-body,
.calendar-audience-liste-type-evenement > .calendar-audience-liste-type-evenement-body {
	flex: 1;
	padding: 8px;

	display: flex;
	flex-direction: column;

	row-gap: 4px;

	border-radius: 8px;
	border-top-left-radius: 0;
	border-top-right-radius: 0;
	border: 1px solid var(--clr-border);
	border-top: 0;

	overflow: auto;
}

/* ========================================================= */
/* ========================== CRM ========================== */
/* ========================================================= */

/* ======================== SEARCH ========================= */

.crm_filter_result {
	height: auto;
	width: 100%;
	min-width: 415px;
	padding: 15px;

	position: absolute;
	top: calc(100% - 8px);

	display: flex;
	flex-direction: column;

	border: 1px solid #C0C0C0;
	border-bottom-left-radius: 8px;
	border-bottom-right-radius: 8px;
	background-color: #FFFFFF;

	z-index: 100;
	box-shadow: 0 1px 3px rgb(0 0 0 / 12%), 0 1px 2px rgb(0 0 0 / 24%);
}

.crm_filter_result > .form-group {
	margin-bottom: 15px;
}

.crm_filter_result > .form-group input[type="number"] {
	width: 100% !important;
}

.crm_filter_result > .form-group input[type="radio"] {
	margin: 0;
}

/* ========================== LIST USERS ACTIONS ========================== */

.crm_list_action_users {
	display: none;
	height: 70px;
	width: 100%;
	background-color: #f9f9f9;
	border-bottom: 1px solid var(--clr-border);
}

/* ========================== ACTIONS ========================== */

.crm_container {
	height: calc(100vh - 50px);
	padding: 15px;

	display: flex;
}

.crm_actions_container {
	height: 100%;
	max-height: 100%;
	width: 40%;
	padding: 15px;

	border-radius: 8px;
	background-color: #2C3E50;
	box-shadow: rgba(0, 0, 0, 0.2) 0px 3px 8px;

	overflow-y: overlay !important;
	overflow-x: hidden !important;
}

.crm_planning_container {
	height: 100%;
	width: 60%;
	padding: 10px;
	margin-left: 10px;

	display: flex;
	flex-direction: column;

	border-radius: 8px;

	background: #FFFFFF;
	box-shadow: rgba(0, 0, 0, 0.2) 0px 3px 8px;
}

.crm_actions_row {
	height: 38px;
	width: 100%;
	margin-bottom: 1px;

	background-color: var(--clr-lightgray);
	box-shadow: 0 1px 3px rgba(0,0,0,0.12), 0 1px 2px rgba(0,0,0,0.24);
	transition: all .1s;
}

.crm_actions_row:last-child {
	margin-bottom: 0;
}

.crm_actions_row:hover {
	background-color: #E9E9E9;
}

.crm_actions_row > h1 {
	height: 38px;
	margin: 0;
	display: flex;
	font-size: 15px;
	font-weight: 700;
}

.crm_actions_row > h1 > span:first-child {
	text-align: center;
	font-weight: bold;

	color: var(--clr-text-clear);
}

.crm_actions_row > h1 > span {
	line-height: 38px;
	padding: 0 15px;

	font-weight: 100;
}

.crm_actions_row > h1 > button {
	padding-right: 15px;
	font-size: 15px;
	border: none;
	background: transparent;
	color: #000000;
}

.crm_actions_row > .crm_actions_row_info {
	padding: 15px;

	display: flex;
	flex-direction: column;

	border-top: 1px solid #C0C0C0;
}

.crm_actions_row > .crm_actions_row_info > p {
	margin: 0 !important;
}

.crm_actions_row > .crm_actions_row_info > p > span {
	width: 50px;
	display: inline-block;
	font-weight: bold;
}

.crm_actions_row > .crm_actions_row_info > textarea {
	height: 200px;
	margin: 15px 0;
	resize: none;
}

.crm_actions_row > .crm_actions_row_info > .crm_actions_row_buttons {
	width: 100%;

	display: flex;
	flex-direction: row;
	justify-content: flex-end;
}

.crm_actions_row > .crm_actions_row_info > .crm_actions_row_buttons > button {
	margin-left: 10px;
}

@media screen and (max-width: 992px)
{
	.crm_filter_result {
		height: auto;
		width: calc(50% + 50px);
		min-width: 400px;
		padding: 5px;

		position: absolute;
		top: calc(100% - 10px);

		display: flex;
		flex-direction: column;

		border: 1px solid #C0C0C0;
		border-bottom-left-radius: 8px;
		border-bottom-right-radius: 8px;
		background-color: #FFFFFF;

		z-index: 100;
		box-shadow: 0 1px 3px rgb(0 0 0 / 12%), 0 1px 2px rgb(0 0 0 / 24%);
	}

	.crm_container {
		height: auto;
		padding: 5px;

		display: flex;
		flex-wrap: wrap;
	}

	.crm_actions_container {
		display: none;
		width: inherit;
		max-height: calc(100vh - 56px);
		position: absolute;
		left: 3px;
		right: 3px;
		top: 3px;
		bottom: 3px;
		margin-bottom: 15px;
		border-radius: 0;
		z-index: 10;
	}

	.crm_actions_container #crm_action_close_containers {
		display: block !important;
	}

	.crm_planning_container {
		height: 100vh;
		width: 100%;
		padding: 0;
	}

	.crm_actions_row > h1 > span:first-child {
		flex-shrink: 0;
	}

	.crm_actions_row > h1 > span {
		line-height: 38px;
		padding: 0 5px;

		font-weight: 100;

		white-space: nowrap;
		text-overflow: ellipsis;
		overflow: hidden;
	}

	.crm_actions_row > h1 > button {
		padding-right: 5px;
		font-size: 15px;
		border: none;
		background: transparent;
		color: #000000;
	}

	.crm_actions_row .crmValidateAction {
		display: none;
	}
}

/* ========================== CLIENTS ========================== */

.crm_info_client {
	position: relative;

	padding: 15px;

	display: flex;
	flex-direction: row;
	flex-wrap: wrap;

	border-bottom: 1px solid var(--clr-border);

	background-color: #F9F9F9;
}

.crm_info_client > .crm_info_client_right > h1,
.crm_info_client > .crm_info_client_left > h1,
.crm_info_comment_container > h1 {
	width: 50%;

	margin-top: 0;
	margin-bottom: 15px;

	font-size: 25px;
	font-weight: bold;
	color: var(--clr-main);
}

.crm_info_client > .crm_info_client_left {
	width: calc(100% - 5px);
	margin-right: 5px;
	display: flex;
	flex-direction: column;
}

.crm_info_client > .crm_info_client_right {
	width: calc(100% - 5px);
	margin-left: 5px;
	display: flex;
	flex-direction: column;
}

.crm_info_client > .crm_info_client_left input,
.crm_info_client > .crm_info_client_right input {
	transition: all .1s;
}

.crm_info_client > .crm_info_client_left input[disabled],
.crm_info_client > .crm_info_client_right input[disabled] {
	background: transparent;
	border: none;
	box-shadow: none;
	padding: 0;

	transition: all .1s;
}

.crm_info_client > .crm_info_client_left > span,
.crm_info_client > .crm_info_client_right > span {
	margin-bottom: 5px;
}

.crm_info_client > .crm_info_client_left > span > b,
.crm_info_client > .crm_info_client_right > span > b {
	display: inline-block;
	width: 120px;

	color: var(--clr-main-dark);
}

.crmOpenLeftPanel {
	height: 34px;
	width: 34px;
	font-size: 15px;
	border-radius: 8px;
	border: none;
	color: var(--clr-text-clear);
	background-color: var(--clr-main);
	box-shadow: 0 1px 3px rgba(0,0,0,0.12), 0 1px 2px rgba(0,0,0,0.24);
	transition: all .1s;
	z-index: 2;
}

.crmOpenLeftPanel:hover {
	background-color: var(--clr-main-dark);
	transition: all .1s;
}

.modal-body-right {
	position: absolute;
	top: 0;
	bottom: 0;

	background-color: #FFFFFF;
	z-index: -1;
}

.modal-body-right > .modal-header > h5,
.modal-body-right > .modal-header > i {
	margin: 0;
	color: #AAAAAA;
}

.crm_info_comment_container > textarea {
	flex: 1;
	resize: none;
}

@media screen and (max-width: 992px) {
	#crm_client_modal {
		padding: 0 !important;
	}

	#crm_client_modal .modal-body {
		height: inherit !important;
	}

	.crmOpenLeftPanel {
		right: 10px;
		transform: translateY(-50%) translateX(0);
	}

	.crmOpenLeftPanel:hover {
		transform: scale(1.1);
	}

	.modal-body-right {
		position: initial;
		top: 0;
		bottom: 0;
		background-color: #FFFFFF;
		z-index: -1;
		border-top: 1px solid #E5E5E5;
	}

	.crm_info_client > .crm_info_client_left,
	.crm_info_client > .crm_info_client_right {
		width: 100%;
	}

	.crm_info_client > .crm_info_client_right > h1 {
		margin-top: 15px;
	}

	.crm_info_btn_container {
		justify-content: center !important;
	}

	.crm_contact_list {
		padding: 10px !important;
	}

	.crm_contact_list_ul {
		width: fit-content !important;
	}

	.modal-body-right > .crm_documents_form,
	.modal-body-right > .crm_documents_list,
	.modal-body-right > .crm_client_factures,
	.modal-body-right > .crm_client_history {
		height: 100%;
		padding: 10px !important;
	}
}

/* ================= HISTORY ================= */

.modal-body-right > .crm_client_history {
	max-height: calc(100% - 50px);
	padding: 15px;
	overflow: auto;
}

.crm_client_history > h1 {
	width: 100%;
	margin: 0;
	margin-bottom: 10px;

	font-size: 25px;
	font-weight: bold;
	color: var(--clr-main);
}

/* ================= DOCUMENTS ================= */

.modal-body-right > .crm_documents_form {
	padding: 15px 15px 10px 15px;
}

.crm_documents_form > h1 {
	width: 100%;
	margin: 0;
	margin-bottom: 10px;

	font-size: 25px;
	font-weight: bold;
	color: var(--clr-main);
}

.crm_documents_form select {
	margin-right: 10px;
}

.crm_documents_form span {
	width: 200px;
	flex-shrink: 0;
}

.crm_documents_form .progress {
	margin: 0;
}

.modal-body-right > .crm_documents_list {
	max-height: calc(100% - 260px);
	padding: 15px;
	padding-top: 0;
	display: flex;
	flex-direction: row;
	flex-wrap: wrap;
	justify-content: space-evenly;
	overflow: auto;
}

.crm_documents_list > h1 {
	width: 100%;
	margin: 0;
	margin-bottom: 10px;

	font-size: 25px;
	font-weight: bold;
	color: var(--clr-main);
}

.crm_documents_list > .crm_document_card {
	height: 110px;
	width: 260px;
	margin-bottom: 10px;

	display: flex;
	flex-direction: column;

	border-radius: 2px;

	flex-shrink: 0;
	transition: all .1s;
}

.crm_document_card:hover {
	transform: scale(1.03);
	transition: all .1s;

	cursor: pointer;
}

.crm_documents_list > .crm_document_card > img {
	height: 70%;

	object-fit: cover;
	object-position: center;

	flex-shrink: 0;
	border-radius: 2px;
}

.crm_document_card > i {
	margin: auto;
	font-size: 40px;
}

.crm_document_card > p {
	width: 100%;
	margin: 0;
	padding: 5px;

	text-align: center;

	border-bottom-left-radius: 2px;
	border-bottom-right-radius: 2px;

	background-color: var(--clr-main);
	color: var(--clr-text-clear);

	white-space: nowrap;
	overflow: hidden;
	text-overflow: ellipsis;
}

/* ================= FACTURE ================= */

.modal-body-right > .crm_client_factures {
	padding: 15px;
}

.crm_contact_list_ul {
	width: 100%;
	padding: 0;

	display: flex;
	flex-direction: column;
}

.crm_contact_list_li {
	padding: 10px !important;

	display: flex;
	align-items: center;
}

.crm_contact_list_li.header {
	background-color: var(--clr-main);
	border: 1px solid var(--clr-main);
	color: var(--clr-text-clear);
}

.crm_contact_list_li.item {
	height: auto;
	width: auto;

	background-color: #F9F9F9;
	border: 1px solid #E0E0E0;
	border-top: none;
	color: #333333;
}

.crm_contact_list_li > p {
	margin: 0;
	text-align: center;
	flex-shrink: 0;
}

.crm_contact_list_li > button {
	height: 25px;
	width: 25px;

	border-radius: 8px;
	border: none;
	color: var(--clr-text-clear);
	background-color: var(--clr-main);
}

/* ================= CONTACT ================= */

.modal-body-right > .crm_contact_form {
	height: 100%;
	margin-top: auto;
	padding: 15px;

	position: absolute;
	bottom: 0;
	right: 0;
	left: 0;

	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: flex-end;

	background-color: rgba(0,0,0,0.4);
}

.crm_contact_form > #crm_add_contact_form .form-group {
	margin-bottom: 10px;
}

.crm_contact_form > h1 {
	width: 100%;
	padding: 15px 15px 0 15px;
	margin: 0;

	font-size: 25px;
	font-weight: bold;
	color: var(--clr-main);

	border-top: 1px solid var(--clr-border);
	background-color: #F9F9F9;
	border-top-left-radius: 8px;
	border-top-right-radius: 8px;
}

.crm_contact_form > form {
	width: 100%;
	padding: 15px;

	background-color: #F9F9F9;
	border-bottom-left-radius: 8px;
	border-bottom-right-radius: 8px;
}

.crm_contact_form > form textarea {
	height: 100px;
	resize: none;
}

/* ================= LIBRARY LIST ================= */

.library_file_list {
	padding-top: 5px;
	display: flex;
	flex-wrap: wrap;
	list-style: none;
}

.library_file_card {
	position: relative;

	height: 180px;
	width: 130px;
	margin-right: 10px;
	margin-bottom: 10px;

	display: flex;
	flex-direction: column;

	border-radius: 2px;
	border: 1px solid var(--clr-border);

	background-color: #F9F9F9;

	transition: all .1s;
}

.library_file_card:hover {
	transform: scale(1.02);
	transition: all .1s;
}

.library_file_card > i {
	margin: auto;

	font-size: 30px;
	color: #C0C0C0;
}

.library_file_card > p {
	width: 100%;
	margin: 0;
	padding: 10px;

	text-align: center;
	color: var(--clr-text-clear);
	white-space: nowrap;
	text-overflow: ellipsis;
	overflow: hidden;

	border-bottom-left-radius: 2px;
	border-bottom-right-radius: 2px;

	background-color: var(--clr-main);
}

/* ================= ALERTES ================= */

.crm_alert_container > h1,
.crm_alert_form_container > h1 {
	width: 100%;
	margin: 0;
	margin-bottom: 15px;
	font-size: 25px;
	font-weight: bold;
	color: var(--clr-main);
}

.crm_alert_form_container > form {
	display: flex;
	flex-direction: column;
}

.crm_alert_form_container > form label {
	width: 120px;
	margin-right: 10px;

	text-align: right;
}

.crm_alert_form_container > form input {
	width: calc(100% - 130px) !important;
}

.fc-icon-list::before {
	content: "\268F";
}

.fc-icon-planning {
	font-size: inherit !important;
}

.fc-icon-planning::before {
	font-family: "Font Awesome 5 Free" !important;
	font-weight: 900;
	content: "\f073";
}

.eventThinBorder {
	border-width: 2px !important;
}

/* ===================================================== */
/* ====================== CAR CHECK ==================== */
/* ===================================================== */

.selected {
	background-color: #8bc34a !important;
}

/* ===================================================== */
/* ======================= COCKPIT ===================== */
/* ===================================================== */

/* .cockpitGridWrapper {
	height: auto;
	width: 100%;
	padding: 15px;

	position: relative;

	display: flex;
	flex-wrap: wrap;

	color: #FFFFFF;
}

.cockpitNav {
	height: 60px;
	margin: 15px;
	padding: 0 15px;

	display: flex;
	align-items: center;

	border-radius: 8px;

	background-color: var(--clr-main);;
	box-shadow: rgba(0, 0, 0, 0.1) 0px 10px 15px -3px, rgba(0, 0, 0, 0.05) 0px 4px 6px -2px;

	transition: all .2s linear;
}

.cockpitNav > h1 {
	margin: 0;
	color: #FFFFFF;

	font-size: 20px;
}

.cockpitNav > button {
	height: 45px;
	margin-left: auto;
}

.cockpitNav .cockpitOpenSideNav {
	background-color: transparent;
	border: none;
}

.cockpitSideNav {
	position: absolute;

	top: 0;
	left: 0;

	height: 100vh;
	width: 400px;
	padding: 15px;

	display: flex;
	flex-direction: column;

	background-color: #FFFFFF;
	box-shadow: rgb(0 0 0 / 10%) 0px 10px 15px -3px, rgb(0 0 0 / 5%) 0px 4px 6px -2px;

	z-index: 10;
}

@media screen and (max-width: 750px) {
	.cockpitNav > h1 {
		font-size: 13px;
	}

	.cockpitSideNav {
		width: 100%;
	}
}

.cockpitSideNav > .cockpitSideNavHeader {
	position: relative;

	height: 34px;

	display: flex;
	align-items: center;
	justify-content: center;
}

.cockpitSideNavHeader > #cockpitSideNavHeaderClose {
	position: absolute;
	top: 0;
	left: 0;
}

.cockpitSideNavHeader > h1 {
	margin: 0;
	font-size: 25px;
}

.cockpitSideNav > .cockpitSideNavModuleList {
	margin-top: 30px;

	display: flex;
	flex-direction: column;
	flex: 1;
	overflow: auto;
}

.cockpitSideNavModuleList > ul {
	width: 100%;
	margin: 0;
	padding: 0;

	list-style-type: none;
}

.cockpitSideNavModuleList > ul > li {
	width: 100%;

	display: flex;

	margin-bottom: 5px;
	padding: 10px;

	border-radius: 8px;

	color: #FFFFFF;
	background-color: var(--clr-main);;
	box-shadow: rgb(0 0 0 / 5%) 0px 1px 2px 0px;
}

.cockpitSideNavModuleList > ul > li > button {
	margin-left: auto;

	background-color: transparent;
	border: none;
}

.cockpitGridCol {
	display: flex;
	flex-direction: column;

	background-color: #FFFFFF;
	box-shadow: rgba(0, 0, 0, 0.05) 0px 1px 2px 0px;

	border-radius: 8px;
	border: none;

	transition: border .05s;
}

.cockpitGridCol > button,
.cockpitGridCol > a[type="button"] {
	font-size: 17px;
}

.cockpitColLoadWheel {
	height: 30px;
	width: 30px;
	margin: auto;
}

.cockpitGridCol.expanded {
	height: calc(100% - 30px) !important;
	width: calc(100% - 30px) !important;

	position: fixed;
	top: 0;
	left: 0;
	margin: 15px !important;

	background-color: #F9F9F9;
	box-shadow: rgba(0, 0, 0, 0.25) 0px 14px 28px, rgba(0, 0, 0, 0.22) 0px 10px 10px;
}

.cockpitGridColHeader {
	height: 40px;

	margin: 0;
	padding: 10px;

	display: flex;
	align-items: center;
	flex-shrink: 0;

	font-size: 15px;

	color: #777777;
	border-bottom: 1px solid #F0F0F0;
}

.cockpitGridCol.expanded > .cockpitGridColHeader {
	height: 60px;
}

.cockpitGridColMoveHandle {
	cursor: grab;
}

.cockpitGridColDel {
	height: 20px;
	width: 20px;

	margin-left: auto;
	padding: 0;

	display: flex;
	align-items: center;
	justify-content: center;

	border-radius: 8px;
	border: none;

	font-size: 12px;
	background-color: var(--clr-main);
	color: #FFFFFF;
}

.cockpitGridColExpand {
	height: 20px;
	width: 20px;

	margin-left: 5px;
	padding: 0;

	display: flex;
	align-items: center;
	justify-content: center;

	border-radius: 8px;
	border: none;

	font-size: 12px;
	background-color: var(--clr-main);
	color: #FFFFFF;
}

.cockpitGridCol.expanded > .cockpitGridColHeader > .cockpitGridColMoveHandle,
.cockpitGridCol.expanded > .cockpitGridColHeader > .cockpitGridColDel {
	display: none;
}

.cockpitGridCol.expanded > .cockpitGridColHeader > .cockpitGridColExpand {
	height: 30px;
	width: 30px;
	margin-left: auto;
} */

/* ================= CENTRE STOCK ================= */

.stockCentreStockPanel {
	position: absolute;

	height: 100vh;
	width: 100vw;

	top: -50px;
	left: 0;

	display: flex;
	align-items: center;
	justify-content: center;

	background-color: rgba(0,0,0,0.7);
	z-index: 100;
}

.stockCentreStockPanel > .stockCentreStock {
	position: relative;

	min-height: 280px;
	height: 28%;
	min-width: 550px;
	width: 40%;

	padding: 50px;

	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;

	border: 1px solid var(--clr-border);
	border-radius: 16px;

	background-color: #FFFFFF;
}

.stockCentreStock > h1 {
	position: absolute;

	margin: 0;

	top: 15px;
	left: 15px;
}

.stockCentreStock > .form-group {
	width: 100%;

	display: flex;
	flex-direction: column;
}

.stockCentreStock > .form-group > input {
	height: 35px !important;
	max-height: 50px;
}

.stockCentreStock > .form-group > button {
	width: 200px;
	margin-left: auto;
}

/* ================= STOCKS ================= */

.stock-container {
	height: -webkit-fill-available;
	padding: 10px;
	padding-top: 0;
	display: flex;
	flex-direction: column;
}

.stockMenu {
	margin: 10px 0;
	margin-top: 0;
	padding: 10px;

	display: flex;
	flex-direction: row;
	align-items: center;
	column-gap: 15px;

	border-radius: 8px;

	background-color: var(--clr-lightgray);
	box-shadow: rgba(0, 0, 0, 0.2) 0px 3px 8px;
}

.stockMenu > .stockMenuSelectedCentre {
	display: flex;
	align-items: center;
	column-gap: 4px;
}

.stockMenuSelectedCentre > span {
	margin: 0;

	font-size: 17px;
	font-weight: bold;
}

.stockMenuSelectedCentre > span:first-of-type {
	color: var(--clr-main);
}

.productsGridContainer {
	height: 100%;
	/* padding: 10px; */

	border-radius: 8px;
	border: 10px inset transparent;

	background-color: var(--clr-lightgray);
	box-shadow: rgba(0, 0, 0, 0.2) 0px 3px 8px;

	overflow: auto;
}

.productsGridContainer > h1 {
	margin: 0;
	margin-top: 10px;
	margin-bottom: 15px;
	font-size: 25px;
	font-weight: bold;
}

.productsGridContainer > h1 > i {
	font-size: 20px;
}

.productsGridContainer > h1 > button {
	margin-left: 10px;
}

.productsGrid {
	position: static;

	margin: 0;
	padding: 0;

	display: flex;
	flex-direction: column;

	list-style-type: none;
}

.productsGrid > .productGridRow {
	min-height: 50px;

	display: flex;
	flex-direction: row;
	align-items: center;

	border: 1px solid var(--clr-border);
	border-top: none;

	background-color: #FFFFFF;
}

.productGridRow.inactive {
	background-color: rgba(0,0,0,0.1);
}

.productGridRow:last-of-type
{
	border-bottom-left-radius: 8px;
	border-bottom-right-radius: 8px;
}

.productGridRow > span
{
	height: 50px;
	padding: 0 10px;

	display: flex;
	align-items: center;
	justify-content: center;

	border-right: 1px solid var(--clr-border);
}

.productGridRow.header
{
	position: sticky;
	top: 0;

	border-top-left-radius: 8px;
	border-top-right-radius: 8px;

	background-color: lightgray;
}

.productGridRow.header > span
{
	font-weight: bold;
	border-right: 1px solid var(--clr-border);

	color: #FFFFFF;
}

.modalAjoutScannedBarCode,
.modalTransitScannedBarCode,
.modalEntrerScannedBarCode
{
	position: relative;

	max-height: 350px;

	padding: 10px;
	margin-bottom: 10px;

	display: flex;
	flex-direction: column;

	border: 1px solid var(--clr-border);
	border-radius: 8px;

	background-color: #FAFAFA;

	overflow: auto;
}

.modalAjoutScannedBarCode > li
{
	margin-bottom: 5px;
	padding: 2px;

	display: flex;
	flex-direction: row;
	align-items: center;

	font-weight: bold;

	border-radius: 8px;

	list-style-type: none;
	transition: all .1s;
}

.modalAjoutScannedBarCode > li:hover
{
	background: rgba(0,0,0,0.05);
	transition: all .1s;
}

.modalAjoutScannedBarCode > li > button
{
	margin-left: auto;
}

.modalTransitScannedBarCode > span,
.modalEntrerScannedBarCode > span
{
	font-weight: bold;
	margin-bottom: 5px;
}

.modalAjoutRecapContainer
{
	height: 50px;

	display: flex;
	flex-direction: row;
	justify-content: center;
	column-gap: 15px;

	border-radius: 8px;

	color: #FFFFFF;
	background-color: var(--clr-main);
}

.modalTransitScannedCount
{
	text-align: right;
	font-weight: bold;
}

.modalAjoutRecapContainer > .modalAjoutRecapData
{
	display: flex;
	align-items: center;
	justify-content: center;
	column-gap: 10px;
}

.modalAjoutRecapData > span
{
	display: flex;
	align-items: center;
	column-gap: 4px;
}

.modalAjoutRecapContainer > .modalAjoutRecapButtons
{
	display: flex;
	align-items: center;
	justify-content: center;
}

.modalRepartitionListContainer
{
	list-style-type: none;

	display: flex;
	flex-direction: column;
}

.modalRepartitionListContainer > .modalRepartitionRow
{
	height: 50px;

	display: flex;
	flex-direction: row;
	align-items: center;

	border: 1px solid var(--clr-border);
	border-bottom: 0;
}

.modalRepartitionRow:last-of-type
{
	border: 1px solid var(--clr-border);

	border-bottom-left-radius: 8px;
	border-bottom-right-radius: 8px;
}

.modalRepartitionListContainer > .modalRepartitionRow.header
{
	border-top-left-radius: 8px;
	border-top-right-radius: 8px;

	background-color: lightgray;
}

.modalRepartitionRow > span
{
	height: 50px;

	display: flex;
	align-items: center;
	justify-content: center;

	border-right: 1px solid var(--clr-border);
}

.modalRepartitionRow > span:last-of-type
{
	border: none;
}

.modalRepartitionRow.header > span
{
	border-right: 1px solid #FFFFFF;

	font-weight: bold;
	color: #FFFFFF;
}

.modalRepartitionRow.header > span:last-of-type
{
	border: none;
}

.modalEntrerArticleInfoEntrer
{
	display: flex;
	flex-direction: column;

	list-style-type: none;
}

.modalEntrerArticleInfoEntrer > .modalEntrerRow
{
	display: flex;
	align-items: center;

	border: 1px solid var(--clr-border);
	border-bottom: none;
}

.modalEntrerRow:last-of-type
{
	border-bottom-left-radius: 8px;
	border-bottom-right-radius: 8px;

	border-bottom: 1px solid var(--clr-border);
}

.modalEntrerRow.header
{
	border-top-left-radius: 8px;
	border-top-right-radius: 8px;

	background-color: lightgrey;
}

.modalEntrerRow > span
{
	padding: 10px;
}

.modalEntrerRow.header > span
{
	font-weight: bold;
	color: #FFFFFF;
}

.modalDetailArticleContainer
{
	display: flex;
	flex-direction: column;
}

.modalDetailArticleContainer > .modalDetailArticleRow
{
	display: flex;
	flex-direction: row;

	border: 1px solid var(--clr-border);
	border-top: none;
}

.modalDetailArticleContainer > .modalDetailArticleRow:not(.header):last-of-type
{
	border-bottom-left-radius: 8px;
	border-bottom-right-radius: 8px;
}

.modalDetailArticleContainer > .modalDetailArticleRow > span
{
	width: 25%;
	padding: 10px;

	text-align: center;
	border-right: 1px solid var(--clr-border);
}

.modalDetailArticleContainer > .modalDetailArticleRow > span:last-of-type
{
	border: none;
}

.modalDetailArticleContainer > .modalDetailArticleRow.header
{
	padding: 10px;

	border-top-left-radius: 8px;
	border-top-right-radius: 8px;

	color: #FFFFFF;
	background-color: lightgray;
}

.modalDetailFluxArticleContainer > h4
{
	margin: 10px 0;
}

.modalDetailFluxArticleContainer > h4:first-of-type
{
	margin-top: 0;
}

.modalDetailFluxRow
{
	margin-left: 15px;
	margin-bottom: -1px;

	display: flex;

	border: 1px solid var(--clr-border);

	background-color: var(--clr-lightgray);
}

.modalDetailFluxRow > span
{
	padding: 5px;

	display: flex;
	align-items: center;
	justify-content: center;
	column-gap: 4px;
}

.modalDetailFluxRow > span:first-of-type
{
	width: 80px;

	font-weight: bold;
	color: #FFFFFF;

	background-color: var(--clr-main);
}

#modal-retour-sav h1.modalHeaderTitle
{
	margin: 0;
	margin-bottom: 10px;

	font-size: 20px;
	font-weight: bold;
}

.modalSAVRetourInfoClient
{
	display: flex;
	flex-direction: column;
	align-items: center;
}

.modalSAVRetourInfoClient > h1
{
	width: 100%;
	font-size: 17px;
	font-weight: bold;
	text-align: center;
}

.modalSAVRetourInfoClient > .modalSAVRetourInfoClientRow
{
	width: 100%;
	margin-bottom: 5px;
	display: flex;
}

.modalSAVRetourInfoClientRow > label
{
	width: 90px;
	margin: 0;
	text-align: left;
	flex-shrink: 0;
}

.modalSAVRetourInfoClientRow > span
{
	width: 100%;
	margin: 0;
	text-align: left;
}

/* ===================================================== */
/* ===================== INVENTAIRE ==================== */
/* ===================================================== */

.modalInventaireHeader
{
	height: 150px;

	padding: 10px;
	margin-bottom: 10px;

	display: flex;
	flex-direction: column;
	justify-content: center;

	border: 1px solid var(--clr-border);
	border-radius: 8px;

	background-color: var(--clr-lightgray);
}

.modalInventaireHeader > .form-group:last-of-type
{
	margin: 0;
}

.modalInventaireHeader > .form-group label
{
	width: 100px !important;
	text-align: left;
}

.modalInventaireHeader > .form-group input,
.modalInventaireHeader > .form-group select
{
	height: 40px !important;
	width: 100% !important;
}

.modalInventaireScannedRowContainer
{
	height: calc(100% - 160px);
	padding: 10px;

	display: flex;
	flex-direction: column;

	border: 1px solid var(--clr-border);
	border-radius: 8px;

	background-color: var(--clr-lightgray);

	overflow: auto;
}

.modalInventaireScannedRowContainer > .modalInventaireScannedRow
{
	height: 50px;
	padding: 0 10px;
	display: flex;
	flex-direction: row;
	align-items: center;
	border: 1px solid var(--clr-border);
	border-top: none;
	flex-shrink: 0;
}

.modalInventaireScannedRowContainer > .modalInventaireScannedRow.header
{
	border-top-left-radius: 8px;
	border-top-right-radius: 8px;

	border: none !important;

	color: var(--clr-text-clear);
	background-color: var(--clr-border);
}

.modalInventaireScannedRow > span
{
	display: flex;
	align-items: center;
}

.modalInventaireScannedRow > span:last-of-type
{
	justify-content: center;
}

.modalInventaireScannedRow > span > button
{
	padding: 0;
	width: 25px;

	aspect-ratio: 1/1;
}

/* ===================================================== */
/* ================== RECAP INVENTAIRE ================= */
/* ===================================================== */

.modalRecapInventaireLeftPanel,
.modalRecapInventaireRightPanel
{
	height: 100%;
	width: 50%;

	overflow: auto;
}

.modalRecapInventaireLeftPanel > h1,
.modalRecapInventaireRightPanel > h1
{
	height: 40px;

	margin: 0;
	margin-bottom: 10px;

	display: flex;
	column-gap: 4px;
}

.modalRecapInventaireRightPanel > h1 > button:first-of-type
{
	margin-left: auto;
}

.modalRecapInventaireLeftPanel > .modalRecapInventairePanelContent,
.modalRecapInventaireRightPanel > .modalRecapInventairePanelContent
{
	height: calc(100% - 50px);
	width: 100%;
}

.modalRecapInventairePanelContent > .inventaireRecapRow,
.modalRecapInventairePanelContent > .inventaireDetailRow
{
	height: 45px;
	margin-bottom: 5px;
	padding-right: 10px;

	display: flex;
	align-items: center;

	border-radius: 8px;
}

.inventaireRecapRow > label
{
	height: 100%;
	width: 220px;
	margin: 0;
	padding: 5px;

	display: flex;
	align-items: center;
	flex-shrink: 0;

	font-size: 15px;
	text-align: left;

	border-top-left-radius: 8px;
	border-bottom-left-radius: 8px;

	color: #FFFFFF;
	background-color: var(--clr-main);
}

.inventaireRecapRow.running > label
{
	background-color: var(--clr-main) !important;
}

.inventaireRecapRow.unvalid > label
{
	background-color: #fdd835 !important;
}

.inventaireRecapRow.valid > label
{
	background-color: #7cb342 !important;
}

.inventaireRecapRow > .inventaireRecapRowInfo
{
	height: 100%;
	width: 100%;
	padding: 5px;

	display: flex;
	align-items: center;
	column-gap: 4px;

	border: 1px solid var(--clr-border);
	border-left: 0;

	border-top-right-radius: 8px;
	border-bottom-right-radius: 8px;
}

.inventaireRecapRowInfo > .inventaireRecapRowInfoTitle
{
	margin-left: 10px;

	font-weight: bold;
}

.inventaireRecapRowInfo > .inventaireRecapRowInfoTitle:first-of-type
{
	margin: 0;
}

.inventaireDetailRow
{
	column-gap: 4px;

	border: 1px solid var(--clr-border);
	border-radius: 8px;
}

.inventaireDetailRow > .inventaireDetailRowCodebarre
{
	height: 100%;
	min-width: 150px;
	width: 150px;
	padding: 0 5px;

	display: flex;
	align-items: center;
	justify-content: center;
	flex-shrink: 0;

	font-weight: bold;

	white-space: nowrap;
	overflow: hidden;
	text-overflow: ellipsis;

	border-top-left-radius: 8px;
	border-bottom-left-radius: 8px;

	color: #FFFFFF;
	background-color: var(--clr-main);

	transition: all .1s;
}

.inventaireDetailRow > .inventaireDetailRowCodebarre:hover
{
	width: auto;
	transition: all .1s;
}

.inventaireDetailRow > button:first-of-type
{
	margin-left: auto;
}

/* ===================================================== */
/* ====================== RELANCE ====================== */
/* ===================================================== */

/* =================== RELANCE HEADER ================== */

.relanceMainContainer
{
	height: calc(100vh - 50px);
	padding: 15px;
}

.relanceHeader
{
	height: 250px;
	width: 100%;

	display: flex;
	column-gap: 10px;
}

.relanceHeader > .relanceGraphContainer
{
	height: 100%;
	width: calc(25% - 10px);
	padding: 10px;

	border-radius: 8px;
	border-top: 8px solid var(--clr-main);

	background-color: #FFFFFF;
	box-shadow: rgba(0, 0, 0, 0.2) 0px 3px 8px;
}

.relanceGraphContainer > .relanceGraphContainerCanvas
{
	height: calc(100% - 30px);
}

.relanceGraphContainer > .relanceCounter
{
	height: 100%;

	display: flex;
	flex-direction: column;
}

.relanceCounter > .relanceCounterRow
{
	height: 50%;
	width: 100%;

	padding: 10px;

	display: flex;
	flex-direction: row;
}

.relanceCounter > .relanceCounterRow2
{
	height: 12%;
}

.relanceCounterRow:first-of-type
{
	align-items: flex-end;
	border-bottom: 1px solid var(--clr-border);
}

.relanceCounterRow:last-of-type
{
	align-items: flex-start;
}

.relanceCounterRow > label:first-of-type
{
	width: 60%;
	font-size: 22px;
	font-weight: 100;
}

.relanceCounterRow > label:last-of-type
{
	width: 40%;
	font-size: 20px;
	text-align: center;
}

.relanceCounterRow > label > i
{
	width: 30px;
}

/* =================== RELANCE CONTENT ================== */

.relanceContentContainer
{
	height: calc(100% - 265px);
	width: 100%;
	margin-top: 15px;

	display: flex;
	flex-direction: column;

	border-radius: 8px;

	background: #FFFFFF;
	box-shadow: rgba(0, 0, 0, 0.2) 0px 3px 8px;
}

.relanceContentContainer > .relanceContentMenu
{
	height: 50px;

	display: flex;
	flex-direction: row;
	align-items: center;
	column-gap: 8px;
	flex-shrink: 0;

	border-top-right-radius: 8px;
	border-top-left-radius: 8px;

	border-bottom: 1px solid var(--clr-border);
}

.relanceContentMenu > .relanceContentMenuLabel
{
	height: 100%;
	width: 100px;

	display: flex;
	align-items: center;
	justify-content: center;

	font-size: 15px;
	font-weight: bold;

	border-top-left-radius: 8px;

	color: #FFFFFF;
	background-color: var(--clr-main);
}

.relanceContentMenu > .form-group
{
	height: 100%;
	margin: 0;

	display: flex;
	align-items: center;
	justify-content: center;
}

.relanceContentMenu > #relanceLoading {
	padding: 0;
}

.relanceContentMenu > #relanceLoading > img {
	height: 30px;
}

.relanceContentMenu > .form-group.noPadding {
	padding: 0px;
}

.relanceContent {
	height: calc(100% - 50px);
	padding: 15px;
	width: 100%;

	display: flex;
	column-gap: 10px;
}

.relanceContent > .relanceList {
	position: relative;

	height: 100%;
	width: 100%;
	padding: 0;
	margin: 0;

	list-style-type: none;

	border: 1px solid var(--clr-border);
	border-top: none;

	border-radius: 8px;
	background-color: var(--clr-lightgray);
	overflow: overlay;
}

.relanceList > h1 {
	position: sticky;

	height: 55px;
	top: 0;

	margin: 0;
	padding: 0 10px !important;

	display: flex;
	align-items: center;

	font-size: 20px;
	font-weight: 500;

	color: #FFFFFF;
	background-color: var(--clr-main);
}

.relanceList > h1 > span {
	width: 100%;
	margin-right: 10px;

	display: flex;
	align-items: center;
}

.relanceList > h1 > button {
	margin-left: auto;
}

.relanceList > li {
	padding: 3px 5px;

	display: flex;
	align-items: center;
	column-gap: 4px;

	transition: all .1s;
}

.relanceList > li:hover
{
	background-color: rgba(0,0,0,0.05);
	transition: all .1s;
}

.relanceList > li > .dateSpan
{
	flex-shrink: 0;
}

.relanceList > li > .dossierSpan
{
	cursor: pointer;
}

.relanceList > li > .assuSpan
{
	margin-left: auto;
	font-weight: bold;
	text-align: right;
}

.relanceList > li > .plusSpan
{
	width: 13px;
	cursor: pointer;
}

.relanceList > li > .usersSpan
{
	min-width: 20px;
	margin-right: 10px;
	flex-shrink: 0;

	display: flex;
	align-items: center;
	justify-content: center;
	column-gap: 2px;
}

.relanceProFullList
{
	position: absolute;

	border: 1px solid var(--clr-border);
	border-top: none;

	border-radius: 8px;

	list-style-type: none;

	background-color: #FFFFFF;

	overflow: auto;
}

.relanceProFullList > h1
{
	margin: 0;
	padding: 10px !important;

	display: flex;

	font-size: 20px;
	font-weight: 500;

	border-top-left-radius: 8px;
	border-top-right-radius: 8px;

	color: #FFFFFF;
	background-color: var(--clr-main);
}

.relanceProFullList > h1 > button
{
	margin-left: auto;
	padding: 0 5px;
}

.relanceProFullList li
{
	padding: 3px 5px;

	display: flex;
	align-items: center;
	column-gap: 4px;

	transition: all .1s;
}

.relanceProFullList li:hover
{
	background-color: rgba(0,0,0,0.05);
	cursor: pointer;
	transition: all .1s;
}

.relanceProFullList li > .dateSpan
{
	flex-shrink: 0;
}

.relanceProFullList li > .assuSpan
{
	margin-left: auto;
	font-weight: bold;
}

.relanceProFullList li > .plusSpan
{
	width: 13px;
}

.relanceDifferenceTarifairePanel
{
	position: absolute;

	left: 0;

	height: 100%;
	width: 100%;
	padding: 10px;

	display: flex;
	flex-direction: row;
	column-gap: 10px;

	background-color: #FFFFFF;
}

.relanceDifferenceTarifairePanel > .relanceDifferenceTarifaireList
{
	width: 50%;

	display: flex;
	flex-direction: column;
}

.relanceDifferenceTarifaireList > h1
{
	height: 34px;

	margin: 0;
	margin-bottom: 15px;

	display: flex;
	align-items: center;
	column-gap: 4px;

	font-size: 17px;
	font-weight: bold;
}

.relanceDifferenceTarifaireList > h1 > button
{
	margin-left: auto;
}

.relanceDifferenceTarifaireList > .relanceDifferenceTarifaireListContainer
{
	height: 100%;
	padding: 10px;

	list-style-type: none;

	border-radius: 8px;
	border: 1px solid var(--clr-border);

	background-color: #F5F5F5;

	overflow: auto;
}

.relanceDifferenceTarifaireRow
{
	padding: 3px 5px;

	display: flex;
	flex-direction: row;
	align-items: center;
	column-gap: 5px;

	border-bottom: 1px solid var(--clr-border);

	transition: all .1s;
}

.relanceDifferenceTarifaireRow:hover
{
	background-color: rgba(0,0,0,0.05);
	transition: all .1s;
}

.relanceDifferenceTarifaireRow.hoverCursor:hover
{
	cursor: pointer;
}

.relanceDifferenceTarifaireRow > span.largeSpan
{
	width: 300px;
}

.relanceDifferenceTarifaireRow > button
{
	height: 25px;
	padding: 0;
	margin-left: auto;
	aspect-ratio: 1/1;
}

/* ===================================================== */
/* ================== PLANNING ANNUEL ================== */
/* ===================================================== */

.modalEvenementAnnulPanel
{
	position: absolute;

	top: 50%;
	left: 30px;

	transform: translateY(-50%);

	height: 50%;
	width: calc(100% - 60px);

	border-radius: 8px;

	background-color: var(--clr-lightgray);
	box-shadow: rgb(0 0 0 / 56%) 0px 22px 70px 4px;

	z-index: 1;
}

.modalEvenementAnnulPanel > h1
{
	height: 50px;
	width: 100%;
	padding: 0 10px;
	margin: 0;

	display: flex;
	align-items: center;

	border-top-left-radius: 8px;
	border-top-right-radius: 8px;

	font-size: 20px;

	color: #FFFFFF;
	background-color: var(--clr-main);
}

.modalEvenementAnnulPanel > h1 > i
{
	margin-right: 10px;
	font-size: 15px;
}

.modalEvenementAnnulPanel > h1 > button
{
	margin-left: auto;
}

.modalEvenementAnnulPanel > .modalEvenementAnnulPanelCommentContainer
{
	height: calc(100% - 50px);
	width: 100%;
	padding: 15px;

	display: flex;
	flex-direction: column;

	border: 3px dashed var(--clr-main);
	border-top: none;

	border-bottom-left-radius: 8px;
	border-bottom-right-radius: 8px;
}

.modalEvenementAnnulPanelCommentContainer > textarea
{
	flex: 1;

	border-radius: 8px;
	border: 1px solid var(--clr-border);
	background-color: #FFFFFF;

	resize: none;
}

/* ===================================================== */
/* ==================== PARRAINAGE ===================== */
/* ===================================================== */

.div_parrain_parrain,
.div_parrain_list_filleul
{
	padding-left: 15px;
	list-style-type: none;
}

.div_parrain_list_filleul > li
{
	display: flex;
	align-items: center;
	column-gap: 10px;
}

.div_parrain_parrain > .parrainageClick,
.div_parrain_list_filleul > li > .parrainageClick
{
	width: 150px;

	white-space: nowrap;
	overflow: hidden;
	text-overflow: ellipsis;

	font-weight: bold;
	cursor: pointer;
}

.modalListParrainItem
{
	padding: 5px;

	list-style-type: none;

	display: flex;
	align-items: center;
	column-gap: 10px;

	border-left: 1px solid var(--clr-border);
	border-right: 1px solid var(--clr-border);
}

.modalListParrainItem.header
{
	height: 50px;

	border: none !important;
	border-top-left-radius: 8px;
	border-top-right-radius: 8px;

	color: #FFFFFF;
	background-color: #C0C0C0;
}

.modalListParrainItem:last-of-type
{
	border-bottom: 1px solid var(--clr-border);

	border-bottom-left-radius: 8px;
	border-bottom-right-radius: 8px
}

.modalListParrainItem > span
{
	cursor: pointer;
}

.modalListParrainItem > button
{
	margin-left: auto;
}

/* ===================================================== */
/* =================== CAMPAGNE SMS ==================== */
/* ===================================================== */

.campagneContainer
{
	position: fixed;

	top: 0;
	left: 0;

	height: 100%;
	width: 100%;

	display: flex;
	flex-direction: column;

	background: var(--clr-lightgray);

	overflow: hidden;
	z-index: 1100;
}

.campagneContainer > .campagneContainerHeader
{
	height: 65px;
	width: 100%;
	padding: 15px;

	display: flex;
	align-items: center;

	box-shadow: rgba(99, 99, 99, 0.2) 0px 2px 8px 0px;
	background-color: #FFFFFF;
}

.campagneContainerHeader > h1
{
	margin: 0;
	font-size: 20px;
}

.campagneContainerHeader > h1 > span
{
	margin: 0;
	font-size: 25px;
}

.campagneContainer > .campagneContainerHeader > button
{
	margin-left: auto;
}

.campagneContainer > .campagneContainerBody
{
	padding: 15px;

	height: calc(100vh - 65px);
	width: 100%;
}

.campagneContainerBody > .campagneContainerContent
{
	height: 100%;
	width: 100%;

	display: flex;
	flex-direction: column;

	row-gap: 15px;
	overflow: hidden;
}

.campagneContainerContent > .campagneBox
{
	padding: 15px;
	width: 100%;

	background-color: #FFFFFF;

	border-radius: 8px;

	box-shadow: rgba(0, 0, 0, 0.1) 0px 1px 3px 0px, rgba(0, 0, 0, 0.06) 0px 1px 2px 0px;
}

.campagneBox#campagneBoxFilter
{
	height: auto;
}

.campagneBox#campagneBoxMessage
{
	height: 100%;
	padding: 0;

	display: flex;
	column-gap: 15px;

	background-color: transparent;
	border-radius: 0;
	box-shadow: none;

	overflow: hidden;
}

.campagneBox > .col
{
	height: 100%;
	width: 100%;

	padding: 15px;

	background-color: #FFFFFF;
	border-radius: 8px;
	box-shadow: rgba(0, 0, 0, 0.1) 0px 1px 3px 0px, rgba(0, 0, 0, 0.06) 0px 1px 2px 0px;
}

.campagneBox > .col > h1
{
	margin: 0;

	display: flex;
	align-items: center;
	justify-content: space-between;

	font-size: 20px;
	font-weight: bold;
}

.campagneBoxBtns
{
	display: flex;
	align-items: center;
	justify-content: flex-end;
	column-gap: 10px;
}

.campagneBoxBtns > button
{
	min-width: 150px;
}

.modelSmsList
{
	height: calc(100% - 45px);
	width: 100%;
	padding: 0;
	margin: 0;
	margin-top: 10px;
	list-style-type: none;
	overflow: auto;
}

.modelSmsList > li
{
	padding: 5px;
	margin-bottom: 5px;

	display: flex;
	align-items: center;

	border-radius: 8px;
	border: 1px solid var(--clr-border);
}

/* ===================================================== */
/* ==================== MODELE SMS ===================== */
/* ===================================================== */

.modalModelSMS
{
	position: absolute;

	height: 100%;
	width: 100%;
	padding: 50px;

	top: 0;
	left: 0;

	display: flex;
	align-items: center;
	justify-content: center;

	background-color: rgba(0,0,0,0.5);

	z-index: 1101;
}

.modalModelSMS > .modalModelSmsContent
{
	height: auto;
	max-height: 100%;
	width: 100%;
	max-width: 650px;

	border-radius: 8px;

	background-color: #FFFFFF;
}

.modalModelSmsContent > .modalModelSmsHeader
{
	padding: 10px;

	display: flex;
	align-items: center;
	justify-content: space-between;

	border-bottom: 1px solid var(--clr-border);
}

.modalModelSmsContent > .modalModelSmsBody
{
	padding: 20px;

	display: flex;
	flex-direction: column;
}

.modalModelSmsContent > .modalModelSmsFooter
{
	padding: 10px;

	display: flex;
	align-items: center;
	justify-content: flex-end;
	column-gap: 5px;

	border-top: 1px solid var(--clr-border);
}

/* ===================================================== */
/* =================== LIST REGL TPE =================== */
/* ===================================================== */

.listReglementTPEFilter
{
	padding: 10px;
	margin-bottom: 15px;

	display: flex;
	flex-direction: column;

	border-radius: 8px;
	border: 1px solid #C0C0C0;
}

.listeReglementTPE
{
	list-style-type: none;
}

.listeReglementTPE > h1
{
	font-size: 17px;
	font-weight: 600;
}

.listeReglementTPE > h1:first-of-type
{
	margin-top: 0 !important;
}

.listeReglementTPE > .listReglementTpeRow
{
	padding: 5px;
	margin-top: -1px;

	display: flex;

	border: 1px solid var(--clr-border);
	background-color: var(--clr-lightgray);
}

/* ===================================================== */
/* ================== LIST KDO TO GIVE ================= */
/* ===================================================== */

.modalListKdoToGiveContainer
{
	list-style-type: none;
}

.modalListKdoToGiveContainer > .modalListKdoToGiveRow
{
	padding: 10px;

	display: flex;
	align-items: center;

	border: 1px solid var(--clr-border);
	border-top: 0;
}

.modalListKdoToGiveContainer > .modalListKdoToGiveRow:last-of-type
{
	border-bottom-left-radius: 8px;
	border-bottom-right-radius: 8px;
}

.modalListKdoToGiveContainer > .modalListKdoToGiveRow.header
{
	height: 50px;

	border: none;
	background-color: #CCCCCC;

	border-top-left-radius: 8px;
	border-top-right-radius: 8px;
}

/* ===================================================== */
/* ===================== PLANNING ====================== */
/* ===================================================== */

.centre_choix {
	display: flex;
	justify-content: space-between;
}

.centre_choix > .planning_users_icon {
	display: flex;
	column-gap: 4px;
}

.menu_planning_toolbar {
	width: -webkit-fill-available;
	margin: 10px;
	margin-top: 0;
	padding: 10px;

	display: flex;
	flex-direction: row;
	row-gap: 10px;
	column-gap: 10px;

	border-radius: 8px;

	background-color: #FFFFFF;
	box-shadow: rgba(0, 0, 0, 0.2) 0px 3px 8px;
}

@media screen and (max-width: 767px) {
	.menu_planning_toolbar {
		flex-direction: column;
	}

	.menu_planning_toolbar > .form-control {
		width: 100% !important;
	}
}

.planning_container {
	width: -webkit-fill-available;
	margin: 10px;
	margin-top: 0;
	padding: 10px;

	display: flex;

	border-radius: 8px;

	background-color: #FFFFFF;
	box-shadow: rgba(0, 0, 0, 0.2) 0px 3px 8px;
}

.planning_content {
	width: 100%;
	padding: 0;
	padding-right: 10px;
}

.planning-calendar {
	padding: 0;
}

.planning_centre {
	height: 80vh;
	overflow-y: scroll;
	padding: 0 10px !important;
}

.event-info-dossier {
	margin-bottom: 10px;
	padding: 10px;
	border-radius: 8px;
	border: 1px solid var(--clr-border);
	background-color: #fafafa;
}

.event-commentaire-vendeur {
	margin-bottom: 10px;
	padding: 5px;
	border-radius: 8px;
	border: 1px solid var(--clr-border);
	font-weight: bold;
	background-color: rgb(250, 250, 250);
}

.selectionne {
	text-decoration: none !important;
	font-weight: bold;
}

.deselectionne {
	text-decoration: line-through;
	font-weight: normal;
}

.rappel_inventaire {
	text-transform: uppercase;
	font-size: 16px;
	font-weight: bold;
	color: var(--clr-main);
	align-self: center;

	animation: blink-animation 1s steps(2, start) infinite;
	-webkit-animation: blink-animation 3s steps(2, start) infinite;
}

.couleur {
	float: left;
	color: var(--clr-text-clear);
	width: 70px;
}

.calendarLoadingScreen {
	position: absolute;

	height: 100%;
	width: 100%;

	display: flex;
	align-items: center;
	justify-content: center;

	border-radius: 8px;

	pointer-events: all;
	z-index: 2;
}

.ghost-event {
	opacity: .4;
}

/* ===================================================== */
/* ============ PLANNING MODAL CHANGE OFFER ============ */
/* ===================================================== */

.planningModalOffreChoixTypeReglement
{
	display: flex;
	justify-content: space-around;
}

.planningModalOffreInfos > label
{
	color: var(--clr-main-dark);
}

.planningModalOffreInfos > .planningModalOffreContent
{
	padding-left: 30px;
}

.planningModalOffreContent .inline-row > label
{
	width: 170px;
	text-align: left;

	color: #000000;
}

.planningModalOffreContent .inline-row > input[type="text"],
.planningModalOffreContent .inline-row > input[type="number"],
.planningModalOffreContent .inline-row > select
{
	width: 100% !important;
}

/* ===================================================== */
/* ========================= MAP ======================= */
/* ===================================================== */

.clientMapAutocomplete,
.centreSearchAddressAutocomplete
{
	position: absolute;

	height: fit-content;
	max-height: 300px;
	width: 100%;
	padding: 10px;
	top: 45px;
	left: 0;

	display: flex;
	flex-direction: column;

	border: 1px solid var(--clr-border);
	border-radius: 8px;

	list-style-type: none;

	background: #FFFFFF;
	overflow: auto;

	z-index: 2000;
}

.clientMapAutocomplete > li,
.centreSearchAddressAutocomplete > li
{
	padding: 10px;
	border-bottom: 1px solid var(--clr-border);
	cursor: pointer;
}

.clientMapAutocomplete > li:last-of-type,
.centreSearchAddressAutocomplete > li:last-of-type
{
	border: none;
}

.clientMapContent
{
	position: relative;
}

.clientMapContent > .clientMapOptions
{
	position: absolute;

	width: 100%;
	bottom: 0;
	padding: 15px;

	background-image: linear-gradient(to bottom, rgba(0,0,0,0) 0%, rgba(0,0,0,0.9) 100%);

	pointer-events: painted;
	z-index: 1000;
}

.clientMapOptions > i
{
	color: #FFFFFF;
	font-size: 25px;
}

.texte_alerte_inventaire {
	width: 100%;
	padding: 10px;
	float: left;
	text-align: center;
	font-size: 16px;
	font-weight: bold;
	color: var(--clr-main);
}

/* ===================================================== */
/* ====================== FEN HISTO ==================== */
/* ===================================================== */

.fen-visualization {
	height: fit-content;
	position: fixed;
	padding: 10px;
	left: 10px;
	right: 10px;
	bottom: 10px;
	border-radius: 8px;
	background-color: var(--clr-lightgray);
	box-shadow: rgba(0, 0, 0, 0.56) 0px 22px 70px 4px;
	z-index: 20;
}

/* ===================================================== */
/* ====================== SIGNATURE ==================== */
/* ===================================================== */

#signatureCopy {
	position: absolute;

	top: 0;
	left: 0;

	width: 100%;
	height: 100%;

	display: flex;
	align-items: center;
	justify-content: center;

	pointer-events: none;
}

#signatureCopy > svg {
	width: fit-content;
	max-width: 70%;

	object-fit: contain;
}

/* ===================================================== */
/* =================== CONFIG POSEUR =================== */
/* ===================================================== */

.modal-poseur-container {
	height: 100%;
	display: flex;
}

.modal-poseur-container > .modal-poseur-list {
	width: fit-content;
	min-width: 250px;
	padding-right: 8px;

	display: flex;
	flex-direction: column;
	row-gap: 8px;
	flex-shrink: 0;

	overflow: auto;
}

.modal-poseur-list > .poseur-list-centre {
	margin-top: 16px;
	margin-bottom: 8px;
	font-size: 1.8rem;
	text-align: left;
}

.modal-poseur-list > .poseur-item {
	padding: 8px;

	display: flex;
	flex-direction: row;
	align-items: center;

	border-radius: 8px;
	font-weight: 600;

	color: #FFFFFF;
	background: var(--clr-main);
	transition: all .15s;

	cursor: pointer;
}

.modal-poseur-list > .poseur-item:hover {
	background: var(--clr-main-dark);
	transition: all .15s;
}

.modal-poseur-list > .poseur-item.poseurSelected {
	background: var(--clr-good);
}

.poseur-item > button {
	height: 100%;
	margin-left: auto;
	border: none;
	background: transparent;
}

.modal-poseur-container > .modal-poseur-grid {
	width: 100%;
	margin-left: 16px;
}

/* ===================================================== */
/* ================== PLANNING POSEUR ================== */
/* ===================================================== */

.planning-poseur-container {
	height: calc(100% - 40px);
	width: -webkit-fill-available;
	margin: 10px;
	margin-left: 75px;
	margin-top: 0;
	padding: 10px;
	border-radius: 8px;
	background-color: #FFFFFF;
	box-shadow: rgba(0, 0, 0, 0.2) 0px 3px 8px;
}

.fc-col-header-cell.fc-resource {
	white-space: nowrap;
	overflow: hidden;
	text-overflow: ellipsis;
	background-color: #FAFAFAFA;
}

.planing-poseur-form {
	width: 100%;

	display: flex;
	flex-direction: column;
	row-gap: 8px;
}

/* ===================================================== */
/* ================= LIST CENTRE POSEUR ================ */
/* ===================================================== */

.poseur-centres-window {
	height: 35px;
	width: 35px;
	max-width: 90%;
	bottom: 10px;
	right: 10px;

	position: fixed;

	border-radius: 8px;

	background-color: #FFFFFF;
	box-shadow: rgba(50, 50, 93, 0.25) 0px 13px 27px -5px, rgba(0, 0, 0, 0.3) 0px 8px 16px -8px;
	z-index: 9;
	overflow: hidden;
}

.poseur-centres-window a {
	line-height: 20px;
}

.poseur-centres-window-header {
	width: 100%;
	height: 35px;
	padding: 0 8px;
	display: flex;
	align-items: center;
	background-color: var(--clr-main);
	color: #FFFFFF;
	line-height: 28px;
	border: 1px solid #FFFFFF;
	border-radius: 8px;
	border-bottom: 0;
}

.poseur-centres-window-content {
	background-color: #FFFFFF;
	color: #000000;
	height: 0px;
	padding: 8px;

	overflow: auto;
}

.poseur-maximise,
.poseur-minimise {
	margin-left: auto;
}

.poseur-maximise:hover,
.poseur-minimise:hover {
	cursor: pointer;
}

.fc-toolbar-chunk {
	display: flex;
	align-items: center;
}

.fullcalendar-custom-title {
	font-weight: 700;
	font-size: 2rem;
}

.fc-event-custom-header {
	width: calc(100% + 8px);
	margin-left: -4px;
	margin-top: -4px;
	padding: 8px;
	margin-bottom: 4px;

	display: flex;
	column-gap: 8px;
	align-items: center;

	border-radius: 8px;

	font-size: 1.5rem;
	background: #FFFFFF;
}

.planning-poseur-available-car-container {
	padding-bottom: 5px;

	display: flex;
	align-items: center;
	justify-content: center;
	column-gap: 10px;
}

.planning-poseur-available-car {
	width: 20px;

	display: flex;
	align-items: center;
	justify-content: center;

	border-radius: 8px;

	aspect-ratio: 1/1;
	color: #FFFFFF;
	background: var(--clr-main);
}

.btn-primary.calendar-unavailable-car-delete-event {
	width: 40px;
	background-color: #D00000 !important;
}

/* ===================================================== */
/* ================= APP MODAL DOCUMENT ================ */
/* ===================================================== */

.app_modal_document_signature_panel {
	position: absolute;
	bottom: 0;
	left: 0;

	height: fit-content;
	width: 100%;
	padding: 10px;

	background: #FFFFFF;
	z-index: 100;
}

.app_modal_document_signature_panel > h2 {
	margin: 0;
	padding: 0;
	margin-bottom: 10px;
}

.app_modal_document_signature_panel > .app-modal-document-signature {
	border: 1px solid lightgray;
	border-radius: 8px;
}

.app-modal-document-signature-btn {
	display: flex;
	column-gap: 10px;
	justify-content: flex-end;
	padding-top: 10px;
}

/* ===================================================== */
/* ======================= VERSION ===================== */
/* ===================================================== */

.version-container {
	position: absolute;

	bottom: 0;
	left: 0;
	padding: 8px;

	font-size: 1rem;

	display: flex;
	align-items: center;
	justify-content: center;

	border-top-right-radius: 8px;

	color: #FFFFFF;
	background: var(--clr-main);

	z-index: 9999;
}

/* ===================================================== */
/* ================= POINTAGE REGLEMENT ================ */
/* ===================================================== */

.modal-pointage-form-filter {
	padding: 10px;

	border: 1px solid #CCCCCC;
	border-radius: 8px;

	background: #F9F9F9;
}

.modalPointageTotalbar {
	padding: 10px;
	margin-top: 10px;

	border: 1px solid #CCCCCC;
	border-radius: 8px;

	background: #F9F9F9;
}

.reglement-non-pointer-centre {
	text-align: left;
}

.reglement-non-pointe-container {
	border: 1px solid #CCCCCC;
	border-radius: 8px;

	overflow: hidden;
}

.reglement-non-pointe-row {
	padding: 10px;

	display: flex;
	column-gap: 10px;
	width: 100%;
}

.reglement-non-pointe-row:not(:first-of-type) {
	border-top: 1px solid #CCCCCC;
}

.reglement-non-pointe-row > p {
	margin: 0;
	padding: 0;

	display: flex;
	align-items: center;
}

.reglement-non-pointe-row > p > input[type="checkbox"] {
	margin: 0;
}

.reglement-non-pointe-row.header {
	background: #CCCCCC;
}

.reglement-non-pointe-row.header > p {
	font-weight: bold;
}

/* ===================================================== */
/* ===================== RELANCE NEW =================== */
/* ===================================================== */

.relance-header {
	height: 250px;
	width: 100%;

	display: flex;
	column-gap: 10px;
}

.relance-header > .relance-header-content {
	height: 100%;
	width: 100%;
	padding: 8px;

	border-radius: 8px;

	background: #FFFFFF;
	box-shadow: rgba(0, 0, 0, 0.2) 0px 3px 8px;
}

.relance-header-buttons {
	height: calc(34px - 8px);
}

.relance-header-graph-container {
	height: calc(216px - 8px);

	display: flex;
	align-items: center;
	justify-content: center;
}

.relance-header-graph-container > i {
	font-weight: 600;
}

.relance-content-container {
	position: relative;

	height: calc(100% - 265px);
	width: 100%;
	margin-top: 15px;

	display: flex;
	flex-direction: column;

	border-radius: 8px;

	background: #FFFFFF;
	box-shadow: rgba(0, 0, 0, 0.2) 0px 3px 8px;

	overflow: hidden;
}

.relance-content-container > .relance-content-menu {
	height: 50px;

	display: flex;
	flex-direction: row;
	align-items: center;
	column-gap: 8px;
	flex-shrink: 0;

	border-top-right-radius: 8px;
	border-top-left-radius: 8px;

	border-bottom: 1px solid var(--clr-border);
}

.relance-content-menu > .relance-content-menu-label {
	height: 100%;
	width: 75px;

	display: flex;
	align-items: center;
	justify-content: center;

	font-size: 15px;
	font-weight: bold;

	border-top-left-radius: 8px;

	color: #FFFFFF;
	background-color: var(--clr-main);
}

.relance-content-menu > .form-group {
	height: 100%;
	margin: 0;

	display: flex;
	align-items: center;
	justify-content: center;
}

.relance-content-menu .relance-radio-btn {
	border-radius: 8px;
	border: 1px solid var(--clr-main);

	cursor: pointer !important;
}

.relance-content-menu .relance-radio-btn > label {
	padding: 4px !important;
	position: relative;
}

.relance-content-menu .relance-radio-btn:hover,
.relance-content-menu .relance-radio-btn:has(input[type="radio"]:checked) {
	background: var(--clr-main);
}

.relance-content-menu .relance-radio-btn:hover > label,
.relance-content-menu .relance-radio-btn:has(input[type="radio"]:checked) > label {
	color: #FFFFFF;
	cursor: pointer !important;
}

.relance-content-menu .relance-radio-btn > input {
	display: none;
}

.relance-content {
	height: 100%;
	min-height: 0px;
	padding: 10px;

	display: flex;
	flex-direction: row;
	align-items: stretch;

	overflow: hidden;
}

.relance-col {
	display: flex;
	flex-direction: column;

	overflow: auto;
}

.relance-col-header {
	position: sticky;
	
	height: 48px;
	top: 0;

	padding: 10px;
	
	display: flex;
	align-items: center;
	flex-shrink: 0;
	
	border-top-left-radius: 8px;
	border-top-right-radius: 8px;
	
	color: #FFFFFF;
	background: var(--clr-main);
}

.relance-col-header > span {
	font-weight: bold;
}

.relance-row {
	padding: 8px 10px;

	display: flex;
	align-items: center;
	/* column-gap: 8px; */
	transition: background .15s;
}

.relance-row:nth-child(even) {
	background: rgba(0,0,0,0.04);
	transition: background .15s;
}

.relance-row:hover {
	background: rgba(0,0,0,0.08);
	transition: background .15s;
}

.relance-row.relance-row-spe {
	padding: 8px;
	margin-top: 0;
	
	display: flex;
	column-gap: 8px;
	
	font-variant: all-small-caps;
	font-weight: 700;
	font-size: 1.6rem;
	background: #E1E1E1;
}

.relance-row.relance-row-spe > i {
	font-size: 1.4rem;
}

.relance-loader {
	position: absolute;

	top: 0;
	left: 0;

	height: 100%;
	width: 100%;

	display: flex;
	align-items: center;
	justify-content: center;

	background: rgba(0,0,0,0.5);
}

/* ===================================================== */
/* ==================== RELANCE ASSU =================== */
/* ===================================================== */

.relance-assu-recap {
	min-width: 300px;
	/* margin-right: 10px; */

	border-radius: 8px;
	row-gap: 0;

	flex-shrink: 0;
}

.relance-assu-recap > .relance-assu-recap-header {
	position: sticky;
	top: 0;

	height: 48px;
	padding: 10px;

	display: flex;
	align-items: center;
	flex-shrink: 0;

	color: #FFFFFF;
	background: var(--clr-main);
}

.relance-assu-recap-header > h4 {
	margin: 0;
}

.relance-assu-recap > .relance-assu-recap-body {
	padding: 10px;

	display: flex;
	flex-direction: column;
	row-gap: 8px;
	flex: 1;

	border: 1px solid var(--clr-border);
	border-top: none;
	border-bottom-left-radius: 8px;
	border-bottom-right-radius: 8px;
}

.relance-assu-recap-body > span,
.relance-assu-recap-body > a > span {
	width: 100%;

	display: flex;
	align-items: center;
	column-gap: 8px;
	justify-content: space-between;
	
	font-size: 1.6rem;
	font-weight: bold;

	transition: all .15s;
}

.relance-assu-recap-body > a {
	border-bottom: 1px solid transparent;
}

.relance-assu-recap-body > a:hover {
	text-decoration: none;
	border-bottom: 1px solid var(--clr-main);

	transition: all .15s;
}

.relance-assu-recap-body > a > span {
	color: var(--clr-main);

	transition: all .15s;
}

.relance-assu-recap-body > hr {
	width: 100%;
	margin-top: 8px;
	margin-bottom: 8px;
	border: 0;
	border-top: 1px solid var(--clr-border);
}

.relance-assu-recap > span > i {
	font-weight: normal;
}

.relance-assu-results {
	width: 100%;
	padding: 0 10px;
	scroll-padding-top: 48px;
	scroll-behavior: smooth;
}

.relance-assu-row-date {
	width: 100px
}

.relance-assu-row-id {
	width: 100px;
	font-weight: bold;
	cursor: pointer;
}

.relance-assu-row-client {
	width: 200px;
}

.relance-assu-row-assu {
	width: 280px;
	font-weight: bold;
	margin-left: auto;
}

.relance-assu-row-montant {
	width: 90px;
	text-align: right;
}

.relance-users-span {
	width: 50px;
	display: flex;
	align-items: center;
	justify-content: center;
	column-gap: 4px;
}

/* ===================================================== */
/* =================== SMS MANAGEMENT ================== */
/* ===================================================== */

.sms-management-window {
	position: absolute;
	top: 0;
	left: 0;

	width: 100vw;
	height: 100vh;
	padding: 16px;
	
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: 16px;

	background-color: var(--clr-lightgray);
	color: #FFFFFF;

	z-index: 999;
}

.sms-management-window-header {
	flex-shrink: 0;

	height: fit-content;
	width: 100%;
	padding: 16px;

	display: flex;
	align-items: center;
	justify-content: space-between;

	border-radius: 8px;

	background: #FFFFFF;
	box-shadow: rgba(0, 0, 0, 0.2) 0px 3px 8px;
}

.sms-management-window-header > span {
	font-size: 2rem;
	font-weight: bold;
	color: #000000;
}

.sms-management-window-body {
	flex: 1;
	height: calc(100% - 78px);
	width: 100%;

	display: flex;
	flex-direction: row;
	column-gap: 16px;
}

.sms-management-window-body > .sms-management-window-body-column {
	height: 100%;
	display: flex;
	flex-direction: column;

	border-radius: 8px;

	background: #FFFFFF;
	box-shadow: rgba(0, 0, 0, 0.2) 0px 3px 8px;
}

.sms-management-window-body-column.small {
	min-width: 300px;
	flex: .5;
}

.sms-management-window-body-column.large {
	min-width: 500px;
	flex: 2;
}

.sms-management-window-body-column > .column-header {
	padding: 16px;
	
	font-size: 1.6rem;
	font-weight: 600;
	color: #000000;
}

.sms-management-window-body-column > .column-body {
	flex: 1;

	padding: 16px;
	padding-top: 0;
	
	display: flex;
	flex-direction: column;
	row-gap: 8px;

	font-size: 1.4rem;
	color: #000000;

	overflow: auto;
}

.sms-management-tag-list {
	list-style-type: none;
	padding: 0;
}

.sms-management-tag-list > .tag-header {
	font-weight: 600;
	margin-top: 16px;

	color: var(--clr-main);
}

.sms-management-tag-list > .tag-header:first-of-type {
	margin-top: 0;
}

.sms-management-tag-list > .sms-tag {
	margin-top: 4px;
	margin-left: 4px;
	padding: 8px;

	font-size: 1.2rem;
	font-weight: 600;

	border-radius: 8px;
	background: rgba(0,0,0,0.05);

	-webkit-user-select: none; /* Safari */
	-ms-user-select: none; /* IE 10 and IE 11 */
	user-select: none; /* Standard syntax */
}

.sms-management-tag-list > .sms-tag:hover {
	transform: scale(1.03);

	cursor: pointer;
}

.sms-content {
	flex: 1;

	display: flex;
	flex-direction: column;
}

.sms-description-container {
	display: flex;
	flex-direction: column;

	border-radius: 8px;
	border: 1px solid var(--clr-border);

	overflow: hidden;
}

.sms-description-container > .sms-description-title {
	height: 100%;
	padding: 8px;
	font-size: 1.4rem;
	background: rgba(0,0,0,0.05);
}

.sms-description-container > i {
	padding: 8px;
	font-size: 1.4rem;
}

.sms-text {
	margin-top: auto;
}

.sms-text > .form-control {
	resize: none;
}

.sms-management-sms-list {
	list-style-type: none;
	padding: 0;
}

.sms-management-sms-list > .sms-management-list-header {
	margin-left: 4px;
	margin-bottom: 8px;
	margin-top: 16px;
	display: flex;
	justify-content: space-between;
	align-items: center;
	font-size: 1.6rem;
	font-weight: 600;
}

.sms-management-list-header:first-of-type {
	margin-top: 0;
}

.sms-management-sms-list > .sms-management-list-item {
	margin-top: 4px;
	margin-left: 4px;
	padding: 8px;
	display: flex;
	justify-content: space-between;
	align-items: center;
	font-size: 1.2rem;
	font-weight: 600;
	border-radius: 8px;
	background: rgba(0, 0, 0, 0.05);
}

.sms-management-list-item.selected {
	background: var(--clr-main) !important;
	color: #FFFFFF;
}

.sms-management-list-item:hover {
	transform: scale(1.03);
	cursor: pointer;
}

.sms-management-toolbar {
	display: flex;
	justify-content: flex-end;
	column-gap: 8px;
}

.sms-management-toolbar > .sms-management-toolbar-switch {
	margin-right: auto;
	
	display: flex;
	align-items: center;
	justify-content: center;
	column-gap: 8px;
}

.sms-management-toolbar-switch > label {
	margin: 0;
}

/* ===================================================== */
/* ==================== PHONE PREVIEW ================== */
/* ===================================================== */

.phone-preview-window {
	position: absolute;
	height: 159.9mm;
	width: 76.7mm;
	top: 50%;
	left: 50%;
	display: flex;
	flex-direction: column;
	transform: translate(-50%, -50%);
	border: 2mm solid #000000;
	border-radius: 14mm;
	background: #FFFFFF;
	z-index: 1001;

	box-shadow: 0mm 0mm 0mm .6mm lightgray, rgba(0, 0, 0, 0.3) 0px 19px 38px, rgba(0, 0, 0, 0.22) 0px 15px 12px;
}

.phone-preview-close-window {
	position: absolute;
	top: 0;
	right: -50px;
	padding: 6px 12px;

	border-radius: 8px;
	cursor: pointer;

	color: white;
	background: var(--clr-main);
}

.phone-preview-window-header {
	flex-shrink: 0;
	height: calc(100% / 6);
	width: 100%;
	padding: 0 2.5mm;

	display: flex;
	align-items: center;
	justify-content: space-between;

	border-top-left-radius: inherit;
	border-top-right-radius: inherit;

	background: #f3f3f1;
	border-bottom: 1px solid #e0e0e0;
}

.phone-preview-window-header::before {
	content: '';
	position: absolute;
	top: 2.5mm;
	left: 50%;
	width: 20mm;
	height: 6mm;
	transform: translate(-50%, 0);
	border-radius: 500px;
	background: black;
}

.phone-preview-window-header > i {
	margin-top: 8mm;
	font-size: 1.8rem;
	color: #0178ff;
}

.phone-preview-header-text {
	margin-top: 8mm;
	font-weight: 600;
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
}

.phone-preview-header-icon {
	height: 32px;
	width: 32px;
	padding: 4px;
	background: var(--clr-border);
	border-radius: 100px;
}

.phone-preview-header-icon > img {
	height: 100%;
	width: 100%;
}

.phone-preview-window-body {
	flex: 1;
	background: #FFFFFF;
	padding: 2.5mm;
	padding-bottom: 0;

	display: flex;
	flex-direction: column;
	justify-content: flex-end;
}

.phone-preview-window-body > .phone-preview-msg-bubble {
	height: fit-content;
	width: fit-content;
	padding: 2.5mm;

	display: flex;
	align-items: center;
	justify-content: flex-end;

	border-radius: 12px;

	font-size: 1.2rem;

	color: #FFFFFF;
	background: #198bfe;
}

.phone-preview-msg-bubble.right {
	margin-left: auto;
	border-bottom-right-radius: 0;
}

.phone-preview-msg-bubble.left {
	margin-right: auto;
	border-bottom-left-radius: 0;
}

.phone-preview-window-footer {
	flex-shrink: 0;
	height: calc(100% / 9);
	width: 100%;
	padding: 2.5mm;

	display: flex;
	column-gap: 2.5mm;
}

.phone-preview-window-footer::before {
	content: '';
	position: absolute;
	bottom: 2mm;
	height: 3px;
	width: 33%;
	border-radius: 5px;
	left: 50%;
	transform: translateX(-50%);

	background: #000000;
}

.phone-preview-footer-btn {
	flex-shrink: 0;
	height: 26px;
	width: 26px;

	display: flex;
	align-items: center;
	justify-content: center;

	border-radius: 12px;

	background: #e8e9eb;
	color: #7d7f85;
}

.phone-preview-footer-input {
	flex: 1;
	height: 26px;
	padding-left: 2.5mm;

	display: flex;
	align-items: center;
	justify-content: center;

	border-radius: 12px;
	border: 1px solid #e0e0e0;

	background: #ffffff;
	color: #7d7f85;
}

.phone-preview-footer-input > span {
	width: 100%;
	font-size: 1.2rem;
	color: #7d7f85;
}

/* ===================================================== */
/* ================== MAIL MANAGEMENT ================== */
/* ===================================================== */

.mail-management-window {
	position: absolute;
	top: 0;
	left: 0;

	width: 100vw;
	height: 100vh;
	padding: 16px;
	
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: 16px;

	background-color: var(--clr-lightgray);
	color: #FFFFFF;

	z-index: 999;
}

.mail-preview-close-btn {
	position: absolute;
	top: -2mm;
	right: -50px;
	padding: 6px 12px;

	border-radius: 8px;
	cursor: pointer;

	color: white;
	background: var(--clr-main);
}

.mail-management-window-header {
	flex-shrink: 0;

	height: fit-content;
	width: 100%;
	padding: 16px;

	display: flex;
	align-items: center;
	justify-content: space-between;

	border-radius: 8px;

	background: #FFFFFF;
	box-shadow: rgba(0, 0, 0, 0.2) 0px 3px 8px;
}

.mail-management-window-header > span {
	font-size: 2rem;
	font-weight: bold;
	color: #000000;
}

.mail-management-window-body {
	flex: 1;
	height: calc(100% - 78px);
	width: 100%;

	display: flex;
	flex-direction: row;
	column-gap: 16px;
}

.mail-management-window-body > .mail-management-window-body-column {
	height: 100%;
	display: flex;
	flex-direction: column;

	border-radius: 8px;

	background: #FFFFFF;
	box-shadow: rgba(0, 0, 0, 0.2) 0px 3px 8px;
}

.mail-management-window-body-column.small {
	min-width: 300px;
	flex: .5;
}

.mail-management-window-body-column.large {
	min-width: 500px;
	flex: 2;
}

.mail-management-window-body-column > .column-header {
	padding: 16px;
	
	font-size: 1.6rem;
	font-weight: 600;
	color: #000000;
}

.mail-management-window-body-column > .column-body {
	flex: 1;

	padding: 16px;
	padding-top: 0;
	
	display: flex;
	flex-direction: column;
	row-gap: 8px;

	font-size: 1.4rem;
	color: #000000;

	overflow: auto;
}

.mail-management-tag-list {
	list-style-type: none;
	padding: 0;
}

.mail-management-tag-list > .tag-header {
	font-weight: 600;
	margin-top: 16px;

	color: var(--clr-main);
}

.mail-management-tag-list > .tag-header:first-of-type {
	margin-top: 0;
}

.mail-management-tag-list > .mail-tag {
	margin-top: 4px;
	margin-left: 4px;
	padding: 8px;

	font-size: 1.2rem;
	font-weight: 600;

	border-radius: 8px;
	background: rgba(0,0,0,0.05);

	-webkit-user-select: none; /* Safari */
	-ms-user-select: none; /* IE 10 and IE 11 */
	user-select: none; /* Standard syntax */
}

.mail-management-tag-list > .mail-tag:hover {
	transform: scale(1.03);

	cursor: pointer;
}

.mail-content {
	flex: 1;

	display: flex;
	flex-direction: column;
}

.mail-description-container {
	display: flex;
	flex-direction: column;

	border-radius: 8px;
	border: 1px solid var(--clr-border);

	overflow: hidden;
}

.mail-description-container > .mail-description-title {
	height: 100%;
	padding: 8px;
	font-size: 1.4rem;
	background: rgba(0,0,0,0.05);
}

.mail-description-container > i {
	padding: 8px;
	font-size: 1.4rem;
}

.mail-text {
	margin-top: auto;

	display: flex;
	flex-direction: column;
	row-gap: 16px;
}

.mail-text > .form-control {
	resize: none;
}

.mail-text label {
	margin: 0;
}

.mail-text .note-editor {
	margin: 0;
}

.mail-management-mail-list {
	list-style-type: none;
	padding: 0;
}

.mail-management-mail-list > .mail-management-list-header {
	margin-left: 4px;
	margin-bottom: 8px;
	margin-top: 16px;
	display: flex;
	justify-content: space-between;
	align-items: center;
	font-size: 1.6rem;
	font-weight: 600;
}

.mail-management-list-header:first-of-type {
	margin-top: 0;
}

.mail-management-mail-list > .mail-management-list-item {
	margin-top: 4px;
	margin-left: 4px;
	padding: 8px;
	display: flex;
	justify-content: space-between;
	align-items: center;
	font-size: 1.2rem;
	font-weight: 600;
	border-radius: 8px;
	background: rgba(0, 0, 0, 0.05);
}

.mail-management-list-item.selected {
	background: var(--clr-main) !important;
	color: #FFFFFF;
}

.mail-management-list-item:hover {
	transform: scale(1.03);
	cursor: pointer;
}

.mail-management-toolbar {
	display: flex;
	justify-content: flex-end;
	column-gap: 8px;
}

.mail-management-toolbar > .mail-management-toolbar-switch {
	margin-right: auto;
	
	display: flex;
	align-items: center;
	justify-content: center;
	column-gap: 8px;
}

.mail-management-toolbar-switch > label {
	margin: 0;
}

/* ===================================================== */
/* =================== MAIL PREVIEW ==================== */
/* ===================================================== */

.mail-preview-window {
	position: absolute;
	height: 90vh;
	top: 50%;
	left: 50%;
	display: flex;
	flex-direction: column;
	transform: translate(-50%, -50%);
	border: 2mm solid #000000;
	border-bottom: 8mm solid #000000;
	border-radius: 3mm;
	background: #FFFFFF;
	z-index: 1001;
	box-shadow: rgba(0, 0, 0, 0.3) 0px 19px 38px, rgba(0, 0, 0, 0.22) 0px 15px 12px;
	background: #000000;
	aspect-ratio: 16/9;
}

.mail-preview-window::after {
	position: absolute;
	
	content: 'SCREEN';
	width: 100%;
	height: 8mm;
	bottom: -8mm;
	line-height: 8mm;
	
	font-family: sans-serif;
	text-align: center;
	font-size: 1.4rem;
	font-weight: 900;
	font-variant: all-small-caps;
	font-style: italic;
	
	color: #C0C0C0;
}

.mail-preview-header {
	height: 6%;
	width: 100%;
	padding: 8px 16px;
	display: flex;
	align-items: center;
	justify-content: center;
	border-top-left-radius: 1.5mm;
	border-top-right-radius: 1.5mm;
	background-color: #3c3c3c;
}

.mail-preview-header > .fake-url {
	height: 100%;
	width: 100%;
	padding: 8px 16px;

	display: flex;
	align-items: center;

	border-radius: 500px;

	background: rgba(0,0,0,0.5);
}

.fake-url > span {
	color: #FFFFFF;
	font-size: 1rem;
}

.mail-preview-body {
	flex: 1;
}

.mail-preview-footer {
	height: 5%;
	width: 100%;
	padding: 8px;

	display: flex;
	align-items: center;
	justify-content: center;
	column-gap: 8px;

	border-bottom-left-radius: 1.5mm;
	border-bottom-right-radius: 1.5mm;

	background-color: #3c3c3c;
}

.mail-preview-footer > i {
	font-size: 1.8rem;
}

.mail-preview-footer > .fake-url {
	height: 100%;
	width: 150px;
	padding: 10px;

	display: flex;
	align-items: center;

	border-radius: 500px;

	background: rgba(255,255,255,0.15);
}

/* ===================================================== */
/* ================ DOCUMENTS SOCIETE ================== */
/* ===================================================== */

.societe-files-list {
	display: flex;
	flex-direction: column;
	row-gap: 10px;
}

.societe-file-container {
	display: flex;
	flex-wrap: wrap;
	gap: 10px;
}

.societe-file-card {
	position: relative;

	width: 200px;

	border-radius: 8px;
	background-color: var(--clr-main);
	aspect-ratio: 1/1.414;

	cursor: pointer;
	overflow: hidden;
}

.societe-file-card-img {
	height: 100%;
	width: 100%;

	display: flex;
	align-items: center;
	justify-content: center;
}

.societe-file-card-img > img {
	height: 100%;
	width: 100%;

	object-fit: cover;
}

.societe-file-card-img > i {
	font-size: 4rem;
	color: white;
}

.societe-file-card-name {
	position: absolute;
	padding: 16px;
	bottom: 0;
	left: 0;
	right: 0;

	display: flex;
	flex-direction: column;

	overflow: hidden;
	white-space: nowrap;
	text-overflow: ellipsis;

	color: white;
	background: rgba(0,0,0,0.7);
	
	z-index: 1;
}

.societe-file-card-name > i {
	font-size: .85em;
}

.societe-file-card > .societe-file-options {
	position: absolute;
	top: 0;
	bottom: 0;
	left: 0;
	right: 0;
	display: flex;
	flex-direction: column;
	row-gap: 10px;
	align-items: center;
	justify-content: center;
	border-radius: 8px;
	background: rgba(0, 0, 0, 0.6);
	opacity: 0;
	pointer-events: none;

	transition: opacity .15s;
}

.societe-file-card:hover > .societe-file-options {
	opacity: 1;
	pointer-events: all;

	transition: opacity .15s;
}

.societe-file-options > button {
	height: 48px;
	aspect-ratio: 1/1;
}

/* ===================================================== */
/* =================== AMBASSADEURS ==================== */
/* ===================================================== */

.ambassador-window {
	position: absolute;

	left: 0;
	top: 0;

	height: 100vh;
	width: 100vw;

	display: flex;
	flex-direction: column;
	row-gap: 16px;

	z-index: 999;

	background: var(--bs-gray-100);
}

.ambassador-header {
	padding: 16px;
	margin: 0 16px;
	margin-top: 16px;

	display: flex;
	flex-direction: row;
	justify-content: space-between;
	align-items: center;

	border-radius: 8px;

	background-color: white;
	box-shadow: rgba(0, 0, 0, 0.2) 0px 3px 8px;
}

.ambassador-header > span {
	margin: 0;

	font-size: 2rem;
	font-weight: bold;
}

.ambassador-container {
	height: 100%;
	width: 100%;
	padding: 16px;
	padding-top: 0;

	display: flex;
	flex-direction: row;
	column-gap: 16px;
	overflow: hidden;
}

.ambassador-menu {
	height: 100%;
	width: 300px;
	flex-shrink: 0;

	display: flex;
	flex-direction: column;
	row-gap: 8px;

	border-radius: 8px;

	box-shadow: rgba(0, 0, 0, 0.2) 0px 3px 8px;

	background-color: white;
	overflow: hidden;
}

.ambassador-menu > .ambassador-menu-header {
	height: 72px;
	padding: 16px;

	display: flex;
	align-items: center;
	flex-shrink: 0;
	column-gap: 4px;

	border-bottom: 1px solid var(--bs-gray-200);
}

.ambassador-menu-header > span {
	font-size: 1.4rem;
	font-weight: 600;
}

.ambassador-menu > .ambassador-menu-content {
	height: 100%;
	width: 100%;
	padding: 16px;

	display: flex;
	flex-direction: column;
	row-gap: 8px;
	overflow: auto;
}

.ambassador-menu-content > .ambassador-item {
	display: flex;
	flex-direction: row;
	column-gap: 8px;
	align-items: center;
	flex-shrink: 0;

	border-radius: 8px;

	background: var(--bs-gray-100);
	overflow: hidden;

	transition: all .15s;
}

.ambassador-item.unvalidated {
	border-right: 8px solid var(--clr-warning);
}

.ambassador-item.inactive {
	color: rgba(0,0,0,0.5);
	background: var(--bs-gray-300) !important;
}

.ambassador-menu-content > .ambassador-item.active {
	background: var(--clr-main) !important;
	color: white;
}

.ambassador-menu-content > .ambassador-item:hover {
	transform: scale(1.01);
	background-color: var(--bs-gray-200);
	cursor: pointer;

	transition: all .15s;
}

.ambassador-item > .ambassador-item-icon {
	height: 40px;
	width: 40px;
	padding: 8px;

	display: flex;
	align-items: center;
	justify-content: center;

	font-size: 1.6rem;

	color: white;
	background: rgba(50,50,50,0.15);
}

.ambassador-item > .ambassador-item-text {
	font-weight: 600;
}

.ambassador-content {
	flex: 1;

	border-radius: 8px;

	display: flex;
	flex-direction: column;

	background-color: white;
	box-shadow: rgba(0, 0, 0, 0.2) 0px 3px 8px;

	overflow: hidden;
}

.ambassador-content-header {
	/* height: 72px; */
	padding: 16px;

	display: flex;
	flex-direction: column;
	flex-shrink: 0;
	row-gap: 8px;

	border-bottom: 1px solid var(--bs-gray-200);

	background: var(--bs-gray-100);
}

.ambassador-content-header-data {
	display: flex;
	flex-direction: row;
	column-gap: 16px;
	align-items: center;
}

.ambassador-content-header-data > .ambassador-content-header-data-group {
	display: flex;
	column-gap: 8px;
	align-items: center;
}

.ambassador-content-header-data-group > label {
	margin: 0;
}

.ambassador-content-body {
	flex: 1;
	padding: 16px;

	display: flex;
	flex-direction: column;
	row-gap: 16px;

	overflow: hidden;
}

.ambassador-body-list {
	display: flex;
	flex-direction: column;
	flex: 1;
	overflow: hidden;
}

.ambassador-body-list-header {
	display: flex;
	align-items: center;
	margin-bottom: 16px;
	column-gap: 8px;
}

.ambassador-body-list-header > h3 {
	font-size: 1.6rem;
	margin: 0;
}

.ambassador-body-list-content {
	position: relative;
	overflow: auto;
}

.ambassador-list-item-header {
	position: sticky;
	top: 0;
	padding: 16px;
	
	display: flex;
	flex-direction: row;
	align-items: center;

	border-radius: 8px;

	background: var(--bs-gray-500);
}

.ambassador-list-item-header > span {
	flex: 1;
	color: white;
	font-weight: 600;
}

.ambassador-list-item {
	padding: 8px 16px;

	display: flex;
	flex-direction: row;
	align-items: center;
}

.ambassador-list-item:nth-child(odd) {
	border-radius: 8px;
	background: var(--bs-gray-100);
}

.ambassador-list-item > .ambassador-list-item-child {
	cursor: pointer;
}

.ambassador-list-item > span {
	flex: 1;
}

.ambassador-validation-list {
	height: 100%;

	display: flex;
	flex-direction: column;
	row-gap: 8px;

	overflow: auto;
}

.ambassador-validation-row {
	padding: 8px;

	display: flex;
	flex-direction: row;
	column-gap: 16px;
	align-items: center;

	border-radius: 8px;
}

.ambassador-validation-row.header {
	padding: 16px 8px;

	font-weight: bold !important;

	color: white;
	background: rgba(0,0,0,0.2);
}

.ambassador-validation-row:nth-child(even) {
	background: rgba(0,0,0,0.03);
}

.ambassador-validation-name {
	font-weight: bold;
}

.ambassador-validation-pdf {
	width: 120px;
}

.ambassador-validation-ci {
	width: 300px;
    overflow: hidden;
    text-align: center;
    display: flex;
    flex-direction: row;
    column-gap: 8px;
}

.ambassador-validation-ci > img {
    max-height: 100px;
    border-radius: 8px;
}

.ambassador-validation-control {
	width: 60px;
}

.btn.pdf_ambassador_signed {
	background-color: var(--clr-good) !important;
	border-color: var(--clr-good) !important;
}