/* ============================================================
   Islamic Library — RTL Stylesheet
   Applied when body has .rtl class (Arabic / Urdu).

   IMPORTANT: body.rtl { direction: rtl } already cascades to
   ALL descendants including flex containers — their main axis
   automatically reverses. Do NOT add flex-direction: row-reverse
   here; that would double-reverse flex rows back to LTR.
   Only add rules for things direction:rtl cannot handle:
   absolute/fixed positions, explicit padding/border sides,
   transforms, and font overrides.
   ============================================================ */

body.rtl {
	direction: rtl;
	text-align: right;
}

/* ── Positioned elements: left ↔ right swaps ─────────────── */

/* Language dropdown opens to the left of the button in RTL */
body.rtl .lang-dropdown-menu { right: auto; left: 0; }

/* Section title gold underline */
body.rtl .section-title::after { left: auto; right: 0; }

/* Subject card hover animation flips direction */
body.rtl .subject-card:hover { transform: translateX(-2px); }
body.rtl .subject-card .subject-count { margin-left: 0; margin-right: auto; }

/* ── Border / padding side swaps ─────────────────────────── */

body.rtl .entry-content blockquote {
	border-left: none;
	border-right: 4px solid var(--color-secondary);
	padding-left: 0;
	padding-right: var(--spacing-md);
}

body.rtl .entry-content ul,
body.rtl .entry-content ol {
	padding-left: 0;
	padding-right: var(--spacing-lg);
}

body.rtl .footer-links a:hover {
	padding-left: 0;
	padding-right: 4px;
}

/* ── Chapter prev/next: swap arrow glyphs ────────────────── */
body.rtl .chapter-nav .prev .chapter-nav-label::before { content: '→ '; }
body.rtl .chapter-nav .next .chapter-nav-label         { direction: rtl; }

/* ── Font overrides for Arabic ───────────────────────────── */
body.lang-arabic,
body.lang-arabic .entry-content,
body.lang-arabic h1,
body.lang-arabic h2,
body.lang-arabic h3,
body.lang-arabic h4,
body.lang-arabic h5,
body.lang-arabic h6,
body.lang-arabic .card-title,
body.lang-arabic .single-title,
body.lang-arabic .archive-title,
body.lang-arabic .hero-title,
body.lang-arabic .section-title {
	font-family: var(--font-arabic);
}

/* ── Font overrides for Urdu ─────────────────────────────── */
body.lang-urdu,
body.lang-urdu h1,
body.lang-urdu h2,
body.lang-urdu h3,
body.lang-urdu h4,
body.lang-urdu h5,
body.lang-urdu h6,
body.lang-urdu .card-title,
body.lang-urdu .single-title,
body.lang-urdu .archive-title,
body.lang-urdu .hero-title,
body.lang-urdu .section-title {
	font-family: var(--font-urdu);
	line-height: 2;
}

body.lang-urdu .entry-content {
	font-family: var(--font-urdu);
	line-height: var(--reading-line-height, 2);
}

/* Urdu needs extra line-height on small text blocks too */
body.lang-urdu .card-body    { line-height: 2; }
body.lang-urdu .single-meta  { line-height: 2; }
body.lang-urdu .card-excerpt { line-height: 2.2; }

/* ── Toolbar: progress bar runs right-to-left ────────────── */
body.rtl .toolbar-progress-bar {
	background: linear-gradient(to left, var(--color-primary), var(--color-secondary));
}