/* === FOOTBAR MINIMALISTE === */
.footbar {
  background: var(--surface, #f9fafb);
  border-top: 1px solid var(--line, #e5e7eb);
  padding: 1rem 2rem;
  margin-top: auto;
  font-size: 0.875rem;
  color: var(--muted, #6b7280);
  width: 100%;
  box-sizing: border-box;
  /* Garantit que la footbar n'est jamais fixée à l'écran */
  position: static !important;
}

/* Pleine largeur naturelle en page-shell (plus besoin de marges négatives) */

.footbar-content {
  display: flex;
  justify-content: center;
  align-items: center;
  gap: 2rem;
  flex-wrap: wrap;
  max-width: 1200px;
  margin: 0 auto;
  position: relative; /* ancre le popover */
  overflow-x: auto;      /* permet le scroll horizontal si dépasse */
  -webkit-overflow-scrolling: touch; /* inertie iOS */
  scroll-snap-type: x proximity; /* aide le centrage perçu lors du scroll */
}

.footbar-links {
  display: flex;
  gap: 1rem;
  align-items: center;
}

.footbar-links a {
  color: var(--text-secondary, #666);
  text-decoration: none;
  transition: color 0.2s ease;
  display: inline-flex;
  align-items: center;
  gap: 6px;
}

.footbar-links a:hover {
  color: var(--accent, #00AFB5);
  text-decoration: underline;
}

/* Icônes (emoji) */
/* Lucide icônes (taille et masquage par défaut)
   Lucide remplace <i data-lucide> par <svg class="lucide ..."> */
.footbar-links svg {
  width: 18px;
  height: 18px;
  display: none; /* affichées seulement en responsive */
  vertical-align: -2px;
}
.footbar-links .foot-text { display: inline; }

/* Accessibilité: masquer visuellement le texte mais le laisser aux lecteurs d’écran */
.visually-hidden {
  position: absolute !important;
  width: 1px; height: 1px; padding: 0; margin: -1px;
  overflow: hidden; clip: rect(0, 0, 0, 0); white-space: nowrap; border: 0;
}

.footbar-separator {
  color: var(--line, #e5e7eb);
}

.footbar-copyright {
  font-weight: 500;
}

/* Thème via ThemeManager (prend le pas sur la préférence système) */
.theme-light .footbar {
  background: var(--surface, #f9fafb);
  border-top-color: var(--line, #e5e7eb);
}
.theme-dark .footbar {
  background: var(--surface-dark, #1a1a1a);
  border-top-color: var(--line-dark, #333);
}

/* Responsive */
@media (max-width: 768px) {
  .footbar {
    padding: 1rem;
    text-align: center;
  }
  
  .footbar-content {
    flex-direction: row;     /* rester sur une seule ligne */
    flex-wrap: nowrap;       /* pas de retour à la ligne */
    gap: 1rem;               /* espace un peu réduit */
    overflow-x: auto;        /* autoriser le scroll horizontal si nécessaire */
    scrollbar-width: thin;   /* léger sur Firefox */
    white-space: nowrap;     /* empêche les retours à la ligne implicites */
    justify-content: center; /* centré par défaut même en mobile */
  }
  .footbar-content::-webkit-scrollbar { display: none; }
  
  .footbar-links {
    gap: 1rem;
  }
}

/* Popover du menu de la footbar (masqué par défaut, cf. HTML) */
/* Nettoyage des styles du menu supprimé */

/* Responsive: n'afficher que les icônes quand la largeur est faible */
@media (max-width: 880px) {
  .footbar-links svg { display: inline-flex; }
  .footbar-links .foot-text { display: none; }
}

/* === INDEX.HTML: icônes seulement en mobile, et remplacement du texte === */
#legal-links svg,
#legal-links i[data-lucide] {
  width: 18px;
  height: 18px;
  vertical-align: -2px;
  margin-right: 6px;
  display: none; /* caché par défaut (desktop/tablette) */
}
@media (max-width: 500px) {
  #legal-links svg { display: inline; }
  #legal-links .foot-text { display: none; }
}

/* Toujours une seule ligne. Si ça ne tient pas, défilement horizontal.
   Option future: remplacer par icônes ou menu kebab si besoin. */

/* S'assurer que le body prend toute la hauteur pour pousser le footer en bas */
body {
  display: flex;
  flex-direction: column;
  min-height: 100vh;
  overflow-x: hidden; /* éviter les barres de scroll horizontales dues aux marges négatives */
}

/* Règle déjà définie dans navbar.css : html, body { overflow-x: hidden; } */

/* Pour les pages avec page-shell (dashboard, admin, etc.) */
body.page-shell {
  display: flex !important;
  flex-direction: column;
  min-height: 100vh;
  padding: 0 !important; /* Padding déplacé vers le conteneur principal */
  align-items: stretch !important;
  justify-content: flex-start !important;
}

/* S'assurer que la footbar garde sa position statique dans page-shell */
body.page-shell .footbar {
  position: static !important;
  margin-top: auto !important;
}



/* Responsive : ajuster le padding sur mobile */
@media (max-width: 600px) {
  .main-container, 
  .main-content, 
  main,
  #main-admin-content {
    padding: 0 16px;
  }
}


/* Pour les pages avec conteneur spécifique */
#page-root {
  display: flex;
  flex-direction: column;
  min-height: 100vh;
}

/* Ajustements pour les navbars fixes */
body.page-shell .main-content,
body.page-shell main {
  flex: 1;
  display: flex;
  flex-direction: column;
}