/* IMOVI+ — Petits écrans : une seule règle pour tout ce qui flotte (chargée avec chaque bouton flottant).
   ───────────────────────────────────────────────────────────────────────────────────────────────
   Avant : chaque bouton flottant (concierge, messagerie, « retour en haut », « publier ») avait SA position écrite en dur
   (bottom: 24px, 88px, 160px…) : ils se marchaient dessus et passaient sous la barre de navigation du bas.
   Maintenant : une pile, calée sur la hauteur RÉELLE de la barre du bas + la zone de sécurité du téléphone
   (encoche, barre de gestes Android/iOS) — de bas en haut : [barre] → discussion → retour en haut.            */

:root { --pile-nav: 0px; --pile-fab: 54px; --pile-gap: 12px; --pile-bord: 14px; }

/* Barre du bas visible : pages publiques ≤ 767 px (partials/barre-mobile.php) et espaces connectés ≤ 920 px (espace.css). */
@media (max-width: 767px) { :root { --pile-nav: calc(66px + env(safe-area-inset-bottom, 0px)); } }
@media (max-width: 920px) { body.es { --pile-nav: calc(66px + env(safe-area-inset-bottom, 0px)); } }
/* Fiche d'annonce : la barre d'action (Contacter / Réserver) remplace la barre de navigation. */
@media (max-width: 767px) { body:has(.fx-barre), body:has(.fab-bar) { --pile-nav: calc(76px + env(safe-area-inset-bottom, 0px)); } }

@media (max-width: 920px) {
  /* 1 · le bouton de discussion (concierge sur les pages publiques, messagerie dans les espaces) */
  #imvcFab, .ivc-fab, body.es .ivc-fab {
    right: var(--pile-bord) !important;
    bottom: calc(var(--pile-nav) + var(--pile-bord)) !important;
    width: var(--pile-fab) !important; height: var(--pile-fab) !important;
  }
  /* 2 · « retour en haut » : juste au-dessus, centré sur le même axe */
  .hp-top {
    right: calc(var(--pile-bord) + (var(--pile-fab) - 44px) / 2) !important;
    bottom: calc(var(--pile-nav) + var(--pile-bord) + var(--pile-fab) + var(--pile-gap)) !important;
  }
  /* 3 · les bulles qui s'accrochent au bouton de discussion */
  #imvcInvite {
    right: var(--pile-bord) !important;
    bottom: calc(var(--pile-nav) + var(--pile-bord) + var(--pile-fab) + var(--pile-gap)) !important;
    max-width: calc(100vw - 2 * var(--pile-bord)) !important;
  }
  /* le bouton de messagerie disparaît tant que la messagerie est ouverte : jamais un bouton de discussion DANS la messagerie */
  .ivc-fab.ivc-open, .ivc-fab[aria-expanded="true"] { display: none !important; }
  /* 4 · « publier » : la barre du bas et l'en-tête l'offrent déjà — un troisième bouton ne ferait que gêner */
  .ivp-fab, .ivp-hint, .ivp-menu { display: none !important; }
}

/* Tablette : le panneau de messagerie se pose au-dessus de la pile (en dessous de 561 px il occupe tout l'écran, il n'y touche pas). */
@media (min-width: 561px) and (max-width: 920px) {
  .ivc-panel, body.es .ivc-panel {
    bottom: calc(var(--pile-nav) + var(--pile-bord) + var(--pile-fab) + var(--pile-gap)) !important;
    right: var(--pile-bord) !important;
    max-height: calc(100dvh - var(--pile-nav) - var(--pile-fab) - 2 * var(--pile-bord) - var(--pile-gap) - 16px);
  }
}

/* Bandeaux du bas (installation de l'application, cookies) : au-dessus de la barre, jamais dessous. */
@media (max-width: 767px) {
  #ivpPwa { bottom: calc(var(--pile-nav) + 10px) !important; }
  #ivpPwaTip { bottom: calc(var(--pile-nav) + 76px) !important; }
}

/* Clavier ouvert (champ actif) : les boutons flottants s'effacent, ils masqueraient la saisie. */
@media (max-width: 920px) {
  html.clavier-ouvert #imvcFab, html.clavier-ouvert .ivc-fab, html.clavier-ouvert .hp-top { opacity: 0 !important; pointer-events: none !important; }
}

/* Bannière d'installation affichée : les boutons flottants lui laissent la place (ils ne se superposent plus à elle). */
@media (max-width: 920px) {
  body:has(#ivpPwa.ivp-show) #imvcFab, body:has(#ivpPwa.ivp-show) .ivc-fab, body:has(#ivpPwa.ivp-show) .hp-top { opacity: 0 !important; pointer-events: none !important; }
}
