/*
 * En-tête compact des écrans connectés (templates/_entete.html.twig) : actions
 * de masse ou retour à gauche, titre au centre, ajouts et filtres à droite, sur
 * une seule ligne — la hauteur de l'écran revient au contenu. Sur un écran
 * étroit, les trois blocs s'empilent.
 *
 * Même fichier dans AccessManager et EventsManager.
 */
.entete-page {
    display: grid;
    grid-template-columns: 1fr auto 1fr;
    align-items: center;
    gap: 0.5rem;
    margin-bottom: 0.75rem;
}
.entete-page > :first-child { justify-self: start; }
.entete-page > :last-child  { justify-self: end; }
.entete-page h1 {
    margin: 0;
    font-size: 1.5rem;
    text-align: center;
}
.entete-page-droite {
    display: flex;
    flex-wrap: wrap;
    justify-content: flex-end;
    gap: 0.5rem;
}
/* Boutons de l'en-tête à la taille réduite de Bootstrap (btn-sm), qu'un écran
   l'ait demandée ou non : l'en-tête doit rester sur une ligne. */
.entete-page .btn {
    padding: 0.25rem 0.5rem;
    font-size: 0.875rem;
}
/* Complément du titre : total, statut. */
.entete-page-suite {
    margin-left: 0.5rem;
    font-size: 1rem;
    color: var(--bs-secondary);
    white-space: nowrap;
}
@media (max-width: 991.98px) {
    .entete-page { grid-template-columns: 1fr; }
    .entete-page > :first-child,
    .entete-page > :last-child { justify-self: center; }
    .entete-page-droite { justify-content: center; }
    .entete-page h1 { font-size: 1.2rem; }
}