ul {
	  margin-left: 0;
	  padding-left: 15;
	}
.table-wrap {
  display: inline-block;
  max-width: 100%;
  margin: 0 auto;
  --scrollbar-largeur: clamp(20px, 2vw, 28px);
}
.table-wrap table.alt.table-head {
  width: calc(100% - var(--scrollbar-largeur)) !important;
  table-layout: fixed;
  border-collapse: separate !important;
  border-spacing: 0 !important;
  margin: 0 !important;
}

.table-wrap table.alt.table-body {
  width: 100% !important;
  table-layout: fixed;
  border-collapse: separate !important;
  border-spacing: 0 !important;
  margin: 0 !important;
}

.table-scroll {
  max-height: 60vh;
  overflow-y: scroll;
  overflow-x: hidden;
  width: 100%;
  box-sizing: border-box;
}

/* Scrollbar */
.table-scroll::-webkit-scrollbar {
  width: clamp(20px, 2vw, 28px);
}

.table-scroll::-webkit-scrollbar-track {
  background: #8089B3;
  border-left: 3px solid #686b3d;
}

.table-scroll::-webkit-scrollbar-thumb {
  background: linear-gradient(#ececd9, #a8a885);
  border-radius: 14px;
  border: 2px solid #76805b;
}

.table-scroll::-webkit-scrollbar-thumb:hover {
  background: linear-gradient(#e0e0a0, #aaaa5f);
}

.tri-click {
  cursor: pointer;
  user-select: none;
}

.tri-arrow {
  margin-left: 5px;
  color: rgb(108,214,108);
}
/* Entête actif */
.table-head th.tri-actif {
  background-image: linear-gradient(hsl(230, 45%, 72%), hsl(230, 45%, 56%)) !important;
  color: #fff8d8;
}

/* Colonne active */
table.alt.table-body td.tri-col {
  background: rgba(120, 140, 220, 0.25) !important;
  background-color: rgba(120, 140, 220, 0.25) !important;
  background-image: none !important;
}

/* Hover optionnel (tu peux l'enlever si tu veux) */
.table-body tr:hover td {
  background-color: #c9dcff;
}

	/* Sur écran étroit : montrer la version courte */
	
	 
.titre-classe-cell {
  width: 25%;
  text-align: center;
  white-space: nowrap;
}

.marquee-cell {
  width: 100%;
  max-width: 100%;
  overflow: hidden !important;
  padding: 0 !important;
}

.marquee-container {
  display: block;
  width: 100%;
  max-width: 100%;
  overflow: hidden !important;
  position: relative;
  box-sizing: border-box;
  white-space: nowrap;
}

.marquee-prochain {
  display: inline-block;
  white-space: nowrap;
  padding-left: 100%;
  animation: defilement 14s linear infinite;
  color: #fff8d8;
}

@keyframes defilement {
  from {
    transform: translateX(0);
  }
  to {
    transform: translateX(-100%);
  }
}