/* Menu Netflop — L1 + L2 (v1.1.0) — L2 plus petit, chevron-only, fermé par défaut */
#netflop-menu-root{
  /* Palette & typo */
--accent:#154F9E;        /* Couleur principale (bleu actif) */
--text-dark:#5a5d63;     /* Couleur du texte inactif (L1 & L2) */
--icon-light:#d0d3d9;    /* Couleur des icônes inactives */
--bg:#ffffff;            /* Couleur de fond (sert au fondu) */
--font-family:"Cera Pro",system-ui,-apple-system,"Segoe UI",Roboto,Arial,sans-serif; /* Police du menu */

/* Tailles & métriques L1 */
--text-size:26px;        /* Taille de police des libellés L1 */
--w-regular:500;         /* Graisse du texte inactif L1 */
--w-active:800;          /* Graisse du texte actif L1 */
--icon-size:42px;        /* Taille des icônes L1 */
--space:19px;            /* Espace entre icône et libellé L1 */
--overlap:26px;          /* Chevauchement du libellé sur l'icône L1 */
--active-shift:15px;     /* Décalage vers la droite du libellé L1 actif */
--fade:12px;             /* Largeur du fondu blanc sur l'icône */
--row-gap:28px;          /* Espace vertical entre items L1 */
--left-pad:14px;         /* Marge gauche interne du lien L1 */
--container-width:430px; /* Largeur du bloc menu */
--bottom-offset:130px;   /* Distance du menu par rapport au bas de l'écran */

/* Sous-menu L2 (plus petit que L1) */
--l2-scale:0.86;         /* Échelle du L2 vs L1 ( <1 = plus petit ) */
--l2-indent:32px;        /* Décalage vers la droite du L2 */
--l2-row-gap:16px;       /* Espace vertical entre items L2 */
--l2-overlap-mult:1.20;  /* Intensité du chevauchement L2 (× overlap L1) */
--l2-active-shift:12px;  /* Décalage supplémentaire du libellé L2 actif */
--l2-fade-mult:1.60;     /* Intensité du fondu des icônes L2 */
--l2-top-gap:16px;       /* Espace entre un L1 et le début de son L2 */
  position:fixed;position:fixed; left:0; bottom:var(--bottom-offset); z-index:1000;
  font-family:var(--font-family);
}
#netflop-menu-root .netflop-inner{ width:var(--container-width); padding:8px 12px; box-sizing:border-box; }
#netflop-menu-root .netflop-menu-list{ list-style:none; margin:0; padding:0; display:flex; flex-direction:column; row-gap:var(--row-gap); }

/* Reset minimal et ciblé */
#netflop-menu-root .netflop-menu-list > li{ list-style:none !important; margin:0; padding:0; }
#netflop-menu-root .netflop-menu-list > li > a{
  text-decoration:none; background:transparent !important; border:0 !important; box-shadow:none !important;
  display:flex; align-items:center; justify-content:flex-start !important; gap:0; column-gap:0; min-width:0;
  padding-left:var(--left-pad) !important; padding-right:0 !important; margin:0 !important;
  -webkit-tap-highlight-color:transparent; touch-action:manipulation;
}
/* Supprime une éventuelle flèche ::after du thème */
#netflop-menu-root .menu-item-has-children > a::after{ content:none !important; }

/* Icône (Menu Icons) + fondu */
#netflop-menu-root i._mi{
  position:relative;
  font-size:var(--icon-size) !important; width:var(--icon-size) !important; height:var(--icon-size) !important;
  color:var(--icon-light) !important; display:inline-flex !important; align-items:center; justify-content:center;
  margin-right:var(--space) !important; flex:0 0 var(--icon-size);
  text-shadow:0 2px 3px rgba(0,0,0,.16);
}
#netflop-menu-root i._mi::before{ font-size:inherit !important; line-height:1 !important; color:inherit !important; }
#netflop-menu-root i._mi::after{
  content:""; position:absolute; top:0; right:-1px; height:100%; width:var(--fade);
  background:linear-gradient(to right, rgba(255,255,255,0) 0%, var(--bg) 90%); pointer-events:none;
}

/* Libellé L1 */
#netflop-menu-root .netflop-menu-list > li > a .nf-label{
  font-size:var(--text-size); font-weight:var(--w-regular); color:var(--text-dark);
  position:relative; left:calc(-1 * var(--overlap)); white-space:nowrap; line-height:1.06;
}

/* Actif L1 */
#netflop-menu-root .netflop-menu-list > li.current-menu-item > a .nf-label,
#netflop-menu-root .netflop-menu-list > li.current_page_item > a .nf-label{
  color:var(--accent); font-weight:var(--w-active);
  left:calc(-1 * var(--overlap) + var(--active-shift));
}
#netflop-menu-root .netflop-menu-list > li.current-menu-item > a i._mi,
#netflop-menu-root .netflop-menu-list > li.current_page_item > a i._mi{
  color:var(--accent) !important; text-shadow:0 3px 4px rgba(0,0,0,.18);
}
#netflop-menu-root .netflop-menu-list > li.current-menu-item > a i._mi::after,
#netflop-menu-root .netflop-menu-list > li.current_page_item > a i._mi::after{ width:0; } /* pas de fondu sur l'actif */

/* ——— SOUS-MENU (L2) ——— */
#netflop-menu-root .sub-menu{
  list-style:none; margin:10px 0 0 0; padding:0 0 0 var(--l2-indent) !important;
  max-height:0; overflow:hidden; opacity:0; transform:translateY(-4px);
  transition:max-height .25s ease, opacity .25s ease, transform .25s ease;
}
#netflop-menu-root li.is-open > .sub-menu{ max-height:1000px; opacity:1; transform:none; }
#netflop-menu-root .sub-menu > li + li{ margin-top:var(--l2-row-gap); }

/* Items L2 : même structure que L1, mais scaled */
#netflop-menu-root .sub-menu > li > a,
#netflop-menu-root .sub-menu > li > a span{ color:var(--text-dark) !important; }
#netflop-menu-root .sub-menu > li > a{
  display:flex; align-items:center; justify-content:flex-start !important; gap:0; column-gap:0; min-width:0;
  padding:0 !important; margin:0 !important; text-decoration:none; background:transparent !important; border:0 !important; box-shadow:none !important;
}
#netflop-menu-root .sub-menu > li > a i._mi{
  position:relative;
  font-size:calc(var(--icon-size) * var(--l2-scale)) !important;
  width:calc(var(--icon-size) * var(--l2-scale)) !important; height:calc(var(--icon-size) * var(--l2-scale)) !important;
  color:var(--icon-light) !important; display:inline-flex !important; align-items:center; justify-content:center;
  margin-right:calc(var(--space) * var(--l2-scale)) !important; flex:0 0 calc(var(--icon-size) * var(--l2-scale)); opacity:.85;
}
#netflop-menu-root .sub-menu > li > a i._mi::after{
  content:""; position:absolute; top:0; right:-1px; height:100%; width:calc(var(--fade) * var(--l2-scale) * var(--l2-fade-mult));
  background:linear-gradient(to right, rgba(255,255,255,0) 0%, var(--bg) 90%); pointer-events:none;
}
#netflop-menu-root .sub-menu > li > a span{
  font-size:calc(var(--text-size) * var(--l2-scale)) !important; line-height:1.06;
  position:relative; left:0 !important; white-space:nowrap;
}
#netflop-menu-root .sub-menu > li > a i._mi + span{ left:calc(-1 * var(--overlap) * var(--l2-scale) * var(--l2-overlap-mult)) !important; }

#netflop-menu-root .sub-menu .current-menu-item > a span,
#netflop-menu-root .sub-menu .current_page_item > a span{ color:var(--accent) !important; font-weight:var(--w-active) !important; }
#netflop-menu-root .sub-menu .current-menu-item > a i._mi,
#netflop-menu-root .sub-menu .current_page_item > a i._mi{ color:var(--accent) !important; }
#netflop-menu-root .sub-menu .current-menu-item > a i._mi::after,
#netflop-menu-root .sub-menu .current_page_item > a i._mi::after{ width:0; } /* pas de fondu sur actif L2 */

/* Chevron inline (bouton) — le lien reste cliquable pour naviguer */
#netflop-menu-root .has-toggle{ display:flex; align-items:center; }
#netflop-menu-root .nf-toggle{
  margin-left:10px; width:24px; height:24px; border:0; background:transparent; padding:0; cursor:pointer; border-radius:6px; flex:0 0 24px;
}
#netflop-menu-root .nf-toggle::before{
  content:""; display:block; width:9px; height:9px;
  border-right:2px solid var(--text-dark); border-bottom:2px solid var(--text-dark);
  transform:rotate(-45deg); margin:6px auto; opacity:.75;
}
#netflop-menu-root li.is-open > a .nf-toggle::before{ transform:rotate(45deg); }

/* Alerte */
#netflop-menu-root .netflop-warning{ background:#fff3cd; border-left:4px solid #ffce00; padding:10px 12px; font-size:14px; }
#netflop-menu-root .sub-menu .current-menu-item > a i._mi + span,
#netflop-menu-root .sub-menu .current_page_item > a i._mi + span{
  left:calc(-1 * var(--overlap) * var(--l2-scale) * var(--l2-overlap-mult) + var(--l2-active-shift)) !important;
}