/* =====================================================================
   BAZA-S298 — RÉPONDEUR AUTOMATIQUE : styles ADDITIFS.

   Feuille servie depuis public/ (Vite ne la fusionne PAS dans
   assets/index-*.css) : la coque CSS GELÉE S141 reste byte-identique,
   aucun re-pin de hash, PWA sans réinstallation (motif validé S215→S285).

   Contenu :
   - mention DISCRÈTE « Réponse automatique » sous une bulle (modèle
     visuel de l'étiquette d'édition .s169-edited — même taille, même
     couleur discrète) ;
   - aperçu réaliste de la bulle dans la page « Mon répondeur » ;
   - liste des conditions d'éligibilité (page « Mon répondeur »).
   ===================================================================== */

/* Mention sous la bulle (fil de conversation + aperçu). */
.s298-autoreply-mention {
  font-size: 0.62rem;
  color: var(--text-faint);
  font-style: italic;
}

/* Aperçu : reproduction fidèle d'une bulle SORTANTE (fond vert doux des
   bulles .bubble.me gelées), alignée à droite comme dans le vrai fil. */
.s298-preview {
  display: flex;
  justify-content: flex-end;
  padding: 10px 4px;
}

.s298-preview-bubble {
  max-width: 76%;
  padding: 7px 10px 5px;
  border-radius: 12px;
  background-color: #d9f8cf; /* couleur GELÉE des bulles sortantes (.bubble.is-me, S170) */
  border-bottom-right-radius: 6px;
  color: var(--text);
  font-size: 1rem;
  line-height: 1.4;
  box-shadow: 0 1px 1px rgba(0, 0, 0, 0.05);
  overflow-wrap: break-word;
  word-break: break-word;
}

.s298-preview-text {
  white-space: pre-wrap;
}

.s298-preview-meta {
  display: flex;
  justify-content: flex-end;
  align-items: baseline;
  gap: 6px;
  margin-top: 2px;
}

.s298-preview-time {
  font-size: 0.68rem;
  color: var(--text-faint);
}

/* Conditions d'éligibilité (membres non éligibles / répondeur suspendu). */
.s298-cond-list {
  list-style: none;
  margin: 8px 0 0;
  padding: 0;
  display: flex;
  flex-direction: column;
  gap: 6px;
}

.s298-cond {
  display: flex;
  align-items: baseline;
  gap: 8px;
  font-size: 0.88rem;
  color: var(--text);
}

.s298-cond-dot {
  flex: none;
  color: var(--text-faint);
  font-weight: 600;
}

.s298-cond--met .s298-cond-dot {
  color: #1f9d55;
}