/* Neutralise les backdrops Bootstrap si jamais ils apparaissent */
.modal-backdrop { display: none !important; opacity: 0 !important; }

/* Notre overlay unique */
/* Overlay: couvre tout l’écran, bord à bord */
#bbx-overlay {
  position: fixed;
  top: 0; left: 0;
  width: 100vw;           /* bord à bord, pas 100% */
  height: 100vh;          /* plein viewport */
  background: rgba(0,0,0,0.20);
  display: none;
  z-index: 1040;
}
#bbx-overlay.show { display: block; }

/* Centrage vertical réel du modal (sans reflow ni .height()) */
.bootbox.modal .modal-dialog {
  margin: 0 auto !important;
  top: 20% !important;
  transform: translateY(-50%) !important;
}

/* On masque l'entête native Bootbox */
.bootbox .modal-header {
  display: none !important;
}

/* En-tête custom : grille sur une seule ligne */
.bbx-head {
  display: grid;
  grid-template-columns: var(--bbx-side, 80px) 1fr var(--bbx-side, 80px);
  align-items: center; /* <<< aligne verticalement l'icône et le titre */
  column-gap: 10px;
  margin: 0;
  padding: 10px 0;
}

/* Icône en haut-gauche, alignée sur la même ligne que le titre */
.bbx-icon {
  grid-column: 1;
  justify-self: start;
  align-self: center; /* alignement vertical au centre du titre */
  width: 48px;
  height: 48px;
  margin-left: var(--bbx-left, 8px);
  object-fit: contain;
}

/* Titre centré horizontalement et multi-ligne */
.bbx-title {
  grid-column: 2;
  text-align: center;
  font-weight: 700;
  font-size: 16px;
  line-height: 1.3;
  padding: 0 12px;
  word-break: break-word;
}

/* Colonne "fantôme" pour équilibrer */
.bbx-spacer {
  grid-column: 3;
}

/* Corps du message (sous le titre) */
.bbx-body {
  margin-top: 15px;
  text-align: center;
  font-size: 1.1em;
  line-height: 1.5;
}

.bbx-title:empty::before { content: "\00a0"; } /* espace insécable */