@import url('https://fonts.googleapis.com/css2?family=Poppins:ital,wght@0,100;0,200;0,300;0,400;0,500;0,600;0,700;0,800;0,900;1,100;1,200;1,300;1,400;1,500;1,600;1,700;1,800;1,900&display=swap');
@import url("../icons/fontawesome/css/all.min.css");

:root {
  --body-bg-rgb:	240 ,240, 245;
  --primary-rgb:	108, 95, 252;
  --secondary-rgb:	5, 195, 251;
  --warning-rgb:	247, 183, 49;
  --info-rgb:	17, 112, 228;
  --success-rgb:	9, 173, 149;
  --danger-rgb:	232, 38, 70;
  --light-rgb:	246, 246, 251;
  --dark-rgb:	52, 58, 64;
  --orange-rgb:	252, 115, 3;
  --pink-rgb:	236, 130, 239;
  --teal-rgb:	28, 175, 159;
  --purple-rgb:	137, 39, 236;
  --default-body-bg-color:	rgb(var(--body-bg-rgb));
  --primary-color:	rgb(var(--primary-rgb));
  --primary-border:	rgb(var(--primary-rgb));
  --primary01:	rgba(var(--primary-rgb), 0.1);
  --primary02:	rgba(var(--primary-rgb), 0.2);
  --primary03:	rgba(var(--primary-rgb), 0.3);
  --primary04:	rgba(var(--primary-rgb), 0.4);
  --primary05:	rgba(var(--primary-rgb), 0.5);
  --primary06:	rgba(var(--primary-rgb), 0.6);
  --primary07:	rgba(var(--primary-rgb), 0.7);
  --primary08:	rgba(var(--primary-rgb), 0.8);
  --primary09:	rgba(var(--primary-rgb), 0.9);
  --primary005:	rgba(var(--primary-rgb), 0.05);
  --default-font-family: 'Poppins', sans-serif; /* Utilisation de la police Poppins */
  --default-font-weight:	400;
  --default-text-color:	#77838f;
  --default-border:	#e9edf4;
  --default-background:	#f7f8f9;
  --menu-bg:	#fff;
  --menu-prime-color:	#212529;
  --menu-border-color:	#e9edf4;
  --header-bg: #fff;
  --header-prime-color:	rgb(var(--primary-rgb));
  --header-border-color:	#e9edf4;
  --custom-white:	#fff;
  --custom-black:	#000;
  --bootstrap-card-border:	#e9edf4;
  --list-hover-focus-bg:	#f5f6f7;
  --text-muted:	#74829c;
  --input-border:	#e9edf6;
  --form-control-bg:	#ffffff;
  --shadow-color:	rgba(168, 180, 208, 0.1);
  /* Gray set */
  --gray-1:	#f9fafb;
  --gray-2:	#f2f4f5;
  --gray-3:	#e6eaeb;
  --gray-4:	#dbdfe1;
  --gray-5:	#949eb7;
  --gray-6:	#7987a1;
  --gray-7:	#4d5875;
  --gray-8:	#383853;
  --gray-9:	#323251;
  /* White set */
  --white-1:	rgba(255,255,255, 0.1);
  --white-2:	rgba(255,255,255, 0.2);
  --white-3:	rgba(255,255,255, 0.3);
  --white-4:	rgba(255,255,255, 0.4);
  --white-5:	rgba(255,255,255, 0.5);
  --white-6:	rgba(255,255,255, 0.6);
  --white-7:	rgba(255,255,255, 0.7);
  --white-8:	rgba(255,255,255, 0.8);
  --white-9:	rgba(255,255,255, 0.9);
  /* Black set */
  --black-1:	rgba(0,0,0, 0.1);
  --black-2:	rgba(0,0,0, 0.2);
  --black-3:	rgba(0,0,0, 0.3);
  --black-4:	rgba(0,0,0, 0.4);
  --black-5:	rgba(0,0,0, 0.5);
  --black-6:	rgba(0,0,0, 0.6);
  --black-7:	rgba(0,0,0, 0.7);
  --black-8:	rgba(0,0,0, 0.8);
  --black-9:	rgba(0,0,0, 0.9);
}

/*Font Family*/
/*Font Size*/
/*Font Weight*/
/*Body & Text colors*/
/*Default Background Color*/
/*Border Color*/
/*Border Radius*/
/*Box Shadow*/
/* Header Variables */
/*Menu Variables*/
/*Color Variables*/
/* social icons colors */
/*gradient variables*/
/*gray set*/
/*white set*/
/*black set*/
/* dark mode */
[data-theme-mode=dark] {
  --body-bg-rgb:	26, 26, 60;
  --body-bg-rgb2:	42, 42, 74;
  --menu-bg:	rgb(var(--body-bg-rgb2));
  --menu-border-color:	rgba(255,255,255,0.1);
  --menu-prime-color:	rgba(255,255,255);
  --header-bg:	rgb(var(--body-bg-rgb2));
  --header-prime-color:	rgba(255,255,255);
  --header-border-color:	rgba(255,255,255,0.1);
  --custom-white:	rgb(var(--body-bg-rgb2));
  --custom-black:	#fff;
  --default-border:	rgba(255,255,255,0.1);
  --default-text-color:	#dedefd;
  --light-rgb:	31, 31, 65;
  --dark-rgb:	240 ,245 ,248;
  --bootstrap-card-border:	rgba(255,255,255,0.1);
  --list-hover-focus-bg:	rgba(255,255,255,0.1);
  --default-background:	rgba(255,255,255,0.1);
  --default-body-bg-color:	rgb(var(--body-bg-rgb));
  --text-muted:	#9595b5;
  --input-border:	rgba(255,255,255,0.1);
  --form-control-bg:	rgb(var(--body-bg-rgb2));
  --shadow-color:	rgba(28, 28, 51, 0.15);
  /* Gray Set */
  --gray-100:	#110f0f;
  --gray-200:	#17171c;
  --gray-300:	#393946;
  --gray-400:	#505062;
  --gray-500:	#73738c;
  --gray-600:	#8f8fa3;
  --gray-700:	#ababba;
  --gray-800:	#c7c7d1;
  --gray-900:	#e3e3e8;
  /* white set */
  --white-1:	rgba(0,0,0,0.1);
  --white-2:	rgba(0,0,0,0.2);
  --white-3:	rgba(0,0,0,0.3);
  --white-4:	rgba(0,0,0,0.4);
  --white-5:	rgba(0,0,0,0.5);
  --white-6:	rgba(0,0,0,0.6);
  --white-7:	rgba(0,0,0,0.7);
  --white-8:	rgba(0,0,0,0.8);
  --white-9:	rgba(0,0,0,0.9);
  /* black set */
  --black-1:	rgba(255,255,255,0.05);
  --black-2:	rgba(255,255,255,0.2);
  --black-3:	rgba(255,255,255,0.3);
  --black-4:	rgba(255,255,255,0.4);
  --black-5:	rgba(255,255,255,0.5);
  --black-6:	rgba(255,255,255,0.6);
  --black-7:	rgba(255,255,255,0.7);
  --black-8:	rgba(255,255,255,0.8);
  --black-9:	rgba(255,255,255,0.9);
}

:root {
  --primary-rgb:	16, 165, 216;
  --default-text-color:	#56595b;
}

body {
  font-family: "Poppins", Helvetica, Arial, sans-serif;
  line-height: 1.5;
  text-align: left;
}

.table td {
  vertical-align: top;
}

.square-image-container {
  align-items: center;
  justify-content: center;
  text-align: center;
}

.pp-image {
  object-fit: cover;
  margin: 7% 0% 7% 0%;
  border: 1px solid #333131;
  width: 200px;
  height: 200px;
}


.btn-menu {
  font-size: 1rem;
  color: #77838f;
}

.container {
  max-width: 1195px;
}

.container-fluid {
  max-width: 1195px;
}

[data-nav-layout=horizontal] .app-content {
  margin-block-start: 4.5rem;
}

.overlay {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  z-index: 999;
  background-color: rgba(0, 0, 0, 0.5);
}

.card.sticky-card {
  top: -170px;
}

/*progressbar*/
#progressbar {
  margin-bottom: 30px;
  overflow: hidden;
  color: lightgrey;
}

#progressbar .active {
  color: #000000;
}

#progressbar li {
  list-style-type: none;
  font-size: 12px;
  width: 25%;
  float: left;
  position: relative;
}

/*Icons in the ProgressBar*/
#progressbar #event_type:before {
  font-family: FontAwesome;
  content: "\f02d";
}

#progressbar #account:before {
  font-family: FontAwesome;
  content: "\f023";
}

#progressbar #confirm:before {
  font-family: FontAwesome;
  content: "\f007";
}

#progressbar #success:before {
  font-family: FontAwesome;
  content: "\f00c";
}

/*ProgressBar before any progress*/
#progressbar li:before {
  width: 50px;
  height: 50px;
  line-height: 45px;
  display: block;
  font-size: 18px;
  color: #ffffff;
  background: lightgray;
  border-radius: 50%;
  margin: 0 auto 10px auto;
  padding: 2px;
}

/*ProgressBar connectors*/
#progressbar li:after {
  content: '';
  width: 100%;
  height: 2px;
  background: lightgray;
  position: absolute;
  left: 0;
  top: 25px;
  z-index: -1;
}

/*Color number of the step and the connector before it*/
#progressbar li.active:before, #progressbar li.active:after {
  background: var(--primary-color);
}

.text-large {
  font-size: 1.25rem; /* Ajustez selon vos besoins */
}

#toastContainer {
  position: fixed;
  top: 20px;
  right: 20px;
  z-index: 1050; /* Pour s'assurer qu'il s'affiche au-dessus des autres éléments */
}

.mapLocation {
  height: 220px;
  margin-top: 20px; /* Espacement entre la carte et le contenu au-dessus */
}

/* CSS Media Query pour une largeur d'écran inférieure ou égale à 1056px */
@media screen and (max-width: 1056px) {
  .mapLocation {
      order: 2; /* Change l'ordre pour que la carte soit affichée en dessous */
      margin-top: 0; /* Supprime l'espacement entre la carte et le contenu au-dessus */
  }
}

/* Social Media */
.instagram-social,.linkedin-social,.facebook-social,.twitter-social {
  color: #fff;
  width: 2rem;
  height: 2rem;
  padding: 8.5px;
  text-decoration: none;
  margin: 5px 2px;
  border-radius: 7px;
  text-align: center;
}

.facebook-social {
  background: #3b5998
}

.twitter-social {
  background: #000000
}

.linkedin-social {
  background: #007bb5
}

.instagram-social {
  background: linear-gradient(45deg,#f09433,#e6683c 25%,#dc2743 50%,#cc2366 75%,#bc1888);
  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr="#f09433",endColorstr="#bc1888",GradientType=1)
}