body {
  font-family: 'Arial', sans-serif;
  background-color: #FFF9EE;
  color: #333;
  margin: 0;
  padding: 0;
  display: flex;
  flex-direction: column;
  min-height: 100vh;
}

h1 {
  text-align: center;
  margin: 0;
  margin-right: 220px;
  color: #FFA916;
  padding: 10px 0;
}

/* Bloc titre + recherche */
.header-container {
  position: sticky;
  top: 0;
  background-color: #f9f9f9;
  color: white;
  padding: 10px 20px;
  align-items: center;
  box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1);

}
.header-container .logo {
  height: 50px; /* taille fixe pour le logo */
  margin-right: 20px; /* espace entre logo et titre */
  flex-shrink: 0; /* empêcher le logo de rétrécir */
  
}

.header-container .lignetitre {
  display: flex;
  align-items: center; /* centre verticalement logo et titre */
  position: relative; /* pour gérer le titre en position absolue */
}

.header-button {
    position: absolute;
    margin: 0px;
    top: 11px;
    right: 20px;
    max-width: 200px;
    width: 100%;
    background-color: #ffa916;
    color: black;
    text-decoration: none;
    padding: 2px 2px;
    border-radius: 5px;
    font-size: 11px;
    text-align: center;
    display: block;
    transition: color 0.3s ease, background-color 0.3s ease;
    box-sizing: border-box;
    font-weight: bold;
    box-shadow: 0px 2px 2px #0000003b;
	border: 1px solid #d08b15;
}

.header-button:hover {
    background-color: #ca152c;
	color: black;
}

#csvFileInput,
#search-box {
  display: block;
  margin: 10px auto;
  padding: 10px;
  width: 80%;
  font-size: 1em;
  border: 1px solid #ccc;
  border-radius: 4px;
}



/* Descriptif NON FIXE */
.description {
  width: 80%;
  margin: 0px auto;
  padding: 0 15px;
  color: #555;
  font-size: 1em;
  line-height: 1.4;
}


.MAJ {
  width: 80%;
  margin: 0px auto;
  padding: 0 15px;
  color: #555;
  font-size: 1em;
  font-weight: bold;
  line-height: 1.4;
}

table {
  width: 80%;
  border-collapse: collapse;
  margin: 0 auto;
}

/* Exemple — à ajuster selon tes besoins */
.col-0 { width: 15%; font-weight: bold; }
.col-1 { width: 10%; }
.col-2 { width: 5%; }
.col-3 { width: 8%; }
.col-4 { width: 9%; }
.col-5 { width: 10%; }
.col-6 { width: 10%; }
.col-7 { width: 15%; }


/* Pour que les largeurs soient respectées */
#data-table {
  table-layout: fixed;
}




/* On fixe l'entête */
#data-table thead th {
  position: sticky;
  top: var(--sticky-offset, 0px); /* valeur par défaut au cas où */
  border: 1px solid black;
  background-color: #ca152c;
  color:#f9f9f9;
  z-index: 100;
}


#data-table tbody tr:hover {
    background-color: #fcde97;   /* couleur de surbrillance */
         
}

th, td {
  border: 1px solid #ddd;
  padding: 1px;
  text-align: Center;
  word-wrap: break-word;
  overflow-wrap: break-word;
}

th:hover {
  background-color: #e0e0e0;
}

tbody tr:nth-child(even) {
  background-color: #f9f9f9;
}
tbody tr:nth-child(2n+1) {
  background-color: whitesmoke;
}

.sort-indicator {
  margin-left: 5px;
  font-size: 0.8em;
  color: #888;
}