/* =============================================================================
   UX-5 — Couches flottantes : ne jamais recouvrir une action
   -----------------------------------------------------------------------------
   Constat de qualification E2E du 15/08/2026 (GED-VISA-BTN-MASQUE-001) :
   sur un écran 1512x787, trois éléments en `position:fixed` s'empilent dans le
   même coin bas-droit / bas-centre et rendent des boutons d'action physiquement
   inatteignables à la souris :

     1. #c360-conn ............ bandeau « Build360 connecté — ... »
                                position:fixed; bottom:12px; left:50%;
                                z-index:9999; max-width:90vw  (sync.js ~1100)
     2. .b360-guide-launcher .. bulle « Besoin d'aide ? »
                                position:fixed; right:22px; bottom:24px;
                                z-index:72                    (assistant.css)
     3. Boutons d'action flottants de certaines vues

   Deux cas reproduits :
     - GED > onglet Visas : le bouton « Statuer » de la dernière ligne tombe
       sous la bulle d'aide. La page ne scrolle pas au-delà : le valideur ne
       peut pas viser son document.
     - Modale « Nouveau projet » : le bouton « Créer le projet » est recouvert
       par le bandeau #c360-conn (z-index 9999, donc au-dessus de la modale).

   Ce fichier est chargé EN DERNIER et ne modifie aucune règle existante.
   Il applique trois corrections indépendantes :

     A. Réserve de place en bas de la zone de contenu, pour que la dernière
        ligne d'une liste puisse toujours passer au-dessus des flottants.
     B. Masquage du bandeau de connexion quand une modale/drawer est ouvert
        (même traitement que la bulle d'aide, qui l'avait déjà).
     C. Le bandeau ne capture plus les clics : même visible, il laisse passer
        le pointeur vers ce qu'il recouvre.

   L'auto-effacement du bandeau après quelques secondes est traité côté JS
   (sync.js) — la pastille `#envPill` de la barre latérale porte déjà
   l'information de mode en permanence, le bandeau n'a pas à rester à vie.
   ============================================================================= */

/* --- A. Réserve de place sous le contenu -----------------------------------
   Hauteurs cumulées : bulle d'aide 48px + 24px de marge basse = 72px,
   bandeau 30px + 12px = 42px. On réserve 132px pour couvrir les deux et
   laisser une respiration. Les paddings horizontaux existants sont conservés
   (on ne surcharge que `padding-bottom`). */
.content{ padding-bottom:132px; }

@media (max-width:1024px){
  .content{ padding-bottom:124px; }
}

@media (max-width:640px){
  /* En mobile la barre de navigation basse s'ajoute aux flottants. */
  .content{ padding-bottom:148px; }
}

@media print{
  /* Rien de tout cela n'existe à l'impression. */
  .content{ padding-bottom:0; }
}

/* --- B. Bandeau de connexion masqué quand une modale est ouverte -----------
   `assistant.css` faisait déjà disparaître la bulle d'aide dans ce cas ;
   le bandeau, lui, restait au-dessus de la modale avec son z-index 9999. */
body.drawer-open #c360-conn{ display:none !important; }

/* --- C. Le bandeau ne vole plus les clics ----------------------------------
   #c360-conn est cliquable uniquement pour ouvrir la connexion quand
   l'utilisateur n'est PAS connecté. Une fois connecté, il n'est plus qu'un
   indicateur : il ne doit pas intercepter les clics destinés au contenu. */
body.b360-connected #c360-conn{ pointer-events:none; }

/* --- D. Effacement progressif du bandeau -----------------------------------
   Classe posée par sync.js quelques secondes après l'affichage. */
#c360-conn{ transition:opacity .35s ease, visibility .35s ease; }
#c360-conn.c360-conn--idle{ opacity:0; visibility:hidden; pointer-events:none; }

/* =============================================================================
   AUTH-ONBOARDING-BILLING — récapitulatif d'offre (PLAN-PRESERV-001)
   -----------------------------------------------------------------------------
   L'écran « Société » ne redemande plus le forfait dans un <select> : il
   rappelle l'offre choisie sur la landing. Ce bloc est purement additif et
   n'altère aucune règle existante.
   ============================================================================= */
.auth-plan-recap{
  grid-column:1 / -1;
  display:flex; flex-direction:column; gap:3px;
  padding:12px 14px; border-radius:12px;
  background:#f1f6fb; border:1px solid #d7e5f2;
}
.auth-plan-recap b{ font-size:15px; color:#0e2a4e; }
.auth-plan-recap span{ font-size:13.5px; font-weight:700; color:#1b5aa8; }
.auth-plan-recap small{ font-size:11.5px; color:#5b7690; line-height:1.35; }
.auth-plan-recap .auth-link{ align-self:flex-start; margin-top:4px; padding:0; font-size:12.5px; }

/* MOBILE-001 — un champ dont la police est inférieure à 16px déclenche le zoom
   automatique de Safari iOS ; dans une modale `position:fixed`, ce zoom peut
   rendre le champ suivant inatteignable. Le tunnel d'inscription est le seul
   endroit où l'on saisit sur mobile avant d'être client : on y neutralise le
   déclencheur sans toucher au reste de l'application. */
@media (max-width:640px){
  #authOverlay .auth-inp,
  #resetOverlay .auth-inp{ font-size:16px; }
  /* `100vh` inclut la barre d'outils Safari : le CTA de paiement pouvait
     passer sous le chrome du navigateur. `dvh` suit la hauteur réellement
     visible, avec repli sur l'ancienne valeur pour les navigateurs anciens. */
  .auth-card--provision{ max-height:calc(100vh - 20px); max-height:calc(100dvh - 20px); }
}
