/* Pastilles communes de la suite (servie sous /commun/pastilles.css),
   créées le 24/08/2026 (demande d'Yves) en promotion du style du module
   Équipe, lui-même repris de la forme .etat de l'auth (écran des
   groupes) : pilule à bordure fine. Spécification et règles P1-P5 :
   docs/specs/pastilles-communes.md.

   USAGE : <span class="pastille-marque pastille-verte">moi</span> — la
   classe de base porte la forme, une classe de gamme la couleur. Le
   TEXTE de la pastille porte seul le sens (RGAA 3.1 : jamais la couleur
   seule). Les couples texte/fond sont ceux des gammes vert, ambre et
   rouge de la suite, déclarés et vérifiés à 4,5:1 dans les deux thèmes
   (outils/rgaa/contraste.php) ; les bordures sont décoratives (aucune
   exigence de contraste), valeurs reprises de l'auth.

   Gamme GRISE ajoutée le 26/09/2026 (lot L1 du module Guichet) : gamme
   NEUTRE, pour une marque qui ne dit ni un succès, ni une réserve, ni une
   alerte. Le Guichet en a besoin pour ses étiquettes de courrier, dont
   « Information » est neutre par nature (arbitrage A8 de
   docs/specs/guichet-boite-de-service-prespecification.md §8.2) ; marquer
   une information neutre en vert, en ambre ou en rouge aurait donné un sens
   qu'elle n'a pas. Couples vérifiés comme les trois autres (6,62:1 en
   clair, 5,68:1 en sombre), section « pastilles » de l'outil de contrastes.

   THÈMES : feuille autonome, aucun jeton à déclarer par les modules ;
   les DEUX blocs sombres ci-dessous doivent rester identiques.

   Un libellé long peut se replier : poser « white-space: normal » dans
   la feuille du module, sur le conteneur concerné, jamais ici.

   Toute évolution s'accompagne de l'incrément du ?v= dans les layouts
   qui chargent la feuille (outils/coherence/verifier.php contrôle leur
   alignement) et, comme pour tout asset /commun/, d'une présence au
   PRECACHE de projet/public/sw.js. */
.pastille-marque {
    display: inline-block;
    padding: 0 0.45rem;
    border: 1px solid;
    border-radius: 1rem;
    font-size: 0.7rem;
    font-weight: 600;
    white-space: nowrap;
    vertical-align: middle;
}
.pastille-verte { color: #2f6b45; background: #e9f2ec; border-color: #bfd8c8; }
.pastille-ambre { color: #806419; background: #fdf3df; border-color: #ecd9a8; }
.pastille-rouge { color: #b3352e; background: #f9ebea; border-color: #e3bdba; }
.pastille-grise { color: #4b5563; background: #eef0f2; border-color: #d3d8de; }

@media (prefers-color-scheme: dark) {
    :root:not([data-theme="clair"]) .pastille-verte { color: #85c39d; background: #1e2f25; border-color: #3a5c47; }
    :root:not([data-theme="clair"]) .pastille-ambre { color: #d7b25f; background: #332b18; border-color: #66582d; }
    :root:not([data-theme="clair"]) .pastille-rouge { color: #e0837c; background: #3a2422; border-color: #6e3a36; }
    :root:not([data-theme="clair"]) .pastille-grise { color: #a5aeba; background: #2d3149; border-color: #3f4460; }
}
/* Bloc sombre EXPLICITE : doit rester identique au bloc ci-dessus. */
:root[data-theme="sombre"] .pastille-verte { color: #85c39d; background: #1e2f25; border-color: #3a5c47; }
:root[data-theme="sombre"] .pastille-ambre { color: #d7b25f; background: #332b18; border-color: #66582d; }
:root[data-theme="sombre"] .pastille-rouge { color: #e0837c; background: #3a2422; border-color: #6e3a36; }
:root[data-theme="sombre"] .pastille-grise { color: #a5aeba; background: #2d3149; border-color: #3f4460; }
