body {
    background-color: #F3F3F3;
    padding-top: 5.5rem;
    padding-left: 12px;
}

.btn-action {
  padding:2px;
}

text-wisedev {
color:#FF7848;
}

.btn-primary,.btn-primary:visited {
  background-color: #FF7848;
  border-color: #FF7848;
}

.btn-primary:hover, 
.btn-primary:active,
.btn-primary:focus,
.btn-primary:disabled
{
    background-color:  #e06336; 
    border-color: #e06336;
    color:#dddddd;
}

.bg-wisedev {
  background-color:  #FF7848; 
}

.color-wisedev {
  color:  #c57254; 
}


.bg-wisedev-brown {
  background-color:  #c57254
}

.bg-wisedev-gray {
  background-color:  #b5b5b5
}

.bg-wisedev-yellow {
  background-color:  #ffffa4;
  color:#444444;
}

.wisedev-badge {
  background-color:  #FF7848;
  border-radius:20px;
  color:#ffffff;
  font-weight:bold;
  padding:8px 20px 8px 20px;
  text-decoration: none;
}

.wisedev-badge-brown {
  background-color:  #c57254;
  border-radius:20px;
  color:#ffffff;
  font-weight:bold;
  padding:8px 20px 8px 20px;
}

.wisedev-badge-purple {
  background-color:  #808eff;
  border-radius:20px;
  color:#ffffff;
  font-weight:bold;
  padding:8px 20px 8px 20px;
  text-decoration: none;
}

.wisedev-badge-red {
  background-color:  #ff5770;
  border-radius:20px;
  color:#ffffff;
  font-weight:bold;
  padding:8px 20px 8px 20px;
}

.wisedev-badge-grey {
  background-color:  #aaaaaa;
  border-radius:20px;
  color:#ffffff;
  font-weight:bold;
  padding:8px 20px 8px 20px;
}
.wisedev-badge {
  background-color:  #FF7848;
  border-radius:20px;
  color:#ffffff;
  font-weight:bold;
  padding:8px 20px 8px 20px;
}



.body-connected {
  padding-top: 3.5rem !important;
/*  padding-left: 220px; */
}

.top-bar {
  margin-left: 150px;
}
.table-container-medium {
  padding: 2rem;
  max-width: 1000px;
}

.small-image {
  width:150px;
  border-radius: 30px;
  opacity:0.7;
}

.profil-image {
  width:150px;
  border-radius: 100px;
}

.home-button {
  border: 2px solid #808080;
  width: 34px;
  border-radius: 5px;
  padding-left: 5px;
}
.table-border {
  border:1px solid #e0e0e0;
}

.table-head {
  --bs-table-bg: #e0e0e0;
}

.active>.page-link, .page-link.active {
  z-index: 3;
  color: var(--bs-pagination-active-color);
  background-color: #FF7848;
  border-color: #FF7848;
}

.table-th {
  font-weight: normal;
}

.pagination {
  --bs-pagination-color: #000000;
}

.sortable{
  font-weight: normal;
  color: #000000;
}

.form-medium {
  max-width: 550px;
  padding: 1rem;
  background-color: #dddddd;
  border-radius: 10px;
}

.form-large {
  max-width: 800px;
  min-width: 650px;
  padding: 1rem;
  background-color: #dddddd;
  border-radius: 10px;
}

.subform-large {
  background-color: #ebebeb;
  border-radius: 5px;
  padding:5px;
}

.form-signin {
    max-width: 330px;
    padding: 1rem;
    background-color: #dddddd;
    border-radius: 10px;
  }

.form-signin .form-floating:focus-within {
    z-index: 2;
  }
  
.form-signin input[type="text"] {
    margin-bottom: -1px;
    border-bottom-right-radius: 0;
    border-bottom-left-radius: 0;
  }
  
.form-signin input[type="password"] {
    margin-bottom: 10px;
    border-top-left-radius: 0;
    border-top-right-radius: 0;
}

.button-corail {
    background-color: #FF7848;
    color:#ffffff;
}

.button-corail:visited{
  background-color:  #FF7848; 
  color:#ffffff;
}

.button-corail:hover, 
.button-corail:active,
.button-corail:disabled,
.button-corail:focus{
    background-color:  #e06336; 
    color:#dddddd;
}

.toggle-password-button-login {
  /* Ajoutez vos styles personnalisés ici */
  margin-top: 30px;
}

.site-header {
  background-color: #ffffff;
  font-size: 18px;
  border-bottom: 1px solid #dddddd;
}

.site-footer {
  background-color: #ffffff;
  font-size: 18px;
  border-top: 1px solid #dddddd;
}

.menu-actif {
  color:#595959;
  font-weight: bold;
}
.menu-actif:hover {
  color:#595959;
  font-weight: bold;
  text-decoration: underline;
}
.menu-inactif {
  color:#595959;
}
.menu-inactif:hover {
  color:#e0e0e0;
  text-decoration: underline;
}

.left-menu {
  margin-top: 3.7rem !important;
  width:fit-content;
  min-width: 180px;
  z-index: 0;
  background-color: #e0e0e0;
}

.href-notextdecoration  {
  text-decoration: none !important;
}

.dropdown-toggle { outline: 0; }

.btn-toggle {
  padding: .25rem .5rem;
  font-weight: 600;
  color: var(--bs-emphasis-color);
  background-color: transparent;
  padding: 0px 10px 0px 5px;
}
.btn-toggle:hover,
.btn-toggle:focus {
  color: rgba(var(--bs-emphasis-color-rgb), .85);
  background-color: var(--bs-tertiary-bg);
}

.btn-toggle::before {
  width: 1.25em;
  line-height: 0;
  content: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 16 16'%3e%3cpath fill='none' stroke='rgba%280,0,0,.5%29' stroke-linecap='round' stroke-linejoin='round' stroke-width='2' d='M5 14l6-6-6-6'/%3e%3c/svg%3e");
  transition: transform .35s ease;
  transform-origin: .5em 50%;
}

[data-bs-theme="dark"] .btn-toggle::before {
  content: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 16 16'%3e%3cpath fill='none' stroke='rgba%28255,255,255,.5%29' stroke-linecap='round' stroke-linejoin='round' stroke-width='2' d='M5 14l6-6-6-6'/%3e%3c/svg%3e");
}

.btn-toggle[aria-expanded="true"] {
  color: rgba(var(--bs-emphasis-color-rgb), .85);
}
.btn-toggle[aria-expanded="true"]::before {
  transform: rotate(90deg);
}

.btn-toggle-nav a {
  padding: .1875rem .5rem;
  margin-top: .125rem;
  margin-left: 1.25rem;
}
.btn-toggle-nav a:hover,
.btn-toggle-nav a:focus {
  background-color: var(--bs-tertiary-bg);
}

.active-subfunction {
  background-color: var(--bs-tertiary-bg);
}

.alert {
  margin: 30px auto;
  max-width: 800px;
  min-width: 650px;
}

.field-info {
  font-size: 12px;
  font-style: italic;
  margin: -15px 0px 15px 0px;

}

.check-link-off {
  font-size: 24px;
  color:#d9d9d9;
  font-weight: bold;
}
.check-link-view {
  font-size: 24px;
  color:#2cb12c;
  opacity:0.3;
  font-weight: bold;
}
.check-link-edit {
  font-size: 24px;
  color:#2cb12c;
  font-weight: bold;
}

.custom-head {
  font-size: 15px;
  font-weight: normal;  
  border-bottom: 1px solid #595959;
}

.custom-td {
  line-height:18px;
}

.btn-form-collection{
  margin-left: 0px;
}

.form_collection {
  display:ruby;
  background:transparent;
  border:0px;
}

/*******************************************************************************/

.sidebar {
  height: 100%; /* 100% Full-height */
  width: 0; /* 0 width - change this with JavaScript */
  position: fixed; /* Stay in place */
  z-index: 1; /* Stay on top */
  top: 0;
  left: 0;
  background-color: #d3d3d3 !important;
  overflow-x: hidden; /* Disable horizontal scroll */
  padding: 70px 0px 0px 0px;  /* Place content 60px from the top */
  transition: 0.5s; /* 0.5 second transition effect to slide in the sidebar */
}


/* The button used to open the sidebar */
.openbtn {
  font-size: 32px;
  cursor: pointer;
  border: none;
  color:#808080;
  padding:2px;
}

.openbtn:hover {
  color:#c0c0c0;
}

#main {
  transition: margin-left .5s; /* If you want a transition effect */
}

/* Style for assitants */

.assistant-responses {
  padding:5px;
  height: 50vh;
  border: 1px solid #dddddd;
  border-radius: 5px;
}

.user-message {
    text-align: right;
    padding: 10px;
    background-color: #d2cdff;
    border-radius: 10px;
    min-width: 250px;
    float:right;
    max-width: 80%; /* Ajuste la largeur maximale */
    word-wrap: break-word; /* Empêche les débordements */
  }

.assistant-message {
  border: 1px dashed #dddddd;
  margin: 5px 0px;
  text-align: left;
  padding: 10px;
  display: inline-block;
  background-color: rgb(255, 255, 255);
  width: 100%;
  border-radius: 10px;
}

.assistant-reference {
  font-size:12px;
  vertical-align: top;
}

.assistant-left {
  border: 1px solid #dddddd;
  border-radius: 5px;
}

.conversation {
  background-color: #ffffff;  
  font-size: 15px;
}

.activeConversation {
  background-color: #dddddd;  
  font-size: 15px;
  font-weight: 600;
}

.copyResponse {
  position:relative;
  top: -23px;
  background-color: #ffffff;
  width: 22px;
  padding: 2px;
  left: -12px;
  color: #586066;
  cursor:pointer;
}  

.sentiment-tres-negatif,
.sentiment-negatif,
.sentiment-neutre,
.sentiment-positif,
.sentiment-tres-positif {
  padding: 3px; /* Propriété commune */
  border-radius: 10px;
  white-space: nowrap;
  width:100px;
  text-align: center;
}

.sentiment-tres-negatif {
  background-color: #ed1a1a; /* Rouge foncé */
  color: white;
}

.sentiment-negatif {
  background-color: #fb9381; /* Rouge clair */
  color: black;
}

.sentiment-neutre {
  background-color: #ffe86b; /* Jaune */
  color: black;
}

.sentiment-positif {
  background-color: #6ccd6c; /* Vert clair */
  color: black;
}

.sentiment-tres-positif {
  background-color: #0eb10e; /* Vert très clair */
  color: white;
}

.assistant-container {
  height: 90vh !important;
  border-left: 1px solid #d3d3d3;
}

.solr-document-link {
  font-size: 12px;
  font-style: italic;
  text-decoration: none;
  color:#2cb12c;
}

.facet-link {
  background-color: #fdf7ad;
  color:#444444;
  border-radius: 5px;
  border:1px solid #cccccc;
  padding: 2px 5px;
}

.prev-link {
  font-size: 20px;
  color: #FF7848;
  margin-left: -10px;
  margin-right: 10px;
}

.q-page-link {
  font-size: 12px;
}
.q-page-ul {
  margin:10px 0px 0px 0px;
}
.q-data {
  background-color: #e0e0e0;
  padding: 1px 3px;
  border-radius: 3px;
  margin-right: 5px;
}
.q-title {
  font-size: 18px;
  font-weight: 500;
}

.q-collapse {
  color: #808080;
  cursor:pointer;
  font-size: 18px;
}

.q-fact {
  margin-bottom:5px;
  background-color: #ffffff;  
  opacity:0.7;
}
.q-fact-list{
  font-size: 15px;
}
.q-fact-active {
  background-color: #ffeeee;
  color:#808080;
  margin-bottom:5px;
}

.q-factTitle-active {
  font-weight:500;
  color:#222222;
  margin-left:-5px;
}

.card-services {
  background-color: #faf5c0 !important;
}

.use-case-image{
  vertical-align: top;
  padding: 8px;
  font-size: 26px;
}

.use-case-texte{
  vertical-align: top;
  padding: 8px;
  font-size: 16px;
}

.use-case-card{
min-height: 750px;
}

.text-wisedev {
  color: #FF7848;
}
.step {
    margin-bottom: 40px;
    background-color: #f8f9fa; 
    border-radius: 8px; 
    box-shadow: 0 4px 8px rgba(0,0,0,0.1); 
    margin-bottom: 20px;
}
.step-icon {
    font-size: 2rem;
    color: #FF7848;
}
.step-report {
    background: #808eff;
    padding: 50px 20px;
    text-align: center;
}
.step-container {
  gap: 5px; /* Définit l'espace entre les icônes */
  align-items: center; /* Assure un alignement vertical correct */
}

#chatbot-icon {
  position: fixed;
  bottom: 20px;
  right: 20px;
  width: 50px;
  height: 50px;
  background-color: #FF7848;
  color: white;
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  box-shadow: 0 4px 8px rgba(0, 0, 0, 0.2);
  cursor: pointer;
  z-index: 9999;
}

#chatbot-icon i {
  font-size: 24px;
}

#chatbot-container {
  position: fixed;
  bottom: 80px;
  right: 20px;
  font-size: 13px;
  width: 330px;
  box-shadow: 0 4px 8px rgba(0, 0, 0, 0.2);
  border-radius: 10px;
  background-color: #fff;
  font-family: Arial, sans-serif;
  overflow: hidden;
  z-index: 9999;
  display: none;
}

#chatbot-container.expanded {
  display: block;
}

#chatbot-header {
  background-color: #FF7848;
  color: white;
  padding: 10px;
  text-align: center;
  font-size: 16px;
  font-weight: bold;
}

#chatbot-body {
  display: flex;
  flex-direction: column;
  height: 500px;
}

#chatbot-messages {
  flex-grow: 1;
  padding: 10px;
  overflow-y: auto;
  background-color: #f5f5f5;
}


#chatbot-input {
  border: none;
  border-top: 1px solid #ddd;
  padding: 10px;
  width: 249px;
  font-size: 14px;
}

#chatbot-input:focus {
  outline: none;
}

.chatbot-message {
  margin-bottom: 10px;
}

.chatbot-message.user {
  text-align: right;
  color: #000000;
}

.chatbot-message.assistant {
  text-align: left;
  color: #333;
}

.chatbot-copy {
    position:relative;
    top: -21px;
    background-color:transparent;
    width: 22px;
    padding: 2px;
    left: -12px;
    color: #586066;
    cursor:pointer;
}

.btn-chatbot-send {
  padding:4px;
  font-size: 22px;
}

.btn-chatbot,.btn-chatbot:visited {
  background-color: #FF7848;
  border-color: #FF7848;
  color:#eeeeee;  
}

.btn-chatbot:hover, 
.btn-chatbot:active,
.btn-chatbot:focus,
.btn-chatbot:disabled
{
    background-color:  #FF7848; 
    border-color: #FF7848;
    color:#dddddd;
}

.rounded-video {
  border-radius: 15px; /* Ajustez pour arrondir les coins */
  box-shadow: 0 4px 8px rgba(0, 0, 0, 0.2); /* Ajoutez une ombre pour l'esthétique */
  background-color: transparent; 
}


@media screen and (max-width: 580px) {
  .chatTable {
    display: block;
  }
}

.chatRow {
  display: table-row;
  background: #f6f6f6;
}
.chatRow:nth-of-type(odd) {
  background: #e9e9e9;
}
.chatRow.header {
  font-weight: 400;
  color: #ffffff;
  background: #FF7848;
}

.chatRow.green {
  background: #27ae60;
}
.chatRow.blue {
  background: #2980b9;
}
.chatRow.gray {
  background: #808080;
}
@media screen and (max-width: 580px) {
  .chatRow {
    padding: 14px 0px 7px 0px;
    display: block;
  }
  .chatRow.header {
    padding: 0;
    height: 6px;
  }
  .chatRow.header .cell {
    display: none;
  }
  .chatRow .cell {
    margin-bottom: 10px;
  }
  .chatRow .chatCell:before {
    margin-bottom: 3px;
    content: attr(data-title);
    min-width: 98px;
    font-size: 10px;
    line-height: 10px;
    font-weight: bold;
    text-transform: uppercase;
    color: #969696;
    display: block;
  }
}

.chatCell {
  padding: 6px 12px;
  display: table-cell;
}

@media screen and (max-width: 580px) {
  .chatCell {
    padding: 2px 16px;
    display: block;
  }
}

.dots-loading::after {
  content: '...';
  animation: dots 1.5s steps(3, end) infinite;
}

@keyframes dots {
  0% {
    content: '.';
    font-weight: bold;
    line-height: 18px;
    font-size: 18px;
    color:#888888;
  }
  33% {
    content: '..';
    font-weight: bold;
    color:#888888;
    line-height: 18px;
    font-size: 18px;
  }
  66% {
    content: '...';
    font-weight: bold;
    color:#888888;
    line-height: 18px;
    font-size: 18px;
  }
  100% {
    font-size: 18px;
    color:#888888;
    font-weight: bold;
    line-height: 18px;
    content: '....';
  }
}