/* =============================================================================
   NABSEED · surcharge arabe. Chargee UNIQUEMENT par les pages -ar.

   POURQUOI UNE FEUILLE A PART ET NON UNE REECRITURE DU CSS PRINCIPAL. Parce que les
   six pages latines sont en ligne et fonctionnent. Toucher composants.css pour l arabe,
   c est risquer les trois autres langues pour la quatrieme. Une surcharge chargee en
   dernier ne peut rien casser ailleurs, et elle se retire en une ligne si elle deplait.

   CE QUE L ARABE EXIGE, ET QUI N EST PAS QU UNE DIRECTION DE TEXTE.

     1. La police. Jost ne contient AUCUN glyphe arabe : verifie sur la source, 524
        glyphes, zero dans la plage U+0600. Les titres arabes ne peuvent donc pas etre
        en Jost. Ils prennent Noto Naskh Arabic, qui est la police que ce dossier
        employait deja avant que je la retire faute d arabe a afficher.

     2. La direction. direction:rtl retourne le flux du texte, et rien d autre. Tout ce
        qui a ete ecrit en left, right, padding-left ou border-right reste a sa place et
        se retrouve du mauvais cote. Les vingt-trois occurrences relevees a l audit sont
        reprises ici une par une.

     3. Les fleches. Une fleche « suivant » pointe a droite en latin et A GAUCHE en
        arabe. Ce n est pas un detail cosmetique : une fleche qui pointe dans le sens de
        lecture inverse fait reculer le lecteur.
   ============================================================================= */

/* ----------------------------------------------------- 01 · direction et voix */

html { direction: rtl; }

:root {
  /* Noto Naskh porte les titres ET le recit : il n existe pas d equivalent arabe de la
     distinction Jost/Inter, et en inventer une serait decider a la place d un typographe
     arabe. La monospace reste pour la donnee mesuree : les chiffres sont en caracteres
     occidentaux, comme partout dans le commerce du Golfe. */
  --voix-titre: 'Noto Naskh Arabic', 'Geeza Pro', serif;
  --voix-recit: 'Noto Naskh Arabic', 'Geeza Pro', serif;
}

body { font-family: var(--voix-recit); }

/* L arabe a une hauteur d oeil plus grande et des hampes longues : la meme valeur
   d interlignage qu en latin le rend serre. Mesure a l oeil sur Noto Naskh, remontee de
   1,62 a 1,85. C est le seul reglage de ce fichier qui releve du gout et non de la
   mecanique, et il est signale comme tel. */
body, p, li { line-height: 1.85; }

/* Les capitales et l interlettrage n existent pas en arabe. Les appliquer produit un
   texte disloque, parce que l ecriture est liee : un espacement entre les lettres casse
   les ligatures obligatoires. */
[class], [class] * {
  text-transform: none !important;
  letter-spacing: normal !important;
}

/* ----------------------------------------------------- 02 · ce qui doit se retourner */

.nav a::after      { left: auto; right: 0; }
.chapitre          { left: auto; right: var(--pad); }
.puces             { left: auto; right: var(--pad); }
.langue ul         { right: auto; left: 0; }
.avance            { left: auto; right: 0; }

.vide              { border-left: 0; border-inline-end: 2px solid var(--acc); }

.axe:first-child   { padding-left: var(--pad); padding-right: 0; }
.axe:last-child    { padding-right: var(--pad); padding-left: 0;
                     border-right: var(--filet) solid var(--filet-faible); }

.ligne .st         { text-align: left; }

/* ----------------------------------------------------- 03 · les fleches */

/* Les positions s echangent : la fleche « precedent » passe a droite, « suivant » a gauche. */
.fleche.g { left: auto;  right: max(6px, calc(var(--pad) - 10px)); }
.fleche.d { right: auto; left:  max(6px, calc(var(--pad) - 10px)); }

/* Et la pointe elle meme se retourne : le chevron etait construit avec un bord droit,
   il se construit ici avec un bord gauche. Sans cela, les fleches pointent l une vers
   l autre au lieu de pointer dans le sens de la lecture. */
.fleche i        { border-right: 0; border-left: 1px solid currentColor; }
.btn .arw::after { border-right: 0; border-left: var(--filet) solid currentColor;
                   right: auto; left: 0; }
.langue button::after { border-right: 0; border-left: 1px solid currentColor; }

/* ----------------------------------------------------- 04 · les effets */

/* Le fil et la derive parlent de deplacement horizontal. Les laisser tels quels ferait
   glisser le decor dans le sens contraire de la lecture. On ne les retourne pas : on les
   neutralise, parce qu un decor qui contredit le sens de lecture vaut moins que pas de
   decor du tout, et parce qu une trochoide inversee demande une mesure que je n ai pas
   faite. A reprendre le jour ou la version arabe sera relue. */
.fx-derive [style*="translate3d"] { transform: none !important; }

/* ----------------------------------------------------- 05 · nombres et donnees */

/* Les nombres restent en chiffres occidentaux et se lisent de gauche a droite meme dans
   un paragraphe arabe. Le navigateur le fait seul par l algorithme bidirectionnel, mais
   une reference de lot melant chiffres et tirets peut se disloquer : on l isole. */
var, time, .rang, .marqueur .n, .gamme .k {
  direction: ltr;
  unicode-bidi: isolate;
  font-family: var(--voix-mesure);
}