@import url('./Montserrat.css');

/* ? -------------------------------------------------------------
/* ? FIX hyper
/* ? ------------------------------------------------------------- */

html[data-sidenav-size=condensed]:not(.authentication-bg),
html[data-sidenav-size=condensed]:not(.authentication-bg) .wrapper,
html[data-sidenav-size=condensed]:not(.authentication-bg) .wrapper .leftside-menu,
html[data-sidenav-size=condensed][data-layout-mode=detached]:not([data-layout=topnav]) .content-page {
  min-height: 100vh;
}

html[data-sidenav-size=condensed][data-layout-mode=detached][data-layout-position="fixed"]:not(.authentication-bg) .wrapper .leftside-menu {
  position: fixed;
  min-height: calc(100vh - 106px);
  max-height: calc(100vh - 106px);
}

html[data-theme=dark][data-layout-mode=detached]:not([data-sidenav-color=light]) {
  --ct-menu-item: #cedce4;
  --ct-menu-item-hover: #fff;
  --ct-menu-item-active: #fff;
}

html[data-theme=dark] .authentication-bg {
  background-image: url(../images/bg-pattern-dark.png);
}

html[data-theme=light][data-sidenav-color="dark"] .leftbar-user-avatar {
  background-color: rgba(241,241,241,1) !important;
  color: #464f5b !important;
}

html[data-theme=dark][data-sidenav-color="light"] .leftbar-user-avatar,
html[data-theme=dark][data-sidenav-color="default"] .leftbar-user-avatar {
  background-color: rgba(49,58,70,1) !important;
  color: rgba(238,242,247,1) !important;
}

.jq-toast-wrap.top-right {
  top: 90px;
}

div.dataTables_wrapper div.dataTables_processing {
  top: 35px;
  border: 1px solid rgb(73, 73, 73);
}

@media (max-width: 767.98px) {
  .page-title-box .page-title-right {
    display: block;
  }
}

.form-select:disabled:not(.is-invalid):not(.is-valid) {
  background-color: var(--ct-input-disabled-bg);
  border-color: var(--ct-input-border-color);
}

.modal-open {
  overflow: hidden !important;
}

.select2-container--default.select2-container--disabled .select2-selection--multiple,
.select2-container--default.select2-container--disabled .select2-selection--single {
  background-color: var(--ct-input-disabled-bg) !important;
}

textarea.select2-search__field::placeholder,
.select2-container--default .select2-results__option--disabled,
.select2-results__option.select2-results__message,
input[type="checkbox"] + label {
  color: var(--ct-input-color) !important;
}

input[type="checkbox"] + label {
  font-weight: 400;
}

/* ? -------------------------------------------------------------
/* ? montserrat
/* ? ------------------------------------------------------------- */

.montserrat {
  font-family: 'Montserrat', 'Nunito', sans-serif;
}

/* ? -------------------------------------------------------------
/* ? account-user-avatar
/* ? ------------------------------------------------------------- */

.account-user-avatar {
  display: flex;
  justify-content: center;
  align-items: center;
  width: 32px;
  height: 32px;
}

/* ? -------------------------------------------------------------
/* ? leftbar-user-avatar
/* ? ------------------------------------------------------------- */

.leftbar-user-avatar {
  display: inline-flex;
  justify-content: center;
  align-items: center;
  width: 42px;
  height: 42px;
}

/* ? -------------------------------------------------------------
/* ? leftbar-account-position
/* ? ------------------------------------------------------------- */

.leftbar-user .leftbar-account-position {
  color: var(--ct-menu-item);
}

html[data-sidenav-color=dark] .leftbar-user .leftbar-account-position {
  color: #eef2f7;
}

/* ? -------------------------------------------------------------
/* ? form feedback
/* ? ------------------------------------------------------------- */

.invalid-feedback,
.valid-feedback {
  min-height: 18px;
}

/* ? -------------------------------------------------------------
/* ? table-privilege
/* ? ------------------------------------------------------------- */

.table-privilege>:not(caption)>*>* {
  padding: 4px;
}

/* ? -------------------------------------------------------------
/* ? table-task-group-model
/* ? ------------------------------------------------------------- */

.table-task-group-model>:not(caption)>*>* {
  padding: 4px;
}

.table-task-group-model tbody tr:last-child td {
  border-bottom: 0px;
}

/* ? -------------------------------------------------------------
/* ? noti-test-instance
/* ? ------------------------------------------------------------- */

.noti-test-instance {
  margin: 0 7px;
  vertical-align: middle;
  line-height: 70px;
}

/* ? -------------------------------------------------------------
/* ? checkbox-check
/* ? ------------------------------------------------------------- */

.checkbox-check .form-check {
  padding-left: calc(var(--ct-gutter-x) * .5);
}

.checkbox-check .form-check .form-check-input {
  float: none;
  margin-left: 0;
  margin-right: 5px;
}

div.row.is-invalid input,
div.row.is-invalid ~ .row input {
  border-color: #fa5c7c !important;
}

div.row.is-valid input,
div.row.is-valid ~ .row input {
  border-color: #0acf97 !important;
}

/* ? -------------------------------------------------------------
/* ? easter-egg
/* ? ------------------------------------------------------------- */

#easter-egg {
  position: fixed;
  top: 0;
  right: 0;
  width: 24px;
  /* width: calc(100vw / 100 * 2.5 + 12px); */
  height: 70px;
}

@keyframes rotation {
  from {
    scale: 1;
    transform: rotate(0deg);
  }
  25% {
    scale: -2;
    transform: rotate(2000deg);
  }
  50% {
    scale: 1;
    transform: rotate(0deg);
  }
  75% {
    scale: -2;
    transform: rotate(2000deg);
  }
  to {
    scale: 1;
    transform: rotate(0deg);
  }
}

/* ? -------------------------------------------------------------
/* ? cursor
/* ? ------------------------------------------------------------- */

.cursor-help {
  cursor: help;
}

.cursor-pointer {
  cursor: pointer;
}

/* ? -------------------------------------------------------------
/* ? select2
/* ? ------------------------------------------------------------- */

form .is-invalid + span span .select2-selection.select2-selection--single,
form .is-invalid + span span .select2-selection.select2-selection--multiple {
  border-color: #fa5c7c !important;
}

form .is-valid + span span .select2-selection.select2-selection--single,
form .is-valid + span span .select2-selection.select2-selection--multiple {
  border-color: #0acf97 !important;
}

.select2-selection__rendered:empty {
  display:none !important;
}

.select2-results__option--selected {
  display: none !important;
}

/* ? -------------------------------------------------------------
/* ? info-bulle-form
/* ? ------------------------------------------------------------- */

.info-bulle-container {
  position: relative;
}

.info-bulle-form {
  position: absolute;
  width: max-content;
  top: 19px;
  left: 0px;
  transform: translate(-50%, -50%);
}

/* ? -------------------------------------------------------------
/* ? clear-element-form
/* ? ------------------------------------------------------------- */

.clear-element-container {
  position: relative;
}

.clear-element-form {
  position: absolute;
  width: max-content;
  top: 0;
  right: 0px;
  transform: translate(50%, 0);
}

/* ? -------------------------------------------------------------
/* ? object-view
/* ? ------------------------------------------------------------- */

.object-view ul {
  margin-bottom: 0;
}

.object-view>* {
  padding-top: 8px;
  margin-bottom: 0;
}

.object-view>*:not(:nth-last-child(2)):not(:last-child):not(.object-view--border-bottom-none) {
  border-bottom: var(--ct-border-width) var(--ct-border-style) var(--ct-border-color) !important;
}

/* ? -------------------------------------------------------------
/* ? label-required
/* ? ------------------------------------------------------------- */

.label-required::after {
  color: #fa5c7c;
  content: " *";
}

/* ? -------------------------------------------------------------
/* ? maintenance
/* ? ------------------------------------------------------------- */

.image-maintenance img {
  height: 140px;
}

.image-maintenance img:last-child {
  transform: scaleX(-1);
}

/* ? -------------------------------------------------------------
/* ? hidden-input
/* ? ------------------------------------------------------------- */

.hidden-input {
  opacity: 0;
  position: absolute;
}

/* ? -------------------------------------------------------------
/* ? changelog
/* ? ------------------------------------------------------------- */

.changelog h1, .changelog h2 {
    font-size: 1.5em;
    margin-bottom: 0px;
}

.changelog h1 + p {
  font-size: 1.17em;
  margin-bottom: 0px;
  color:rgb(var(--ct-primary-rgb));
  text-align: right;
  position: relative;
  top: -35px;
}

.changelog h1 {
  --ct-badge-padding-x: 0.4em;
  --ct-badge-padding-y: 0.25em;
  --ct-badge-font-weight: 700;
  --ct-badge-color: #fff;
  --ct-badge-border-radius: 0.25rem;
  display: inline-block;
  padding: var(--ct-badge-padding-y) var(--ct-badge-padding-x);
  font-weight: var(--ct-badge-font-weight);
  line-height: 1;
  color: var(--ct-badge-color);
  text-align: center;
  white-space: nowrap;
  vertical-align: baseline;
  border-radius: var(--ct-badge-border-radius);
  --ct-bg-opacity: 1;
  background-color: rgba(var(--ct-primary-rgb),var(--ct-bg-opacity))!important;
}

/* ? -------------------------------------------------------------
/* ? editor-ace
/* ? ------------------------------------------------------------- */

#editor-ace,
.multiple-ace-editor {
  width: 100%;
  height: 600px;
}

/* ? -------------------------------------------------------------
/* ? textarea
/* ? ------------------------------------------------------------- */

textarea.form-control {
  min-height: 150px;
}

/* ? -------------------------------------------------------------
/* ? feedback-card-body
/* ? ------------------------------------------------------------- */

.feedback-card-body {
  position: absolute;
  top: 56px;
  left: 24px;
}

/* ? -------------------------------------------------------------
/* ? container-task-model-dragula
/* ? ------------------------------------------------------------- */

#container-task-dragula div:first-child,
#container-task-model-dragula div:first-child {
  margin-top: 0 !important;
}

/* ? -------------------------------------------------------------
/* ? action-icon-card
/* ? ------------------------------------------------------------- */

.action-icon-card {
  color: var(--ct-gray-600);
  font-size: 1.2rem;
}

.action-icon-card:hover {
  color: var(--ct-gray-700);
}

/* ? -------------------------------------------------------------
/* ? form-separate-border-bottom
/* ? ------------------------------------------------------------- */

.form-separate-border-bottom>div:not(:last-of-type) {
  border-bottom: var(--ct-border-width) var(--ct-border-style) var(--ct-border-color) !important;
  margin-bottom: 0.375rem !important;
}

/* ? -------------------------------------------------------------
/* ? dropdown-task-group
/* ? ------------------------------------------------------------- */

.dropdown-task-group {
  position: absolute;
  inset: 0px 0px auto auto;
  margin: 0px;
  transform: translate(0px, 31px);
}

/* ? -------------------------------------------------------------
/* ? progressbar-size-XX
/* ? ------------------------------------------------------------- */

.dataTables_wrapper .progress {
  width: 100px;
}

.progressbar-size[aria-valuenow="0"] { min-width: max-content; width: 0%; }
.progressbar-size[aria-valuenow="1"] { min-width: max-content; width: 1%; }
.progressbar-size[aria-valuenow="2"] { min-width: max-content; width: 2%; }
.progressbar-size[aria-valuenow="3"] { min-width: max-content; width: 3%; }
.progressbar-size[aria-valuenow="4"] { min-width: max-content; width: 4%; }
.progressbar-size[aria-valuenow="5"] { min-width: max-content; width: 5%; }
.progressbar-size[aria-valuenow="6"] { min-width: max-content; width: 6%; }
.progressbar-size[aria-valuenow="7"] { min-width: max-content; width: 7%; }
.progressbar-size[aria-valuenow="8"] { min-width: max-content; width: 8%; }
.progressbar-size[aria-valuenow="9"] { min-width: max-content; width: 9%; }
.progressbar-size[aria-valuenow="10"] { min-width: max-content; width: 10%; }
.progressbar-size[aria-valuenow="11"] { min-width: max-content; width: 11%; }
.progressbar-size[aria-valuenow="12"] { min-width: max-content; width: 12%; }
.progressbar-size[aria-valuenow="13"] { min-width: max-content; width: 13%; }
.progressbar-size[aria-valuenow="14"] { min-width: max-content; width: 14%; }
.progressbar-size[aria-valuenow="15"] { min-width: max-content; width: 15%; }
.progressbar-size[aria-valuenow="16"] { min-width: max-content; width: 16%; }
.progressbar-size[aria-valuenow="17"] { min-width: max-content; width: 17%; }
.progressbar-size[aria-valuenow="18"] { min-width: max-content; width: 18%; }
.progressbar-size[aria-valuenow="19"] { min-width: max-content; width: 19%; }
.progressbar-size[aria-valuenow="20"] { min-width: max-content; width: 20%; }
.progressbar-size[aria-valuenow="21"] { min-width: max-content; width: 21%; }
.progressbar-size[aria-valuenow="22"] { min-width: max-content; width: 22%; }
.progressbar-size[aria-valuenow="23"] { min-width: max-content; width: 23%; }
.progressbar-size[aria-valuenow="24"] { min-width: max-content; width: 24%; }
.progressbar-size[aria-valuenow="25"] { min-width: max-content; width: 25%; }
.progressbar-size[aria-valuenow="26"] { min-width: max-content; width: 26%; }
.progressbar-size[aria-valuenow="27"] { min-width: max-content; width: 27%; }
.progressbar-size[aria-valuenow="28"] { min-width: max-content; width: 28%; }
.progressbar-size[aria-valuenow="29"] { min-width: max-content; width: 29%; }
.progressbar-size[aria-valuenow="30"] { min-width: max-content; width: 30%; }
.progressbar-size[aria-valuenow="31"] { min-width: max-content; width: 31%; }
.progressbar-size[aria-valuenow="32"] { min-width: max-content; width: 32%; }
.progressbar-size[aria-valuenow="33"] { min-width: max-content; width: 33%; }
.progressbar-size[aria-valuenow="34"] { min-width: max-content; width: 34%; }
.progressbar-size[aria-valuenow="35"] { min-width: max-content; width: 35%; }
.progressbar-size[aria-valuenow="36"] { min-width: max-content; width: 36%; }
.progressbar-size[aria-valuenow="37"] { min-width: max-content; width: 37%; }
.progressbar-size[aria-valuenow="38"] { min-width: max-content; width: 38%; }
.progressbar-size[aria-valuenow="39"] { min-width: max-content; width: 39%; }
.progressbar-size[aria-valuenow="40"] { min-width: max-content; width: 40%; }
.progressbar-size[aria-valuenow="41"] { min-width: max-content; width: 41%; }
.progressbar-size[aria-valuenow="42"] { min-width: max-content; width: 42%; }
.progressbar-size[aria-valuenow="43"] { min-width: max-content; width: 43%; }
.progressbar-size[aria-valuenow="44"] { min-width: max-content; width: 44%; }
.progressbar-size[aria-valuenow="45"] { min-width: max-content; width: 45%; }
.progressbar-size[aria-valuenow="46"] { min-width: max-content; width: 46%; }
.progressbar-size[aria-valuenow="47"] { min-width: max-content; width: 47%; }
.progressbar-size[aria-valuenow="48"] { min-width: max-content; width: 48%; }
.progressbar-size[aria-valuenow="49"] { min-width: max-content; width: 49%; }
.progressbar-size[aria-valuenow="50"] { min-width: max-content; width: 50%; }
.progressbar-size[aria-valuenow="51"] { min-width: max-content; width: 51%; }
.progressbar-size[aria-valuenow="52"] { min-width: max-content; width: 52%; }
.progressbar-size[aria-valuenow="53"] { min-width: max-content; width: 53%; }
.progressbar-size[aria-valuenow="54"] { min-width: max-content; width: 54%; }
.progressbar-size[aria-valuenow="55"] { min-width: max-content; width: 55%; }
.progressbar-size[aria-valuenow="56"] { min-width: max-content; width: 56%; }
.progressbar-size[aria-valuenow="57"] { min-width: max-content; width: 57%; }
.progressbar-size[aria-valuenow="58"] { min-width: max-content; width: 58%; }
.progressbar-size[aria-valuenow="59"] { min-width: max-content; width: 59%; }
.progressbar-size[aria-valuenow="60"] { min-width: max-content; width: 60%; }
.progressbar-size[aria-valuenow="61"] { min-width: max-content; width: 61%; }
.progressbar-size[aria-valuenow="62"] { min-width: max-content; width: 62%; }
.progressbar-size[aria-valuenow="63"] { min-width: max-content; width: 63%; }
.progressbar-size[aria-valuenow="64"] { min-width: max-content; width: 64%; }
.progressbar-size[aria-valuenow="65"] { min-width: max-content; width: 65%; }
.progressbar-size[aria-valuenow="66"] { min-width: max-content; width: 66%; }
.progressbar-size[aria-valuenow="67"] { min-width: max-content; width: 67%; }
.progressbar-size[aria-valuenow="68"] { min-width: max-content; width: 68%; }
.progressbar-size[aria-valuenow="69"] { min-width: max-content; width: 69%; }
.progressbar-size[aria-valuenow="70"] { min-width: max-content; width: 70%; }
.progressbar-size[aria-valuenow="71"] { min-width: max-content; width: 71%; }
.progressbar-size[aria-valuenow="72"] { min-width: max-content; width: 72%; }
.progressbar-size[aria-valuenow="73"] { min-width: max-content; width: 73%; }
.progressbar-size[aria-valuenow="74"] { min-width: max-content; width: 74%; }
.progressbar-size[aria-valuenow="75"] { min-width: max-content; width: 75%; }
.progressbar-size[aria-valuenow="76"] { min-width: max-content; width: 76%; }
.progressbar-size[aria-valuenow="77"] { min-width: max-content; width: 77%; }
.progressbar-size[aria-valuenow="78"] { min-width: max-content; width: 78%; }
.progressbar-size[aria-valuenow="79"] { min-width: max-content; width: 79%; }
.progressbar-size[aria-valuenow="80"] { min-width: max-content; width: 80%; }
.progressbar-size[aria-valuenow="81"] { min-width: max-content; width: 81%; }
.progressbar-size[aria-valuenow="82"] { min-width: max-content; width: 82%; }
.progressbar-size[aria-valuenow="83"] { min-width: max-content; width: 83%; }
.progressbar-size[aria-valuenow="84"] { min-width: max-content; width: 84%; }
.progressbar-size[aria-valuenow="85"] { min-width: max-content; width: 85%; }
.progressbar-size[aria-valuenow="86"] { min-width: max-content; width: 86%; }
.progressbar-size[aria-valuenow="87"] { min-width: max-content; width: 87%; }
.progressbar-size[aria-valuenow="88"] { min-width: max-content; width: 88%; }
.progressbar-size[aria-valuenow="89"] { min-width: max-content; width: 89%; }
.progressbar-size[aria-valuenow="90"] { min-width: max-content; width: 90%; }
.progressbar-size[aria-valuenow="91"] { min-width: max-content; width: 91%; }
.progressbar-size[aria-valuenow="92"] { min-width: max-content; width: 92%; }
.progressbar-size[aria-valuenow="93"] { min-width: max-content; width: 93%; }
.progressbar-size[aria-valuenow="94"] { min-width: max-content; width: 94%; }
.progressbar-size[aria-valuenow="95"] { min-width: max-content; width: 95%; }
.progressbar-size[aria-valuenow="96"] { min-width: max-content; width: 96%; }
.progressbar-size[aria-valuenow="97"] { min-width: max-content; width: 97%; }
.progressbar-size[aria-valuenow="98"] { min-width: max-content; width: 98%; }
.progressbar-size[aria-valuenow="99"] { min-width: max-content; width: 99%; }
.progressbar-size[aria-valuenow="100"] { min-width: max-content; width: 100%; }

/* ? -------------------------------------------------------------
/* ? Accueil APICOM + Portail 2IP (gestion hauteur des cartes)
/* ? ------------------------------------------------------------- */

.dashboard-category, .widget-homepage {
  height: 95%;
}
.dashboard-category-container, .widget-homepage-container {
  justify-content: center;
}

.dashboard-group-image-container {
  width: 90px;
  height: 90px;
  padding: 1px !important;
  display: flex;
  justify-content: center;
  align-items: center;
}

.dashboard-category-image-container,
.contact-center-dashboard-image-container {
  width: 70px;
  height: 70px;
  padding: 1px !important;
  display: flex;
  justify-content: center;
  align-items: center;
}

.modal-collaborator-error-content a {
  color: #fff;
  text-decoration: underline;
  font-weight: bolder;
}

.display-hide-specific-roles {
  cursor: pointer;
}

/* ? -------------------------------------------------------------
/* ? Modal for lnk customer/team/taskGroupMdl in Customer edit
/* ? ------------------------------------------------------------- */

.collab-triple-lnk {
  --ct-modal-width: 800px !important;
}