.tab-button {
  transition: all 0.2s ease;
}

.active-tab {
  border-bottom: 2px solid #facc15; /* jaune Tailwind (yellow-400/500) */
  color: #ca8a04; /* texte jaune foncé */
  font-weight: 600;
}

.no-scrollbar::-webkit-scrollbar {
  display: none;
}
.no-scrollbar {
  -ms-overflow-style: none;
  scrollbar-width: none;
}


.limit-two-lines {
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
}
.limit-three-lines {
    display: -webkit-box;
    -webkit-line-clamp: 3;
    -webkit-box-orient: vertical;
    overflow: hidden;
}
.limit-six-lines {
    display: -webkit-box;
    -webkit-line-clamp: 6;
    -webkit-box-orient: vertical;
    overflow: hidden;
}


/* Styles personnalisés si nécessaire, par exemple pour la barre de progression */
.progress-bar-container {
    height: 8px;
    background-color: #e0e0e0;
    border-radius: 4px;
    overflow: hidden;
}
.progress-bar {
    height: 100%;
    border-radius: 4px;
    transition: width 0.5s ease-in-out, background-color 0.5s ease-in-out;
}

  .menu-item.active {
    background-color: #374151; /* bg-gray-700 */
    color: #60a5fa; /* text-blue-400 */
    font-weight: bold;
    border-left: 4px solid #3b82f6; /* ligne bleue à gauche */
    padding-left: 0.75rem;
}

/* Barre flottante */
.barre-connexion {
    position: fixed;
    top: 0;
    right: 0;
    left: 0;
    background-color: rgba(255, 255, 255, 0.95);
    backdrop-filter: blur(6px);
    box-shadow: 0 2px 8px rgba(0,0,0,0.1);
    z-index: 50;
}

/* Pied de page */
footer {
    background-color: #464e59ff; /* gray-800 */
    color: #d1d5db; /* gray-300 */
}
/* Modal */
.modal {
    display: none;
}
.modal.active {
    display: flex;
}

.mot {
    opacity: 0.3;
    transition: opacity 0.2s ease;
}
.mot.actif {
    opacity: 1;
    color: #2563eb;      /* bleu Tailwind */
    font-weight: bold;
}