html {
  height: 100%;
}

.central-panel {
  width: 75%;
  height: 3%;
  vertical-align: bottom;
  position: fixed;
  top: 0px;
  right: 15%;
}
.editor-container {
  width: 100%;
  height: 100%;
}
.player-load-button-container {
  position: fixed; /* Pour couvrir toute la page */
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background-color: rgba(204, 204, 204, 0.5); /* Opacité de 0.5 */
  display: flex;
  justify-content: center; /* Centre le bouton horizontalement */
  align-items: center; /* Centre le bouton verticalement */
}

.tile-link {
  text-decoration: none;
  display: inline-block;
}

.tile-button {
  background-color: #555;
  color: #eee;
  padding: 8px 12px;
  border-radius: 3px;
  border: 1px solid #777;
  cursor: pointer;
  transition: background-color 0.3s, color 0.3s, box-shadow 0.3s;
}

.tile-button:hover {
  background-color: #777;
  color: #fff;
  border-color: #999;
}

.tile-button-text {
  font-family: "Eurostile", sans-serif;
  font-size: 20px;
  font-weight: normal;
  text-transform: uppercase;
  color: #8dadca;
  text-shadow: 0 0 5px rgba(0, 0, 0, 0.3);
}

.tab-bottom nav a {
  background-color: #555; /* Couleur de fond plus sombre */
  color: #eee; /* Couleur du texte claire */
  padding: 8px 12px;
  margin-right: 5px;
  border-radius: 3px;
  text-decoration: none;
  cursor: pointer;
  border: 1px solid #777; /* Bordure discrète */
  transition: background-color 0.3s, color 0.3s, box-shadow 0.3s;
}

.tab-bottom nav a:hover {
  background-color: #777; /* Couleur de fond plus claire au survol */
  color: #fff; /* Couleur du texte plus claire au survol */
  border-color: #999; /* Bordure plus claire au survol */
}

.tab-bottom nav a.active {
  /* Style pour l'onglet sélectionné */
  background-color: #34404e; /* Gris-bleu clair */
  color: #fff; /* Couleur du texte claire pour le contraste */
  border-color: #87e7e27c; /* Bordure gris-bleu foncé */
  box-shadow: 0 2px 4px rgba(0, 0, 0, 0.2); /* Ombre subtile */
}
.tab-bottom nav a span {
  margin-top: 2px;
  margin-left: 5px; /* Espacement entre le texte et le "x" */
}

.tab-bottom nav a:last-of-type {
  /* Style spécifique pour le bouton "+" */
  order: 1; /* Le bouton "+" sera le dernier */
}

.tab-container a {
  display: inline-flex; /* Pour aligner les éléments horizontalement */
  align-items: center; /* Pour centrer verticalement */
}