/* Textes mis en forme d'ANIMOO : affichage (classe .texte-riche, filtre Jinja « riche ») et éditeur (.editeur).
   Les balises possibles sont celles de app/utils/texte_riche.py (BALISES). */

/* --- Affichage --- */
.texte-riche { line-height: 1.7; overflow-wrap: anywhere; }
.texte-riche > :first-child { margin-top: 0; }
.texte-riche > :last-child { margin-bottom: 0; }
.texte-riche p { margin-bottom: .75rem; }
.texte-riche h2, .texte-riche h3 { font-size: 1.15rem; font-weight: 700; margin: 1.25rem 0 .5rem; }
.texte-riche h4 { font-size: 1rem; font-weight: 700; margin: 1rem 0 .4rem; }
.texte-riche ul, .texte-riche ol { padding-left: 1.4rem; margin-bottom: .75rem; }
.texte-riche li { margin-bottom: .2rem; }
.texte-riche blockquote { border-left: 4px solid #dee2e6; padding: .25rem 0 .25rem 1rem; color: #6c757d; font-style: italic; margin: 0 0 .75rem; }
.texte-riche hr { margin: 1rem 0; }
.texte-riche a { text-decoration: underline; }

/* --- Éditeur --- */
.editeur:focus-within { border-color: #86b7fe !important; box-shadow: 0 0 0 .25rem rgba(13, 110, 253, .25); }
.editeur.is-invalid { border-color: #dc3545 !important; }
/* Barre d'outils : reste visible en haut de l'écran pendant la saisie d'un long texte ; passe à la ligne sur mobile */
.editeur-barre { display: flex; flex-wrap: wrap; align-items: center; gap: 2px; padding: 4px; border-bottom: 1px solid #dee2e6;
                 background: #f8f9fa; border-radius: .25rem .25rem 0 0; position: sticky; top: 0; z-index: 2; }
.editeur-barre .btn { min-width: 2.25rem; min-height: 2.25rem; padding: .2rem .45rem; }   /* Cibles assez grandes pour le doigt */
.editeur-barre .btn.active { background: #dbe4ff; border-color: #b6c8ff; }
.editeur-separateur { width: 1px; align-self: stretch; background: #dee2e6; margin: 2px 4px; }
.editeur-zone { position: relative; padding: .6rem .75rem; outline: none; max-height: 70vh; overflow-y: auto; }
.editeur-zone.vide::before { content: attr(data-placeholder); color: #adb5bd; pointer-events: none; position: absolute; }