.score-blue {
  background-color: #a29fff;
}

.score-green {
  background-color: #71d176;
}

.score-yellow {
  background-color: #ffd966;
}

.score-orange {
  background-color: #ffb266;
}

.score-rouge {
  background-color: #e57373;
}

.score-violet {
  background-color: #c466ff;
}

/** Si None / undefined**/
.score-gray {
  background-color: #e9e1d3;
}

.tab-btn.active {
  background-color: #4c6680;
  color: white;
}

#sort-occurences:hover,
#sort-score:hover {
  background-color: #fadcc2;
}

.phoneme-color-violet {
  background-color: #a29fff;
  color: white;
} /* 9 */

.phoneme-color-green {
  background-color: #71d176;
  color: black;
} /* 8 */

.phoneme-color-yellow {
  background-color: #ffd966;
  color: black;
} /* 7 */

.phoneme-color-orange {
  background-color: #ffb266;
  color: black;
} /* 6-5 */

.phoneme-color-red {
  background-color: #e57373;
  color: white;
} /* 4-3-2-1-0 */

.phoneme-color-gray {
  background-color: #8f8b8b;
  color: white;
} /* not calculated */

.phoneme-color-vowel {
  background-color: #ffb266;
  color: black;
} /* moki consonne */

.phoneme-color-consonant {
  background-color: #a29fff;
  color: black;
} /* moki consonne */

/* .phoneme-color-green       { background-color: #6bc178; color: white; }
.phoneme-color-lightgreen  { background-color: #c5e384; color: black; }
.phoneme-color-yellow      { background-color: #f2d06b; color: black; }
.phoneme-color-orange      { background-color: #e6a57e; color: black; }
.phoneme-color-red         { background-color: #d07c7c; color: white; }
.phoneme-color-gray        { background-color: #8f8b8b; color: white; } */

#results-scroll {
  max-height: 70vh;
  overflow-y: auto;
  overflow-x: hidden;
}

#results-header-wrap,
#results-header-wrap table {
  -webkit-transform: translateZ(0);
  transform: translateZ(0);
  backface-visibility: hidden;
  z-index: 50;
}

#results-header-wrap {
  scrollbar-gutter: stable;
}

@media (min-width: 768px) {
  #results-header-wrap {
    overflow: hidden;
  }
}

#results-header thead tr {
  height: 24px;
}

#results-header,
#results {
  table-layout: fixed;
  width: 100%;
  border-collapse: collapse;
}

#results thead {
  display: none; /* on cache le thead du body */
}

#results-header thead.hidden {
  display: none; /* caché tant qu’il n’y a pas de résultats */
}
#results-header thead {
  display: table-header-group;
}

#results-scroll {
  max-height: 70vh;
  overflow-y: auto;
  overflow-x: hidden;
  scrollbar-gutter: stable;
}