/* input(5858,53): run-time error CSS1030: Expected identifier, found '.'
input(5858,98): run-time error CSS1025: Expected comma or open brace, found ')' */
@charset "UTF-8";
/* Generated by KB Crawl Platform on 20261013 21:31:02.788 */
/* Import du fichier de variables du site client */
/* Generated by KB Crawl Platform on 20261013 21:31:02.788 */
/**************************************************************************************************
                                    ENRICHISSEMENT COLORS BOOTSTRAP
**************************************************************************************************/
.text-default {
  color: #333333 !important;
}

.bg-text-default {
  background-color: #333333 !important;
}

.bg-text-muted {
  background-color: #999999 !important;
}

.border-text-default {
  border-color: #333333 !important;
}

.border-text-muted {
  border-color: #999999 !important;
}

/**************************************************************************************************
                            Pager
***************************************************************************************************/
.kb-pagination-counter .page-link:hover {
  color: #3B4F9E;
  cursor: default;
  background-color: transparent;
}

/**************************************************************************************************
                            FORM-CONTROL, DROP DOWN, INPUT GROUPS
***************************************************************************************************/
input.form-control, .kb-dropdown .dropdown-toggle, button.kb-multiselect {
  height: 44px;
}

.form-control, .kb-dropdown .dropdown-toggle, button.kb-multiselect {
  padding: 12px 25px 12px 25px !important;
  border: solid 1px #E7E8EB;
  font-weight: 700;
  border-radius: 8px;
  letter-spacing: 0em;
}

.form-control:focus {
  border: 1px solid #3B4F9E;
  box-shadow: 0px 1px 8px rgba(210, 193, 202, 0.45);
  border-radius: 8px;
}

.form-control.input-validation-error {
  border: solid 1px #E7E8EB;
  border-bottom: solid 1px #FF5A68 !important;
  background: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 512 512' fill='%23FF5A68'%3e%3cpath d='M256 0C114.6 0 0 114.6 0 256s114.6 256 256 256s256-114.6 256-256S397.4 0 256 0zM256 464c-114.7 0-208-93.31-208-208S141.3 48 256 48s208 93.31 208 208S370.7 464 256 464zM256 304c13.25 0 24-10.75 24-24v-128C280 138.8 269.3 128 256 128S232 138.8 232 152v128C232 293.3 242.8 304 256 304zM256 337.1c-17.36 0-31.44 14.08-31.44 31.44C224.6 385.9 238.6 400 256 400s31.44-14.08 31.44-31.44C287.4 351.2 273.4 337.1 256 337.1z'/%3e%3c/svg%3e") no-repeat top 12px right 18px !important;
  background-size: 18px 18px !important;
  background-color: #FFFFFF;
  background-size: 18px;
  padding-right: 43px !important;
  background-color: #FFFFFF !important;
}

.field-validation-error {
  padding-top: 7px;
  font-style: normal;
  font-weight: 400;
  line-height: 20px;
  color: #FF5A68;
}

.form-control.kb-search-input {
  border: 1px solid #E7E8EB;
  border-radius: 35px;
  background: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 512 512' fill='%2333364A'%3e%3cpath d='M504.1 471l-134-134C399.1 301.5 415.1 256.8 415.1 208c0-114.9-93.13-208-208-208S-.0002 93.13-.0002 208S93.12 416 207.1 416c48.79 0 93.55-16.91 129-45.04l134 134C475.7 509.7 481.9 512 488 512s12.28-2.344 16.97-7.031C514.3 495.6 514.3 480.4 504.1 471zM48 208c0-88.22 71.78-160 160-160s160 71.78 160 160s-71.78 160-160 160S48 296.2 48 208z'/%3e%3c/svg%3e") no-repeat top 12px right 18px white !important;
  background-size: 18px 18px !important;
  padding-right: 43px !important;
  background-position-y: center !important;
}

/* Alignement des zones à gauche ou à droite des input group qui bien souvent comporte des icones */
.kb-input-group .input-group-text {
  display: flex;
  vertical-align: middle;
  background: linear-gradient(1.83deg, #E7E8EB -86.76%, #FFFFFF 50.92%);
}

.kb-input-group .input-group-text.bg-primary {
  background: #3B4F9E;
}

.kb-input-group-text-left {
  border-top-left-radius: 8px;
  border-bottom-left-radius: 8px;
}

.kb-input-group-text-right {
  border-top-right-radius: 8px;
  border-bottom-right-radius: 8px;
}

/**************************************************************************************************
                                 Buttons 
***************************************************************************************************/
.btn {
  padding: 8px 16px 8px 16px !important;
  border-radius: 35px;
  font-weight: 700;
  line-height: 18px;
  outline: none !important;
}

/* Suppression le Shadow de bootstrap sur les boutons cliqués (active ou focus) */
.btn:active, .btn:focus {
  box-shadow: none !important;
}

.kb-btn-icon {
  padding-right: 8px !important;
}

.btn-sm {
  font-size: 12px !important;
  padding: 6px 16px 6px 16px !important;
}

.btn-lg {
  padding: 12px 24px 12px 24px !important;
}

.btn-lg .kb-btn-icon {
  padding-right: 12px !important;
}

/**************************************************************************************************
                                RADIO BUTTON / CHECK BOX / SWITCH
**************************************************************************************************/
.form-check .form-check-label {
  padding-left: 12px;
  color: #454456;
  font-weight: 600;
  line-height: 24px;
  margin-bottom: 0px !important;
}

.form-check .form-check-label.form-check-label-lg {
  font-size: 16px !important;
}

/* Suppression le Shadow de bootstrap sur les switch actifs (active ou focus) */
.form-check .form-check-input:active, .form-check .form-check-input:focus {
  outline: none !important;
  box-shadow: none !important;
}

.form-check .form-check-input:not(.disabled),
.form-check .form-check-label:not(.disabled) {
  cursor: pointer !important;
}

/**************************************************************************************************
                                    SPECIFIQUE SWITCH
**************************************************************************************************/
.form-switch .form-check-input {
  width: 55px !important;
  height: 29px !important;
  min-width: 55px !important;
  min-height: 29px !important;
}

.form-switch .form-check-label {
  color: #555971;
  font-weight: normal;
  font-size: 1rem;
}

.form-switch.kb-switch-sm .form-check-input {
  width: 40px !important;
  height: 21px !important;
  min-width: 40px !important;
  min-height: 21px !important;
}

.form-switch.kb-switch-sm .form-check-label {
  padding-left: 8px;
  font-size: 12px;
}

.kb-switch-description {
  color: #8D90A0;
  font-size: 0.8rem !important;
}

/**************************************************************************************************
                                SPECIFIQUE CHECKBOX & RADIO BUTTON 
**************************************************************************************************/
.form-check:not(.form-switch) input[type=checkbox], .form-check:not(.form-switch) input[type=radio] {
  height: 20px !important;
  width: 20px !important;
  min-height: 20px !important;
  min-width: 20px !important;
}

.form-check:not(.form-switch) input[type=checkbox], .form-check:not(.form-switch) input[type=radio] {
  border-width: 2px;
  border-color: #33364A;
}

.input-validation-error[type=checkbox], .input-validation-error[type=radio] {
  border-color: #FF5A68 !important;
}

/**************************************************************************************************
                                   SPECIFIQUE CHECKBOX 
**************************************************************************************************/
.form-check:not(.form-switch) input[type=checkbox]:checked {
  border: 0px;
}

.form-check:not(.form-switch) input[type=checkbox]:disabled, .form-check:not(.form-switch) input[type=checkbox][disabled] {
  border-color: #E7E8EB !important;
}

/**************************************************************************************************
                                    FORM CHECKBOX A DROIT
***************************************************************************************************/
.form-check .form-check-input.form-check-input-reverse {
  float: initial;
  margin-left: revert;
}

.form-check-input-reverse {
  margin-left: 10px !important;
}

/**************************************************************************************************
                                   SPECIFIQUE RADIO BUTTON 
**************************************************************************************************/
.form-check:not(.form-switch) input[type=radio]:checked {
  border-width: 2px;
  border-color: #3B4F9E;
}

.form-check-input:checked[type=radio] {
  background-color: #FFF !important;
  background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='-4 -4 8 8'%3e%3ccircle r='2' fill='%2333364A'/%3e%3c/svg%3e");
}

/**************************************************************************************************
                                        Composant Icon 
***************************************************************************************************/
.kb-icon {
  width: 43px;
  height: 43px;
  border-radius: 55px;
  padding: 0px !important;
}

.kb-icon.kb-icon-squre {
  border-radius: 8px !important;
}

.kb-icon:disabled, .kb-icon[disabled] {
  background-color: #F8F8FA !important;
  border-color: #F8F8FA !important;
  color: #BFC1CA !important;
}

.kb-icon.btn-sm {
  width: 30px !important;
  height: 30px !important;
}

/**************************************************************************************************
                                   Composant POPOVER
**************************************************************************************************/
.popover, .popover-body, .popover-header, .popover-body a {
  background-color: #FFFFFF !important;
  border: 1px solid #FFFFFF;
  border-radius: 8px !important;
  box-shadow: 0 1px 8px rgba(210, 193, 202, 0.45);
}

.popover.kb-popover-light, .kb-popover-light .popover-body, .kb-popover-light .popover-header {
  background-color: #F8F8FA !important;
  color: #33364A !important;
  border: 1px solid #E7E8EB;
}

.popover-header {
  padding: 3px !important;
}

.popover-header:before {
  border-bottom: 1px solid #FFFFFF !important;
}

/* la couleurs des arrow sur les popovers */
.bs-popover-top .popover-arrow:after {
  border-top-color: #FFFFFF;
}

.kb-popover-light.bs-popover-top .popover-arrow:after {
  border-top-color: #F8F8FA !important;
}

.bs-popover-bottom .popover-arrow:after {
  border-bottom-color: #FFFFFF;
}

.kb-popover-light.bs-popover-bottom .popover-arrow:after {
  border-bottom-color: #F8F8FA !important;
}

.bs-popover-start .popover-arrow:after {
  border-left-color: #FFFFFF;
}

.kb-popover-light.bs-popover-start .popover-arrow:after {
  border-left-color: #F8F8FA !important;
}

.bs-popover-end .popover-arrow:after {
  border-right-color: #FFFFFF;
}

.kb-popover-light.bs-popover-end .popover-arrow:after {
  border-right-color: #F8F8FA !important;
}

/**********************
    Popover Texte 
***********************/
.kb-popover-text {
  z-index: 10000;
}

.kb-popover-text .popover-body {
  padding: 8px 16px 8px 16px !important;
}

.kb-popover-content-title {
  font-size: 14px !important;
  font-weight: 600 !important;
  line-height: 24px !important;
  letter-spacing: 0em !important;
}

.kb-popover-content-text {
  margin-right: 6px !important;
  font-size: 14px !important;
  font-weight: 400 !important;
  line-height: 24px !important;
  letter-spacing: 0em !important;
  text-align: left !important;
}

.kb-popover-content-text-left-circle {
  margin-right: 16px !important;
  margin-left: 4px !important;
  color: #3B4F9E !important;
}

/**********************
    Popover Actions 
***********************/
.kb-popover-actions {
  max-width: 100% !important;
}

.kb-popover-actions-list-group-item, .kb-popover-actions-list-group-item a {
  background-color: #FFFFFF !important;
  text-decoration: none !important;
}

.kb-popover-actions-list-group-item:hover:not(.kb-popover-actions-list-group-item-seperator),
.kb-popover-actions-list-group-item:hover *:not(.kb-popover-actions-list-group-item-seperator) {
  color: #FFFFFF !important;
  background-color: #3B4F9E !important;
  border-radius: 8px;
}

.kb-popover-actions-list-group-item-label {
  font-size: 14px;
  font-weight: 600;
  line-height: 24px;
  letter-spacing: 0em;
}

.kb-popover-actions-list-group-item-icon {
  font-weight: 400;
  font-size: 16px;
  line-height: 18px;
}

.kb-popover-actions-list-group-item-seperator-vertical {
  border-right: 1px solid #555971;
  font-size: 22px;
  width: 24px;
  height: 0px;
  flex: none;
  order: 3;
  flex-grow: 0;
}

.kb-popover-actions-list-group-item-seperator-horizontal {
  border-bottom: 1px solid rgba(59, 79, 158, 0.2);
}

.kb-popover-actions-list-group-item-seperator:hover {
  pointer-events: none !important;
}

.kb-popover-actions-list-group-item.selected, .kb-popover-actions-list-group-item.selected a {
  background-color: #E7E8EB !important;
  border-radius: 8px;
}

.kb-popover-actions-list-group-item-compact {
  padding: 0.2rem 0.5rem !important;
}

.kb-popover-actions-list-group-item-compact .kb-popover-actions-list-group-item-label {
  font-size: 13px !important;
}

/**********************
    Popover Carousel
***********************/
.kb-popover-carousel .popover-body {
  padding: 0px !important;
}

.popover.kb-popover-carousel, .kb-popover-carousel .popover-body, .kb-popover-carousel .popover-header {
  border: 0px !important;
  border-radius: 10px 10px 8px 8px !important;
}

.kb-popover-carousel-items-image {
  background-color: #FFFFFF !important;
  border-radius: 8px 8px 0px 0px !important;
}

.kb-popover-carousel-items-title {
  font-weight: 700;
  font-size: 14px;
  line-height: 20px;
  align-items: center;
  text-align: center;
  color: #FFFFFF;
  padding-bottom: 20px !important;
}

.kb-popover-carousel-items-text {
  font-style: normal;
  font-weight: 400;
  font-size: 14px;
  line-height: 24px;
  color: #FFFFFF;
}

.kb-popover-carousel .carousel-indicators {
  position: static !important;
}

.kb-popover-carousel .carousel-indicators button {
  width: 8px;
  height: 8px;
  border-radius: 100%;
  color: #E7E8EB !important;
}

.kb-popover-carousel .carousel-indicators button.active {
  background-color: #3B4F9E !important;
}

/**************************************************************************************************
                                            TOOLTIP
                                    Surcharge Bootstrap
**************************************************************************************************/
.tooltip-inner {
  background-color: #33364A;
  box-shadow: none !important;
  opacity: 1 !important;
}

.tooltip.bs-tooltip-right .tooltip-arrow::before {
  border-right-color: #33364A !important;
  opacity: 1 !important;
}

.tooltip.bs-tooltip-left .tooltip-arrow::before {
  border-left-color: #33364A !important;
  opacity: 1 !important;
}

.tooltip.bs-tooltip-bottom .tooltip-arrow::before {
  border-bottom-color: #33364A !important;
  opacity: 1 !important;
}

.tooltip.bs-tooltip-top .tooltip-arrow::before {
  border-top-color: #33364A !important;
  opacity: 1 !important;
}

.tooltip.show {
  opacity: 1 !important;
}

/**************************************************************************************************
                                            Number Spinner 
***************************************************************************************************/
.kb-spinner-main-input-resize-icon {
  background: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 512 512' fill='%23BFC1CA'%3e%3cpath d='M512 256c0 6.688-2.812 13.09-7.719 17.62l-104 96C395.7 373.9 389.8 376 384 376c-6.469 0-12.91-2.594-17.62-7.719c-9-9.75-8.406-24.94 1.344-33.91L426.6 280H85.38l58.91 54.38c9.75 8.969 10.34 24.16 1.344 33.91C140.9 373.4 134.5 376 128 376c-5.812 0-11.66-2.094-16.28-6.375l-104-96C2.813 269.1 0 262.7 0 256s2.812-13.09 7.719-17.62l104-96C121.5 133.3 136.7 134 145.6 143.7c9 9.75 8.406 24.94-1.344 33.91L85.38 232h341.3l-58.91-54.38c-9.75-8.969-10.34-24.16-1.344-33.91C375.3 134 390.5 133.3 400.3 142.4l104 96C509.2 242.9 512 249.3 512 256z'/%3e%3c/svg%3e") no-repeat top 12px left 12px white !important;
  background-size: 18px 18px !important;
  padding-left: 43px !important;
}

/**********************
       Vertical
***********************/
.kb-spinner-vertical .form-control {
  text-align: center;
  padding: 10px 12px 10px 12px;
}

.kb-spinner-vertical {
  min-width: 130px;
}

.kb-spinner-vertical.kb-spinner-compact {
  min-width: auto !important;
}

.kb-spinner-vertical.kb-spinner-compact input.form-control {
  padding: inherit !important;
}

.kb-spinner-input-group-vertical {
  background-color: #F8F8FA;
  border: 1px solid #E7E8EB;
  border-radius: 0px 8px 8px 0px;
  width: 41px;
  height: 44px !important;
}

.kb-spinner-vertical.kb-spinner-compact .kb-spinner-input-group-vertical {
  width: 30px;
}

.kb-spinner-input-group-vertical-action {
  font-size: 14px;
  text-align: center;
}

.kb-spinner-input-group-vertical-action.disabled {
  cursor: not-allowed;
}

.kb-spinner-input-group-vertical-action:hover:not(.disabled) {
  background-color: #FFFFFF;
  border: 1px solid #E7E8EB;
  border-radius: 0px 8px 8px 0px;
}

/**********************
 Horizontal (right left)
***********************/
.kb-spinner-horizontal {
  min-width: 213px;
}

.kb-spinner-horizontal .form-control {
  text-align: center;
  padding: 10px 12px 10px 12px;
}

.kb-spinner-input-group-horizontal {
  background-color: #F8F8FA;
  border: 1px solid #E7E8EB;
  width: 64px !important;
}

.kb-spinner-input-group-horizontal-right {
  border-radius: 0px 8px 8px 0px;
}

.kb-spinner-input-group-horizontal-right:hover:not(.disabled) {
  background-color: #FFFFFF;
  border-radius: 0px 8px 8px 0px;
}

.kb-spinner-input-group-horizontal-left {
  border-radius: 8px 0px 0px 8px;
}

.kb-spinner-input-group-horizontal-left:hover:not(.disabled) {
  background-color: #FFFFFF;
  border-radius: 8px 0px 0px 8px;
}

.kb-spinner-input-group-horizontal-action {
  font-size: 14px;
  text-align: center;
}

.kb-spinner-input-group-horizontal-left.disabled, .kb-spinner-input-group-horizontal-right.disabled {
  cursor: not-allowed;
}

/**************************************************************************************************
                                        MULTISELECT DROPDOWN 
**************************************************************************************************/
.kb-multiselect.dropdown-toggle::after {
  position: absolute;
  top: 50%;
  right: 25px;
}

.kb-multiselect .multiselect-selected-text {
  float: left;
}

/* Le bouton "X" pour effacer la recherche apparaît sur Firefox, on le cache par défaut */
.multiselect-container.kb-dropdown-menu .multiselect-clear-filter {
  display: none !important;
}

.multiselect-container.kb-dropdown-menu .dropdown-item:hover,
.multiselect-container.kb-dropdown-menu .dropdown-item:focus,
.multiselect-container .multiselect-group.dropdown-item-text:hover {
  background: #FFFFFF !important;
}

.multiselect-container .multiselect-group.dropdown-item-text {
  font-size: 10px;
  font-weight: 800;
}

.multiselect.dropdown-toggle:after {
  display: block !important;
}

/**************************************************************************************************
                                                SEGMENT
**************************************************************************************************/
.kb-segment input[type=radio] {
  border: 0;
  clip: rect(0 0 0 0);
  height: 1px;
  margin: -1px;
  overflow: hidden;
  padding: 0;
  position: absolute;
  width: 1px;
}

.kb-segment .btn {
  min-height: 44px;
  border-radius: 8px;
  font-weight: 700;
  line-height: 14px;
  text-align: center;
  color: #8D90A0;
  border: solid 1px #E7E8EB;
}

.kb-segment .btn-primary {
  background-color: #3B4F9E !important;
  border-color: #3B4F9E !important;
  color: #FFFFFF !important;
}

.kb-segment-btn-text {
  padding: 6px 0px 6px 0px;
}

.kb-segment.btn-group-sm .btn {
  min-height: auto !important;
  padding: 4px 8px !important;
  font-size: 12px !important;
}

.kb-segment.btn-group-lg .btn {
  padding: 10px 20px !important;
  font-size: 18px !important;
}

/**************************************************************************************************
                                            EMPTY STATE
***************************************************************************************************/
.kb-emptystate {
  text-align: center;
  color: #999999;
  font-size: 1.7rem;
  font-weight: bold;
}

.kb-emptystate-icon {
  background-color: #999999;
  border: 1px solid #999999;
  border-radius: 75px;
  height: 10rem;
  width: 10rem;
  line-height: 10rem;
  margin-left: auto;
  margin-right: auto;
  color: #FFFFFF;
  font-size: 5rem;
}

.kb-emptystate-img {
  text-align: center;
  margin-left: auto;
  margin-right: auto;
}

/******************************************************************************************
                                       Helper TOAST
                                Commun entre client et back
******************************************************************************************/
.kb-toast-message-title {
  font-size: 16px;
  font-weight: 700;
  line-height: 20px;
  letter-spacing: 0em;
  text-align: left;
}

.fa-stack.kb-toast-message-stack-icon {
  font-size: 16px;
}

.kb-toast-message {
  left: 50%;
  top: 40%;
  transform: translate(-50%, 0px);
  position: fixed;
  z-index: 9999;
  max-width: 350px;
  min-width: 200px;
  padding: 10px 16px 10px 16px !important;
  border-radius: 8px;
}

.kb-toast-message-bg-warning {
  color: #F08A17 !important;
  background-color: #FEF5EE !important;
}

.kb-toast-message-warning, .kb-toast-message-warning .kb-toast-message-subtitle {
  color: #F08A17 !important;
}

.kb-toast-message-text {
  font-size: 16px;
  font-weight: 400;
  line-height: 24px;
  letter-spacing: 0em;
  text-align: left;
  padding-bottom: 14px;
}

.kb-toast-message-subtitle {
  font-size: 14px;
  font-weight: 400;
  line-height: 20px;
  letter-spacing: 0em;
  text-align: right;
  color: #8D90A0 !important;
}

.kb-toast-message-transparent-container {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  z-index: 2;
  opacity: 0.4;
  filter: alpha(opacity=50);
}

/**************************************************************************************************
                                            GRID
**************************************************************************************************/
/*Hauteur mini pour le grid launcher qui porte la grille, permet de bien positionner le loading */
.kb-grid-launcher {
  min-height: 150px;
}

/* Surchage sur le hover bootstrap et formatage de la table */
.kb-grid {
  --bs-table-striped-bg: none;
  --bs-table-hover-bg: none;
  border-collapse: collapse;
  margin-bottom: 0px;
  font-size: 13px;
}

/* Surcharge couleur de fond des lignes en alternance Table Striped Bootstrap */
.kb-grid.table-striped tbody tr:nth-of-type(2n) {
  background-color: #F8F8FA;
}

/* Formatage de colonnes*/
.kb-grid td {
  vertical-align: top;
  padding-bottom: 2px;
  height: 50px;
}

.kb-grid td,
.kb-grid-header th {
  padding-left: 5px;
  padding-right: 5px;
  padding-top: 12px;
  padding-bottom: 12px;
  text-align: left;
  vertical-align: middle;
}

/* Padding gauche de la première colonne */
.kb-grid td:first-child,
.kb-grid-header th:first-child {
  padding-left: 20px;
}

/* Padding droite de la dernière colonne */
.kb-grid td:last-child,
.kb-grid-header th:last-child {
  padding-right: 20px;
}

/* Formatage header */
/* Le border corrige l'affichage sous firefox (problème avec les border, affichage d'un scroll) */
.kb-grid-header {
  background-color: #F8F8FA;
  padding: 0px 0px 0px 20px;
  border: 2px solid #F8F8FA;
}

/* Liens dans le header */
.kb-grid-header th,
.kb-grid-header-link,
.kb-grid-header th.kb-grid-actions-header {
  text-transform: uppercase;
  font-weight: 700;
  font-size: 12px;
  text-decoration: none;
  white-space: nowrap;
  color: #555971;
  line-height: 16px;
}

/* Survol des liens dans le header */
.kb-grid-header-link:hover,
.kb-grid-header th.kb-grid-actions-header:hover {
  text-decoration: none;
  color: #3B4F9E;
}

/* Entrées dans une colonne en surbrillance */
.kb-grid-highlight,
.kb-grid-highlight a {
  font-weight: bold;
}

/* Action */
.kb-grid-actions-col,
.kb-grid-header th.kb-grid-actions-header {
  text-align: right !important;
}

/* Hide du caret du menu des actions */
.kb-grid-actions-col .dropdown-toggle::after {
  display: none;
}

/* Actions affichées directement dans la grille */
.kb-grid-actions-item {
  display: inline-block;
  margin-left: 5px;
  margin-right: 5px;
  text-decoration: none !important;
}

.kb-grid-actions-item a {
  text-decoration: none !important;
}

/* Menu drop down des actions, icones */
.kb-grid-actions-item .dropdown-item .fas,
.kb-grid-actions-item .dropdown-item .fa-solid,
.kb-grid-actions-item .dropdown-item .far,
.kb-grid-actions-item .dropdown-item .fa-regular,
.kb-grid-actions-item .dropdown-item .icon {
  margin-right: 8px;
}

/* Colonne de case à cocher de sélection*/
.kb-grid-selection {
  width: 30px;
}

/* Case à chocer de sélection */
.kb-grid .form-check-input {
  margin: 0 5px 0 0;
  height: 16px !important;
  width: 16px !important;
  min-height: 16px !important;
  min-width: 16px !important;
}

/* On ajoute un border transparent pour éviter les flips dus à la border de survol */
.kb-grid.table-hover tbody tr {
  border: 2px solid transparent;
}

/* Gestion du survol des lignes et colonnes */
.kb-grid.table-hover tbody tr:hover {
  border: 2px solid #3B4F9E;
  text-decoration: none;
  background-color: #FFFFFF !important;
  box-shadow: 0px -5px 12px rgba(205, 196, 201, 0.65);
}

.kb-grid.table-hover tbody tr:hover td {
  border-top: 2px solid #3B4F9E;
  border-bottom: 2px solid #3B4F9E;
  text-decoration: none;
  background-color: #FFFFFF !important;
}

/* Couleur de fond des lignes sélectionnées */
.kb-grid-selectedline {
  border: 2px solid #3B4F9E !important;
  background-color: #F4FDFC !important;
  box-shadow: 0px -5px 12px rgba(205, 196, 201, 0.65);
}

.kb-grid-selectedline td {
  border-top: 2px solid #3B4F9E !important;
  border-bottom: 2px solid #3B4F9E !important;
  background-color: #F4FDFC !important;
}

/* Mise en avant d'une ligne pour danger-incient */
.kb-grid-dangerline {
  background-color: #FFF7F7 !important;
  border: 2px solid #FF5A68 !important;
  box-shadow: 0px -5px 12px rgba(205, 196, 201, 0.65);
}

.kb-grid-dangerline.kb-grid-selectedline {
  background-color: #F4FDFC !important;
}

.kb-grid-dangerline td {
  background-color: #FFF7F7 !important;
  border-top: 2px solid #FF5A68 !important;
  border-bottom: 2px solid #FF5A68 !important;
}

.kb-grid-dangerline.kb-grid-selectedline td {
  background-color: #F4FDFC !important;
}

/*Affichage d'une favicon*/
.kb-grid-favicon {
  height: 24px;
  width: 24px;
}

/* Le style des icônes d'action dans les grids */
.kb-grid-action-icon {
  padding-bottom: 10px;
  padding-top: 10px;
}

.kb-grid-action-icon:hover {
  color: #3B4F9E !important;
}

/**************************************************************************************************
                                       GRID SETTINGS
**************************************************************************************************/
.kb-grid-settings-tab .nav-link {
  border-radius: 8px 8px 0px 0px;
  color: #4FABA9;
  font-weight: 700;
  border-top: 1px solid #E7E8EB;
  border-left: 1px solid #E7E8EB;
  border-right: 1px solid #E7E8EB;
  text-decoration: none;
}

.kb-grid-settings-tab .nav-link.active {
  background-color: #FFFFFF;
}

.kb-grid-settings-content {
  border-bottom: 1px solid #E7E8EB;
  border-left: 1px solid #E7E8EB;
  border-right: 1px solid #E7E8EB;
}

/**************************************************************************************************
                                        MENU CONTEXTUEL 
**************************************************************************************************/
/*Utlisé pour le moment sur la partie onglet*/
.kb-dropdown-menu,
.typeahead.dropdown-menu {
  background: #FFFFFF;
  border: 1px solid #E7E8EB;
  box-shadow: 0px 1px 8px rgba(210, 193, 202, 0.45);
  border-radius: 8px !important;
  padding: 20px !important;
  position: relative;
  z-index: 5000;
}

.typeahead.dropdown-menu {
  max-height: 250px;
  overflow-x: hidden;
  overflow-y: auto;
}

.kb-dropdown-menu .dropdown-item,
.kb-dropdown-button .dropdown-item,
.typeahead.dropdown-menu .dropdown-item {
  height: 44px;
  font-weight: 600 !important;
  color: #33364A !important;
  text-decoration: none;
  border: 2px solid transparent;
  display: flex;
  align-items: center;
}

.typeahead.dropdown-menu .dropdown-item {
  font-weight: 500 !important;
  display: block !important;
}

.kb-dropdown-menu .dropdown-item a {
  text-decoration: none;
}

.kb-dropdown-menu .dropdown-item:hover, .typeahead.dropdown-menu .dropdown-item:hover {
  border: 2px solid #3B4F9E;
  background: #3B4F9E;
  border-radius: 8px !important;
  color: #FFFFFF !important;
}

.typeahead.dropdown-menu .active .dropdown-item,
.typeahead.dropdown-menu .active .dropdown-item:hover {
  color: #FFFFFF !important;
}

.kb-dropdown-menu-item-action {
  background: #F8F8FA;
}

.kb-dropdown-menu .dropdown-item,
.kb-dropdown-menu-item-action {
  border-radius: 8px !important;
  margin-bottom: 2px;
}

.kb-dropdown-menu .dropdown-item.active,
.kb-dropdown-menu-item-action.active,
.multiselect-container.dropdown-menu .dropdown-item.active {
  border-radius: 8px !important;
  color: #3B4F9E !important;
  background: rgba(59, 79, 158, 0.3) !important;
}

.kb-dropdown-menu-item-text,
.kb-dropdown-menu-item-text input,
.kb-dropdown-menu-item-text label {
  font-weight: 600 !important;
  font-size: 14px !important;
  line-height: 24px !important;
  color: #33364A !important;
}

/* Décalage du menu dans une modal centré non scrollable */
.kb-modal-center-body .kb-dropdown-menu {
  transform: translate(0px, 47px) !important;
}

/**********************************
Largeur des zones dans les dropdown
***********************************/
/*Exemple : Drop down des action suplémentaires sur une grille (export, configuration...)*/
.kb-dropdown-menu-area-sm {
  width: 250px;
}

/*Exemple : Drop down des recherches sauvgardées*/
.kb-dropdown-menu-area-lg {
  width: 400px;
}

/*Exemple : Drop down des action suplémentaires sur une grille version large)*/
.kb-dropdown-menu-area-xl {
  width: 650px;
}

/*Exemple : Drop down des action suplémentaires sur une grille version large)*/
.kb-dropdown-menu-area-xxl {
  width: 800px;
}

/**************************************************************************************************
                                        DROPDOWN BUTTON
**************************************************************************************************/
.kb-dropdown-button {
  background: #FFFFFF;
  box-shadow: 0px 1px 8px rgba(210, 193, 202, 0.45);
  border-radius: 8px !important;
  padding: 5px 20px 5px 20px !important;
}

.kb-dropdown-button-primary .dropdown-item:hover {
  border: 2px solid #3B4F9E;
  background: #FFFFFF;
  border-radius: 8px !important;
}

.kb-dropdown-button-default .dropdown-item:hover,
.kb-dropdown-button-secondary .dropdown-item:hover,
.kb-dropdown-button-light .dropdown-item:hover .kb-dropdown-button-dark .dropdown-item:hover {
  border: 2px solid #8D90A0;
  background: #FFFFFF;
  border-radius: 8px !important;
}

.kb-dropdown-button-success .dropdown-item:hover {
  border: 2px solid #229954;
  background: #FFFFFF;
  border-radius: 8px !important;
}

.kb-dropdown-button-danger .dropdown-item:hover {
  border: 2px solid #c0392b;
  background: #FFFFFF;
  border-radius: 8px !important;
}

.kb-dropdown-button-warning .dropdown-item:hover {
  border: 2px solid #FF8C00;
  background: #FFFFFF;
  border-radius: 8px !important;
}

.kb-dropdown-button-info .dropdown-item:hover {
  border: 2px solid #85c1e9;
  background: #FFFFFF;
  border-radius: 8px !important;
}

.kb-dropdown-button-md {
  transform: translate(0px, 38px) !important;
}

.kb-dropdown-button-lg {
  transform: translate(0px, 47px) !important;
}

.kb-dropdown-button-sm {
  transform: translate(0px, 34px) !important;
}

.kb-dropdown-button-first-btn-left {
  padding-right: 15px !important;
}

.kb-dropdown-button-first-btn-right {
  padding-left: 10px !important;
  padding-right: 15px !important;
}

/**************************************************************************************************
                                        DATETIME PICKER
**************************************************************************************************/
/*Position de l'input date, corrige les problèmes de décalage de la pop up du calendrier*/
.kb-datetimepicker {
  position: relative;
}

/* L'ajout l'icône de calendrier sur le input avec la classe "datetimepicker-input" */
input.datetimepicker-input, input.datetimepicker-input:disabled {
  background: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 512 512' fill='%23555971'%3e%3cpath d='M96 288C96 270.3 110.3 256 128 256C145.7 256 160 270.3 160 288C160 305.7 145.7 320 128 320C110.3 320 96 305.7 96 288zM320 352C337.7 352 352 366.3 352 384C352 401.7 337.7 416 320 416C302.3 416 288 401.7 288 384C288 366.3 302.3 352 320 352zM192 288C192 274.7 202.7 264 216 264H328C341.3 264 352 274.7 352 288C352 301.3 341.3 312 328 312H216C202.7 312 192 301.3 192 288zM232 360C245.3 360 256 370.7 256 384C256 397.3 245.3 408 232 408H120C106.7 408 96 397.3 96 384C96 370.7 106.7 360 120 360H232zM152 64H296V24C296 10.75 306.7 0 320 0C333.3 0 344 10.75 344 24V64H384C419.3 64 448 92.65 448 128V448C448 483.3 419.3 512 384 512H64C28.65 512 0 483.3 0 448V128C0 92.65 28.65 64 64 64H104V24C104 10.75 114.7 0 128 0C141.3 0 152 10.75 152 24V64zM48 448C48 456.8 55.16 464 64 464H384C392.8 464 400 456.8 400 448V192H48V448z'/%3e%3c/svg%3e") no-repeat top 12px right 18px white !important;
  background-size: 18px 18px !important;
  padding-right: 43px !important;
}

/* L'ajout l'icône de calendrier sur le input avec la classe "datetimepicker-input" */
input.datetimepicker-input:disabled {
  background: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 512 512' fill='%23555971'%3e%3cpath d='M96 288C96 270.3 110.3 256 128 256C145.7 256 160 270.3 160 288C160 305.7 145.7 320 128 320C110.3 320 96 305.7 96 288zM320 352C337.7 352 352 366.3 352 384C352 401.7 337.7 416 320 416C302.3 416 288 401.7 288 384C288 366.3 302.3 352 320 352zM192 288C192 274.7 202.7 264 216 264H328C341.3 264 352 274.7 352 288C352 301.3 341.3 312 328 312H216C202.7 312 192 301.3 192 288zM232 360C245.3 360 256 370.7 256 384C256 397.3 245.3 408 232 408H120C106.7 408 96 397.3 96 384C96 370.7 106.7 360 120 360H232zM152 64H296V24C296 10.75 306.7 0 320 0C333.3 0 344 10.75 344 24V64H384C419.3 64 448 92.65 448 128V448C448 483.3 419.3 512 384 512H64C28.65 512 0 483.3 0 448V128C0 92.65 28.65 64 64 64H104V24C104 10.75 114.7 0 128 0C141.3 0 152 10.75 152 24V64zM48 448C48 456.8 55.16 464 64 464H384C392.8 464 400 456.8 400 448V192H48V448z'/%3e%3c/svg%3e") no-repeat top 12px right 18px !important;
  background-size: 18px 18px !important;
}

/* Application de notre couleur de primary sur le composant datetimepicker  */
.bootstrap-datetimepicker-widget table td.active, .bootstrap-datetimepicker-widget table td.active:hover,
.bootstrap-datetimepicker-widget table td span.active {
  background-color: #3B4F9E !important;
}

.bootstrap-datetimepicker-widget table td.today:before {
  border-bottom-color: #3B4F9E !important;
}

.bootstrap-datetimepicker-widget .timepicker .timepicker-picker a.btn {
  color: #3B4F9E !important;
}

/* La taille et style de dropdonw de datetimepicker */
.bootstrap-datetimepicker-widget.dropdown-menu {
  width: auto;
  padding: 20px !important;
  z-index: 10000;
  background: #FFFFFF !important;
  border: 1px solid #E7E8EB !important;
  box-shadow: 0px 1px 8px rgba(210, 193, 202, 0.45);
  border-radius: 8px !important;
  font-size: 1.2em;
}

/* Réduction d'espacement des bouton (de la class btn) dans le composant datetimepicker */
.bootstrap-datetimepicker-widget.dropdown-menu .table-condensed .btn {
  padding: 5px 12px 5px 12px !important;
}

/* Le bouton de AM PM sur le calendrier anglais */
.bootstrap-datetimepicker-widget.dropdown-menu .table-condensed .btn.btn-primary {
  padding: 2px !important;
  background-color: #3B4F9E !important;
  border-color: #3B4F9E !important;
  color: #FFFFFF !important;
}

/*Taille des colonnes*/
.bootstrap-datetimepicker-widget table td.day {
  height: 30px !important;
  line-height: 30px !important;
  width: 30px !important;
}

/**************************************************************************************************
                                        COLOR PICKER
                                    Surcharge composant
**************************************************************************************************/
/* Panneau principal */
.cp-color-picker {
  padding: 20px !important;
  box-sizing: border-box;
  width: 370px;
  z-index: 10000;
  background: #FFFFFF !important;
  border: 1px solid #E7E8EB !important;
  box-shadow: 0px 1px 8px rgba(210, 193, 202, 0.45);
  border-radius: 8px !important;
}

/* Panneau de droite, portant les valeurs RGB et HEX */
.cp-color-picker .cp-panel {
  line-height: 25px;
  float: right;
  padding: 0 1px 0 8px;
  margin-top: -1px;
  overflow: visible;
}

/* Input des valeurs RGB */
.cp-panel input {
  width: 60px;
  height: 25px;
  text-align: center;
  border: solid 1px #E7E8EB;
  border-radius: 8px;
  font-size: 14px;
  line-height: 25px;
  letter-spacing: 0em;
  float: right;
  margin-left: 5px;
}

/* Input del a valeur HEX */
.cp-panel .cp-HEX {
  width: 80px;
  position: absolute;
  margin: 1px -3px 0 -2px;
  font-weight: 700;
}

/* Slider vertical de sélection de couleur */
.cp-z-slider {
  width: 25px !important;
  margin-left: 10px !important;
  margin-right: 10px !important;
  height: 190px !important;
}

/* Carré de séleciton de couleur */
.cp-xy-slider {
  height: 190px !important;
  width: 190px !important;
}

/* Carré de séleciton de couleur */
.cp-xy-slider:active {
  cursor: none;
}

/* On affiche pas le slide alpha (vu qu on utilise que du HEX), pas de display : none ça à un impact sur l'affichage */
.cp-alpha {
  width: 0px !important;
}

/**************************************************************************************************
                                        BREADCRUMB
**************************************************************************************************/
/* Card : fil d'ariane */
.kb-breadcrumb a {
  text-decoration: none;
}

.kb-breadcrumb .dropdown-toggle::after {
  margin-left: 12px;
}

.kb-breadcrumb-link.badge {
  text-align: left !important;
  white-space: normal !important;
}

.kb-breadcrumb-link a, .kb-breadcrumb-link span {
  font-size: 16px !important;
  line-height: 20px;
}

/**************************************************************************************************
                                        CARDS
**************************************************************************************************/
/* Card principale, avec border transparent pour éviter les flips au survol */
.kb-card {
  width: 360px;
  border: 2px solid transparent;
  box-shadow: 0px 1px 8px rgba(210, 193, 202, 0.45);
  border-radius: 8px;
  padding: 20px;
  display: flex;
  flex-flow: column;
  background: #FFFFFF;
}

.kb-card:hover {
  border: 2px solid #3B4F9E;
  box-shadow: 0px 5px 12px rgba(205, 196, 201, 0.65);
}

.kb-card.kb-card-selected {
  background: #F4FDFC;
  border: 2px solid #3B4F9E;
}

/* Header et footer */
.kb-card-header,
.kb-card-footer {
  height: 30px;
  font-weight: 600;
  font-size: 12px;
  line-height: 20px;
}

.kb-card-header img,
.kb-card-footer img {
  height: 24px;
  width: 24px;
}

/* Taille réduite des cases à cocher sur les cards */
.kb-card .form-check:not(.form-switch) input[type=checkbox],
.kb-card .form-check:not(.form-switch) input[type=radio] {
  height: 14px !important;
  width: 14px !important;
  min-height: 14px !important;
  min-width: 14px !important;
}

/* Incidents */
.kb-card-incident {
  background-color: #FFF7F7 !important;
  box-shadow: 0px 1px 8px rgba(210, 193, 202, 0.45);
  border-radius: 8px;
}

.kb-card-incident:hover {
  border: 2px solid rgba(255, 90, 104, 0.35);
  background-color: #FFF7F7;
  box-shadow: 0px 1px 8px rgba(210, 193, 202, 0.45);
  border-radius: 8px;
}

.kb-card-incident.kb-card-selected {
  border: 2px solid rgba(255, 90, 104, 0.35);
  background-color: #FFF7F7;
  box-shadow: 0px 1px 8px rgba(210, 193, 202, 0.45);
  border-radius: 8px;
}

/* Archive */
.kb-card-archive {
  color: #8D90A0 !important;
  background-color: #FFFFFF;
}

.kb-card-archive img {
  opacity: 0.55 !important;
}

/* Card : titre d'une card */
.kb-card-title {
  font-weight: 600;
  font-size: 14px;
  line-height: 24px;
  text-overflow: ellipsis;
  display: -webkit-box;
  -webkit-line-clamp: 3;
  -webkit-box-orient: vertical;
  overflow: hidden;
}

/* Card : titre sur deux lignes max */
.kb-card-title-two-rows {
  -webkit-line-clamp: 2;
}

/* Card : titre sur trois lignes max */
.kb-card-title-three-rows {
  -webkit-line-clamp: 3;
}

/* Icone arrondie */
.kb-card-rounded-icon {
  height: 27px;
  min-width: 27px;
  display: inline-block;
}

/* Card : Sources et dossiers de sources */
/* Source : background spécifique */
.kb-card-source {
  background: #F8F8FA;
}

/*Source : première colonne d'une source : image */
.kb-card-source-image-col {
  width: 140px;
}

.kb-card-source-image {
  object-position: center;
  object-fit: cover;
  max-width: 120px;
  height: 80px;
  border-radius: 4px;
}

/* Card : Post */
/* Post : image */
.kb-card-post-image {
  object-position: center;
  object-fit: cover;
  width: 100%;
  height: 180px;
  border-radius: 4px;
}

/* Card : Thème */
/*Thème : on change le padding*/
.kb-card-theme {
  padding: 0;
}

/*Thème : margin lié au padding à zéro spécifique*/
.kb-card-theme .kb-card-footer {
  margin: 20px;
}

/*Thème : body spécifique*/
.kb-card-theme-body {
  height: 140px;
  border-top-left-radius: 5px;
  border-top-right-radius: 5px;
  font-weight: 700;
  font-size: 30px;
  line-height: 35px;
}

/**************************************************************************************************
                                        BUTTON RADION LIST GROUP
**************************************************************************************************/
.kb-radio-button-list-group-select:not(.kb-radio-button-list-group-select-compact) {
  padding: 16px !important;
  margin-bottom: 16px !important;
  border: 2px solid #E7E8EB;
  border-radius: 8px;
  color: #33364A;
}

.kb-radio-button-list-group-select.disabled {
  pointer-events: none;
  filter: none;
  opacity: 0.5;
}

.kb-radio-button-list-group-select.selected {
  border-color: #3B4F9E;
  background-color: #F4FCF9 !important;
}

.kb-radio-button-list-group-select:hover {
  border-color: #3B4F9E;
}

.kb-radio-button-list-group-select-inside *:hover,
.kb-checkbox-button-list-group-select-inside *:hover {
  cursor: pointer !important;
}

.kb-radio-button-list-group-select.selected .h3 {
  color: #3B4F9E !important;
}

.kb-radio-button-list-group-select:not(.kb-radio-button-list-group-select-compact) .kb-radio-button-list-group-select-input {
  margin-right: 16px !important;
}

.kb-radio-button-list-group-select.kb-radio-button-list-group-select-compact {
  padding: 5px !important;
  margin-bottom: 5px !important;
  border: 2px solid #E7E8EB;
  border-radius: 8px;
  color: #33364A;
  width: 240px !important;
  height: 70px !important;
  overflow: hidden;
}

.kb-radio-button-list-group-select.kb-radio-button-list-group-select-compact .kb-radio-button-list-group-select-input {
  margin-right: 5px !important;
}

/**************************************************************************************************
                                        BADGE
**************************************************************************************************/
.kb-badge {
  border-radius: 30px;
  font-style: normal;
  font-weight: 700;
  font-size: 12px;
  line-height: 20px;
}

/**************************************************************************************************
                                        CHIPS
**************************************************************************************************/
.kb-chips {
  padding: 4px 16px 4px 16px;
  border-radius: 8px;
  height: 44px !important;
  margin: 0px;
  height: auto !important;
  font-weight: 400;
}

.kb-chips.h3 {
  font-weight: 600;
  line-height: 20px;
}

.kb-chips.fw-bold {
  font-weight: 700;
}

.kb-chips.primary {
  background-color: rgba(59, 79, 158, 0.15);
  color: #3B4F9E;
  border: 1px solid white;
}

.kb-chips.primary:hover,
.kb-chips.primary:hover a,
.kb-chips.primary-selected:hover,
.kb-chips.primary-selected.selected:hover {
  color: white !important;
  background-color: #3B4F9E !important;
  text-decoration: none;
}

.kb-chips.primary a {
  color: #3B4F9E;
}

.kb-chips.primary-border {
  border: 1px solid #3B4F9E;
}

.kb-chips.primary:not(.selected):hover {
  border: 1px solid #3B4F9E;
}

.kb-chips.primary-selected.selected {
  border: 2px solid #3B4F9E !important;
  color: #3B4F9E !important;
  background-color: white !important;
}

.kb-chips.secondary {
  background-color: rgba(83, 160, 216, 0.15);
  color: #53A0D8;
  border: 1px solid white;
}

.kb-chips.secondary:hover,
.kb-chips.secondary:hover a,
.kb-chips.secondary-selected:hover,
.kb-chips.secondary-selected.selected:hover {
  color: white !important;
  background-color: #53A0D8 !important;
  text-decoration: none;
}

.kb-chips.secondary a {
  color: #53A0D8;
}

.kb-chips.secondary-border {
  border: 1px solid #53A0D8;
}

.kb-chips.secondary:not(.selected):hover {
  border: 1px solid #53A0D8;
}

.kb-chips.secondary-selected.selected {
  border: 2px solid #53A0D8;
  color: #53A0D8;
  background-color: white !important;
}

.kb-chips.success {
  background-color: #F4FCF9;
  color: #1BA88E;
  border: 1px solid #FFFFFF;
}

.kb-chips.success:hover,
.kb-chips.success:hover a,
.kb-chips.success-selected:hover,
.kb-chips.success-selected.selected:hover {
  color: #FFFFFF !important;
  background-color: #1BA88E !important;
  text-decoration: none;
}

.kb-chips.success a {
  color: #1BA88E;
}

.kb-chips.success-border {
  border: 1px solid #1BA88E;
}

.kb-chips.success:not(.selected):hover {
  border: 1px solid #1BA88E;
}

.kb-chips.success-selected.selected {
  border: 2px solid #1BA88E;
  color: #1BA88E;
  background-color: #FFFFFF !important;
}

.kb-chips.info {
  background-color: #ebf5fb;
  color: #85c1e9;
  border: 1px solid #FFFFFF;
}

.kb-chips.info:hover,
.kb-chips.info:hover a,
.kb-chips.info-selected:hover,
.kb-chips.info-selected.selected:hover {
  color: #FFFFFF !important;
  background-color: #85c1e9 !important;
  text-decoration: none;
}

.kb-chips.info a {
  color: #85c1e9;
}

.kb-chips.info-border {
  border: 1px solid #a1cfee;
}

.kb-chips.info:not(.selected):hover {
  border: 1px solid #85c1e9;
}

.kb-chips.info-selected.selected {
  border: 2px solid #a1cfee;
  color: #a1cfee;
  background-color: #FFFFFF !important;
}

.kb-chips.warning {
  background-color: #FEF5EE;
  color: #F08A17;
  border: 1px solid #FFFFFF;
}

.kb-chips.warning:hover,
.kb-chips.warning:hover a,
.kb-chips.warning-selected:hover,
.kb-chips.warning-selected.selected:hover {
  color: #FFFFFF !important;
  background-color: #F08A17 !important;
  text-decoration: none;
}

.kb-chips.warning a {
  color: #F08A17;
}

.kb-chips.warning-border {
  border: 1px solid #FFB25B;
}

.kb-chips.warning:not(.selected):hover {
  border: 1px solid #F08A17;
}

.kb-chips.warning-selected.selected {
  border: 2px solid #FFB25B;
  color: #F08A17;
  background-color: #FFFFFF !important;
}

.kb-chips.danger {
  background-color: #FFF7F7;
  color: #FF5A68;
  border: 1px solid #FFFFFF;
}

.kb-chips.danger:hover,
.kb-chips.danger:hover a,
.kb-chips.danger-selected:hover,
.kb-chips.danger-selected.selected:hover {
  color: #FFFFFF !important;
  background-color: #FF5A68 !important;
  text-decoration: none;
}

.kb-chips.danger a {
  color: #FF5A68;
}

.kb-chips.danger-border {
  border: 1px solid #ff808b;
}

.kb-chips.danger:not(.selected):hover {
  border: 1px solid #FF5A68;
}

.kb-chips.danger-selected.selected {
  border: 2px solid #ff808b;
  color: #FF5A68;
  background-color: #FFFFFF !important;
}

.kb-chips.dark {
  background-color: #F8F8FA;
  color: #33364A;
  border: 1px solid #FFFFFF;
}

.kb-chips.dark:hover,
.kb-chips.dark:hover a,
.kb-chips.dark-selected:hover,
.kb-chips.dark-selected.selected:hover {
  color: #FFFFFF !important;
  background-color: #33364A !important;
  text-decoration: none;
}

.kb-chips.dark a {
  color: #33364A;
}

.kb-chips.dark-border {
  border: 1px solid #555971;
}

.kb-chips.dark:not(.selected):hover {
  border: 1px solid #33364A;
}

.kb-chips.dark-selected.selected {
  border: 2px solid #555971;
  background-color: #FFFFFF !important;
}

.kb-chips.default {
  background-color: #FFFFFF;
  color: #33364A;
  border: 1px solid #E7E8EB;
}

.kb-chips.default:hover,
.kb-chips.default:hover a,
.kb-chips.default-selected:hover,
.kb-chips.default-selected.selected:hover {
  color: #FFFFFF !important;
  background-color: #555971 !important;
  text-decoration: none;
}

.kb-chips.default a {
  color: #33364A;
}

.kb-chips.default-border {
  border: 1px solid #BFC1CA;
}

.kb-chips.default:not(.selected):hover {
  border: 1px solid #555971;
}

.kb-chips.default-selected.selected {
  border: 2px solid #555971;
  background-color: #FFFFFF !important;
}

.kb-chips-prepend-action-space {
  margin-right: 8px;
}

.kb-chips-append-action-space {
  margin-left: 8px;
}

/**************************************************************************************************
                                        CHOICE BLOCK
**************************************************************************************************/
.kb-choice-block-col-auto {
  margin-bottom: 15px;
}

.kb-choice-block-hide-actions-text {
  font-size: 1.15rem;
}

.kb-choice-block-container {
  background: #FFFFFF;
  box-shadow: 0px 1px 8px rgba(210, 193, 202, 0.45);
  border-radius: 8px;
  height: 100%;
  width: 230px;
  border: 2px solid transparent;
  padding: 14px !important;
}

.kb-choice-block-container.kb-choice-block-container-small {
  width: auto !important;
  padding: 2px !important;
}

.kb-choice-block-container.kb-choice-block-container-small .kb-choice-block-icon-item {
  font-size: 1.25em !important;
}

.kb-choice-block-container.kb-choice-block-container-small .kb-choice-block-text {
  margin-bottom: 0px !important;
}

.kb-choice-block-container.kb-multi-choice-block-container {
  padding: 10px !important;
}

.kb-choice-block-container a {
  text-decoration: none;
}

.kb-choice-block-container h3 {
  margin-right: 14px;
  text-overflow: ellipsis;
  display: -webkit-box;
  -webkit-box-orient: vertical;
  overflow: hidden;
  -webkit-line-clamp: 3;
}

.kb-choice-block-container.kb-choice-block-container-small h3 {
  font-size: 1.1rem !important;
  font-weight: 700;
  margin-right: 5px !important;
}

.kb-choice-block-container h3,
.kb-choice-block-container .kb-choice-block-icon {
  color: #33364A;
}

.kb-choice-block-container:hover {
  border: 2px solid #3B4F9E;
  box-shadow: 0px 5px 12px rgba(205, 196, 201, 0.65);
}

.kb-choice-block-container.selected,
.kb-light-rounded-zone.selected {
  background-color: #F4FCF9;
  border: 2px solid #3B4F9E;
}

.kb-choice-block-container.selected h3,
.kb-choice-block-container.selected .kb-choice-block-icon {
  color: #4FABA9;
}

.kb-choice-block-container-full-size {
  width: 100% !important;
}

.kb-choice-block-icon {
  height: 44px !important;
  width: 44px !important;
  margin-right: 12px !important;
}

.kb-choice-block-container.kb-choice-block-container-small .kb-choice-block-icon {
  height: 30px !important;
  width: 30px !important;
  margin-right: 5px !important;
}

/**************************************************************************************************
                                    TYPEAHEAD => PERSONNALISE POUR KB 
        Il suffit d'ajouter la classe ".kb-dropdown-menu" dans le template de typeahead 
        A voir la page des composants sur l'exemple de Typeahead autocomplete 
**************************************************************************************************/
.typeahead.dropdown-menu {
  position: absolute !important;
}

.typeahead.dropdown-menu .dropdown-item {
  height: auto !important;
}

.typeahead.dropdown-menu .dropdown-item {
  height: auto !important;
  border-radius: 8px;
  margin-bottom: 5px !important;
}

/**************************************************************************************************
                                          ARBRES JSTREE
                                  Surcharge du composant JSTree
**************************************************************************************************/
/*Colonne qui contient l'arbre, border à droite symbolisant le grid de redimensionnement*/
.kb-tree-col {
  width: 400px;
  border-right: 6px solid #F8F8FA;
}

/*Ecran plus petit, on réduit la largeur*/
@media (max-width: 1600px) {
  .kb-tree-col {
    width: 300px;
    border-right: 6px solid #F8F8FA;
  }
}
/*Arbre*/
.kb-tree {
  overflow: auto;
  padding-right: 10px;
}

.kb-tree .jstree-anchor:hover {
  background-color: #F8F8FA;
}

.kb-tree .jstree-hovered {
  background-color: #F8F8FA !important;
}

/*Contenu du noeud (icones et textes)*/
.kb-tree a {
  height: 35px !important;
  padding: 5px 15px !important;
  line-height: normal !important;
  border: 2px solid transparent;
}

/*Elément sélectionné*/
.kb-tree .jstree-clicked {
  background: #F8F8FA;
  border: 2px solid #3B4F9E;
  border-radius: 8px;
}

/*Affichage des éléments recherchés*/
.kb-tree .jstree-search {
  color: #53A0D8 !important;
}

/*Classe d'une icone à placer sur le icon lors de la contruction de l'arbre*/
.kb-tree-icon {
  font-size: 16px !important;
}

.kb-tree .jstree-icon {
  vertical-align: middle;
}

/*Alerte*/
.kb-tree-alert {
  color: #3B4F9E !important;
}

/*Warning*/
.kb-tree-warning {
  color: #FF8C00 !important;
}

/*Incident*/
.kb-tree-incident {
  color: #c0392b !important;
}

/*Texte principal d'un dossier*/
.kb-tree-text-folder {
  font-weight: 700;
  font-size: 14px;
  line-height: 20px;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

/*Texte principal d'une source*/
.kb-tree-text-source {
  font-weight: normal;
  font-size: 14px;
  line-height: 20px;
  white-space: nowrap;
}

/*Texte présent sous le texte prinicpal. Margin left prend en compte les checkbox*/
.kb-tree-text-sub-title {
  white-space: nowrap;
  font-size: 0.8em;
  display: block;
  margin-top: -2px;
  margin-left: 30px;
}

/*Informations présentes mais cachées, comme les metas, permet de faire une recherche dans l'arbre*/
.kb-tree-info-hidden {
  display: none;
}

/*
Gestion des dossiers, changement des icones sur ouverture et fermeture
Icone sur dossier "fermé"
*/
.kb-tree .jstree-closed > * > .kb-tree-icon-folder:before,
.kb-tree .jstree-node > * > .kb-tree-icon-folder:before {
  font-family: "Font Awesome 6 Pro", "Font Awesome 6 Regular", "Font Awesome 6 Brands", "Arial";
  content: "\e185";
  display: inline-block;
  text-rendering: auto;
  -webkit-font-smoothing: antialiased;
  font-style: normal;
}

/*
Gestion des dossiers, changement des icones sur ouverture et fermeture
Icone sur dossier "ouvert"
*/
.kb-tree .jstree-open > * > .kb-tree-icon-folder:before {
  font-family: "Font Awesome 6 Pro", "Font Awesome 6 Regular", "Font Awesome 6 Brands", "Arial";
  content: "\f07c";
  display: inline-block;
  text-rendering: auto;
  -webkit-font-smoothing: antialiased;
  font-style: normal;
}

/*
Gestion des carrets sur l'arbre, remplacement par du Font Awesome  
Icone sur noeud "ouvert", on supprime le background par défaut JSTree
*/
.kb-tree .jstree-open > .jstree-ocl {
  background-image: none;
}

.kb-tree .jstree-open > .jstree-ocl:before {
  font-family: "Font Awesome 6 Pro", "Font Awesome 6 Solid", "Font Awesome 6 Brands", "Arial";
  font-size: 22px;
  content: "\f107";
  display: inline-block;
  text-rendering: auto;
  font-style: normal;
  margin-top: 4px;
  margin-right: 5px;
}

/*
Gestion des carrets sur l'arbre, remplacement par du Font Awesome  
Icone sur noeud "fermé", on supprime le background par défaut JSTree
*/
.kb-tree .jstree-closed > .jstree-ocl {
  background-image: none;
}

.kb-tree .jstree-closed > .jstree-ocl:before {
  font-family: "Font Awesome 6 Pro", "Font Awesome 6 Regular", "Font Awesome 6 Brands", "Arial";
  font-size: 22px;
  content: "\f105";
  display: inline-block;
  text-rendering: auto;
  font-style: normal;
  margin-top: 4px;
  margin-right: 5px;
}

/*Suppression des trait et ligne de l'arbre représentant l'arborésance*/
.kb-tree .jstree-leaf > .jstree-ocl,
.kb-tree .jstree-node {
  background-image: none;
}

/*Gestion des checkbox de l'arbre, pris sur les check box bootstrap*/
.kb-tree .jstree-checkbox {
  background-position: center;
  background-color: #fff;
  background-repeat: no-repeat;
  background-position: center;
  background-size: contain;
  border: 1px solid rgba(0, 0, 0, 0.25);
  background-image: none;
  height: 16px !important;
  width: 16px !important;
  min-height: 16px !important;
  min-width: 16px !important;
  border-radius: 0.25em;
  margin-right: 5px;
}

/*
Gestion des checkbox de l'arbre, pris sur les check box bootstrap
Case cochée
*/
.kb-tree .jstree-checked > .jstree-checkbox,
.kb-tree .jstree-checkbox-selection .jstree-clicked > .jstree-checkbox:hover,
.kb-tree .jstree-checked > .jstree-checkbox:hover {
  background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 20 20'%3e%3cpath fill='none' stroke='%23fff' stroke-linecap='round' stroke-linejoin='round' stroke-width='3' d='M6 10l3 3l6-6'/%3e%3c/svg%3e");
  background-position: center;
  background-color: #3B4F9E;
  border-color: #3B4F9E;
  height: 16px !important;
  width: 16px !important;
  min-height: 16px !important;
  min-width: 16px !important;
  border-radius: 0.25em;
  margin-right: 5px;
}

/*
Gestion des checkbox de l'arbre, pris sur les check box bootstrap
Case en statut intermédiaire
*/
.kb-tree .jstree-anchor > .jstree-undetermined,
.kb-tree .jstree-anchor > .jstree-undetermined:hover {
  background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 20 20'%3e%3cpath fill='none' stroke='%23fff' stroke-linecap='round' stroke-linejoin='round' stroke-width='3' d='M6 10h8'/%3e%3c/svg%3e");
  background-position: center;
  background-color: #3B4F9E;
  border-color: #3B4F9E;
  height: 16px !important;
  width: 16px !important;
  min-height: 16px !important;
  min-width: 16px !important;
  border-radius: 0.25em;
  margin-right: 5px;
}

/*Menu contextuel d'un arbre*/
.vakata-context {
  z-index: 1100 !important;
}

.vakata-context.jstree-contextmenu,
.vakata-context.jstree-contextmenu ul {
  background: #FFFFFF;
  border: 1px solid #E7E8EB;
  box-shadow: 0px 1px 8px rgba(210, 193, 202, 0.45);
  border-radius: 8px !important;
  padding: 20px !important;
  z-index: 5000;
}

.vakata-context.jstree-contextmenu a {
  height: 44px;
  font-weight: 600 !important;
  font-size: 14px !important;
  line-height: 24px !important;
  color: #33364A !important;
  text-decoration: none;
  border: 2px solid transparent;
  display: flex;
  align-items: center;
}

.vakata-context.jstree-contextmenu a:hover,
.vakata-context .vakata-context-hover > a {
  border: 2px solid #3B4F9E;
  background: #FFFFFF;
  border-radius: 8px !important;
}

/*Suppression du séparateur d'icone*/
.vakata-context li > a .vakata-contextmenu-sep {
  margin: 0;
  border-left: none;
}

/*L'image du carret à droite est cachée par le .vakata-context.jstree-contextmenu a:hover, on le place en important*/
.vakata-context li > a.vakata-context-parent {
  background-image: url(data:image/gif;base64,R0lGODlhCwAHAIAAACgoKP///yH5BAEAAAEALAAAAAALAAcAAAIORI4JlrqN1oMSnmmZDQUAOw==) !important;
  background-position: right center !important;
  background-repeat: no-repeat !important;
}

/*Separateur*/
.vakata-context-separator a {
  border: 1px solid #F8F8FA !important;
}

.vakata-context-separator a:hover {
  border: 1px solid #F8F8FA !important;
}

.vakata-context ul {
  margin-top: -5.5em;
}

.kb-tree .jstree-loading {
  font-size: 16px;
  vertical-align: middle;
  display: flex;
  align-items: center;
}

.kb-tree .jstree-loading a {
  display: flex;
  align-items: center;
}

/**************************************************************************************************
                                Helper Export File Modal
**************************************************************************************************/
.kb-modal-center-export-file {
  width: 400px !important;
}

/**************************************************************************************************
                                        Progress bar
**************************************************************************************************/
.kb-progress {
  height: 2rem;
  font-size: 1rem;
  font-weight: bold;
}

/**************************************************************************************************
                   SELECTION DE JOURS DANS UNE SEMAINE
***************************************************************************************************/
.kb-day-selector-group label {
  height: 35px !important;
  width: 35px !important;
  font-size: 14px;
  padding: 0px !important;
  margin: 0px !important;
  display: table-cell;
  vertical-align: middle;
}

.kb-day-selector-group .btn-outline-primary {
  background-color: #FFFFFF !important;
  border-color: #BFC1CA !important;
  color: #33364A !important;
}

.kb-day-selector-group .btn-check:checked + .btn-outline-primary,
.kb-day-selector-group .btn-check:active + .btn-outline-primary,
.kb-day-selector-group .btn-outline-primary:active,
.kb-day-selector-group .btn-outline-primary.active,
.kb-day-selector-group .btn-outline-primary.dropdown-toggle.show {
  color: #FFFFFF !important;
  background-color: #3B4F9E !important;
  border-color: #3B4F9E !important;
}

.kb-day-selector-group .btn {
  border-radius: 50% !important;
}

/**************************************************************************************************
                                    MULTI SELECTION DE TAGS
**************************************************************************************************/
.kb-chips.kb-tag-multiselection-item {
  border: 1px solid #3B4F9E;
  background-color: #3B4F9E;
  color: #FFFFFF;
  cursor: move;
  display: inline-block;
  font-size: 1.1rem !important;
  margin-right: 5px;
}

.kb-chips.kb-tag-multiselection-item > * a {
  color: #FFFFFF;
}

.kb-tag-multiselection-item-inactive {
  background-color: #FFFFFF !important;
  border: 1px solid #cfcfcf !important;
  text-decoration: line-through !important;
}

.kb-tag-multiselection-item-inactive, .kb-tag-multiselection-item-inactive > * a {
  color: #3B4F9E !important;
}

.kb-tag-multiselection-item-smart {
  background-color: #FF8C00 !important;
  border: 1px solid #FF8C00 !important;
  color: #FFFFFF !important;
}

.kb-tag-multiselection-item-smart > * a {
  color: #FFFFFF !important;
}

.kb-tag-multiselection-item-smart.kb-tag-multiselection-item-inactive {
  background-color: #FF8C00 !important;
  border: 1px solid #FF8C00 !important;
  color: #33364A !important;
}

.kb-tag-multiselection-item-smart.kb-tag-multiselection-item-inactive > * a {
  color: #33364A !important;
}

.kb-tag-multiselection-item-highlight {
  background-color: #229954 !important;
  border: 1px solid #229954 !important;
  color: #FFFFFF !important;
}

.kb-tag-multiselection-item-highlight > * a {
  color: #FFFFFF !important;
}

.kb-tag-multiselection-item span {
  margin-left: 2px;
  margin-right: 2px;
}

.kb-tag-multiselection-no-checkbox > i.jstree-checkbox {
  display: none;
}

.kb-tag-multiselection-item.kb-chips.h3 {
  font-weight: 400 !important;
}

/**************************************************************************************************
                                KB BOOTSTRAP SELECT
***************************************************************************************************/
/*Attention, le select ne doit pas être display none, sinon la validation ne se fait pas.*/
/*On met le select inital derrière le composant.*/
.kb-dropdown select {
  position: absolute !important;
  bottom: 0;
  left: 50%;
  display: block !important;
  width: 0.5px !important;
  height: 100% !important;
  padding: 0 !important;
  opacity: 0 !important;
  border: none;
  z-index: 0 !important;
}

.kb-dropdown ul.kb-dropdown-menu {
  min-width: 100% !important;
  overflow: auto;
  overflow-x: hidden;
}

.kb-dropdown .dropdown-toggle {
  width: 100%;
  text-align: left !important;
}

.kb-dropdown .dropdown-toggle div {
  -webkit-line-clamp: 1;
  -webkit-box-orient: vertical;
  overflow: hidden;
  margin-right: 8px !important;
  text-overflow: ellipsis;
}

.kb-dropdown .dropdown-toggle:after {
  display: block !important;
}

.kb-dropdown .dropdown-toggle::after {
  position: absolute;
  top: 50%;
  right: 25px;
}

.kb-dropdown-menu .kb-dropdown-item.dropdown-item {
  min-height: 44px !important;
  height: auto !important;
}

/**************************************************************************************************
                                KB NAVBAR
***************************************************************************************************/
.kb-navbar {
  height: 50px;
}

.kb-navbar .nav-link {
  font-weight: 700;
  color: #33364A !important;
  font-size: 14px;
  padding-left: 0 !important;
  padding-right: 20px !important;
}

.kb-navbar .nav-link:hover {
  cursor: pointer;
}

.kb-navbar .nav-link.active {
  color: #4FABA9 !important;
}

.kb-navbar .nav-item:hover,
.kb-navbar .nav-link:hover {
  color: #4FABA9 !important;
  text-decoration: none;
}

.kb-navbar .nav-item {
  position: relative;
  margin-bottom: 30px;
}

.kb-navbar .nav-link.active:after {
  content: "";
  position: absolute;
  background-color: #3B4F9E !important;
  width: 30px !important;
  height: 3px !important;
  top: 40px;
  left: 0;
}

.kb-tabs .nav-link.disabled {
  color: #BFC1CA !important;
}

/**************************************************************************************************
                                KB TABS (se placent à gauche)
**************************************************************************************************/
.kb-tabs {
  max-width: 250px;
}

.kb-tabs .nav-link {
  font-style: normal;
  font-weight: 700;
  font-size: 16px;
  line-height: 20px;
  width: 200px;
  color: #33364A;
  width: 100%;
  border: 2px solid transparent;
  border-radius: 8px 0px 0px 8px;
  padding-left: 20px;
  padding-right: 20px;
}

.kb-tabs .nav-link:hover {
  border: 2px solid #3B4F9E;
  text-decoration: none;
  border-radius: 8px 0px 0px 8px;
}

.kb-tabs .nav-link.active {
  color: #FFFFFF;
  background-color: #3B4F9E;
}

.kb-tabs-content {
  border-left: 1px solid #E7E8EB;
  padding-left: 30px !important;
  padding-right: 10px !important;
}

/**************************************************************************************************
                                            PILLS
**************************************************************************************************/
.kb-pills .nav-link {
  font-style: normal;
  font-weight: 700;
  font-size: 16px;
  line-height: 20px;
  width: 200px;
  color: #33364A;
  width: 100%;
  border: 2px solid transparent;
  border-radius: 8px;
  padding: 13px 20px 13px 20px;
}

.kb-pills .nav-link:hover {
  border: 2px solid #3B4F9E;
  text-decoration: none;
}

.kb-pills .nav-link.active {
  color: #FFFFFF;
  background-color: #3B4F9E;
}

.kb-pills-tab-content .tab-pane {
  border-left: 5px solid #4FABA9;
  padding: 20px 25px 20px 25px;
  border-top: 1px solid #E7E8EB;
  border-bottom: 1px solid #E7E8EB;
  border-right: 1px solid #E7E8EB;
  border-radius: 8px;
}

.kb-pills-tab-content .tab-pane.tab-pane-warning {
  border-left: 5px solid #F08A17;
}

.kb-pills-tab-content .tab-pane.tab-pane-info {
  border-left: 5px solid #85c1e9;
}

.kb-pills-tab-content .tab-pane.tab-pane-danger {
  border-left: 5px solid #c0392b;
}

.kb-pills-tab-content .tab-pane.tab-pane-success {
  border-left: 5px solid #229954;
}

/******************************************************************************************
                                     Modal de Popover
******************************************************************************************/
.kb-modal-popover {
  max-height: 450px;
  overflow: auto;
}

/**************************************************************************************************
                                          SCROLL BACK TO TOP
**************************************************************************************************/
.kb-scroll-back-to-top {
  width: 3.5rem;
  height: 3.5rem;
  position: fixed;
  bottom: 2.5rem;
  right: 3.8rem;
  cursor: pointer;
  text-align: center;
  display: none;
  padding: 0.6rem;
  z-index: 110;
  border-radius: 100%;
  background-color: #3B4F9E;
  color: #fff;
  font-size: 1.5rem;
}

/**************************************************************************************************
                                                CURSORS
**************************************************************************************************/
.kb-cursor-pointer {
  cursor: pointer;
}

.kb-cursor-alias {
  cursor: alias;
}

.kb-cursor-move {
  cursor: move;
}

/**************************************************************************************************
                                                ALERTS
**************************************************************************************************/
.kb-alert-info {
  box-shadow: 0 1px 8px rgba(210, 193, 202, 0.45);
  border-radius: 8px;
  background-color: #ebf5fb;
}

.kb-alert-primary {
  box-shadow: 0 1px 8px rgba(210, 193, 202, 0.45);
  border-radius: 8px;
  background-color: #DCF5F5;
  color: #4FABA9;
}

.kb-alert-warning {
  box-shadow: 0 1px 8px rgba(210, 193, 202, 0.45);
  border-radius: 8px;
  background-color: #FEF5EE;
  color: #F08A17;
}

.kb-alert-danger {
  box-shadow: 0 1px 8px rgba(210, 193, 202, 0.45);
  border-radius: 8px;
  background-color: #FFF7F7;
  color: #FF5A68;
}

/**************************************************************************************************
                            MODAL DIALOG : BASE + CENTER + CUSTOM HEIGHT
**************************************************************************************************/
/* 
    Pour les modals qui sont très importantes à l'affichage (avec une z-index plus élevée que les modal de center et right) 
    Cas d'utilisation : Quand nous voulons d'afficher une 3eme modal à afficher, il faut mettre cette classe sur votre modal
*/
.kb-modal-dialog {
  z-index: 1055 !important;
}

/* 
    Pour les modals au centre d'écran => une importance moins faible que la modal NORMALE mais plus élevée que celle à droit 
    Cas d'utilisation : Dans les modal au centre qui ont peut-etre une autre modal à afficher au dessus 
                        (ou votre modal n'est pas la modal de fin et il y a une possibilité d'avoir une autre modal au dessus)
*/
.kb-modal-center {
  z-index: 1054 !important;
}

.kb-modal-center-content {
  background: #FFFFFF;
  border: 1px solid rgba(0, 0, 0, 0.1) !important;
  box-shadow: 0px 10px 20px rgba(0, 0, 0, 0.3) !important;
  border-radius: 8px !important;
  padding: 24px 24px 32px;
}

.kb-modal-center-header {
  border: none;
  padding-left: 15px;
  padding-right: 15px;
  padding-top: 0;
  padding-bottom: 0;
}

.kb-modal-center-header .btn-close {
  position: absolute;
  right: 20px;
}

.kb-modal-center-title {
  width: 100%;
  font-weight: 700;
  font-size: 20px;
  line-height: 35px;
  color: #33364A !important;
}

.kb-modal-center-body {
  text-align: center;
  padding: 2rem;
  font-weight: 400;
  font-size: 14px;
  line-height: 24px;
  color: #33364A !important;
}

.kb-modal-center-body p {
  margin: 0;
}

.kb-modal-center-footer {
  border: none;
  margin-left: auto;
  margin-right: auto;
  padding: 0 !important;
}

.kb-modal-center-footer button {
  margin-left: 5px;
  margin-right: 5px;
}

/* Modal avec height min à 80 % */
.kb-modal-minheight80 {
  min-height: 80%;
}

/**************************************************************************************************
                                                CHARTS
**************************************************************************************************/
.kb-chart-conten {
  min-height: 150px;
}

/**************************************************************************************************
                                        STATISTIQUES
**************************************************************************************************/
/* Tableau de répartition à la semaine sur des jours et heures */
.kb-statistic-week-timetable-day table.table tbody tr td,
.kb-statistic-week-timetable-day table.table thead tr th,
.kb-statistic-week-timetable-day table.table tbody tr th,
.kb-statistic-week-timetable-day table.table thead {
  border-left: 4px solid #FFFFFF;
  border-right: 4px solid #FFFFFF;
}

.kb-statistic-week-timetable-day table.table thead tr th {
  border-bottom: 4px solid #FFFFFF;
}

.kb-statistic-week-timetable-clickable-hour {
  cursor: pointer;
}

/**************************************************************************************************
                                          LOADING 
**************************************************************************************************/
.kb-loading {
  background: rgba(255, 255, 255, 0.5);
  border: 1px solid rgba(59, 79, 158, 0.1);
  border-radius: 8px;
  padding: 10px 20px 10px 20px;
  box-shadow: 0 1px 8px rgba(210, 193, 202, 0.45);
}

.kb-loading-body-center {
  position: fixed;
  top: 50%;
  left: 50%;
  display: block;
  opacity: 1;
  z-index: 1055;
}

.kb-loading-body-top {
  position: fixed;
  top: 7rem;
  left: 50%;
  display: block;
  opacity: 1;
  z-index: 1055;
}

.kb-loading-body-bottom {
  position: fixed;
  bottom: 3rem;
  left: 50%;
  display: block;
  opacity: 1;
  z-index: 1055;
}

.kb-loading-element-center {
  position: absolute;
  top: 50%;
  left: 50%;
  display: block;
  opacity: 1;
  z-index: 1049;
}

.kb-loading-element-top {
  position: absolute;
  top: 1rem;
  left: 50%;
  display: block;
  opacity: 1;
  z-index: 1049;
}

.kb-loading-element-bottom {
  position: absolute;
  bottom: 1rem;
  left: 50%;
  display: block;
  opacity: 1;
  z-index: 1049;
}

.kb-loading-icon {
  --fa-secondary-color: #E7E8EB !important;
}

/*Voile de chargement appliqué sur un élément*/
.kb-loading-opacity {
  position: relative;
  opacity: 0.5;
  pointer-events: none;
}

/**************************************************************************************************
                                          MENU UTILISATEUR
**************************************************************************************************/
.layout-header-user-menu-action {
  padding: 5px 10px;
}

.layout-header-user-menu-action:hover {
  text-decoration: none;
  box-shadow: 0 3px 10px rgba(0, 0, 0, 0.2);
  border-radius: 8px;
}

/**************************************************************************************************
                                         POSITION MODAL
**************************************************************************************************/
.kb-modal-position-button {
  background-color: #FFFFFF !important;
  border: 1px solid #BFC1CA !important;
  color: #33364A !important;
  border-radius: 35px;
  padding: 8px 16px 8px 16px !important;
}

.kb-modal-position-button .kb-modal-position-selected {
  color: #78D0CE !important;
}

.kb-dropdown-menu .dropdown-item.kb-modal-position-selected {
  color: #78D0CE !important;
}

/**************************************************************************************************
                                         CALENDRIER
**************************************************************************************************/
.kb-calendar .ec-main {
  border: none;
  box-shadow: 0 1px 8px rgba(210, 193, 202, 0.45);
  border-radius: 8px;
  background: #fff;
}

.kb-calendar .ec-event-title {
  font-size: 15px;
}

.kb-calendar .ec-event {
  box-shadow: 0 5px 15px rgba(0, 0, 0, 0.35);
  padding: 5px;
  border-radius: 5px;
  margin-left: 2px;
}

.kb-calendar .ec-list .ec-event {
  margin-top: 5px;
  margin-bottom: 5px;
  box-shadow: none;
  background-color: transparent !important;
}

.kb-calendar .ec-event:hover {
  box-shadow: 0 5px 15px rgba(0, 0, 0, 0.55);
}

.kb-calendar .ec-col-head.ec-today,
.kb-calendar .ec-list .ec-today .ec-day-head {
  font-weight: bold;
}

.kb-calendar .ec-event.ec-preview {
  background-color: #85c1e9 !important;
  border: none;
}

.kb-calendar .ec-event-tag {
  display: none;
}

.kb-calendar .ec-list .ec-day-head,
.kb-calendar .ec-col-head,
.kb-calendar .ec-sidebar {
  background-image: none !important;
  background-color: #F8F8FA !important;
}
@charset "UTF-8";
/* Generated by KB Crawl Platform on 20261013 21:31:02.788 */
/* Import du fichier de variables du site */
/* Generated by KB Crawl Platform on 20261013 21:31:02.788 */
/******************************************************************************************
                                TAILLE POLICE PAR DEFAUT
******************************************************************************************/
html {
  font-size: 11px;
}

/******************************************************************************************
                                        COMMONS
******************************************************************************************/
/* Pas de surlignement par défaut sur les liens*/
a {
  text-decoration: none;
}

a:hover {
  /* soulignement des liens */
  text-decoration: underline;
  /* Annulation du changement de couleur au survol des liens sur le site client */
  color: inherit;
}

#kb-menu-nav-bar .nav-link:hover,
#kb-menu-nav-bar .nav-link:focus {
  /* Pas de soulignement des liens pour les elements du menu */
  text-decoration: none;
}

label {
  font-weight: bold;
  margin-bottom: 0.5rem;
}

/******************************************************************************************
                                        BUTTONS
******************************************************************************************/
.btn-default {
  color: #495057;
  /* Couleur identique au form-control */
  background-color: white;
  border-color: #ced4da;
}

.btn-warning {
  color: #FFFFFF;
}

.btn-secondary {
  color: #FFFFFF;
}

/******************************************************************************************
                                        LAYOUT
******************************************************************************************/
.layout-body {
  background: url("theme/client-themes/null");
  background-repeat: no-repeat;
  background-position: Center Top;
  background-color: #ffffff !important;
}

.layout-body-print {
  background-color: #FFFFFF;
}

.layout-main {
  margin-left: auto;
  margin-right: auto;
  text-align: left;
  margin-top: 0px;
  max-width: 90%;
  position: relative;
}

/******************************************************************************************
                                    LAYOUT FOOTER
******************************************************************************************/
.layout-footer {
  background-color: #ffffff;
  width: 100%;
  padding-top: 10px;
  padding-bottom: 10px;
  padding-left: 10px;
  padding-right: 10px;
  border-radius: 0px;
}

.layout-footer, .layout-footer a {
  color: #000000;
}

.layout-footer a:hover {
  color: #FE5E00;
}

/******************************************************************************************
                                        LAYOUT ROW
******************************************************************************************/
.layout-row {
  width: 100%;
}

/*****************************************************************************************
                    LAYOUT TWO COLUMNS 1s2b : LEFT SIDEBAR / RIGHT CONTENT
*****************************************************************************************/
.layout-col-1s2b-left {
  float: left;
  width: 21%;
  box-sizing: border-box;
}

.layout-col-1s2b-right {
  float: left;
  width: 79%;
  padding-left: 10px;
  box-sizing: border-box;
}

@media (max-width: 768px) {
  .layout-col-1s2b-left {
    float: none;
    width: 100%;
  }

  .layout-col-1s2b-right {
    float: none;
    width: 100%;
    padding-left: 0px;
  }
}
/*****************************************************************************************
                    LAYOUT TWO COLUMNS 1m2b : LEFT SIDEBAR / RIGHT CONTENT
*****************************************************************************************/
.layout-col-1m2b-left {
  float: left;
  width: 35%;
  box-sizing: border-box;
}

.layout-col-1m2b-right {
  float: left;
  width: 65%;
  padding-left: 10px;
  box-sizing: border-box;
}

@media (max-width: 768px) {
  .layout-col-1m2b-left {
    float: none;
    width: 100%;
  }

  .layout-col-1m2b-right {
    float: none;
    width: 100%;
    padding-left: 0px;
  }
}
/*****************************************************************************************
                    LAYOUT TWO COLUMNS 1b2s : LEFT CONTENT / RIGHT SIDEBAR
*****************************************************************************************/
.layout-col-1b2s-left {
  float: left;
  width: 79%;
  padding-right: 10px;
  box-sizing: border-box;
}

.layout-col-1b2s-right {
  float: left;
  width: 21%;
  box-sizing: border-box;
}

@media (max-width: 768px) {
  .layout-col-1b2s-left {
    float: none;
    width: 100%;
    padding-right: 0px;
  }

  .layout-col-1b2s-right {
    float: none;
    width: 100%;
  }
}
/*****************************************************************************************
                    LAYOUT TWO COLUMNS 1b2m : LEFT CONTENT / RIGHT SIDEBAR
*****************************************************************************************/
.layout-col-1b2m-left {
  float: left;
  width: 65%;
  padding-right: 10px;
  box-sizing: border-box;
}

.layout-col-1b2m-right {
  float: left;
  width: 35%;
  box-sizing: border-box;
}

@media (max-width: 768px) {
  .layout-col-1b2m-left {
    float: none;
    width: 100%;
    padding-right: 0px;
  }

  .layout-col-1b2m-right {
    float: none;
    width: 100%;
  }
}
/*****************************************************************************************
                    LAYOUT TWO COLUMNS 1m2m : LEFT/RIGHT EQUALS
*****************************************************************************************/
.layout-col-1m2m-left {
  float: left;
  width: 50%;
  padding-right: 5px;
  box-sizing: border-box;
}

.layout-col-1m2m-right {
  float: left;
  width: 50%;
  padding-left: 5px;
  box-sizing: border-box;
}

@media (max-width: 768px) {
  .layout-col-1m2m-left {
    float: none;
    width: 100%;
    padding-right: 0px;
  }

  .layout-col-1m2m-right {
    float: none;
    padding-left: 0px;
    width: 100%;
  }
}
/*****************************************************************************************
        LAYOUT THREE COLUMNS 1s2s3b : LEFT SIDEBAR, CENTER SIDEBAR, RIGHT CONTENT
*****************************************************************************************/
.layout-col-1s2s3b-left {
  float: left;
  width: 21%;
  padding-right: 5px;
  box-sizing: border-box;
}

.layout-col-1s2s3b-center {
  float: left;
  width: 21%;
  padding-left: 5px;
  box-sizing: border-box;
}

.layout-col-1s2s3b-right {
  float: left;
  width: 58%;
  padding-left: 10px;
  box-sizing: border-box;
}

@media (max-width: 768px) {
  .layout-col-1s2s3b-left {
    float: none;
    width: 100%;
    padding-right: 0px;
  }

  .layout-col-1s2s3b-center {
    float: none;
    width: 100%;
    padding-left: 0px;
  }

  .layout-col-1s2s3b-right {
    float: none;
    width: 100%;
    padding-left: 0px;
  }
}
/*****************************************************************************************
        LAYOUT THREE COLUMNS 1s2b3s : LEFT SIDEBAR, CENTER CONTENT, RIGHT SIDEBAR
*****************************************************************************************/
.layout-col-1s2b3s-left {
  float: left;
  width: 21%;
  box-sizing: border-box;
}

.layout-col-1s2b3s-center {
  float: left;
  width: 58%;
  padding-left: 10px;
  padding-right: 10px;
  box-sizing: border-box;
}

.layout-col-1s2b3s-right {
  float: left;
  width: 21%;
  box-sizing: border-box;
}

@media (max-width: 768px) {
  .layout-col-1s2b3s-left {
    float: none;
    width: 100%;
  }

  .layout-col-1s2b3s-center {
    float: none;
    width: 100%;
    padding-left: 0px;
    padding-right: 0px;
  }

  .layout-col-1s2b3s-right {
    float: none;
    width: 100%;
  }
}
/*****************************************************************************************
        LAYOUT THREE COLUMNS 1b2s3s : LEFT CONTENT, CENTER SIDEBAR, RIGHT SIDEBAR
*****************************************************************************************/
.layout-col-1b2s3s-left {
  float: left;
  width: 58%;
  padding-right: 10px;
}

.layout-col-1b2s3s-center {
  float: left;
  width: 21%;
  padding-right: 5px;
  box-sizing: border-box;
}

.layout-col-1b2s3s-right {
  float: left;
  width: 21%;
  padding-left: 5px;
  box-sizing: border-box;
}

@media (max-width: 768px) {
  .layout-col-1b2s3s-left {
    float: none;
    padding-right: 0px;
    width: 100%;
  }

  .layout-col-1b2s3s-center {
    float: none;
    padding-right: 0px;
    width: 100%;
  }

  .layout-col-1b2s3s-right {
    float: none;
    padding-left: 0px;
    width: 100%;
  }
}
/*****************************************************************************************
                LAYOUT THREE COLUMNS 1m2m3m : LEFT/CENTER/RIGHT EQUALS
*****************************************************************************************/
.layout-col-1m2m3m-left {
  float: left;
  width: 33%;
  padding-right: 5px;
  box-sizing: border-box;
}

.layout-col-1m2m3m-center {
  float: left;
  width: 34%;
  padding-left: 5px;
  padding-right: 5px;
  box-sizing: border-box;
}

.layout-col-1m2m3m-right {
  float: left;
  width: 33%;
  padding-left: 5px;
  box-sizing: border-box;
}

@media (max-width: 768px) {
  .layout-col-1m2m3m-left {
    float: none;
    width: 100%;
    padding-right: 0px;
  }

  .layout-col-1m2m3m-center {
    float: none;
    width: 100%;
    padding-left: 0px;
    padding-right: 0px;
  }

  .layout-col-1m2m3m-right {
    float: none;
    padding-left: 0px;
    width: 100%;
  }
}
/*****************************************************************************************
            LAYOUT THREE COLUMNS 1s2b3m : LEFT SMALL / CENTER BIG / RIGHT MEDIUM
*****************************************************************************************/
.layout-col-1s2b3m-left {
  float: left;
  width: 20%;
  padding-right: 5px;
  box-sizing: border-box;
}

.layout-col-1s2b3m-center {
  float: left;
  width: 45%;
  padding-left: 5px;
  padding-right: 5px;
  box-sizing: border-box;
}

.layout-col-1s2b3m-right {
  float: left;
  width: 35%;
  padding-left: 5px;
  box-sizing: border-box;
}

@media (max-width: 768px) {
  .layout-col-1s2b3m-left {
    float: none;
    width: 100%;
    padding-right: 0px;
  }

  .layout-col-1s2b3m-center {
    float: none;
    width: 100%;
    padding-left: 0px;
    padding-right: 0px;
  }

  .layout-col-1s2b3m-right {
    float: none;
    padding-left: 0px;
    width: 100%;
  }
}
/*****************************************************************************************
        LAYOUT FOUR COLUMNS 1s2s3s4s : LEFT/CENTER-LEFT/CENTER-RIGHT/RIGHT EQUALS
*****************************************************************************************/
.layout-col-1s2s3s4s-left {
  float: left;
  width: 24%;
  padding-right: 5px;
  box-sizing: border-box;
}

.layout-col-1s2s3s4s-left-center {
  float: left;
  width: 26%;
  padding-left: 5px;
  padding-right: 5px;
  box-sizing: border-box;
}

.layout-col-1s2s3s4s-right-center {
  float: left;
  width: 26%;
  padding-left: 5px;
  padding-right: 5px;
  box-sizing: border-box;
}

.layout-col-1s2s3s4s-right {
  float: left;
  width: 24%;
  padding-left: 5px;
  box-sizing: border-box;
}

@media (max-width: 768px) {
  .layout-col-1s2s3s4s-left {
    float: none;
    width: 100%;
    padding-right: 0px;
  }

  .layout-col-1s2s3s4s-left-center {
    float: none;
    width: 100%;
    padding-left: 0px;
    padding-right: 0px;
  }

  .layout-col-1s2s3s4s-right-center {
    float: none;
    width: 100%;
    padding-left: 0px;
    padding-right: 0px;
  }

  .layout-col-1s2s3s4s-right {
    float: none;
    padding-left: 0px;
    width: 100%;
  }
}
/******************************************************************************************
                        TIMELINE DE WIDGETS (GRID "PACKERY" DE WIDGETS)
******************************************************************************************/
/* Adaptation des marges des grid bootstrap à l'insertion l'utilisation dans un canvas */
.canvas-timeline-container {
  margin-left: auto;
  margin-right: auto;
  width: 100%;
}

.canvas-timeline {
  margin-left: -5px;
  margin-right: -5px;
}

.canvas-timeline .col-xs-12,
.canvas-timeline .col-md-3,
.canvas-timeline .col-md-4,
.canvas-timeline .col-md-6 {
  padding-left: 5px;
  padding-right: 5px;
}

/******************************************************************************************
                                        CONTAINERS
******************************************************************************************/
.canvas-container {
  background: #ffffff;
  border: 0px Solid #CFCFCF;
  border-radius: 0px;
  margin-top: 10px;
  margin-bottom: 0px;
}

.canvas-container-onlysmallscreens {
  display: none;
}

.canvas-container-onlylargescreens {
  display: block;
}

@media (max-width: 768px) {
  .canvas-container-onlysmallscreens {
    display: block;
  }

  .canvas-container-onlylargescreens {
    display: none;
  }
}
.canvas-container-header {
  width: 100%;
  text-align: left;
  letter-spacing: 1px;
  background-color: #E9E9E9;
  padding: 10px 10px 10px 10px;
  text-transform: Uppercase;
  border-bottom: 1px Solid #CFCFCF;
  border-top-left-radius: 0px;
  /* Utilisé pour adapter le radius du canvas-container sur l'entete de celui-ci (car sinon il deborde du radius) */
  border-top-right-radius: 0px;
  /* Utilisé pour adapter le radius du canvas-container sur l'entete de celui-ci (car sinon il deborde du radius) */
}

.canvas-container-header-text, .canvas-container-header-text a {
  font-weight: bold;
  font-style: normal;
  text-decoration: none;
  font-family: "Verdana";
  font-size: 14px;
  color: #202a4d;
  text-transform: Uppercase;
}

.canvas-container-header-action a {
  color: #202a4d;
  font-size: 14px;
}

.canvas-container-content {
  padding-top: 10px;
  padding-left: 10px;
  padding-right: 10px;
  padding-bottom: 10px;
  border-bottom-left-radius: 0px;
  /* Utilisé pour adapter le radius du canvas-container sur le bas de celui-ci, qui est le "content" (car sinon il deborde du radius) */
  border-bottom-right-radius: 0px;
  /* Utilisé pour adapter le radius du canvas-container sur le bas de celui-ci, qui est le "content" (car sinon il deborde du radius) */
}

.canvas-container-listplus {
  text-align: Center;
  margin-top: 10px;
  padding: 10px;
  border-top: 1px Solid #CFCFCF;
}

.canvas-container-listplus div {
  display: inline-block;
  margin-left: 5px;
  margin-right: 5px;
}

.canvas-container-listplus span {
  margin-right: 2px;
  color: #333333;
}

.canvas-container-listplus a, .canvas-container-listplus a:hover {
  color: #333333;
  text-decoration: none;
  font-weight: bold;
}

/******************************************************************************************
                                TEXTS SINGLE POST
******************************************************************************************/
.post-text img {
  max-width: 100%;
  /* Image ne dépasse pas le cadre */
  height: auto;
  /* Laissez afin que si le max-width est utilise par le browser, la hauteur de l'image s'adapte bien */
  /*width: auto; Retire, sinon les dimensions de tiny son jamais pris en compte */
}

.post-text {
  font-size: 11px;
  text-align: Left;
}

.post-text, .post-text a {
  color: #333333;
}

.post-text h6 {
  font-size: 11px;
}

.post-text h5 {
  font-size: 12px;
}

.post-text h4 {
  font-size: 15px;
}

.post-text h3 {
  font-size: 21px;
}

.post-text h2 {
  font-size: 25px;
}

.post-text h1 {
  font-size: 31px;
}

/*****************************************************************************************
                                        PAGE SPECIFIC
*****************************************************************************************/
.page-text img {
  max-width: 100%;
  /* Image ne dépasse pas le cadre */
  height: auto;
  /* Laissez afin que si le max-width est utilise par le browser, la hauteur de l'image s'adapte bien */
  /*width: auto; Retire, sinon les dimensions de tiny son jamais pris en compte */
}

.page-text {
  font-size: 11px;
  text-align: Left;
}

.page-text, .page-text a {
  color: #333333;
}

.page-text h6 {
  font-size: 11px;
}

.page-text h5 {
  font-size: 12px;
}

.page-text h4 {
  font-size: 15px;
}

.page-text h3 {
  font-size: 21px;
}

.page-text h2 {
  font-size: 25px;
}

.page-text h1 {
  font-size: 31px;
}

/* Survol des liens du texte d'une page */
.page-text a:hover {
  color: #53A0D8;
}

/*****************************************************************************************
                                        POST SPECIFIC
*****************************************************************************************/
.post-header-text {
  font-weight: bold;
  font-style: normal;
  text-decoration: none;
  font-size: nullpx !important;
}

.post-header-text {
  color: #333333;
}

.post-publication {
  font-weight: normal;
  font-style: normal;
  text-decoration: none;
  font-size: nullpx !important;
}

/* Survol des liens du texte d'un article */
.post-header-text a, .post-text-html a {
  color: #53A0D8;
}

.post-publication, .post-publication a {
  color: #333333;
}

/* 
    Le border-radius ne marche pas "avec object-fit: contain" sur la balise img, donc la solution c'est d'avoir un div parent en "display: grid + margin: auto"
    et le img avec max-width et max-height à 100% et margin: auto
    https://jsfiddle.net/pe0m58du/63/
    https://stackoverflow.com/questions/68502752/how-can-i-use-object-fit-contain-in-css-and-still-have-a-border-radius-on-the
*/
.post-header-image {
  object-position: Left;
  object-fit: scale-down;
  max-height: 250px;
  border-radius: 0px;
  width: 100% !important;
}

.post-link a {
  font-weight: bold;
}

.post-named-entity {
  color: #3B4F9E !important;
  font-weight: bold;
  text-decoration: underline dotted !important;
  cursor: pointer;
}

/*****************************************************************************************
                        POST ACTIONS : TO DO A VERIFIER CAR A DELETE A LA FIN
*****************************************************************************************/
.post-actions a, .post-actions a:hover {
  text-decoration: none;
  white-space: nowrap;
  color: #3B4F9E;
}

.post-actions .far, .post-actions .fas {
  font-size: 1rem;
  color: #3B4F9E;
}

.post-actions-likes {
  white-space: nowrap;
}

.post-actions-tall {
  margin-top: 2rem;
}

.post-actions-small {
  margin-top: 1rem;
}

.post-actions-share {
  max-width: 360px;
}

.post-actions-share .dropdown-item {
  word-wrap: break-word;
  white-space: normal;
}

/*****************************************************************************************
                                    BOXED TEXT / LINK
*****************************************************************************************/
.box {
  display: inline-block;
  padding: 5px;
  background-color: #3B4F9E;
  border-radius: 5px;
}

.box, .box a {
  color: #FFFFFF;
  text-decoration: none;
}

.boxed-text {
  display: inline-block;
  padding: 5px 10px;
  margin-right: 10px;
  margin-bottom: 10px;
  background-color: #3B4F9E;
  border: 1px solid #3B4F9E;
  border-radius: 4px;
}

.boxed-text-highlight {
  background-color: #53A0D8;
  border: 1px solid #53A0D8;
}

.boxed-text, .boxed-text:hover,
.boxed-text a, .boxed-text a:hover {
  font-weight: bold;
  color: #FFFFFF;
  text-decoration: none;
}

.boxed-text .fa-times {
  margin-left: 5px;
}

/*****************************************************************************************
                                     POST LIST
*****************************************************************************************/
.postlist-big {
  background-color: transparent;
  padding-top: 0px;
  padding-bottom: 0px;
  padding-left: 0px;
  padding-right: 0px;
  border-top: 0px Solid #CFCFCF;
  border-bottom: 0px Solid #CFCFCF;
  border-left: 0px Solid #CFCFCF;
  border-right: 0px Solid #CFCFCF;
}

.postlist-small {
  background-color: transparent;
  padding-top: 0px;
  padding-bottom: 0px;
  padding-left: 0px;
  padding-right: 0px;
  border-top: 0px Solid #CFCFCF;
  border-bottom: 0px Solid #CFCFCF;
  border-left: 0px Solid #CFCFCF;
  border-right: 0px Solid #CFCFCF;
}

.postlist-separator-big {
  margin-top: 20px;
  margin-bottom: 20px;
  border-top: 1px Solid #CFCFCF;
}

.postlist-separator-grid-big {
  padding-top: 20px;
  padding-bottom: 20px;
  border-top: 1px Solid #CFCFCF;
}

.postlist-separator-small {
  margin-top: 5px;
  margin-bottom: 5px;
  border-top: 1px Dotted #CFCFCF;
}

.postlist-separator-grid-small {
  padding-top: 5px;
  padding-bottom: 5px;
  border-top: 1px Dotted #CFCFCF;
}

.postlist-origin, .postlist-origin a {
  color: #333333 !important;
  font-weight: Normal;
  font-size: 11px;
}

.postlist-origin-small, .postlist-origin-small a {
  color: #333333 !important;
  font-weight: Normal;
  font-size: 11px;
}

.highlight-search-keyword {
  background-color: #fe5e00;
  color: #ffffff;
  padding: 1px;
  font-weight: bolder;
}

.postlist-title-notread,
.postlist-title-notread:hover {
  color: #202a4d !important;
}

.postlist-title-read {
  color: #8B8C8D !important;
}

.postlist-title-read:hover {
  color: #202a4d !important;
}

/* Zone "badge" indiquant le nombre de lectures*/
.postlist-title-notread .badge {
  color: #FFFFFF;
  background-color: #202a4d;
  letter-spacing: 1px;
}

.postlist-title-read .badge {
  color: #FFFFFF;
  background-color: #8B8C8D;
  letter-spacing: 1px;
}

.postlist-title-big {
  text-transform: None;
  font-size: 11px;
  font-family: "Verdana";
  font-weight: Bold;
}

.postlist-title-small {
  text-transform: None;
  font-size: 11px;
  font-family: "Verdana";
  font-weight: Bold;
}

.postlist-headerimage img {
  height: 250px;
  width: 100%;
  object-fit: cover;
  object-position: center;
}

.postlist-headerimage-horizontal-left, .postlist-headerimage-horizontal-right {
  float: left;
  width: 50%;
  text-align: center;
}

.postlist-headerimage-horizontal-content {
  float: left;
  width: 50%;
}

.postlist-headerimage-horizontal-left {
  padding-right: 15px;
}

.postlist-headerimage-horizontal-right {
  padding-left: 15px;
}

@media (max-width: 768px) {
  .postlist-headerimage-horizontal-left, .postlist-headerimage-horizontal-right, .postlist-headerimage-horizontal-content {
    float: none;
    width: 100%;
  }

  .postlist-headerimage-horizontal-left {
    margin-bottom: 10px;
    padding-right: 0px;
  }

  .postlist-headerimage-horizontal-right {
    margin-top: 10px;
    padding-left: 0px;
  }
}
.postlist-content-big {
  font-size: 11px;
}

.postlist-content-small {
  font-size: 11px;
}

.postlist-tags-top-big, .postlist-tags-top-big a, .postlist-tags-top-big a:hover {
  color: #EF4000 !important;
  font-weight: Normal;
  font-size: 10px;
  text-transform: None;
}

.front-archive-tags-top-big {
  padding-bottom: 5px;
  border-bottom: 0px Solid #CFCFCF;
  margin-bottom: 5px;
}

.postlist-tags-top-small, .postlist-tags-top-small a, .postlist-tags-top-small a:hover {
  color: #202a4d !important;
  font-weight: Normal;
  font-size: 11px;
  text-transform: None;
}

.postlist-tags-top-small {
  padding-bottom: 5px;
  border-bottom: 0px Solid #CFCFCF;
  margin-bottom: 5px;
}

.postlist-tags-bottom-big, .postlist-tags-bottom-big a, .postlist-tags-bottom-big a:hover {
  color: #202a4d !important;
  font-weight: Normal;
  font-size: 11px;
  text-transform: None;
}

.postlist-tags-bottom-big {
  padding-top: 5px;
  border-top: 0px Solid #CFCFCF;
  margin-top: 5px;
}

.postlist-tags-bottom-small, .postlist-tags-bottom-small a, .postlist-tags-bottom-small a:hover {
  color: #202a4d !important;
  font-weight: Normal;
  font-size: 11px;
  text-transform: None;
}

.postlist-tags-bottom-small {
  padding-top: 5px;
  border-top: 0px Solid #CFCFCF;
  margin-top: 5px;
}

/*****************************************************************************************
                                WIDGET POST ACTIONS
*****************************************************************************************/
.widget-post-actions a {
  display: inline-block;
}

/*****************************************************************************************
                                WIDGET SOCIAL NETWORK
*****************************************************************************************/
.widget-socialnetwork-profil-picture {
  width: 50px;
  height: 50px;
  border: 1px inset rgba(0, 0, 0, 0.1);
  border-radius: 50%;
  margin-right: 5px;
}

.widget-socialnetwork-banner {
  object-fit: cover;
  height: 200px;
}

/******************************************************************************************
                        PAGE DE CONNEXION KB SUITE COMPLETE
******************************************************************************************/
.authentication-body {
  background: url("/Medias/images-entete/Banniere-portail-2024.jpg?v=vMMZNouRGy4WEY88L7uCUzicmCY");
  background-repeat: no-repeat;
  background-position: top center;
  background-color: #FFFFFF;
}

.authentication-block, .authentication-noblock {
  margin-left: auto;
  margin-right: auto;
  margin-top: 330px;
  color: #333333;
  font-size: 12px;
}

.authentication-block {
  width: 500px;
}

.authentication-noblock {
  width: 270px;
}

.authentication-nonblocktitle {
  text-align: center;
  font-size: 12px;
}

.authentication-link a {
  color: #333333;
}

.authentication-submit .btn {
  width: 100%;
}

.authentication-errorlogin {
  font-weight: bold;
  color: #FF0000;
}

@media (max-width: 768px) {
  .authentication-block, .authentication-noblock {
    margin-top: 330px;
    width: 95%;
  }

  .authentication-body {
    background: url("/Medias/images-entete/banniere-portail de veille-2017-3.png");
    background-repeat: no-repeat;
    background-position: top center;
    background-color: #FFFFFF;
  }
}
/******************************************************************************************
                        PAGE DE REGISTER et CHANGE PASSWORD
******************************************************************************************/
.kb-register-error, .kb-changepassword-error {
  font-weight: bold;
  color: #FF0000;
}

/*****************************************************************************************
                                WIDGET MARQUEE
*****************************************************************************************/
.widget-marquee {
  width: auto;
  overflow: hidden;
  font-weight: bold;
  letter-spacing: 1px;
  height: 100%;
}

/*****************************************************************************************
                                    WIDGET SLIDER
*****************************************************************************************/
/* Style Widget Slider Commun */
.widget-slider .carousel-inner {
  overflow: hidden;
  height: 400px;
  /* Hauteur du carousel */
}

.widget-slider .carousel-inner img {
  width: auto;
  height: 400px;
  /* Hauteur du carousel */
}

/* Positionnement du texte au dessus de l'image */
.widget-slider .carousel-caption {
  height: 400px;
  /* Hauteur du carousel */
  top: 0;
  left: 0;
  bottom: 0;
  width: 100%;
  padding: 30px;
  text-align: left;
  background-image: linear-gradient(208deg, rgba(73, 73, 73, 0), rgba(73, 73, 73, 0.9));
}

.widget-slider .carousel-caption > div {
  width: 70%;
  /* Largeur des textes par rapport à toute la zone image / layer dégradé donné au caption*/
}

.widget-slider-content > div:not(:last-child) {
  margin-bottom: 10px;
}

.widget-slider-tag-boxed {
  display: inline-block;
  padding: 5px 10px;
  margin-right: 10px;
  border-radius: 3px;
}

.widget-slider-title {
  font-size: 1.4rem;
}

.widget-slider-text {
  text-align: left;
}

.widget-slider .carousel-caption a {
  color: White;
  text-decoration: none;
  outline: none;
}

/* Positionnement des fleches*/
.widget-slider .carousel-control {
  width: 50px;
}

.widget-slider .carousel-control.left {
  left: auto;
  right: 100px;
}

.widget-slider .carousel-control.right {
  left: auto;
  right: 50px;
}

.widget-slider .carousel-control.left,
.widget-slider .carousel-control.right {
  background-image: none;
  filter: none;
  z-index: 40;
}

/* Gestion de l'image */
.widget-slider-img-coverfit,
.widget-slider-img-coverfit,
.widget-slider-img-coverfit,
.widget-slider-img-coverfit {
  object-position: center;
  width: 100%;
}

.widget-slider-img-coverfit {
  object-fit: cover;
}

.widget-slider-img-containfit {
  object-fit: contain;
}

.widget-slider-img-fillfit {
  object-fit: fill;
}

.widget-slider-img-scalldownfit {
  object-fit: scale-down;
}

.widget-slider-img-no-fit {
  width: auto;
}

/* RESPONSIVITE */
@media (max-width: 768px) {
  /* En dessous d'une tablette, on retire le summary, la date, la source */
  .widget-slider-text {
    display: none;
  }
}
/*****************************************************************************************
                                WIDGETS SEARCH
*****************************************************************************************/
.widget-searchresume-exclude {
  text-decoration: line-through;
}

/**************************************************************************************************
                                MULTI SELECTION DE TAGS
**************************************************************************************************/
.tag-multiselection-item {
  display: inline-block;
  background-color: #3B4F9E;
  border: 1px solid #3B4F9E;
  border-radius: 4px;
  margin-right: 5px;
  cursor: move;
}

.tag-multiselection-item, .tag-multiselection-item a {
  color: #FFFFFF;
}

.tag-multiselection-item-inactive {
  background-color: transparent;
  border: 1px solid #cfcfcf;
  text-decoration: line-through;
}

.tag-multiselection-item-inactive, .tag-multiselection-item-inactive a {
  color: #999999;
}

.tag-multiselection-item-highlight {
  background-color: #53A0D8;
  border: 1px solid #53A0D8;
}

.tag-multiselection-item span {
  margin-left: 2px;
  margin-right: 2px;
}

/*****************************************************************************************
                                    WIDGET FOLDER
*****************************************************************************************/
.widget-folders .firstLevel {
  margin: 0 0 0 0px !important;
  padding: 0;
  list-style-type: none;
}

.widget-folders ul {
  margin: 0 0 0 15px;
  padding: 0;
  list-style-type: none;
}

.widget-folders li {
  padding-bottom: 0px;
}

.widget-folders .badge {
  font-size: 90%;
}

.widget-folders-block {
  line-height: 1.8rem;
}

.widget-folders-clickable {
  cursor: pointer;
}

/*****************************************************************************************
                                    FOLDERS
*****************************************************************************************/
.folders .firstLevel {
  margin: 0 0 0 5px !important;
  padding: 0;
  list-style-type: none;
}

.folders ul {
  margin: 0 0 0 15px;
  padding: 0;
  list-style-type: none;
}

.folders li {
  padding-bottom: 0px;
}

.folders .badge {
  font-size: 90%;
}

.folders-block {
  line-height: 1.8rem;
}

.folders-clickable {
  cursor: pointer;
}

/*****************************************************************************************
                                    DATA VIZ
*****************************************************************************************/
.dataviz-generate-btn {
  width: 100%;
  text-transform: uppercase;
  letter-spacing: 1px;
  font-weight: bold;
}

/*****************************************************************************************
                                WIDGET TAG TREE
*****************************************************************************************/
.widget-tag-tree-scroll {
  max-width: 100%;
  overflow-x: auto;
}

.widget-tag-tree li[haschildren=true] {
  font-weight: bold;
}

.widget-tag-tree li[haschildren=false] {
  font-weight: normal;
}

/*****************************************************************************************
                                WIDGET SEARCH
*****************************************************************************************/
.widget-search-fake-input-text {
  width: 100%;
  /*color: #555555;*/
  /*background-color: transparent;*/
  background-image: none;
  font-size: 11px;
}

.widget-search-launch-button btn {
  height: 100% !important;
}

.widget-search-input-text {
  display: inline;
  border: 0px;
  background-color: transparent;
  margin-bottom: 0.6rem;
}

.widget-search-item {
  display: inline-block;
  padding: 0.4rem 0.6rem 0.4rem;
  margin-right: 0.5rem;
  margin-bottom: 0.3rem;
  font-size: 90%;
  line-height: 1.6rem;
  text-align: center;
  white-space: nowrap;
  vertical-align: baseline;
  border-radius: 0.25rem;
  border: none;
  background-color: #3B4F9E;
}

.widget-search-item, .widget-search-item a {
  color: #fff;
}

.widget-search-item-remove {
  cursor: pointer;
}

/* Largeur 100% de l'autocomplete */
.widget-search .typeahead,
.widget-search .tt-hint,
.widget-search .tt-input,
.widget-search .tt-menu {
  width: 100%;
}

/*****************************************************************************************
                                WIDGET CALENDAR
*****************************************************************************************/
.widget-calendar {
  text-align: center;
}

.widget-calendar a {
  text-decoration: none;
}

.widget-calendar h2 {
  font-size: 22px;
  line-height: 20px;
  margin: 4px 0;
  text-transform: uppercase;
}

.widget-calendar table {
  border-spacing: 0;
  width: 100%;
  border-collapse: separate;
}

.widget-calendar header {
  position: relative;
}

.widget-calendar thead {
  font-weight: 600;
  text-transform: uppercase;
}

.widget-calendar .day-notInMonth {
  opacity: 0.5;
  filter: alpha(opacity=50);
  /* For IE8 and earlier */
}

.widget-calendar td {
  border: 2px solid transparent;
  border-radius: 50%;
  line-height: 32px;
  text-align: center;
  width: 32px;
}

.widget-calendar tbody td:hover {
  background: #3B4F9E;
  color: #f9f9f9;
}

.widget-calendar tbody td.active {
  background: #3B4F9E;
  color: #f9f9f9;
}

.widget-calendar .marker {
  cursor: pointer;
  position: relative;
}

.widget-calendar .marker.active:after {
  background: #f9f9f9;
}

.widget-calendar .marker:hover:after {
  background: #f9f9f9;
}

.widget-calendar .marker:after {
  background: #3B4F9E;
  border-radius: 50%;
  bottom: 0px;
  display: block;
  content: "";
  height: 8px;
  left: 50%;
  margin: -4px 0 0 -4px;
  position: absolute;
  width: 8px;
}

.widget-calendar .current-day {
  background: #3B4F9E;
  color: #f9f9f9;
}

.widget-calendar .marker.current-day:after {
  background: #f9f9f9;
}

.widget-calendar .btn-prev,
.widget-calendar .btn-next {
  color: #cbd1d2;
  font-size: 18px;
  line-height: 28px;
  margin: -15px;
  position: absolute;
  top: 50%;
}

.widget-calendar .btn-prev:hover,
.widget-calendar .btn-next:hover {
  background: #cbd1d2;
  color: #f9f9f9;
}

.widget-calendar .btn-prev {
  left: 30px;
}

.widget-calendar .btn-next {
  right: 35px;
}

/*****************************************************************************************
                                WIDGET TAG/CATEGORY HEADER
*****************************************************************************************/
.widget-tagorcategory-header-container {
  position: relative;
}

.widget-tagorcategory-header-centered {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
}

.widget-tagorcategory-header-title {
  font-weight: bold;
  font-size: 3rem;
}

.widget-tagorcategory-header-count {
  font-weight: bold;
  font-size: 1.5rem;
}

.widget-tagorcategory-header-image {
  object-fit: cover;
  object-position: center;
}

/*****************************************************************************************
                                WIDGET SENTIMENT POLARITE
*****************************************************************************************/
.widget-sentiment-polarity-bold-data {
  font-style: normal;
  font-weight: 800;
  font-size: 2rem !important;
  font-family: Helvetica;
}

.widget-sentiment-polarity-semi-bold-data {
  font-style: normal;
  font-weight: 800;
  font-size: 1.1rem !important;
  font-family: Helvetica;
}

/*****************************************************************************************
                                WIDGET SENTIMENT EMOTION
*****************************************************************************************/
.widget-sentiment-emotion-bold-data {
  font-weight: 800;
}

.widget-sentiment-emotion-icon {
  font-size: 8rem;
}

@media (max-width: 1200px) {
  .widget-sentiment-emotion-icon {
    font-size: 4.5rem;
  }
}
@media (max-width: 992px) {
  .widget-sentiment-emotion-icon {
    font-size: 8rem;
  }
}
/*****************************************************************************************
                                Action Bar
*****************************************************************************************/
.layout-action-bar {
  background-color: #FBFBFB;
  border: 1px solid #CFCFCF;
  position: fixed;
  bottom: 0;
  z-index: 1030;
  width: 90%;
}

.layout-action-bar-item, .layout-action-bar-item a {
  text-decoration: none;
  color: #333333 !important;
}

.layout-action-bar-item:hover, .layout-action-bar-item:hover a {
  color: #FE5E00 !important;
}

@media (max-width: 768px) {
  .layout-action-bar {
    display: none;
  }
}
/*****************************************************************************************
                            Actions post & postslist
*****************************************************************************************/
.actions-likeusers-modal-content {
  display: block;
  max-height: 250px;
  overflow-y: auto;
  -ms-overflow-style: -ms-autohiding-scrollbar;
}

/**************************************************************************************************
                                COULEUR DES TYPEHEAD
**************************************************************************************************/
/* Typehead générales */
.typeahead .active > a,
.typeahead .active > a:hover {
  color: #FFFFFF !important;
  background-color: #3B4F9E;
}

/* Cas particulier des typehead comme celle de l'en-tête qui met en primary les lettres tappées (ici on les met en blanc au survol) */
.typeahead .active > a .text-primary,
.typeahead .active > a .text-primary:hover {
  color: #FFFFFF !important;
}

/**************************************************************************************************
                TINYMCE : Désactivation des notifications
**************************************************************************************************/
.mce-notification {
  display: none !important;
  /* les notifications apparaissent dans la zone de saisie */
}

/**************************************************************************************************
                                            VALIDATION MVC
**************************************************************************************************/
.field-validation-error {
  color: #ff0000;
}

.field-validation-valid {
  display: none;
}

.input-validation-error {
  border: 1px solid #ff0000;
  background-color: #ffeeee;
}

.validation-summary-errors .fas {
  font-size: 3rem;
}

.validation-summary-valid {
  display: none;
}

.custom-validation-block {
  padding-top: 15px;
}

/**************************************************************************************************
                                    Post LIST REFONTE
***************************************************************************************************/
.post-list-headerimage {
  object-position: center;
}

.post-list-actions {
  overflow: hidden;
}

.post-list-action {
  float: left;
  height: 26px;
  width: 26px;
  text-align: center;
}

.post-list-action .fas, .post-list-action .far {
  line-height: 26px;
}

.post-list-action-submenu {
  margin-top: 2rem;
  margin-bottom: 2rem;
  width: 300px;
}

.post-list-action-submenu .dropdown-item {
  word-wrap: break-word;
  white-space: normal;
}

/**************************************************************************************************
                                        WIDGET MENU
***************************************************************************************************/
.widget-menu-tree {
  padding: 0px;
}

.widget-menu-tree, .widget-menu-tree ul {
  list-style-type: none;
}

.widget-menu-tree ul {
  padding-left: 20px;
}

.widget-menu-tree .fas {
  cursor: pointer;
}

/**************************************************************************************************
                                        SSO INFORMATION
***************************************************************************************************/
.sso-information-body {
  background-color: #ffffff;
}

.sso-information-card {
  width: 550px;
  margin-top: 100px;
  margin-left: auto;
  margin-right: auto;
}

@media (max-width: 768px) {
  .sso-information-card {
    width: 330px;
    margin-top: 50px;
  }
}
/**************************************************************************************************
                                        WIDGET REQUEST
***************************************************************************************************/
.widget-request-default {
  cursor: default;
}

/******************************************************************************************************
                                En-tête de l'apparence client
        Le reste des clases est mutualisé entre client et back pour la preview dans le back
*******************************************************************************************************/
.layout-header-submenu > div > ul > li > a {
  color: #3B4F9E;
}

/**************************************************************************************************
                                NOTIFICATION POPOVER
**************************************************************************************************/
.kb-client-notification-popover-href {
  text-decoration: none !important;
  cursor: pointer;
  position: relative;
}

.kb-client-notification-popover-counter {
  font-weight: bold;
  font-size: 0.7rem;
  border-radius: 20px;
  position: absolute;
  left: 60%;
}

.kb-client-notification-popover {
  min-width: 400px;
}

.popover.kb-client-notification-popover,
.popover.kb-client-notification-popover .popover-body,
.popover.kb-client-notification-popover .popover-header {
  background-color: #FFFFFF !important;
  color: #33364A !important;
  border: 1px solid rgba(0, 0, 0, 0.2);
  border-radius: 0.3rem !important;
}

.popover.kb-client-notification-popover .popover-header {
  background-color: #F7F7F7 !important;
  padding: 0.5rem 1rem !important;
  border-bottom: 1px solid rgba(0, 0, 0, 0.2) !important;
  border-top-left-radius: calc(.3rem - 1px) !important;
  border-top-right-radius: calc(.3rem - 1px) !important;
}

.popover.kb-client-notification-popover .popover-body {
  border: none !important;
}

.popover.kb-client-notification-popover .popover-header {
  border-bottom: 1px solid rgba(0, 0, 0, 0.2) !important;
  border-bottom-left-radius: 0px !important;
  border-bottom-right-radius: 0px !important;
  border-top-left-radius: calc(.3rem - 1px) !important;
  border-top-right-radius: calc(.3rem - 1px) !important;
  border-top: none !important;
  border-right: none !important;
  border-left: none !important;
}

.kb-client-notification-popover-body {
  padding: 0px 0px 5px 0px !important;
}

.kb-client-notification-popover-header {
  background-color: white !important;
}

.kb-client-notification-popover-cell {
  margin-left: 0px;
  margin-right: 0px;
  height: 80px !important;
}

.popover.kb-client-notification-popover .popover-header:before {
  border-bottom: 1px solid #FFFFFF !important;
}

.popover.kb-client-notification-popover .popover-arrow:after {
  border-top-color: #F8F8FA;
}

.popover.kb-client-notification-popover .popover-arrow:after {
  border-bottom-color: #F8F8FA;
}

.kb-cursor-pointer {
  cursor: pointer !important;
}

.kb-cursor-move {
  cursor: move;
}

.kb-client-notification-popover-cell:hover,
.kb-client-notification-popover-cell:hover .kb-client-notification-seen-icon {
  background: #3B4F9E !important;
  color: white !important;
}

.kb-client-notification-popover-cell.selected {
  background: #85c1e9 !important;
}

.kb-client-notification-popover-text {
  /* ONLY TWO LINES FOR TITLE */
  line-height: 1.2em;
  max-height: 3.7em;
  overflow: hidden;
  font-size: 1.1rem;
}

.kb-client-notification-popover-date-text {
  color: #999;
  font-size: 0.8rem;
}

.kb-client-notification-popover-img {
  max-height: 65px !important;
}

.kb-client-notification-popover-img img {
  object-fit: cover;
}

.kb-client-notification-popover-pre-scrollable {
  max-height: 400px;
  overflow-y: auto;
}

.kb-client-notification-popover #ClientNotificationMainSettingSubMenu {
  position: absolute;
  right: 20px !important;
  width: max-content;
  z-index: 1061;
}

.kb-client-notification-popover-arrow {
  border-left: 8px solid transparent;
  border-right: 8px solid transparent;
  border-bottom: 8px solid #e0e0e0;
  float: right;
  height: 1px;
  margin-right: 5px !important;
}

.kb-client-notification-popover-search-zone {
  height: 20px !important;
}

.kb-client-notification-popover-search-clear-text-button {
  height: 10px !important;
  top: 4px !important;
  position: absolute;
  right: 8px !important;
}

.kb-client-notification-cell-action {
  position: absolute;
  right: 30px !important;
  top: 25px !important;
  display: none;
}

.kb-client-notification-popover-cell:hover .kb-client-notification-cell-action {
  display: block;
  color: black;
}

.kb-client-notification-cell-actions-popover-arrow {
  position: absolute;
  top: 15px;
  right: -52px;
  border-top: 8px solid transparent;
  border-bottom: 8px solid transparent;
  border-left: 8px solid #d7d7d7;
  float: right;
  height: 1px;
  margin-right: 30px !important;
}

.kb-client-notification-cell-list-actions {
  position: absolute;
  right: 78px !important;
  width: max-content;
  z-index: 1061;
  top: 17px !important;
}

.kb-client-notification-checkbox {
  width: 15px;
  height: 15px;
}

.kb-client-notification-checkbox-container {
  margin-top: auto;
  margin-bottom: auto;
}

.kb-client-notification-main-menu-icon {
  width: 15px !important;
}

.kb-client-notification-cell-btn {
  width: 40px !important;
  font-size: 1.5rem;
  line-height: 1.4;
  border-radius: 22rem;
  padding: 8px 8px 8px 8px !important;
}

/**************************************************************************************************
                                CHAT MESSAGE POPOVER
**************************************************************************************************/
/**************************************
        La liste de discussions
**************************************/
.kb-chat-message-icon {
  position: fixed;
  right: 3rem;
  bottom: 7rem;
  z-index: 1032;
  color: #3B4F9E !important;
}

.kb-chat-message-icon-conversation-list {
  position: absolute;
  left: -20px;
  top: -16px;
  z-index: 1032;
  color: #3B4F9E !important;
  transform: scale(0.7);
}

.kb-chat-message-main-container {
  position: fixed;
  right: 3rem;
  bottom: 7rem;
  z-index: 1032;
  width: 500px !important;
  border: 1.5px solid #3B4F9E !important;
}

@media (max-width: 576px) {
  .kb-chat-message-main-container {
    width: 90% !important;
  }
}
.kb-chat-message-icon-counter {
  font-weight: bold;
  font-size: 0.9rem;
  border-radius: 20px;
  position: absolute;
  left: 60%;
  top: 20%;
}

.kb-chat-message-main-icon {
  border-radius: 4rem !important;
  background-color: white;
}

.kb-chat-message-icon-href {
  text-decoration: none !important;
  cursor: pointer;
}

.kb-chat-message-body {
  padding: 0px 0px 5px 0px !important;
}

.kb-chat-message-body-header {
  background-color: #3B4F9E !important;
  color: #fff !important;
}

.kb-chat-message-header-action-btn {
  font-size: 1.8em;
}

.kb-chat-message-conversation-container {
  background-color: #d8e6f5 !important;
}

.kb-chat-message-conversation-last-message-text {
  color: black;
  font-size: 0.8rem !important;
}

.kb-chat-message-body-container {
  height: 400px;
  overflow-y: auto;
}

@media (max-width: 576px) {
  .kb-chat-message-body-container {
    overflow-y: auto;
  }
}
.kb-chat-message-my-collaborations-search-clear-text-button {
  height: 10px !important;
  top: 4px !important;
  position: absolute;
  right: 8px !important;
}

.kb-chat-message-conversation-number-container {
  font-size: 0.7em;
}

.kb-chat-message-conversation-number {
  color: #7b241c !important;
}

.kb-chat-message-conversation-user-inactive {
  color: #c0392b;
}

/**************************************
            Chat privé
**************************************/
.kb-chat-message-private-chat-textarea {
  resize: none;
}

.kb-chat-message-body-private-message-container {
  min-height: 150px;
  display: flex;
  flex-direction: column-reverse;
}

.kb-chat-message-private-message-text {
  margin-top: 1px;
}

.kb-chat-message-private-from-current-user {
  background-color: #c1d6f7;
}

.kb-chat-message-private-from-another-user {
  background-color: #cefbf2;
}

.kb-chat-message-private-ready-for-delete {
  background-color: #fdaaaa !important;
}

.kb-chat-message-private-chat-action-zone {
  visibility: hidden !important;
}

@media (max-width: 576px) {
  .kb-chat-message-private-chat-action-zone {
    visibility: visible !important;
  }
}
.kb-chat-message-private-chat-message:not(.kb-chat-message-private-chat-message-deleted):hover .kb-chat-message-private-chat-action-zone {
  visibility: visible !important;
}

.kb-chat-message-private-chat-replied-text {
  background-color: #d6d6d6 !important;
  font-size: 0.9rem !important;
}

.kb-chat-message-user-search-result-container {
  height: 135px;
  overflow-y: auto;
}

.kb-chat-message-user-search-result-container-double {
  height: 270px;
  overflow-y: auto;
}

.kb-chat-message-conversation-small-text {
  font-size: 0.9rem !important;
}

.kb-chat-message-conversation-post-attached-img {
  max-height: 65px !important;
  max-width: 65px !important;
}

/***************************************************************************************************
                                Page d'annuaire des groupes collaboratifs
***************************************************************************************************/
.kb-collaborative-group-directory-list ul {
  list-style-type: none;
  padding: 0px;
  margin: 0px;
}

.kb-collaborative-group-directory-list ul li {
  margin-bottom: 4px;
  min-height: 51px;
  border-radius: 5px;
}

.kb-collaborative-group-directory-list .row {
  margin-left: 10px;
  vertical-align: middle;
  height: 51px;
}

.kb-collaborative-group-directory-list .kb-switch input + label {
  vertical-align: middle;
}

.kb-collaborative-group-directory-list-dark-line {
  background-color: #f4f4f4;
}

.kb-collaborative-group-directory-list-light-line {
  background-color: #ffffff;
  border: 1px solid #f4f4f4;
}

.kb-collaborative-group-directory-list ul li {
  margin-top: 4px;
}

.kb-collaborative-group-directory-item {
  height: 115px !important;
}

.kb-collaborative-group-directory-item-image-container {
  min-width: 60px;
}

.kb-collaborative-group-directory-item-image {
  object-fit: cover;
}

.kb-collaborative-group-directory-item-group-icon {
  font-size: 2.5em;
}

.kb-collaborative-group-directory-item-creator {
  font-size: 0.9rem !important;
  font-weight: lighter;
}

.kb-collaborative-group-directory-item-group-infos {
  font-size: 0.9rem !important;
}

.kb-collaborative-group-directory-toast {
  left: 50%;
  top: 40%;
  transform: translate(-50%, 0px);
  position: fixed;
  z-index: 9999;
  max-width: 500px;
  min-width: 200px;
}

.kb-collaborative-group-directory-toast-background {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  z-index: 2;
  opacity: 0.4;
  filter: alpha(opacity=50);
}

/***************************************************************************************************
                             Widget banière d'un groupe collaboratif
***************************************************************************************************/
.widget-collaborative-group-banner {
  position: relative;
}

.widget-collaborative-group-banner-label-centered {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
}

.widget-collaborative-group-separator {
  border-top: 1px solid #333333;
}

.widget-collaborative-group-user-infos {
  font-size: 0.8rem !important;
}

.kb-collaboration-module-group-directory-container .kb-emptystate {
  color: #333333 !important;
  font-size: 1.2rem;
}

.kb-collaboration-module-group-directory-container .kb-emptystate-icon {
  background-color: #333333;
  border: 1px solid #333333;
  border-radius: 50px;
  height: 7rem;
  width: 7rem;
  line-height: 7rem;
  color: #FFFFFF;
  font-size: 3rem;
}

/***************************************************************************************************
                             Widget forum d'un groupe collaratif
***************************************************************************************************/
.kb-widget-collaborative-group-forum-number-container {
  font-size: 0.7em;
}

.kb-widget-collaborative-group-forum-topic-border {
  border-width: 0.5rem !important;
}

.kb-widget-collaborative-group-forum-topic-closed-border {
  border-color: #a6a6a6 !important;
}

.kb-widget-collaborative-group-forum-topic-action-icons {
  font-size: 0.85rem !important;
}

.kb-widget-collaborative-group-forum-topic-title {
  font-size: 1.4rem !important;
}

.kb-widget-collaborative-group-forum-topics-text {
  font-size: 0.8rem;
  word-break: break-all;
}

.kb-widget-collaborative-group-forum-topics-infos {
  font-size: 0.7rem;
  color: lightslategray;
}

.kb-widget-collaborative-group-forum-topics-new-message-textarea {
  resize: none;
}

.kb-widget-collaborative-group-forum-topics-new-message-post-img {
  max-height: 80px !important;
  max-width: 80px !important;
}

.kb-widget-collaborative-group-forum-topic-message-list-container {
  overflow-y: auto;
}

.kb-widget-collaborative-group-forum-topic-message:hover .kb-widget-collaborative-group-forum-topic-message-action-zone {
  visibility: visible !important;
}

.kb-widget-collaborative-group-forum-topic-message-header {
  background-color: #ededed !important;
}

.kb-widget-collaborative-group-forum-topic-message-header.bg-danger {
  background-color: #c0392b !important;
}

.kb-widget-collaborative-group-forum-topic-message-header.bg-secondary {
  background-color: #53A0D8 !important;
}

.kb-widget-collaborative-group-forum-topic-message-small-text {
  font-size: 0.9rem !important;
}

.kb-widget-collaborative-group-forum-topic-message-post-attached-img {
  max-height: 65px !important;
  max-width: 65px !important;
}

.kb-collaboration-module-group-directory-container .kb-emptystate {
  color: #333333 !important;
  font-size: 1.2rem;
}

.kb-collaboration-module-group-directory-container .kb-emptystate-icon {
  background-color: #333333;
  border: 1px solid #333333;
  border-radius: 50px;
  height: 7rem;
  width: 7rem;
  line-height: 7rem;
  color: #FFFFFF;
  font-size: 3rem;
}

/***************************************************************************************************
                             Widget gestion d'utilisateur d'un groupe collaboratif
***************************************************************************************************/
.widget-collab-group-actions {
  width: 20px;
}

/***************************************************************************************************
                             Widget gestion d'utilisateur d'un groupe collaboratif
***************************************************************************************************/
.kb-collaborative-group-img-preview {
  object-fit: contain;
  object-position: center;
  width: 100%;
  max-height: 500px;
}

/***************************************************************************************************
                             Suggestion d'un article
***************************************************************************************************/
.post-suggest-img {
  max-width: 300px !important;
}

.post-suggest-progress {
  height: 2rem;
  font-size: 1rem;
  font-weight: bold;
}

.post-suggest-fileinput {
  /* Hook pour cacher l'input file mais qu'il soit clickable via JS (si display non certains browsers refusent le clic) */
  position: absolute;
  top: 0px;
  right: 0px;
  opacity: 0;
}

/***************************************************************************************************
                             Widget administration d'un groupe collaboratif
***************************************************************************************************/
.widget-collab-update-group-modal-body {
  height: 600px;
  overflow-y: auto;
  overflow-x: hidden;
}

/***************************************************************************************************
             Message d'erreur en cas de non acceptation des conditions générales
***************************************************************************************************/
.acceptance-general-conditions-error {
  padding-top: 7px;
  font-style: normal;
  font-weight: 400;
  line-height: 20px;
  color: #FF5A68;
}

.acceptance-general-conditions-label-error {
  color: #FF5A68;
}

/***************************************************************************************************
                                Double Authentification
***************************************************************************************************/
.double-authentication-error {
  border-color: #FF5A68;
  color: #FF5A68;
}

/***************************************************************************************************
                            Espace personnel
***************************************************************************************************/
.kb-client-personal-area-text-color, .kb-client-personal-area-text-color a {
  color: #333333;
}

.kb-client-personal-area-menu-and-some-highlighted-text {
  /* 
      Construction d'une couleur RGBA à partir d'une couleur en Hex et d'une opacité donnée à l'aide du module intégré dans les fichiers SCSS 
      https://sass-lang.com/documentation/modules/ & https://sass-lang.com/documentation/values/numbers/
  */
  background-color: rgba(59, 79, 158, 0.15);
}

.kb-client-personal-area-menu-and-some-highlighted-text, .kb-client-personal-area-menu-and-some-highlighted-text a, .kb-client-personal-area-menu-and-some-highlighted-text .form-check-label {
  color: #333333 !important;
}

/******************************
            CARDS
******************************/
/* Card utilisable dans l'admin pour mettre en avant certains portions */
.kb-client-personal-area-card {
  border: 2px solid transparent;
  box-shadow: 0 1px 8px rgba(210, 193, 202, 0.45);
  border-radius: 8px;
  padding: 20px;
}

.kb-client-personal-area-card.kb-client-personal-area-card-compact {
  padding: 5px;
}

/* Card avec fond blanc */
.kb-client-personal-area-card.kb-client-personal-area-white-card {
  background: white;
}

.kb-client-personal-area-platforms-bloc-large,
.kb-client-personal-area-platforms-bloc-compact,
.kb-client-personal-area-selection-post-card,
.kb-client-personal-area-newsletter-card,
.kb-client-personal-area-newsletter-card-compact,
.kb-client-personal-area-communication-card,
.kb-client-personal-area-subscription-card {
  width: 300px;
}

/******************************
    Contenu Page d'accueil
******************************/
/* Les blocs d'info dans le card gris de la page d'accueil */
.kb-client-personal-area-home-numbers-block .row .col:not(:last-child) {
  border-right: 2px solid #999999;
}

.kb-client-personal-area-home-container {
  min-height: 150px;
}

/******************************
        Menu en haut
******************************/
.kb-client-personal-area-top-menu-icon {
  color: #3B4F9E !important;
}

/* Petit Card */
.kb-client-personal-area-top-menu-small-card {
  border: 2px solid rgba(210, 207, 207, 0.15);
  border-radius: 8px;
  padding-top: 20px;
  padding-bottom: 20px;
  padding-right: 10px;
  padding-left: 10px;
  background: #fff;
}

/* L'hover Petit Card */
.kb-client-personal-area-top-menu-small-card:hover {
  border: 2px solid #3B4F9E;
  text-decoration: none;
  border-radius: 8px;
  cursor: pointer;
}

/******************************
        Menu à gauche > Ouvert
******************************/
.kb-client-personal-area-left-menu.open {
  width: 280px;
}

.kb-client-personal-area-left-menu.open .kb-client-personal-area-left-menu-items-title {
  display: block;
}

.kb-client-personal-area-left-menu.close {
  width: 100px;
}

.kb-client-personal-area-left-menu.close .kb-client-personal-area-left-menu-user-inititive-container {
  display: block;
}

.kb-client-personal-area-left-menu.open .kb-client-personal-area-left-menu-user-inititive-container {
  display: none;
}

.kb-client-personal-area-left-menu.close .kb-client-personal-area-left-menu-items-title {
  display: none;
}

.kb-client-personal-area-left-menu-items-icon {
  width: 50px;
}

.kb-client-personal-area-left-menu-items-contaienr {
  padding: 10px 0px;
}

.kb-client-personal-area-left-menu-user-inititive-container {
  width: 40px;
  height: 40px;
  border-radius: 50%;
  /* 
      Construction d'une couleur RGBA à partir d'une couleur en Hex et d'une opacité donnée à l'aide du module intégré dans les fichiers SCSS 
      https://sass-lang.com/documentation/modules/ & https://sass-lang.com/documentation/values/numbers/
  */
  background-color: #3b4f9e;
  color: #FFFFFF !important;
}

.kb-client-personal-area-left-menu-user-inititive-text {
  padding-top: 10px;
}

.kb-client-personal-area-left-menu-items-contaienr.selected {
  /* 
      Construction d'une couleur RGBA à partir d'une couleur en Hex et d'une opacité donnée à l'aide du module intégré dans les fichiers SCSS 
      https://sass-lang.com/documentation/modules/ & https://sass-lang.com/documentation/values/numbers/
  */
  background-color: #3b4f9e;
  color: #FFFFFF !important;
  border-radius: 8px;
}

.kb-client-personal-area-left-menu .kb-client-personal-area-left-menu-items-icon {
  font-size: 1.5rem;
}

.kb-client-personal-area-left-menu-bottom-items-contaienr {
  margin-top: 100px;
}

/******************************
     Derniers articles lus
******************************/
.kb-client-personal-area-last-read-post-img {
  height: 150px !important;
  min-width: 150px !important;
  object-fit: cover;
  object-position: center;
  border-radius: 4px;
}

.kb-client-personal-area-last-read-post-title {
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
  min-height: 20px;
}

.kb-client-personal-area-last-read-post-seen-date {
  color: #999999;
}

/******************************
        Mes plateformes
******************************/
.kb-client-personal-area-platforms-bloc-large {
  height: 125px;
}

.kb-client-personal-area-platforms-bloc-compact {
  height: 100px;
}

.kb-client-personal-area-platforms-label {
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
}

.kb-client-personal-area-platforms-description {
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
  font-size: 11px;
  min-height: 34px;
  line-height: 17px !important;
}

/******************************
        Mes dossiers
******************************/
.kb-client-personal-area-folders-sortable-container ul {
  list-style-type: none;
}

.kb-client-personal-area-folders-new-folder-textbox {
  min-width: 250px !important;
}

.kb-client-personal-area-folders-post-img {
  height: 50px !important;
  width: 85px;
  object-fit: cover;
  object-position: center;
  border-radius: 4px;
}

.kb-client-personal-area-folders-sortable-container .foldertree-dropable-element {
  cursor: move;
}

/******************************
        Ma séléctions
******************************/
.kb-client-personal-area-selection-list-container > ul {
  list-style-type: none;
}

.kb-client-personal-area-selection-post-card {
  height: 320px;
}

.kb-client-personal-area-selection-post-img {
  height: 150px;
  width: 296px;
  object-fit: cover;
  object-position: center;
  border-radius: 5px 5px 0px 0px;
}

.kb-client-personal-area-selection-post-title {
  display: -webkit-box;
  -webkit-line-clamp: 3;
  -webkit-box-orient: vertical;
  overflow: hidden;
  min-height: 55px;
}

.kb-client-personal-area-selection-post-sources {
  display: -webkit-box;
  -webkit-line-clamp: 3;
  -webkit-box-orient: vertical;
  overflow: hidden;
}

.kb-client-personal-area-selection-post-container.selected {
  border: 2px solid #3B4F9E;
}

/******************************
        Mes newsletters 
******************************/
.kb-client-personal-area-newsletter-title,
.kb-client-personal-area-communication-title {
  font-size: 1.3rem;
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
  height: 4rem;
}

.kb-client-personal-area-newsletter-description {
  font-size: 0.9rem;
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
  height: 2.6rem;
}

.kb-client-personal-area-newsletter-platforms {
  min-height: 25px;
}

/******************************
        Mes abonnements  
******************************/
.kb-client-personal-area-subscription-title {
  font-size: 1.4rem;
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
  height: 4rem;
}

.kb-client-personal-area-subscription-nav-container .nav-tabs .nav-link.active, .kb-client-personal-area-subscription-nav-container .nav-tabs .nav-item.show .nav-link {
  border-top: none;
  border-left: none;
  border-right: none;
  border-bottom-width: 5px;
  border-bottom-color: #53A0D8;
  border-bottom-style: solid;
}

.kb-client-personal-area-subscription-nav-container .nav-tabs .nav-link {
  border: 0px;
}

.kb-client-personal-area-subscription-nav-container .nav-link {
  padding: 20px;
  font-size: 14px;
  font-weight: bold;
}

/******************************
        Mes favoris  
******************************/
.kb-client-personal-area-my-bookmarks-list-container > ul {
  list-style-type: none;
}

.kb-client-personal-area-my-bookmarks-post-card {
  height: 315px;
  width: 300px;
}

.kb-client-personal-area-my-bookmarks-post-img {
  height: 150px;
  width: 300px;
  object-fit: cover;
  object-position: center;
  border-radius: 5px 5px 0px 0px;
}

.kb-client-personal-area-my-bookmarks-post-title {
  display: -webkit-box;
  -webkit-line-clamp: 3;
  -webkit-box-orient: vertical;
  overflow: hidden;
  min-height: 55px;
}

.kb-client-personal-area-my-bookmarks-post-sources {
  display: -webkit-box;
  -webkit-line-clamp: 3;
  -webkit-box-orient: vertical;
  overflow: hidden;
}

/***************************************************************************************************
                            Modal Abonnement tag, catégorie ou recherche 
***************************************************************************************************/
.kb-client-subscription-modal-card.kb-client-subscription-modal-white-card {
  border: 2px solid transparent;
  box-shadow: 0 1px 8px rgba(210, 193, 202, 0.45);
  border-radius: 8px;
  padding: 20px;
  background-color: white;
}

.kb-client-subscription-modal-card.kb-client-subscription-modal-white-card.selected {
  background-color: rgba(59, 79, 158, 0.1);
}

/***************************************************************************************************
                            Module de recherche > site client 
***************************************************************************************************/
/******************************
  Modal de recherche > Header 
******************************/
.kb-client-header-search {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background-color: rgba(63, 63, 63, 0.5);
  z-index: 10000;
}

.kb-client-header-search-content {
  width: 100%;
  background-color: #f6f6f6 !important;
}

/******************************
        Input > textbox
******************************/
.kb-client-search-autosuggestion-input {
  font-size: 24px;
  border-radius: 35px 0px 0px 35px !important;
  border-right: none !important;
}

.kb-client-search-autosuggestion-input.light-version {
  font-size: 11px;
}

.kb-client-search-autosuggestion-input-advanced-search-text {
  line-height: 12px;
}

.kb-client-search-autosuggestion-input:focus + .kb-client-search-autosuggestion-input-search-btn {
  border: 1px solid #3B4F9E;
}

.kb-client-search-autosuggestion-input-search-btn {
  border: solid 1px #E7E8EB;
  border-radius: 0px 35px 35px 0px;
  border-left: none;
  font-size: 1.5rem !important;
}

/******************************
        Section Résultat
******************************/
.kb-client-search-autosuggestion-result-section.kb-client-search-autosuggestion-result-section-visible-input {
  box-shadow: 0 0px 10px rgba(210, 193, 202, 0.5);
  border-radius: 8px;
  margin-top: 5px;
}

.kb-client-search-autosuggestion-result-section:not(.kb-client-search-autosuggestion-result-section-visible-input) {
  background-color: #f6f6f6 !important;
}

/* On met à transparent le fond de la zone de suggestion si la classe kb-client-search-autosuggestion-result-empty est présente (ce qui veut dire aucun résultat à afficher) */
.kb-client-search-autosuggestion-result-section:has(.kb-client-search-autosuggestion-result-empty) {
  background-color: transparent !important;
}

.kb-client-search-autosuggestion-result-container:not(.w-100) {
  width: 80% !important;
}

.kb-client-search-autosuggestion-result-container {
  -webkit-animation: kb-client-search-autosuggestion-result-container-expanding-animation 0.5s ease-out;
  min-height: 100px;
}

@keyframes kb-client-search-autosuggestion-result-container-expanding-animation {
  0% {
    height: 0px;
  }
  100% {
    height: 440px;
  }
}
/******************************
   Les éléments du résultat
******************************/
.kb-client-search-autosuggestion-result-elements {
  max-height: 450px;
  overflow-y: auto;
  overflow-x: hidden;
}

/************************************
Les éléments du résultat > Articles 
************************************/
.kb-client-search-autosuggestion-result-post-container {
  border: 2px solid transparent;
  box-shadow: 0 1px 8px rgba(210, 193, 202, 0.45);
  border-radius: 8px;
  padding: 0px 10px 0px 0px;
}

.kb-client-search-autosuggestion-result-elements-light-version .kb-client-search-autosuggestion-result-post-container {
  padding: 5px 10px 5px 10px !important;
}

.kb-client-search-autosuggestion-result-post-container:hover {
  border: 2px solid #d3d3d3;
}

.kb-client-search-autosuggestion-result-post-img {
  height: 65px !important;
  width: 100px !important;
  object-fit: cover;
  object-position: center;
  border-radius: 8px 0px 0px 8px;
}

.kb-client-search-autosuggestion-result-post-source {
  display: -webkit-box;
  -webkit-line-clamp: 1;
  -webkit-box-orient: vertical;
  overflow: hidden;
}

.kb-client-search-autosuggestion-result-post-title {
  min-height: 36px;
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
  line-height: 1.6rem;
  font-size: 1.25rem;
}

.kb-client-search-autosuggestion-result-elements-light-version .kb-client-search-autosuggestion-result-post-title {
  min-height: 32px;
  line-height: 1.4rem !important;
  font-size: 1rem !important;
}

/*******************************************************
   Les éléments du résultat > Tag/Catégorie/Evenements 
*******************************************************/
.kb-client-search-autosuggestion-result-tag-category-badge, .kb-client-search-autosuggestion-trending-search-badge, .kb-client-search-autosuggestion-result-event-badge {
  border-radius: 8px;
  background-color: #3B4F9E;
  padding-top: 0.25rem !important;
  padding-bottom: 0.25rem !important;
  padding-right: 1rem !important;
  padding-left: 1rem !important;
}

.kb-client-search-autosuggestion-result-tag-category-badge:hover, .kb-client-search-autosuggestion-trending-search-badge:hover, .kb-client-search-autosuggestion-result-event-badge:hover {
  box-shadow: 10px 4px 8px rgba(210, 193, 202, 0.5);
}

/****************************************************
        Les éléments du résultat > Sources 
****************************************************/
.kb-client-search-autosuggestion-result-source-badge {
  color: #53A0D8;
  border-color: #53A0D8;
}

.kb-client-search-autosuggestion-result-source-badge:hover {
  box-shadow: 10px 4px 8px rgba(210, 193, 202, 0.5);
  background: #53A0D8 !important;
  color: white !important;
}

.kb-client-search-autosuggestion-result-source-badge:hover .kb-client-search-autosuggestion-result-highlight {
  background-color: #FFFFFF;
  color: #53A0D8;
}

/****************************************************
    Highlight sur les éléments du résultat  
****************************************************/
.kb-client-search-autosuggestion-result-highlight {
  background-color: #53A0D8;
  color: #FFFFFF;
  padding: 1px;
  font-weight: bolder;
}

/***************************************************************************************************
                            Formulaire de recherche avancée
***************************************************************************************************/
.advanced-search-title-area {
  background-color: rgba(59, 79, 158, 0.15);
  border-radius: 8px;
  padding: 20px;
}

.advanced-search-title-area-text {
  color: #3B4F9E !important;
}

.advanced-search-more-options {
  text-decoration: none;
}

.advanced-search-more-options:after {
  font-family: "Font Awesome 6 Pro", "Font Awesome 6 Regular", "Font Awesome 6 Brands", "Arial";
  content: "\f0d8";
  font-size: 1.4rem;
  margin-left: 10px;
}

.advanced-search-more-options.collapsed:after {
  font-family: "Font Awesome 6 Pro", "Font Awesome 6 Regular", "Font Awesome 6 Brands", "Arial";
  content: "\f0d7";
  font-size: 1.4rem;
  margin-left: 10px;
}

/***************************************************************************************************
                                WIDGET MENU > Type ACCORDEON 
***************************************************************************************************/
.kb-client-menu-widget-accordion-item:before {
  font-family: FontAwesome;
  padding-right: 10px;
  font-size: 1.3rem;
}

.kb-client-menu-widget-accordion-item:not(.collapsed):before {
  content: "\f068";
  /* Correspond au signe plus */
}

.kb-client-menu-widget-accordion-item.collapsed:before {
  content: "\f067";
  /* Correspond au signe moins */
}

/***************************************************************************************************
                                MODULE D'IA
***************************************************************************************************/
.kb-ai-search-user-prompt-modal-list-container {
  min-height: 100px;
}

.kb-post-ai-client-result-text {
  text-align: justify;
}