/* Mise en forme du texte enrichi saisi dans le back-office.
   La liste de balises autorisées vit dans App\Support\RichText ; cette
   feuille est son pendant visuel. */

/* Palette de couleurs de texte : classes fermées, jamais de style inline
   (aucun CSS arbitraire ne rentre dans le contenu). Chaque valeur a été
   retenue pour son contraste sur les fonds où le texte enrichi apparaît —
   #f4f4f6 pour un article, #f4f4f4 pour une page légale — au minimum
   4,5:1, seuil AA de RGAA 3.2.

   Rappel pour la rédaction : la couleur ne doit jamais porter seule une
   information (RGAA 3.1). Elle accentue, elle ne remplace pas les mots. */
.rt-corail {
    color: #c43b23; /* 4,78:1 */
}

.rt-bleu {
    color: #0066b3; /* 5,38:1 */
}

.rt-vert {
    color: #16704a; /* 5,54:1 */
}

.rt-teal {
    color: #1d7b7e; /* 4,57:1 */
}

.rt-gris {
    color: #5a5a5a; /* 6,28:1 */
}

/* Souligné du rédacteur : décalé sous la ligne de base pour ne pas
   traverser les jambages, et surtout distinct du souligné d'un lien —
   sur le web, un texte souligné se lit comme cliquable. C'est la raison
   pour laquelle les liens du contenu gardent, eux, leur épaisseur et leur
   couleur propres. */
.lh u,
.blog-article__body u {
    text-decoration-thickness: 1px;
    text-underline-offset: 0.18em;
}

/* Texte barré. À savoir, et c'est dit au rédacteur dans la barre d'outils :
   la plupart des lecteurs d'écran n'annoncent pas la rature. Un « 12 € »
   barré est donc lu « 12 € » — l'information « ce prix n'est plus
   valable » doit être écrite en mots, pas seulement raturée. */
.lh s,
.blog-article__body s {
    text-decoration-thickness: 1px;
}

/* Surlignage. Les trois fonds gardent l'encre brune du site à 7:1 ou
   mieux (niveau AAA). Le fond par défaut sert aux <mark> sans teinte —
   contenu importé, ou teinte retirée de la palette. */
.lh mark,
.blog-article__body mark {
    padding: 0 3px;
    border-radius: 3px;
    background: #f5c518;
    /* Encre imposée : le fond du surlignage est clair, un thème sombre du
       navigateur rendrait le texte illisible dessus. */
    color: #4a2c28;
}

.rt-hl-jaune {
    background: #f5c518; /* encre à 7,66:1 */
}

.rt-hl-rose {
    background: #f7b3a6; /* encre à 7,11:1 */
}

.rt-hl-vert {
    background: #9ddbae; /* encre à 7,83:1 */
}

/* Exposant et indice : sans line-height à 0, une note d'appel fait
   respirer la ligne d'un cran et le paragraphe se met à « sauter ». */
.lh sup,
.lh sub,
.blog-article__body sup,
.blog-article__body sub {
    font-size: 0.7em;
    line-height: 0;
    position: relative;
    vertical-align: baseline;
}

.lh sup,
.blog-article__body sup {
    top: -0.5em;
}

.lh sub,
.blog-article__body sub {
    bottom: -0.25em;
}

/* Alignement de bloc (paragraphe, titre, liste). « gauche » est la mise en
   page par défaut du gabarit, aucune classe ne le porte. */
.rt-align-centre {
    text-align: center;
}

.rt-align-droite {
    text-align: right;
}