/* ---- Structure de base ---- */
html, body {
  height: 100%;
  margin: 0;
  padding: 0;
  overflow-x: hidden;
  color: white;
}

/* ---- Fond d'écran persistent ---- */
body::before {
  content: "";
  position: fixed;
  top: 0; left: 0;
  width: 100%;
  height: 100%;
  background-size: cover;
  background-position: center;
  background-repeat: no-repeat;
  background-color: black; /* fallback */
  z-index: -1;
  pointer-events: none;
  opacity: 1;
}

/* Images de fond par page */
body.page-connexion::before  { background-image: url('../img/connexion.jpg'); }
body.page-profil::before     { background-image: url('../img/profil.jpg'); }
body.page-defis::before      { background-image: url('../img/defis.jpg'); }
body.page-defense::before    { background-image: url('../img/defense.jpg'); }
body.page-lice::before       { background-image: url('../img/lice.jpg'); }
body.page-log_defis::before  { background-image: url('../img/lice.jpg'); }
body.page-log_adv::before    { background-image: url('../img/lice.jpg'); }
body.page-achats::before     { background-image: url('../img/achats.jpg'); }
body.page-stats::before      { background-image: url('../img/stats.jpg'); }
body.page-heaumes::before    { background-image: url('../img/heaumes.jpg'); }
body.page-classement::before { background-image: url('../img/classement.jpg'); }
body.page-records::before    { background-image: url('../img/records.jpg'); }
body.page-civieres::before   { background-image: url('../img/civieres.jpg'); }
body.page-mesnies::before    { background-image: url('../img/mesnies.jpg'); }
body.page-mailto::before     { background-image: url('../img/mailto.jpg'); }
body.page-mailthread::before { background-image: url('../img/mailto.jpg'); }
body.page-memoriam::before   { background-image: url('../img/memoriam.jpg'); }
body.page-occis::before      { background-image: url('../img/occis.jpg'); }
body.page-ruine::before      { background-image: url('../img/ruine.jpg'); }
body.page-deshonneur::before { background-image: url('../img/deshonneur.jpg'); }
body.page-tournoi::before    { background-image: url('../img/tournoi.jpg'); }

/* ---- Titres et couleurs ---- */
h1.title {
  margin-top: -2rem;
}

h2 {
  margin-top: -1rem;
}

strong {
  color: #ffd369;
}

/* ---- Réduction des espacements dans les paragraphes et listes ---- */
.content p {
  margin-bottom: 0.5rem !important;
  margin-top: 0 !important;
}

.joute ul {
  list-style: none;
  padding-left: 0;
  margin-top: 0;
}

.joute li {
  margin-left: -10px;
  margin-bottom: 0.25rem;
}

/* ---- Boîte de formulaire ---- */
.form-box {
  background-color: rgba(0, 0, 0, 0.6);
  padding: 2rem;
  border-radius: 8px;
  box-shadow: 0 0 10px rgba(0, 0, 0, 0.5);
}

/* ---- Mise en page globale ---- */
.layout-wrapper {
  display: flex;
  flex-direction: column;
  min-height: 100vh;
}

.section {
  flex: 1;
}

/* ---- Colonnes compactes ---- */
.columns.is-mobile {
  margin-bottom: 0.1rem;
}

/* ---- Pied de page sombre et compact ---- */
.footer {
  padding: 0.75rem 1rem;
  font-size: 0.9rem;
  background-color: #2c2c2c;
  border-top: 1px solid #444;
}

/* ---- Barre de navigation personnalisée ---- */
.navbar {
  background: transparent;
  backdrop-filter: none;
  padding: 0rem 0.75rem;
  display: flex;
  align-items: center;
  justify-content: space-between;
  margin-bottom: 0;
  border-radius: 6px;
}

.navbar .title {
  color: #f0e6d2;
  font-weight: 700;
  margin: 0;
}

.logo-title {
  height: 1.5em; /* ajuste la hauteur en fonction de la taille du texte */
  vertical-align: middle;
}

.menu-icon {
  color: #f0e6d2;
  font-size: 1.8rem;
  cursor: pointer;
  user-select: none;
  transition: color 0.3s ease;
}

.menu-icon:hover {
  color: #ffd369;
}

/* ---- Modal ---- */
.modal-card {
  max-width: 80vw;
  margin: auto;
  border-radius: 10px; /* Coins arrondis */
  overflow: hidden; /* Assure que le contenu ne déborde pas */
}

.modal-card-title {
  color: white !important;
}

.modal-card-head {
  background: rgb(0, 209, 178) !important; /* Vert spécifique avec RGB */
  border-top-left-radius: 10px;
  border-top-right-radius: 10px;
}

.modal-card-body .menu-list li {
  margin-bottom: -0.2rem;
}


.critique {
  color: #ff3860; /* rouge Bulma */
  font-weight: bold;
}

.achat-armure {
  color: #ffe082; /* jaune pâle pour alerte */
  font-style: italic;
}

.defi-nav-buttons {
  display: flex;
  justify-content: center;
  align-items: center;
  gap: 1rem; /* espace horizontal entre les boutons */
}

.button.icon-only {
  width: 4.5rem;
  height: 2.5rem;
  padding: 0;
  text-align: center;
  margin-right: 1rem;
  margin-left: 1rem;
}

.tournoi-title {
      font-size: 1.2rem; /* Taille du texte similaire à h2 */
      font-weight: bold;
      color: white;
      text-align: left; /* Alignement à gauche */
      margin-bottom: 0.5rem; /* Espacement sous le titre */
      padding-left: 10px; /* Un peu d'espace à gauche pour ne pas toucher le bord */
    }
	
.table.semi-transparent {
  background-color: rgba(33, 33, 33, 0.8);
  border-radius: 8px;
  overflow: hidden; /* utile pour que le border-radius s’applique bien */
}

.table.semi-transparent td,
.table.semi-transparent th {
  background-color: transparent !important;
}

.checkbox-large {
  font-size: 1.2rem;
  margin-top: 1.5rem;     /* espace au-dessus */
  margin-bottom: 1.5rem;  /* espace en dessous */
}

.checkbox-large input[type="checkbox"] {
  transform: scale(1.6);
  margin-right: 0.5em;
  vertical-align: middle;
  cursor: pointer;
}

.floating-button {
  position: fixed;
  bottom: 20px;
  right: 20px;
  z-index: 1000;
  border-radius: 50%;
  width: 60px;
  height: 60px;
  display: flex;
  align-items: center;
  justify-content: center;
  box-shadow: 0 4px 8px rgba(0, 0, 0, 0.2);
}

/* ---- Message ---- */
.message-title td {
  font-weight: bold;
  border-top: 2px solid white;
  border-bottom: 2px solid white;
}

.icon.has-notification {
  position: relative;
}

.notification-dot {
  position: absolute;
  top: 0;
  right: 0;
  width: 9px;
  height: 9px;
  border-radius: 50%;
}

/* Couleurs */
.notification-dot.red {
  background-color: red;
}

.notification-dot.blue {
  background-color: blue;
}