/* Menu de gauche UNIQUE de Fronteo (construit par static/menu.js, sur toutes les pages — 14/10/2026).
   Retour de Nicolas du 01/10/2026 : en quittant la page principale, on changeait d'interface.
   Classes préfixées « fm- » : chaque page a ses propres styles, rien ne doit s'y mélanger.
   - Pages de modules : menu sur ordinateur seulement (≥ 900 px) ; Ma semaine et Photos sont pensées pour le
     téléphone, où un menu fixe prendrait la moitié de l'écran.
   - Page principale (.fm-tiroir) : sur téléphone, le menu est un tiroir ouvert par le bouton ☰ (02/10/2026). */

/* Contenu du menu (mêmes styles sur ordinateur et dans le tiroir) */
.fm-sidebar { flex-direction: column; background: #1f2328; color: #c9d1d9; padding: 1rem .5rem; box-sizing: border-box;
  font-family: ui-sans-serif, system-ui, sans-serif; font-size: 15px; line-height: 1.4; }
.fm-logo { display: block; background: #fff; border-radius: 8px; padding: .45rem .6rem; margin: 0 .5rem 1.5rem; }
.fm-logo img { display: block; width: 100%; height: auto; }
/* La liste du milieu défile ; le logo, les CGU et le pied restent visibles (Alex, 14/10/2026). */
.fm-nav { display: flex; flex-direction: column; gap: .1rem; flex: 1; overflow-y: auto; min-height: 0;
  scrollbar-width: thin; scrollbar-color: #30363d transparent; }
.fm-nav a { display: flex; align-items: center; gap: .5rem; padding: .55rem .75rem; color: #c9d1d9;
  text-decoration: none; border-radius: 6px; font-size: .92rem; }
.fm-nav a:hover { background: #30363d; color: #fff; }
.fm-nav a.fm-actif { background: #30363d; color: #fff; border-left: 3px solid #58a6ff; padding-left: calc(.75rem - 3px); }
.fm-nav a.fm-sub { padding-left: 1.2rem; font-size: .85rem; opacity: .9; }
.fm-groupe { font-size: .72rem; text-transform: uppercase; color: #8b949e; padding: .9rem .75rem .3rem; letter-spacing: .08em; }
.fm-sep { border: 0; border-top: 1px solid #30363d; margin: .6rem .5rem; }
.fm-base { background: #0d1117; color: #c9d1d9; border: 1px solid #30363d; border-radius: 6px;
  font-size: .88rem; padding: .45rem .55rem; margin: .1rem .5rem .2rem; width: calc(100% - 1rem); font-family: inherit; }
.fm-pied { flex: none; font-size: .8rem; color: #8b949e; padding: .5rem .75rem; border-top: 1px solid #30363d; margin-top: .5rem; word-break: break-all; }
/* L'adresse sous le bouton « Mon compte » : assez petite pour tenir sur une ligne (a.lemaire@imbolc-systems.fr
   faisait deux lignes en 0.8rem), et coupée proprement si elle est vraiment trop longue. */
.fm-pied .fm-email { font-size: .68rem; text-align: center; margin: .25rem 0 .1rem; line-height: 1.25;
  overflow-wrap: anywhere; }
/* Tous les éléments du pied à la même largeur, les uns sous les autres (retour d'Alex, 15/10/2026) :
   « Installer l'application », « Signaler un problème », « Mon compte » et « Déconnexion » sont alignés. */
.fm-pied button { display: block; background: transparent; border: 1px solid #30363d; color: #c9d1d9;
  padding: .3rem .6rem; border-radius: 5px; cursor: pointer; font-size: .8rem; margin: .4rem 0 0; font-family: inherit;
  min-height: 0; width: 100%; text-align: center; }
.fm-pied button:hover { background: #30363d; color: #fff; }
.fm-pied button.fm-actif { border-color: #58a6ff; color: #fff; }
.fm-pied a.fm-compte { display: block; border: 1px solid #30363d; color: #c9d1d9; text-decoration: none;
  padding: .3rem .6rem; border-radius: 5px; font-size: .8rem; margin: .4rem 0 0; text-align: center; }
.fm-pied a.fm-compte:hover { background: #30363d; color: #fff; }
.fm-cgu-btn { display: block; margin: -.9rem .5rem 1.2rem; padding: .35rem .6rem; border: 1px solid #30363d; border-radius: 5px;
  color: #c9d1d9; text-decoration: none; font-size: .8rem; text-align: center; }
.fm-cgu-btn:hover { background: #30363d; color: #fff; }

/* Téléphone */
@media (max-width: 899px) {
  .fm-sidebar { display: none; }
  /* Page principale : tiroir */
  .fm-sidebar.fm-tiroir { display: flex; position: fixed; top: 0; left: 0; bottom: 0; width: min(84vw, 300px); z-index: 50;
    transform: translateX(-102%); transition: transform .2s ease; padding-top: calc(1rem + env(safe-area-inset-top)); }
  body.menu-ouvert .fm-sidebar.fm-tiroir { transform: none; box-shadow: 0 0 40px rgba(0,0,0,.35); }
  .fm-tiroir .fm-nav a { padding: .75rem .8rem; font-size: 1rem; }  /* cibles au doigt */
}

/* Ordinateur : menu fixe, haut et pied toujours visibles */
@media (min-width: 900px) {
  body.fm-avec-menu { margin: 0; }
  .fm-layout { display: grid; grid-template-columns: 240px minmax(0, 1fr); min-height: 100vh; }
  .fm-sidebar { display: flex; position: sticky; top: 0; height: 100vh; }
  .fm-contenu { min-width: 0; }
  /* Le menu remplace les liens de retour vers la page principale. */
  body.fm-avec-menu .fm-masque-si-menu { display: none !important; }
  /* Barre d'actions fixée en bas (Photos) : elle commence après le menu. */
  body.fm-avec-menu .barre { left: 240px; }
}