/*
 * HM Parging — Arabic RTL + typography overrides.
 *
 * Every rule is scoped to [dir="rtl"] or [lang="ar"] so this file is always
 * enqueued but stays inert until Arabic is active (language is chosen
 * client-side). The base stylesheet uses CSS logical properties
 * (inset-inline-*, margin-inline-*, border-inline-*, text-align:start/end) so
 * layout mirrors automatically and flex/grid reverse on their own — this file
 * only handles the true exceptions: directional artwork, directional icons,
 * bidi isolation for numbers, and Arabic typography.
 */

/* ------- Directional artwork: mirror the diagonal hazard stripes ------- */
html[dir="rtl"] .hmp-hazard {
	background-image: repeating-linear-gradient(
		-45deg, var(--gold) 0, var(--gold) 14px,
		var(--charcoal) 14px, var(--charcoal) 28px
	);
}
html[dir="rtl"] .hmp-eyebrow--hazard::before {
	background-image: repeating-linear-gradient(-45deg, var(--gold) 0, var(--gold) 6px, var(--charcoal) 6px, var(--charcoal) 12px);
}
html[dir="rtl"] .hmp-section--dark .hmp-eyebrow--hazard::before {
	background-image: repeating-linear-gradient(-45deg, var(--gold) 0, var(--gold) 6px, #000 6px, #000 12px);
}
html[dir="rtl"] .hmp-links::before,
html[dir="rtl"] .hmp-links::after {
	background-image: repeating-linear-gradient(-45deg, var(--gold) 0, var(--gold) 14px, var(--charcoal) 14px, var(--charcoal) 28px);
}

/* ------- Slider: flex order is locked LTR in the base; restore RTL text
   direction inside each slide, and flip the (directional) arrow glyphs so
   "previous" points toward the inline-start and "next" toward inline-end. --- */
html[dir="rtl"] .hmp-slider__slide { direction: rtl; }
html[dir="rtl"] .hmp-slider__arrow--prev .hmp-icon { transform: none; }
html[dir="rtl"] .hmp-slider__arrow--next .hmp-icon { transform: rotate(180deg); }

/* ------- Bidi isolation: phone numbers, emails and @handles stay LTR even
   inside Arabic sentences. dir="ltr" is set on those elements in markup;
   this makes sure they are isolated so surrounding Arabic isn't reordered. --- */
html[dir="rtl"] [dir="ltr"] { unicode-bidi: isolate; }

/* ============================ Arabic typography ============================
   Applied only when lang="ar" (Cairo is loaded with display=swap). */
html[lang="ar"] body {
	font-size: 19px;      /* ~12% larger than the 17px English body */
	line-height: 1.8;     /* generous leading for Arabic */
}
/* Never track Arabic — letter-spacing breaks connected letterforms. */
html[lang="ar"] * { letter-spacing: 0 !important; }

@media (max-width: 620px) {
	html[lang="ar"] body { font-size: 17.5px; }
}