/**
 * The Arabic article.
 *
 * Nearly everything here is inherited: the template uses the homepage
 * plugin's own class names, so the cover, the prose, the contents list and
 * the FAQ are already styled. What is left is the handful of things that
 * only matter once the page runs right to left, plus Arabic type, which
 * needs a little more room between lines than Latin does — the letters
 * connect, and marks sit above and below them.
 */

.dwe-ar-article .dwe-prose,
.dwe-ar-article .dwe-cover__in {
	text-align: right;
}

/* Arabic reads slower when it is set tight. */
.dwe-ar-article .dwe-prose p,
.dwe-ar-article .dwe-prose li {
	line-height: 2;
}

.dwe-ar-article .dwe-prose__lead {
	line-height: 1.9;
}

.dwe-ar-article .dwe-prose h2 {
	line-height: 1.5;
}

/* Lists indent from the right, and the bullet has to come with them. */
.dwe-ar-article .dwe-prose ul,
.dwe-ar-article .dwe-prose ol {
	padding-right: 1.3em;
	padding-left: 0;
}

.dwe-ar-article .dwe-key ul {
	padding-right: 1.2em;
	padding-left: 0;
}

/* The FAQ arrow belongs on the other side of the question. */
.dwe-ar-article .dwe-faq__i summary {
	text-align: right;
}

/* A heading jumped to from the contents list must not hide under the
   sticky site header. */
.dwe-ar-article .dwe-prose h2,
.dwe-ar-article .dwe-prose h3 {
	scroll-margin-top: 100px;
}

/* The closing section, which is this plugin's own rather than borrowed. */
.dwe-ar-end {
	text-align: right;
}

.dwe-ar-end .dwe-sec__t {
	margin: 10px 0 14px;
}

.dwe-ar-end p {
	max-width: 56ch;
	line-height: 1.9;
	opacity: .88;
}

.dwe-ar-end .dwe-btn {
	margin-top: 10px;
}

/* Brand names and figures stay left-to-right inside an Arabic sentence,
   which is what <bdi> and these are for; without this a line ending in
   "Blue Ad" or "3.5" can reorder on the screen. */
.dwe-ar-article .dwe-prose bdi,
.dwe-ar-article .dwe-prose code {
	unicode-bidi: isolate;
}