:root {
  --header-search-height: 76px;
  --bandeau-height-mobile: 110px;
  --bandeau-height-desktop: 120px;
  --mydaylib-white: #ffffff;
  --mydaylib-black: #000000;
  --mydaylib-blue: #5407ee;
  --mydaylib-blue-hover: #4b0fc4;
  --mydaylib-blue-active: #4b16b4;
  --mydaylib-btn-disabled: #9095a0;
  --mydaylib-gray-dark: #f0f0f0;
  --mydaylib-gray-light: #f3f4f6;
  --mydaylib-gray-line: #bcc1caff;
  --mydaylib-gray-shadow: #9095a1;
  --mydaylib-gray-shadow-light: #eeeeef;
  --mydaylib-green: #2bbd11;
  --mydaylib-green-hover: #29a314;
  --mydaylib-green-active: #298a18;
  --mydaylib-orange: #fd6630ff;
  --mydaylib-orange-hover: #ec4102ff;
  --mydaylib-orange-active: #cd3802ff;
  --header-search-menu-margin-top: calc(var(--header-search-height));
}
.header-search + .header-search-mobile + .header-menu-container {
  margin-top: var(--header-search-menu-margin-top);
}
.text-huge {
  font-size: 69px;
  line-height: 63px;
}

.header-search {
  position: fixed;
  top: 0px;
  left: 0px;
  width: 100%;
  height: var(--header-search-height);
  background: var(--mydaylib-white);
  border-radius: 0px;
  margin: 0;
  padding: 0;
  z-index: 401;
  align-items: center;
  justify-content: space-evenly;
  display: none;
  border-bottom: 1px solid var(--mydaylib-gray-line);
}
.header-search-mobile {
  padding-top: 4px;
  display: flex;
}
.header-search-mobile-menu {
  width: 48px;
  height: 48px;
  font-size: 2rem;
  color: var(--mydaylib-blue);
  cursor: pointer;
  padding-top: 6px;
}
.header-search-mobile-menu-connected {
  width: 48px;
  height: 48px;
  color: var(--mydaylib-orange);
  cursor: pointer;
  padding-top: 6px;
  display: inline-block;
}
.header-search-mobile-image {
  height: 46px;
  width: auto;
  cursor: pointer;
}
.header-search-mobile {
  display: flex;
}
.header-search-image {
  position: relative;
  left: 18px;
  width: 214px;
  height: auto;
  border-radius: 0px;
  cursor: pointer;
}
.header-language-container {
  margin-top: 0px;
}
.header-language-text {
  font-family: Inter;
  font-size: 16px;
  font-weight: 400;
  line-height: 22px;
  color: var(--mydaylib-black);
  cursor: pointer;
}
.header-language-text.separation {
  cursor: default;
}
.header-language-text.selected {
  font-weight: 700;
  cursor: default;
}
.menu-connection-btn-connection {
  text-transform: uppercase;
  /* margin-top: 21px; */
  width: 100%;
}
.header-search-dropdown-lg {
  padding-left: 0px;
}
.header-connected-container {
  position: absolute;
  display: flex;
  flex-direction: column;
  flex-grow: 1;
  width: 342px;
  height: 582px;
  background: var(--mydaylib-white);
  border-radius: 4px;
  box-shadow: 0px 8px 17px #9095a0ff, 0px 0px 2px #9095a0ff; /* shadow-l */
}
.header-connected-name {
  font-family: Inter;
  font-size: 16px;
  font-weight: 700;
  line-height: 26px;
  color: var(--mydaylib-black);
  padding-top: 27px;
}
.header-connected-avatar-container {
  display: flex;
  align-items: center;
  justify-content: center;
  margin-top: 30px;
}
.header-connected-avatar {
  width: 59px;
  height: 59px;
  font-family: Inter;
  font-size: 28px;
  font-weight: 400;
  line-height: 28px;
  color: var(--mydaylib-white);
  background: var(--mydaylib-green);
  opacity: 1;
  overflow: hidden;
  border-radius: 30px;
  display: flex;
  justify-content: center;
  align-items: center;
}
.header-connected-avatar .badge {
  border-radius: 7.5px;
}
.header-connected-sidebar-menu {
  padding: 0px 24px;
  width: 100%;
  display: flex;
  flex-direction: column;
  flex-grow: 1;
  font-family: Inter;
  font-size: 14px;
  font-weight: 400;
  line-height: 22px;
  opacity: 1;
}
.header-connected-sidebar-menu .header-connected-sidebar-menu-item {
  padding: 8px 16px;
  display: flex;
  align-items: center;
  justify-content: left;
  color: var(--mydaylib-black);
  background: var(--mydaylib-white);
  border-radius: 0px;
  gap: 8px;
  cursor: pointer;
  white-space: nowrap;
}
.header-connected-sidebar-menu-item-logout {
  margin-top: 20px;
  color: var(--mydaylib-black) !important;
  background: var(--mydaylib-gray-light) !important;
  font-weight: 500 !important;
}
.header-connected-sidebar-menu-item-logout:hover {
  background: #565e6c !important;
  color: #f8f9fa !important;
}
.header-connected-sidebar-menu .header-connected-sidebar-menu-item:hover {
  color: var(--mydaylib-white) !important;
  background: var(--mydaylib-green);
}
.header-connected-sidebar-menu-item .text {
  height: 24px;
}
.header-connected-sidebar-menu-item .mi {
  width: 24px;
  height: 24px;
  fill: currentColor;
}
.header-connected-sidebar-menu-item-badge {
  position: absolute;
  right: 40px;
  display: flex;
  justify-content: center;
  align-items: center;
  width: 28px;
  height: 28px;
  background-color: var(--mydaylib-orange);
  border-radius: 50%;
}
.header-connected-sidebar-menu-item-badge .badge-item {
  color: var(--mydaylib-white);
}
.header-connected-sidebar-line {
  margin: 15px 0px;
  width: 290px;
  height: 0px;
  border-width: 1px;
  border-color: var(--mydaylib-gray-line);
  border-style: solid;
}
.header-connected-button {
  position: absolute;
  /* top: 24px; */
  top: 16px;
  left: 296px;
  height: 28px;
  padding: 0 8px;
  display: flex;
  align-items: center;
  justify-content: center;
  color: #565e6cff;
  background: #f3f4f6ff;
  opacity: 1;
  border: none;
  border-radius: 4px;
  gap: 0px;
  cursor: pointer;
}
.header-connected-button .bi {
  /* width: 12px; */
  /* height: 12px; */
  fill: #565e6cff;
}
.header-connected-button:hover {
  color: #565e6cff;
  background: #dee1e6ff;
}
.header-connected-button:hover:active {
  color: #565e6cff;
  background: #cfd2daff;
}

/* Textbox */
.textbox {
  opacity: 1;
  margin-top: 15px;
  width: 100%;
}
.textbox input {
  height: 36px;
  width: 100%;
  padding-left: 12px;
  padding-right: 12px;
  font-family: Inter;
  font-size: 1rem;
  font-weight: 400;
  line-height: 22px;
  background: #f3f4f6ff;
  border-radius: 4px;
  border-width: 0px;
  outline: none;
}
.date-size-text {
  font-size: 14px;
}
.textbox .input-required {
  background: #fef6f1;
}
.input-required .select2-container--default .select2-selection--single {
  background-color: #fef6f1;
}
.input-required .select2-container--default .select2-selection--single .select2-selection__rendered {
  background-color: #fef6f1;
}

.textbox .label {
  font-family: Inter;
  font-size: 14px;
  font-weight: 700;
  line-height: 20px;
  color: var(--mydaylib-black);
}
.textbox input:hover {
  /* color: var(--mydaylib-gray-line); neutral-400 */
  color: #868a91;
  background: #f3f4f6ff;
}
.textbox input:focus {
  color: var(--mydaylib-black);
  background: #f3f4f6ff;
}
.textbox input:disabled {
  /* color: var(--mydaylib-gray-line); neutral-400 */
  color: #868a91;
  background: #f3f4f6ff;
}
.textbox textarea {
  height: 72px;
  width: 100%;
  padding-left: 12px;
  padding-right: 12px;
  font-family: Inter;
  font-size: 14px;
  font-weight: 400;
  line-height: 22px;
  background: #f3f4f6ff;
  border-radius: 4px;
  border-width: 0px;
  outline: none;
}
.textbox textarea:hover {
  /* color: var(--mydaylib-gray-line); */
  color: #868a91;
  background: #f3f4f6ff;
}
.textbox textarea:focus {
  color: var(--mydaylib-black);
  background: #f3f4f6ff;
}
.textbox textarea:disabled {
  /* color: var(--mydaylib-gray-line); */
  color: #868a91;
  background: #f3f4f6ff;
}
.textbox :disabled + .icon,
.textbox :disabled + .icon + .icon {
  fill: var(--mydaylib-black);
}
/** checkbox */
.owncheckbox {
  font-family: Inter;
  font-size: 1rem;
  font-weight: 400;
  line-height: 22px;
  display: grid;
  color: var(--mydaylib-black);
  grid-template-columns: 1em auto;
  gap: 0.5em;
  cursor: pointer;
}
.owncheckbox.disabled {
  cursor: default;
  color: var(--mydaylib-btn-disabled);
}
.owncheckbox input[type="checkbox"] {
  -webkit-appearance: none;
  appearance: none;
  background-color: var(--mydaylib-white);
  margin: 0;
  font: inherit;
  color: currentColor;
  width: 1.15em;
  height: 1.15em;
  border: 0.15em solid var(--mydaylib-green);
  border-radius: 0.15em;
  transform: translateY(0.2em);
  display: grid;
  place-content: center;
  cursor: pointer;
}
.owncheckbox span {
  padding-top: 0.1rem;
}
.owncheckbox input[type="checkbox"]::before {
  content: "";
  width: 0.65em;
  height: 0.65em;
  transform: scale(0);
  transition: 80ms transform ease-in-out;
  box-shadow: inset 1em 1em var(--mydaylib-white);
  transform-origin: bottom left;
  clip-path: polygon(14% 44%, 0 65%, 50% 100%, 100% 16%, 80% 0%, 43% 62%);
}
.owncheckbox input[type="checkbox"]:checked {
  background-color: var(--mydaylib-green);
}
.owncheckbox input[type="checkbox"]:checked::before {
  transform: scale(1);
}
.owncheckbox + .owncheckbox {
  margin-top: 1em;
}
.owncheckbox input[type="checkbox"]:disabled {
  border: 0.15em solid var(--mydaylib-btn-disabled);
  cursor: default;
}
/** radio button **/
.ownradio {
  font-family: Inter;
  font-size: 1rem;
  font-weight: 400;
  line-height: 22px;
  display: grid;
  color: var(--mydaylib-black);
  grid-template-columns: 1em auto;
  gap: 0.5em;
  cursor: pointer;
}
.ownradio.disabled {
  cursor: default;
  color: var(--mydaylib-btn-disabled);
}
.ownradio input[type="radio"] {
  -webkit-appearance: none;
  appearance: none;
  background-color: var(--mydaylib-white);
  margin: 0;
  font: inherit;
  color: currentColor;
  width: 1.15em;
  height: 1.15em;
  border: 0.15em solid var(--mydaylib-green);
  border-radius: 50%;
  transform: translateY(0.2em);
  display: grid;
  place-content: center;
  cursor: pointer;
}
.ownradio input[type="radio"]::before {
  content: "";
  width: 0.65em;
  height: 0.65em;
  transform: scale(0);
  transition: 80ms transform ease-in-out;
  box-shadow: inset 1em 1em var(--form-control-color);
  /* border-radius: 50%; */
}
.ownradio input[type="radio"]:checked {
  background-color: var(--mydaylib-green-hover);
  border-color: var(--mydaylib-green);
}
.ownradio input[type="radio"]:checked::before {
  transform: scale(1);
}
.ownradio + .ownradio {
  margin-top: 1em;
}
.ownradio input[type="radio"]:disabled {
  border: 0.15em solid var(--mydaylib-btn-disabled);
  cursor: default;
}

.bandeau-container {
  /* height: var(--bandeau-height-mobile); */
  width: 100%;
  position: relative;
  /* left: 0px;
  top: 0px; */
  height: fit-content;
  padding: 4px 4px;
}
.btn-up {
  text-transform: uppercase;
}
.btn-blue {
  height: 36px;
  padding: 0 12px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  font-family: Inter;
  font-size: 14px;
  font-weight: 400;
  line-height: 22px;
  color: var(--mydaylib-white);
  background: var(--mydaylib-blue);
  opacity: 1;
  border: none;
  border-radius: var(--mydaylib-border-radius);
  gap: 6px;
}
.btn-blue .mi-outlined {
  width: 16px;
  height: 16px;
  fill: var(--mydaylib-white);
  display: flex;
  align-items: center;
  justify-content: center;
}
.btn-blue:hover {
  color: var(--mydaylib-white);
  background: var(--mydaylib-blue-hover);
}
.btn-blue:hover:active {
  color: var(--mydaylib-white);
  background: var(--mydaylib-blue-active);
}
.btn-blue:disabled {
  opacity: 0.4;
}
.btn-green {
  height: 36px;
  padding: 0 12px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  font-family: Inter;
  font-size: 14px;
  font-weight: 400;
  line-height: 22px;
  color: var(--mydaylib-white);
  background: var(--mydaylib-green);
  opacity: 1;
  border: none;
  border-radius: var(--mydaylib-border-radius);
  gap: 6px;
}
.btn-green .mi-outlined {
  width: 16px;
  height: 16px;
  fill: var(--mydaylib-white);
  display: flex;
  align-items: center;
  justify-content: center;
}
.btn-green:hover {
  color: var(--mydaylib-white);
  background: var(--mydaylib-green-hover);
}
.btn-green:hover:active {
  color: var(--mydaylib-white);
  background: var(--mydaylib-green-active);
}
.btn-green:disabled {
  opacity: 0.4;
}
.btn-green-dark {
  height: 36px;
  padding: 0 12px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  font-family: Inter;
  font-size: 14px;
  font-weight: 400;
  line-height: 22px;
  color: var(--mydaylib-white);
  background: var(--mydaylib-green-dark);
  opacity: 1;
  border: none;
  border-radius: var(--mydaylib-border-radius);
  gap: 6px;
}
.btn-green-dark .mi-outlined {
  width: 16px;
  height: 16px;
  fill: var(--mydaylib-white);
  display: flex;
  align-items: center;
  justify-content: center;
}
.btn-green-dark:hover {
  color: var(--mydaylib-white);
  background: var(--mydaylib-green-dark-hover);
}
.btn-green-dark:hover:active {
  color: var(--mydaylib-white);
  background: var(--mydaylib-green-dark-active);
}
.btn-green-dark:disabled {
  opacity: 0.4;
}
.btn-orange {
  height: 36px;
  padding: 0 12px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  font-family: Inter;
  font-size: 14px;
  font-weight: 400;
  line-height: 22px;
  color: var(--mydaylib-white);
  background: var(--mydaylib-orange);
  opacity: 1;
  border: none;
  border-radius: var(--mydaylib-border-radius);
  gap: 6px;
}
.btn-orange .mi-outlined {
  width: 16px;
  height: 16px;
  fill: var(--mydaylib-white);
  display: flex;
  align-items: center;
  justify-content: center;
}
.btn-orange:hover {
  color: var(--mydaylib-white);
  background: var(--mydaylib-orange-hover);
}
.btn-orange:hover:active {
  color: var(--mydaylib-white);
  background: var(--mydaylib-orange-active);
}
.btn-orange:disabled {
  opacity: 0.4;
}
.btn-white {
  height: 36px;
  padding: 0 12px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  font-family: Inter;
  font-size: 14px;
  font-weight: 400;
  line-height: 22px;
  color: var(--mydaylib-blue);
  background: var(--mydaylib-white);
  opacity: 1;
  border: 1px var(--mydaylib-blue) solid;
  border-radius: var(--mydaylib-border-radius);
  gap: 6px;
}
.btn-white:hover {
  color: var(--mydaylib-black);
  background: var(--mydaylib-gray-light);
  border: 1px var(--mydaylib-gray-shadow) solid;
}
.btn-white:disabled {
  opacity: 0.4;
}

@media (min-width: 992px) {
  .text-tiny {
    font-size: 9px;
  }
  .text-small {
    font-size: 12px;
  }
  .text-default {
    font-size: inherit;
  }
  .text-big {
    font-size: 24px;
  }
  .text-huge {
    font-size: 32px;
  }  .header-search {
    display: flex;
  }
  .header-search-mobile {
    display: none;
  }
  .bandeau-container {
    /* height: var(--bandeau-height-desktop); */
    padding: 10px 20px;
  }
}

/* Code tables icons */
.iconViewClass {
  font-size: 1.2rem;
  color: #243664;
}
.iconTrashClass {
  font-size: 1.2rem;
  color: #b22222;
}
.iconRestoreClass {
  font-size: 1.2rem;
  color: #ffa500;
}