/* ==========================================================================
   inc-help.css — extrait de inc/help.php le 03/08/2026.
   Charge a la place exacte qu'occupait le <style> : ces regles surclassent
   app.css et app-light.css parce qu'elles viennent APRES. Ne pas remonter
   ce <link> plus haut dans le <head>.
   ========================================================================== */
/* ===== Aide contextuelle (icône « ? » + bulle explicative) ===== */
.help-i{ display:inline-flex; align-items:center; justify-content:center; width:20px; height:20px; margin-left:7px; padding:0; flex:none;
  border-radius:50%; border:1px solid rgba(var(--bz-ink-rgb),.25); background:rgba(var(--bz-ink-rgb),.05); color:var(--bz-text-2);
  font-family:inherit; font-size:.72rem; font-weight:800; line-height:1; cursor:pointer; vertical-align:middle; transition:.15s ease; }
.help-i:hover, .help-i.on{ background:var(--bz-blue-vif); border-color:var(--bz-blue-vif); color:var(--bz-sur-accent); }
.help-i:focus-visible{ outline:2px solid var(--bz-blue-vif); outline-offset:2px; }
@media (max-width:640px){
  /* LA ZONE S'ETEND, LE DESSIN NE BOUGE PAS. Ce bouton vit DANS un titre : le
     porter a 44 px deplacerait la ligne entiere. Le pseudo-element lui donne
     une zone de 44 px sans occuper la moindre place dans la mise en page. */
  .help-i{ position:relative; }
  .help-i::after{ content:''; position:absolute; top:50%; left:50%;
    width:44px; height:44px; transform:translate(-50%,-50%); }
}
.help-pop{ position:fixed; z-index:4000; max-width:320px; width:max-content; background:var(--bz-surface); color:var(--bz-text-1c);
  border:1px solid rgba(var(--bz-blue-vif-rgb),.35); border-radius:12px; padding:13px 16px;
  box-shadow:0 6px 16px rgba(var(--bz-ink-rgb),.10), 0 18px 44px -8px rgba(var(--bz-ink-rgb),.30);
  font-size:.95rem; line-height:1.55; opacity:0; transform:translateY(4px); transition:opacity .12s ease, transform .12s ease; pointer-events:none; }
.help-pop.show{ opacity:1; transform:translateY(0); pointer-events:auto; }
.help-pop .help-pop-title{ font-weight:800; font-size:.92rem; color:var(--bz-blue); margin:0 0 6px; }
.help-pop p{ margin:0 0 8px; color:var(--bz-text-1c); }
.help-pop p:last-child{ margin-bottom:0; }
