/* MySifa — sidebar commune à toutes les applis (v3.3.0, 11/09/2026).
 *
 * Demande d'Eugène : « exactement le même type de sidebar — menu et pied —
 * pour toutes les applis ». Jusqu'ici chaque page recopiait son CSS de
 * sidebar : 18 copies, quatre styles de titres de section, des pieds où
 * manquaient tantôt le support, tantôt la déconnexion, tantôt la version.
 *
 * Ce fichier porte l'apparence ; static/mysifa_sidebar.js construit le pied.
 * Les règles sont préfixées par une classe propre au composant (.msb-*) :
 * leur spécificité passe devant le CSS que chaque page déclare encore dans
 * son <style>, sans avoir besoin de !important. Les règles mobiles de
 * mysifa_mobile_topbar.css (qui, elles, sont en !important) continuent de
 * s'appliquer : les enfants du pied gardent les classes qu'elles visent.
 *
 * Aucune couleur en dur : uniquement les tokens de mysifa_theme.css.
 */

/* ── Menu : boutons de navigation ───────────────────────────────────── */
.msb-nav .nav-btn{display:flex;align-items:center;gap:10px;padding:10px 12px;border-radius:8px;
  border:none;background:transparent;color:var(--text2);cursor:pointer;font-size:13px;
  font-weight:500;width:100%;text-align:left;font-family:inherit;text-decoration:none;
  transition:background .15s,color .15s;margin-bottom:2px;box-sizing:border-box}
.msb-nav .nav-btn:hover,.msb-nav .nav-btn.active{background:var(--accent-bg);color:var(--accent)}
.msb-nav .nav-btn svg{flex-shrink:0}
/* Plusieurs pages (coffres, profil, tâches…) posent un halo coloré au survol des
   boutons de menu, par palette, avec une spécificité (0,5,1). MyStock n'en a pas :
   on l'éteint ici, sans !important, par une spécificité supérieure. */
html body .msb-nav .nav-btn.nav-btn:hover:not(.active),
html body .msb-footer .nav-btn.nav-btn:hover:not(.active){box-shadow:none}

/* ── Menu : titres de section (variante « séparateur » retenue le 11/09) ─
   Texte plein, filet au-dessus de chaque section, couleur d'accent et léger
   décalage au survol. Le chevron n'apparaît que si la section se replie. */
.msb-section{font-size:11px;text-transform:uppercase;letter-spacing:.6px;color:var(--text);
  font-weight:700;margin:10px 0 0;padding:12px 14px 6px 14px;border-top:1px solid var(--border);
  border-radius:0;background:transparent;opacity:1;user-select:none;display:flex;align-items:center;
  justify-content:space-between;gap:8px;line-height:1.3;transition:color .15s;box-sizing:border-box;width:100%}
.msb-section>span:first-child,.msb-section>.msb-section-txt{display:inline-block;transition:transform .18s ease}
.msb-section:hover{color:var(--accent);background:transparent}
.msb-section:hover>span:first-child,.msb-section:hover>.msb-section-txt{transform:translateX(4px)}
.msb-section.msb-toggle{cursor:pointer}
.msb-section .ngl-chevron,.msb-section .nav-group-chevron,.msb-section .msb-chevron{display:inline-flex;
  flex-shrink:0;transition:transform .2s,opacity .15s;opacity:.7}
.msb-section:hover .ngl-chevron,.msb-section:hover .nav-group-chevron,.msb-section:hover .msb-chevron{opacity:1}
.msb-section.ngl-collapsed .ngl-chevron,.msb-section.ngl-collapsed .nav-group-chevron,
.msb-section.ngl-collapsed .msb-chevron{transform:rotate(-90deg)}

/* ── Pied ───────────────────────────────────────────────────────────── */
.sidebar-bottom.msb-footer{padding:12px 8px;border-top:1px solid var(--border);display:flex;
  flex-direction:column;gap:6px;flex-shrink:0;margin-top:auto;background:var(--card);box-sizing:border-box}
.msb-footer>*{box-sizing:border-box}

.msb-footer>.back-mysifa{display:flex;align-items:center;gap:6px;width:100%;padding:8px 10px;
  border:none;background:transparent;border-radius:8px;color:var(--text2);font-size:13px;font-weight:400;
  font-family:inherit;text-decoration:none;cursor:pointer;transition:color .15s;margin:0}
.msb-footer>.back-mysifa:hover{color:var(--text);background:transparent}
.msb-footer>.back-mysifa .wm{font-weight:800;color:var(--text);letter-spacing:-.3px}
.msb-footer>.back-mysifa .wm span{color:var(--accent)}

.msb-footer>.user-chip{padding:10px 12px;border-radius:8px;background:var(--accent-bg);cursor:pointer;
  transition:background .12s}
.msb-footer>.user-chip:hover{background:color-mix(in srgb,var(--accent) 18%,transparent)}
.msb-footer>.user-chip .uc-top{display:flex;align-items:center;gap:10px;margin-bottom:6px}
.msb-footer>.user-chip .uc-avatar{width:36px;height:36px;min-width:36px;border-radius:50%;object-fit:cover;
  border:1px solid var(--border);flex-shrink:0;display:block;background:var(--bg)}
.msb-footer>.user-chip .uc-info{flex:1;min-width:0}
.msb-footer>.user-chip .uc-name{font-size:12px;font-weight:600;color:var(--text);line-height:1.3;
  overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.msb-footer>.user-chip .uc-role{font-size:10px;color:var(--accent);text-transform:uppercase;letter-spacing:.5px;
  line-height:1.3;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.msb-footer>.user-chip .uc-profil{font-size:10px;color:var(--accent);margin-top:3px;display:flex;align-items:center;gap:4px}
.msb-footer>.msb-chip-vide{min-height:52px;border-radius:8px;background:var(--accent-bg);opacity:.5}

.msb-footer>.support-btn,.msb-footer>.theme-btn,.msb-footer>.logout-btn{display:flex;align-items:center;gap:8px;
  width:100%;padding:10px 12px;border-radius:8px;border:1px solid var(--border);background:transparent;
  color:var(--text2);cursor:pointer;font-size:12px;font-weight:400;font-family:inherit;text-align:left;
  transition:background .15s,color .15s,border-color .15s;margin:0}
.msb-footer>.support-btn:hover,.msb-footer>.theme-btn:hover{background:var(--accent-bg);color:var(--accent);border-color:var(--accent)}
.msb-footer>.logout-btn{border-color:transparent}
.msb-footer>.logout-btn:hover{color:var(--danger);background:color-mix(in srgb,var(--danger) 10%,transparent);border-color:transparent}
.msb-footer .support-ico,.msb-footer .theme-ico,.msb-footer .msb-ico{display:inline-flex;align-items:center;
  justify-content:center;width:16px;height:16px;flex-shrink:0}
.msb-footer .support-ico svg,.msb-footer .theme-ico svg,.msb-footer .msb-ico svg{width:16px;height:16px;display:block}
.msb-footer .theme-label{white-space:nowrap}
.msb-footer>.version{font-size:10px;color:var(--muted);font-family:ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;
  padding:4px 12px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}

@media (display-mode:standalone),(max-width:900px){
  .msb-footer>.theme-btn .theme-label{display:none}
  .msb-footer>.theme-btn{justify-content:center}
}

/* Toast de secours, quand la page n'a pas le sien. */
.msb-toast{position:fixed;left:50%;bottom:24px;transform:translateX(-50%);z-index:1200;background:var(--card);
  color:var(--text);border:1px solid var(--border);border-left:3px solid var(--accent);border-radius:10px;
  padding:10px 16px;font-size:13px;box-shadow:0 10px 30px rgba(0,0,0,.25)}
.msb-toast.error{border-left-color:var(--danger)}