/**
 * Barre d’état / encoche (iPhone, PWA) : éviter la bande blanche au-dessus du contenu.
 * Complété par meta theme-color, apple-mobile-web-app-status-bar-style, viewport-fit=cover sur les pages formation.
 */
html {
  color-scheme: dark;
  background-color: #0d0a08;
  touch-action: pan-x pan-y;
  -webkit-text-size-adjust: 100%;
  text-size-adjust: 100%;
}

.formation-topbar {
  padding-top: max(1rem, env(safe-area-inset-top, 0px)) !important;
}

.wrap .topbar {
  padding-top: max(1rem, env(safe-area-inset-top, 0px)) !important;
}

/**
 * Navigation formation : flèche + texte sur une ligne (prev : ← puis libellé ; next : libellé puis →).
 * Modules 1–5 : .formation-topbar ; modules 6+ : .wrap .topbar
 */
.formation-topbar .btn-group,
.wrap .topbar .topbar-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 0.45rem;
  justify-content: flex-end;
  align-items: center;
  max-width: 100%;
}

@media (max-width: 720px) {
  .formation-topbar {
    flex-direction: column;
    align-items: stretch;
  }
  .formation-topbar .btn-group,
  .wrap .topbar .topbar-actions {
    justify-content: center;
  }
  .wrap .topbar {
    flex-direction: column;
    align-items: stretch;
  }
}

.formation-topbar .btn.nav-btn,
.wrap .topbar .btn.nav-btn {
  display: inline-flex;
  flex-direction: row;
  flex-wrap: nowrap;
  align-items: center;
  justify-content: center;
  gap: 0.4em;
  white-space: nowrap;
  min-height: 2.4rem;
}

.formation-topbar .nav-btn__arrow,
.wrap .topbar .nav-btn__arrow {
  flex-shrink: 0;
  line-height: 1;
  opacity: 0.9;
}

.formation-topbar .nav-btn__label,
.wrap .topbar .nav-btn__label {
  line-height: 1.15;
}

/* Retour accueil : deux lignes fixes, pas de flèche — hauteur proche des autres boutons */
.formation-topbar .nav-btn--home,
.wrap .topbar .nav-btn--home {
  white-space: normal;
  min-width: 7.5rem;
}

.formation-topbar .nav-btn__label--stack,
.wrap .topbar .nav-btn__label--stack {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 0.06em;
  text-align: center;
  letter-spacing: inherit;
}

.formation-topbar .nav-btn__label--stack span,
.wrap .topbar .nav-btn__label--stack span {
  display: block;
  white-space: nowrap;
  line-height: 1.12;
}

@media (max-width: 380px) {
  .formation-topbar .btn.nav-btn,
  .wrap .topbar .btn.nav-btn {
    font-size: 0.68rem;
    padding: 0.42rem 0.65rem;
  }
}