/*
 * Feuille de style pour l'affichage de droite à gauche (arabe).
 *
 * WordPress ajoute dir="rtl" sur <html> : les grilles, les flexbox et les
 * marges automatiques basculent d'elles-mêmes. Ne restent ici que les
 * valeurs directionnelles écrites en dur dans style.css, plus les polices.
 */

/* ==========================================================================
   1. Typographie arabe
   ========================================================================== */
:root {
	/* Cairo pour le texte courant, Amiri pour les titres : un naskh classique,
	   lisible et digne, adapté à une école coranique. */
	--sans: "Cairo", "Geeza Pro", "Noto Naskh Arabic", Tahoma, sans-serif;
	--serif: "Amiri", "Noto Naskh Arabic", "Geeza Pro", serif;
}

body {
	font-family: var(--sans);
	text-align: right;
	/* L'arabe se lit avec un interligne plus ample. */
	line-height: 1.9;
}

h1, h2, h3, h4 {
	font-family: var(--serif);
	line-height: 1.4;
	letter-spacing: 0;
}

.lead { line-height: 1.8; }

/* Les chiffres et les adresses restent lisibles de gauche à droite. */
.don-coord,
.don-coord span,
input[type="tel"],
input[type="email"],
input[type="url"] {
	direction: ltr;
	text-align: left;
}

.don-coord { justify-content: space-between; }

/*
 * Les nombres à groupes séparés par une espace (« 500 000 ») s'affichent
 * à l'envers en contexte droite-à-gauche : « 000 500 ». On isole ces
 * valeurs pour qu'elles restent dans le sens gauche-droite.
 */
.chiffre__val,
.impact__montant,
.budget__montant,
.don-coord span {
	direction: ltr;
	unicode-bidi: isolate;
}

.chiffre__val,
.impact__montant,
.budget__montant {
	display: block;
	text-align: center;
}

/* ==========================================================================
   2. Éléments positionnés
   ========================================================================== */
.skip-link { left: auto; right: 16px; }

.burger span::before,
.burger span::after { left: auto; right: 0; }

/* La flèche des boutons pointe vers la gauche en arabe. */
.icone--fleche { transform: scaleX(-1); }

/* L'équerre décorative du surtitre passe à droite. */
.eyebrow { flex-direction: row; }

/* ==========================================================================
   3. Listes et retraits
   ========================================================================== */
ul, ol { padding-left: 0; padding-right: 1.25em; }
.contenu ul, .contenu ol { padding-left: 0; padding-right: 1.4em; }

.liste-coche,
.liste-args,
.pied ul,
.topbar__liste,
.nav__liste { padding-right: 0; }

/* ==========================================================================
   4. Bordures et filets
   ========================================================================== */
blockquote {
	border-left: 0;
	border-right: 4px solid var(--or-500);
	border-radius: var(--r-md) 0 0 var(--r-md);
}

.encart {
	border-left: 1px solid var(--vert-100);
	border-right: 4px solid var(--vert-700);
	border-radius: var(--r-md) 0 0 var(--r-md);
}

.encart--attention {
	border-left-color: #F0D9A8;
	border-right-color: var(--or-500);
}

.urgence {
	border-left: 1px solid #F0D9A8;
	border-right: 5px solid var(--or-500);
}

.budget__postes li { flex-direction: row; }

/* ==========================================================================
   5. Grilles et colonnes
   ========================================================================== */
.heros__grille,
.duo,
.pied__grille,
.chiffres__grille,
.grille,
.impact,
.galerie,
.videos,
.don-grille { /* bascule automatique via dir="rtl" */ }

.duo--inverse .duo__media { order: 0; }

/* ==========================================================================
   6. Menu mobile
   ========================================================================== */
@media (max-width: 900px) {
	.nav { text-align: right; }
	.nav__liste a { text-align: right; }
	.nav__actions { align-items: stretch; }
	.langues ul { justify-content: center; }
}

/* ==========================================================================
   7. Pied de page et pagination
   ========================================================================== */
.pied__bas { text-align: right; }
.pied__social { flex-direction: row; }

.pagination { direction: rtl; }

/* ==========================================================================
   8. Formulaires
   ========================================================================== */
.champ input,
.champ textarea,
.champ select {
	text-align: right;
}

.champ input[type="email"],
.champ input[type="tel"] {
	direction: ltr;
	text-align: left;
}

/* ==========================================================================
   9. Ajustements de lecture
   ========================================================================== */
.citation p { line-height: 1.7; }

.urgence__corps strong,
.budget__legende,
.don-bloc__sous,
.article-carte__meta { letter-spacing: 0; }

/* Les libellés en capitales latines (FR / AR) restent lisibles. */
.langues a { direction: ltr; }