/* ==========================================================================
   Messagerie — styles présents sur toutes les pages (lien lié dans le <head> par messagerie/_tete.html.twig) :
   compteur de non-lus dans l'en-tête et la navigation basse (5 entrées pour un compte connecté), bouton
   « Écrire à l'annonceur » de la fiche. Jetons uniquement (docs/DESIGN.md), aucun [data-theme].
   ========================================================================== */

.nav-compteur {
    display: inline-grid; place-items: center; min-width: 1.375rem; height: 1.375rem; padding: 0 6px; margin-left: 6px;
    border-radius: var(--r-pilule); background: var(--action); color: var(--action-encre);
    font: var(--tres-gras) 0.75rem/1 var(--police-donnees); font-variant-numeric: tabular-nums;
}

/* En-tête de 900 à 1199 px : une entrée de plus (« Messages ») ; libellés sur une ligne, marges resserrées
   (vérifié avec un compteur à deux chiffres dans les trois thèmes, sans débordement). */
@media (min-width: 900px) and (max-width: 1199px) {
    .nav-haut:has(.nav-messages) { gap: 0; }
    .nav-haut:has(.nav-messages) > a:not(.btn) { padding: 0 9px; white-space: nowrap; }
    .nav-haut:has(.nav-messages) > a:not(.btn)[aria-current="page"]::after { left: 9px; right: 9px; }
    .nav-haut:has(.nav-messages) .btn { margin-left: var(--e-1); }
}
@media (min-width: 900px) and (max-width: 1023px) {
    .nav-haut:has(.nav-messages) > a:not(.btn) { padding: 0 6px; }
    .nav-haut:has(.nav-messages) > a:not(.btn)[aria-current="page"]::after { left: 6px; right: 6px; }
    .nav-haut .nav-messages .nav-compteur { margin-left: 4px; }
}

@media (max-width: 899px) {
    .nav-bas:has(.nav-bas-messages) { grid-template-columns: repeat(5, minmax(0, 1fr)); gap: 2px; padding-left: 4px; padding-right: 4px; }
    .nav-bas .nav-bas-icone { position: relative; display: inline-flex; }
    .nav-bas .nav-bas-messages .nav-compteur { position: absolute; top: -7px; left: 15px; margin: 0; box-shadow: 0 0 0 2px var(--navbas-fond); }
}
@media (max-width: 374px) {
    .nav-bas:has(.nav-bas-messages) a { font-size: 0.75rem; }
}

/* Fiche d'une annonce : « Écrire à l'annonceur » sous le contact */
.fi-messagerie { display: grid; gap: 8px; margin-top: 12px; }
.fi-messagerie .btn-plein { font-size: 1rem; padding: 0 16px; }