@font-face {
  font-family: "Neuzeit-black";
  src: url("../fonts/Neuzeit-black.otf");
}

@font-face {
  font-family: "Neuzeit-regular";
  src: url("../fonts/Neuzeit-regular.otf");
}

@font-face {
  font-family: "New-hero";
  src: url("../fonts/New-hero.otf");
}

body {
  overflow-x: hidden;
}

.text-primary {
  color: #001d2d !important;
  font-size: 20px;
  font-weight: bold;
  margin-bottom: 50px;
  text-transform: uppercase;
  font-family: Neuzeit-regular;
  margin-top: 70px;
}

.text-primary-smaller {
  color: #001d2d !important;
  font-size: 16px;
}

h1,
h2,
h3,
h4,
h5 {
  font-family: Neuzeit-regular;
}

label,
p,
span,
a {
  font-family: "New-hero";
  font-size: 14px;
}

button {
  font-family: "New-hero" !important;
  text-transform: uppercase;
}

.btn-primary {
  background-color: #001d2d !important;
  border-color: #001d2d !important;
}

.btn-light {
  color: #d1d4ff;
  background-color: white;
  border-color: #001d2d;
}




/* sidebar */
.form-sidebar .sidebar .step {
  cursor: pointer;
}

.form-sidebar {
  min-height: 100vh;
  height: 100%;
}

.circle {
  position: relative;
  width: 20px;
  height: 20px;
  border: 2px solid var(--text-white);
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  font-weight: 700;
  background-color: #D1D4FF;
}

.step.active .circle {
  background-color: #8de314;
  /* Change background color when step is active */
}


.step.active .circle::after {
  content: '';
  width: 30px;
  height: 30px;
  position: absolute;

  border-radius: 50%;
  border: 2px solid #8de314;
  z-index: 3;
}

.step-content {
  flex-grow: 1;
}

.step-content a {
  color: var(--text-white);
  font-size: 14px;
  display: block;
  margin-left: 10px;
  padding-top: 3px;
  text-decoration: none;
}

.bar {
  display: block;
  border: 1px solid #d1d4ff;
  width: 3px;
  margin: 15px 8px;
  /* height: 6.7vh; */
  height: 64px;
  background-color: #d1d4ff;
  /* margin-bottom: 10px; */
}

.logo {
  display: block;
  text-align: center;
  width: 130px;
  margin: 0 auto;
}



.bg-primary {
  background-color: #e4146b !important;
}

/* index */
.bloc-choix {
  width: 220px;
  height: 200px;
  border: 10px solid #d1d4ff;
  border-radius: 30px;
  margin: 10px;
  text-align: center;
  background-color: #e4146b;
  color: white;

}


.bloc-choix:hover {
  width: 220px;
  height: 200px;
  border: 10px solid #e4146b;
  border-radius: 30px;
  margin: 10px;
  text-align: center;
  background-color: #001d2d;
  color: #ffffff;

}

.bloc-choix-image {
  height: 100px;
}

.bloc-choix-image img {
  padding-top: 30px;
  width: 50px;
}

.bloc-choix-text {
  font-size: 16px;
}

.invisible {
  height: 0
}

.btn-form {
  padding: 20px !important;
  border: 2px solid #001d2d !important;
  height: 75px;
  font-family: "New-hero";
  display: flex;
  align-items: center;
  justify-content: center;
}

.btn-form-twolines {
  padding: 10px !important;
}

.btn-form:hover {
  color: #001d2d !important;
  background-color: #d1d4ff !important;
  border-color: #d1d4ff !important;
}

.btn-form-active {
  color: #001d2d !important;
  background-color: #d1d4ff !important;
  border-color: #d1d4ff !important;
}

.form-input {
  padding: 10px;
  border: 2px solid #001d2d !important;
  border-radius: 8px;
  height: 75px;
  font-family: "New-hero";
  outline: none;
}


label {
  height: 40px;
}

.d-grid {
  margin-top: -10px;
}





.form-input[readonly] {
  background-color: #E4E6FF;
  border: none !important;
}


.input-number {
  text-align: end;
}

.input-group-text {
  color: white;
  background-color: #001d2d;
  border-color: #001d2d;
  width: 124px !important;
  display: flex;
  justify-content: center;
}


.qty-btn {
  font-size: 30px;
  width: 75px;
  height: 75px;
  padding-top: 12px;

}

.qty-add {
  margin-right: 10px
}

.btn-secondary {
  background-color: #D1D4FF;
  border-color: #D1D4FF;
  color: #001d2d
}


.numberstyle {
  flex-grow: 1;
  /* Take up remaining space */
  margin: 0 10px;
  /* Adjust margin as needed */
  text-align: center;
  width: auto;
  /* Set width to auto */
  min-width: 0;
  /* Allow shrinking beyond its content size */
}

.calendar-icon {
  position: absolute;
  right: 25px;
  top: 25px;
}

.input-group2 {
  border-top-right-radius: 8px !important;
  border-bottom-right-radius: 8px !important;
}

.form-radio {
  padding: 12px;
  border: 2px solid #001d2d;
  margin-right: 10px;
}

.form-check-input {
  padding: 10px;
  border: 2px solid #001d2d;
}

.fa-circle-plus {
  cursor: pointer;
}



.active-bar {
  border: 1px solid #8de314;
  background-color: #8de314;
}


/* select 2 style */

.select2-container {
  width: 100% !important;
}

.select2-selection {
  height: 75px !important
}



/* Custom styles to ensure Select2 dropdown retains the form-input class styling */
.select2-container--default .select2-selection--single {
  padding: 10px;
  /* Adjust to match your form input padding */
  border: 2px solid #001d2d !important;
  /* Adjust to match your form input border */
  border-radius: 8px;
  /* Adjust to match your form input border-radius */
  height: 75px;
  /* Adjust to match your form input height */
  font-family: "New-hero";
  /* Adjust to match your form input font-family */
  outline: none;
  display: flex;
  align-items: center;
}

.select2-container--default .select2-selection--single .select2-selection__rendered {
  line-height: normal;
  /* Adjust to match your form input line-height */
  padding: 0;
  /* Remove padding to align text vertically */
}

.select2-container--default .select2-selection--single .select2-selection__arrow {
  height: 20px !important;
  /* Adjust height as needed */
  width: 20px !important;
  /* Adjust width as needed */
  position: absolute;
  top: 50% !important;
  right: 10px;
  /* Adjust if necessary */
  transform: translateY(-50%);
}

.select2-container--default .select2-selection--single {
  border-radius: 8px !important;
}

.select2-dropdown {
  border: 2px solid #001d2d !important;
  /* Adjust to match your form input border */
  border-radius: 8px;
  /* Adjust to match your form input border-radius */
}

.select2-container--default .select2-selection--single .select2-selection__rendered {
  line-height: 50px !important;
}

.error-input {
  border-color: red !important;
}

.input-group-text-error {
  background-color: red !important;
  border-color: red !important;
}

label {
  padding-top: 30px;
}

.label-conaissances {
  padding-top: 0px;
}

/* .main-container{
  margin-bottom: 150px
} */

.btn-secondary:hover {
  background-color: #D1D4FF;
  color: #001d2d;
  border-color: #D1D4FF
}

.form-check-label {
  padding-top: 0px;
}

.btn-success {
  background-color: #8de314;
  color: #001d2d;
  border: none;
}

.btnForm {
  position: fixed;
  /* margin-top:100px!important; */
  right: 0px;
  bottom: 50px;
  width: 100%;
}

.btnForm .btn {
  border-radius: 40px !important;
  padding-top: 13px !important;
  padding-bottom: 10px !important;
  text-transform: uppercase;
}





.btnPrev {
  width: 200px;
  margin-right: 20px;
  font-size: 16px !important;
  color: #D1D4FF;
  padding-right: 36px !important;
}

.btnNext {
  width: 200px;
  border-radius: 40px !important;
  padding: 15px !important;
  font-size: 16px !important;
  margin-left: 25px;
  text-align: start;
  padding-left: 36px !important;
}

.btnEnd {
  width: 296px;
  background-color: #8de314 !important;
  border-color: #8de314 !important;
  color: #001d2d;
  padding-left: 36px !important;
  text-align: left;
  font-size: 16px !important;
}

.btnNext:hover .fa-solid.fa-arrow-right {
  color: #ffffff;
  padding-right: 21px;

}


.btnPrev:hover .fa-arrow-left {
  color: #001d2d;
  padding-left: 21px;
}

.btnPrev:hover .btnText {
  color: #001d2d;
  padding-left: 15px;
}

.btnEnd:hover {
  color: #001d2d;

}

.btnPrev:hover {
  color: #D1D4FF;
  background-color: white;
  border-color: #001d2d;

}

.fa-arrow-left {
  float: left;
  padding-top: 3px;
  padding-left: 36px;
}

.fa-arrow-right {
  float: right;
  padding-top: 3px;
  padding-right: 36px;
}

/* .error-container{
  height:0
} */



.relative-bottom {
  position: relative !important;
  margin-top: 100px !important;
  right: 0px;
  bottom: 50px;
  -webkit-transform: translateZ(0);
}

#resultsList {
  background-color: white;
  border: 2px solid #001d2d;
  border-radius: 4px;
  margin-top: 5px;
  margin-left: 10px;
  display: none;
  padding: 10px;
  overflow-y: auto;
}

#resultsList li {
  padding: 10px;
  cursor: pointer;
}

#resultsList li:hover {
  background-color: #f8f8f8;
}

.btn-modal {
  border-radius: 20px;
  font-size: 12px;
  width: 250px;
  padding: 10px;
}


/* Hide the default Select2 arrow */
.select2-container .select2-selection__arrow b {
  display: none;
  /* Hide the default arrow */
}

/* Add FontAwesome chevron-down icon */
.select2-container .select2-selection__arrow:after {
  content: '\f078';
  /* FontAwesome chevron-down unicode */
  font-family: 'Font Awesome 6 Free';
  /* Specify the FontAwesome family */
  font-weight: 900;
  /* Ensure it's using the solid style */
  font-size: 14px;
  /* Adjust icon size */
  color: #333;
  /* Customize color if needed */
  position: absolute;
  top: 50%;
  right: 10px;
  transform: translateY(-50%);
  pointer-events: none;
  /* Ensure the arrow doesn't interfere with clicking */
}