/* ============================================================
   MENU LATÉRAL — ajustements (chargé en dernier, après les styles de la page)
   1. ouvert : plus étroit (248 → 228 px) et compact, pour tenir dans la
      hauteur de l'écran ; les titres de section ne sont plus écrasés,
      la liste défile si l'écran est vraiment bas ;
   2. replié : au survol, le menu s'ouvre en entier PAR-DESSUS la page
      (avant : le contenu passait en mode large dans une barre de 84 px) ;
   3. replié : plus de petite carte vide en haut du rail.
   ============================================================ */
:root{--qt-side-w:228px;--qt-side-rail:84px}

/* ---------- 1. largeur ouverte ---------- */
.sidebar-nav:hover,.sidebar-nav.expanded,.sidebar-nav.pinned,
body:not(.qt-side-collapsed) .sidebar-nav.pinned,
body:not(.qt-side-collapsed) .sidebar-nav.expanded{width:var(--qt-side-w)}
body:not(.qt-side-collapsed) .qt-side-toggle{left:calc(var(--qt-side-w) - 14px)}

/* ---------- 1. tenir dans la hauteur ---------- */
.sidebar-nav .sidebar-nav-items > *{flex-shrink:0}
.sidebar-nav .sidebar-nav-items{overflow-y:auto;overscroll-behavior:contain;scrollbar-width:thin;scrollbar-color:rgba(255,255,255,.16) transparent}
.sidebar-nav .sidebar-nav-items::-webkit-scrollbar{width:4px}
.sidebar-nav .sidebar-nav-items::-webkit-scrollbar-thumb{background:rgba(255,255,255,.16);border-radius:4px}
.sidebar-nav .sb-brand-card{margin:0 12px 8px;padding:10px;gap:8px}
.sidebar-nav .sb-kpi-row{gap:6px}
.sidebar-nav .sb-kpi-row .sb-kpi{padding:8px 10px;min-width:0}
.sidebar-nav .sb-kpi-v{font-size:16px}
.sidebar-nav .sb-kpi-sub{font-size:10.5px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.sidebar-nav:hover .sb-section-label,.sidebar-nav.expanded .sb-section-label,.sidebar-nav.pinned .sb-section-label{padding:10px 14px 4px}
body .sidebar-nav .sidebar-nav-items .sidebar-nav-item{height:38px !important}
.sidebar-nav:hover .sidebar-nav-footer,.sidebar-nav.expanded .sidebar-nav-footer,.sidebar-nav.pinned .sidebar-nav-footer{padding:12px 12px 10px}
.sidebar-nav:hover .sb-logout-btn,.sidebar-nav.expanded .sb-logout-btn,.sidebar-nav.pinned .sb-logout-btn{height:38px}
@media (max-height:820px){
  body .sidebar-nav .sidebar-nav-items .sidebar-nav-item{height:35px !important}
  .sidebar-nav:hover .sb-section-label,.sidebar-nav.expanded .sb-section-label,.sidebar-nav.pinned .sb-section-label{padding:7px 14px 2px}
  .sidebar-nav .sb-kpi-sub{display:none}
}
@media (max-height:680px){
  .sidebar-nav:hover .sb-section-label,.sidebar-nav.expanded .sb-section-label,.sidebar-nav.pinned .sb-section-label{display:none}
  .sidebar-nav .sb-brand-card{margin-bottom:4px}
}

/* ---------- 2. (remplacé par §7) ---------- */
.qt-side-toggle{transition:left .28s cubic-bezier(.4,0,.2,1),opacity .15s,background .15s,color .15s,border-color .15s}
/* 2026-09-15 : pastille « < » de repli retirée à la demande de Steeve (elle mordait sur le contenu) */
.qt-side-toggle{display:none !important}
/* 2026-09-24 : le repli revient, sous forme de bouton DANS le menu (.qt-side-col, injecté par sidebar-fit.js) */

/* ---------- 4. téléphone (≤ 760 px) : tiroir fermé par défaut, bouton Menu dans l'en-tête ----------
   mobile.css ouvre le tiroir dès que le menu est "pinned"/"expanded" (état du bureau) : sur
   téléphone il restait ouvert par-dessus la page sans moyen de le fermer (burger flottant masqué).
   Seul .is-open l'ouvre désormais ; le bouton est dans l'en-tête, pas flottant. */
.qt-side-mbtn{display:none}
@media (max-width:760px){
  .sidebar-nav:not(.is-open),.app-sidebar:not(.is-open){transform:translateX(-100%) !important;box-shadow:none !important}
  .qt-app-header-left{display:flex;align-items:center}
  .qt-side-mbtn{display:inline-grid;place-items:center;width:40px;height:40px;margin-right:8px;padding:0;border:1px solid #E8EBF0;border-radius:12px;background:#fff;color:#0F172A;cursor:pointer;flex-shrink:0}
  .qt-side-mbtn svg{width:19px;height:19px}
  /* en-tête compact : les 3 portails tiennent en icônes entre le logo et le profil */
  .qt-app-header{gap:8px}
  .qt-app-header-left{gap:0}
  .qt-app-logo-img{height:26px}
  .qt-app-portal{gap:4px}
  .qt-app-portal-tab{padding:8px !important;gap:0 !important}
  .qt-app-header-right .qt-app-profile-chip > svg{display:none}
  /* fond grisé réel (lib/sidebar-fit.js) : couvre toute la page et referme au toucher */
  .sidebar-nav.is-open::before,.app-sidebar.is-open::before{display:none !important}
  .qt-side-bd{position:fixed;inset:0;z-index:8999;background:rgba(11,11,20,.45);-webkit-backdrop-filter:blur(2px);backdrop-filter:blur(2px);
    opacity:0;pointer-events:none;transition:opacity .2s ease}
  body.qt-side-mopen .qt-side-bd{opacity:1;pointer-events:auto}
  body.qt-side-mopen{overflow:hidden}
  /* tiroir : encoche et barre du bas respectées */
  .sidebar-nav.is-open{padding-top:env(safe-area-inset-top);padding-bottom:env(safe-area-inset-bottom)}
}
.qt-side-bd{display:none}
@media (max-width:760px){ .qt-side-bd{display:block} }

/* ---------- 3. rail replié : pas de carte vide en haut ---------- */
.sidebar-nav:not(:hover):not(.expanded):not(.pinned) .sb-brand-card{display:none}
.sidebar-nav:not(:hover):not(.expanded):not(.pinned) .sidebar-nav-items{padding-top:6px}

/* ---------- 5. menu fixe pendant le défilement (2026-09-16) ----------
   html, body{overflow-x:hidden} faisait de <body> un conteneur de défilement :
   le position:sticky du menu se calait sur body et le menu partait avec la page.
   overflow-x:clip coupe pareil sans créer de conteneur, donc seul le contenu défile. */
html:root,html > body{overflow-x:clip}

/* ---------- 6. (retiré) le bouton de repli n'existe plus : voir §7 ---------- */
.sidebar-nav .qt-side-col{display:none !important}

/* ---------- 7. rail permanent qui s'ouvre au survol (2026-09-24) ----------
   Le menu garde TOUJOURS la mise en page « ouvert » (classe .expanded posée par sidebar-fit.js) : les
   icônes ne bougent jamais. Le rail n'est qu'un masque de 84 px ; .qt-open l'élargit à 228 px par-dessus
   la page (marge négative : le contenu ne bouge pas). Un seul easing pour tout : largeur, marge, libellés. */
@media (min-width:761px){
  :root{--qt-ease:cubic-bezier(.32,.72,0,1);--qt-dur:.32s}
  html body .sidebar-nav.sidebar-nav{width:var(--qt-side-rail) !important;margin-right:0 !important;overflow:hidden;
    transition:width var(--qt-dur) var(--qt-ease),margin-right var(--qt-dur) var(--qt-ease),box-shadow var(--qt-dur) ease;will-change:width}
  html body .sidebar-nav.sidebar-nav.qt-open{width:var(--qt-side-w) !important;margin-right:calc(var(--qt-side-rail) - var(--qt-side-w)) !important;z-index:260;box-shadow:14px 0 40px rgba(11,20,38,.45)}
  /* contenu du menu : largeur fixe = celle du menu ouvert, jamais recomposé */
  html body .sidebar-nav.sidebar-nav > *{width:var(--qt-side-w);min-width:var(--qt-side-w);max-width:var(--qt-side-w);box-sizing:border-box;flex:none}
  html body .sidebar-nav.sidebar-nav > .sidebar-nav-items{flex:1 1 auto;min-height:0;padding-left:0;padding-right:0}
  html body .sidebar-nav.sidebar-nav > .sidebar-nav-footer{margin-top:auto}
  /* rubriques : pastille de 48 px centrée sur l'axe du rail (x = 42), qui s'allonge à l'ouverture */
  html body .sidebar-nav.sidebar-nav .sidebar-nav-items .sidebar-nav-item{width:48px !important;margin-left:18px !important;margin-right:0 !important;align-self:flex-start !important;justify-content:flex-start !important;overflow:hidden;position:relative;
    transition:width var(--qt-dur) var(--qt-ease),background .18s,color .18s}
  html body .sidebar-nav.sidebar-nav.qt-open .sidebar-nav-items .sidebar-nav-item{width:192px !important}
  html body .sidebar-nav.sidebar-nav .nav-item-icon{flex:none}
  html body .sidebar-nav.sidebar-nav .nav-item-label{opacity:0 !important;max-width:none !important;white-space:nowrap;transition:opacity .16s ease}
  html body .sidebar-nav.sidebar-nav.qt-open .nav-item-label{opacity:1 !important;transition:opacity .22s ease .1s}
  /* pastilles et cadenas : petit point sur l'icône dans le rail, valeur complète une fois ouvert */
  html body .sidebar-nav.sidebar-nav .sb-active-badge,html body .sidebar-nav.sidebar-nav .seg-pill{transition:opacity .16s ease}
  html body .sidebar-nav.sidebar-nav:not(.qt-open) .sidebar-nav-item .sb-active-badge{position:absolute;top:3px;right:3px;min-width:15px;height:15px;padding:0 4px;font-size:9px;line-height:15px;margin:0;box-shadow:0 0 0 2px #0E1B36}
  html body .sidebar-nav.sidebar-nav:not(.qt-open) .sidebar-nav-item .seg-pill,
  html body .sidebar-nav.sidebar-nav:not(.qt-open) .sidebar-nav-item .sb-pill-new{opacity:0}
  html body .sidebar-nav.sidebar-nav:not(.qt-open) .sidebar-nav-item .sb-lock-icon{position:absolute;top:4px;right:6px;opacity:1;max-width:12px}
  /* titres de section : dans le rail, un trait fin à leur place (même hauteur, aucun saut) */
  html body .sidebar-nav.sidebar-nav .sb-section-label{position:relative;opacity:1 !important;max-height:none !important;transition:color .16s ease;white-space:nowrap}
  html body .sidebar-nav.sidebar-nav:not(.qt-open) .sb-section-label{color:transparent !important}
  html body .sidebar-nav.sidebar-nav .sb-section-label::after{content:'';position:absolute;left:30px;width:24px;top:55%;height:1px;background:rgba(255,255,255,.16);opacity:0;transition:opacity .2s ease}
  html body .sidebar-nav.sidebar-nav:not(.qt-open) .sb-section-label::after{opacity:1}
  html body .sidebar-nav.sidebar-nav .sb-section-divider{display:none !important}
  /* carte budget : dans le rail, seul le budget reste, sans fond */
  html body .sidebar-nav.sidebar-nav .sb-brand-card,html body .sidebar-nav.sidebar-nav .sb-kpi{transition:background .2s ease,border-color .2s ease,opacity .2s ease}
  html body .sidebar-nav.sidebar-nav:not(.qt-open) .sb-brand-card{background:transparent;border-color:transparent}
  html body .sidebar-nav.sidebar-nav:not(.qt-open) .sb-kpi{background:transparent;border-color:transparent}
  html body .sidebar-nav.sidebar-nav:not(.qt-open) .sb-kpi:not(.sb-kpi-click){opacity:0}
  html body .sidebar-nav.sidebar-nav:not(.qt-open) .sb-kpi-sub{opacity:0}
  /* pied : déconnexion + langue empilées, alignées sur l'axe du rail */
  html body .sidebar-nav.sidebar-nav .sidebar-nav-footer{align-items:flex-start;padding:12px 0 10px;border-top-color:transparent;transition:border-color .2s}
  html body .sidebar-nav.sidebar-nav.qt-open .sidebar-nav-footer{border-top-color:rgba(255,255,255,.08)}
  html body .sidebar-nav.sidebar-nav .sb-footer-row{flex-direction:column;align-items:flex-start;gap:8px;width:100%;justify-content:flex-start}
  html body .sidebar-nav.sidebar-nav .sb-logout-btn{flex:none;height:44px;width:44px;margin-left:20px;padding:0 0 0 13px;justify-content:flex-start;gap:12px;overflow:hidden;
    border-radius:22px;transition:width var(--qt-dur) var(--qt-ease),background .18s,border-color .18s}
  html body .sidebar-nav.sidebar-nav.qt-open .sb-logout-btn{width:190px}
  html body .sidebar-nav.sidebar-nav .sb-logout-label{display:inline !important;opacity:0;white-space:nowrap;transition:opacity .16s ease}
  html body .sidebar-nav.sidebar-nav.qt-open .sb-logout-label{opacity:1;transition:opacity .22s ease .1s}
  html body .sidebar-nav.sidebar-nav .sb-footer-row .qt-lang-btn{display:flex !important;flex:none;width:44px;height:44px;margin-left:20px;border-radius:50%}
  /* défilement de la liste : jamais de barre dans le rail */
  html body .sidebar-nav.sidebar-nav:not(.qt-open) .sidebar-nav-items{overflow-y:hidden}
  /* pas d'animation au chargement de la page */
  body.qt-no-transition .sidebar-nav *{transition:none !important}
  @media (prefers-reduced-motion:reduce){ html body .sidebar-nav.sidebar-nav,html body .sidebar-nav.sidebar-nav *{transition:none !important} }
}

/* QA 2026-09-24: closed off-screen mission panel must not paint its shadow on the right edge */
.miss-panel:not(.show){box-shadow:none!important}