/* *******************************
    MAIN CONTAINER GLASS EFFECT
******************************** */
/* Appliqué à l’élément principal (#mastodon) */
#mastodon {
  margin: 20px auto;
  padding: 20px;
  max-width: 1200px;
  background: rgba(255, 255, 255, 0.2);  /* Fond translucide pour l'effet glass */
  border: 1px solid rgba(255, 255, 255, 0.4);
  border-radius: 8px;
  box-shadow: 0 1px 3px rgba(0, 0, 0, 0.05);
  backdrop-filter: blur(12px);
  -webkit-backdrop-filter: blur(12px);
}

/* *******************************
    BOUTONS & LIENS (EFFET GLASS ASSOMBRI)
******************************** */
/* Pour les éléments <button>, les inputs de type submit et les liens ayant la classe .button (et .button.primary) */
button,
a.button,
input[type="submit"],
a.button.primary {
  background: linear-gradient(145deg, rgba(210,210,210,0.8), rgba(190,190,190,0.8));
  border: none;
  border-radius: 6px;
  box-shadow: 1px 1px 3px rgba(190,190,190,0.5), -1px -1px 3px rgba(255,255,255,0.7);
  padding: 10px 20px;
  font-size: 16px;
  color: #000 !important;  /* Texte en noir, forcé avec !important */
  text-decoration: none;
  transition: all 0.2s ease;
  cursor: pointer;
}

button:active,
a.button:active,
input[type="submit"]:active,
a.button.primary:active {
  box-shadow: inset 1px 1px 3px rgba(190,190,190,0.5),
              inset -1px -1px 3px rgba(255,255,255,0.7);
}

/* *******************************
    STYLE POUR .files-list__row-name-link
******************************** */
.files-list__row-name-link {
  background: linear-gradient(145deg, rgba(255,255,255,0.8), rgba(245,245,245,0.8));
  color: #000;
  text-decoration: none;
  padding: 5px 10px;
  border-radius: 4px;
  transition: background 0.2s ease;
}

/* *******************************
    OVERRIDE POUR .header-menu__trigger
    (Pas d'effet glass sur cet élément)
******************************** */
.header-menu__trigger {
  background: none !important;
  backdrop-filter: none !important;
  -webkit-backdrop-filter: none !important;
  box-shadow: none !important;
  border: none !important;
}

/* *******************************
    GLOBAL STYLES
******************************** */
body {
  background: url('ton-image-de-fond.jpg') no-repeat center center fixed;
  background-size: cover;
  font-family: "Segoe UI", Tahoma, Geneva, Verdana, sans-serif;
  margin: 0;
  padding: 0;
}

header {
  text-align: center;
  margin-bottom: 20px;
}

footer {
  text-align: center;
  font-size: 0.9em;
  color: #555;
  margin-top: 20px;
}