/**
 * Arabic / right-to-left layer.
 *
 * Scoped to the .elementor-page-rtl body class, not [dir="rtl"]: the dir
 * attribute sits on the .elementor-88 wrapper itself, so a descendant
 * selector starting from it would never match its own subtree rules.
 *
 * Loaded only by template-arabic.php, after every other stylesheet. The
 * Arabic page reuses the English markup and Elementor classes verbatim, so
 * this file changes direction and typeface only - never sizes, weights,
 * spacing or colour. Scoped to .elementor-page-rtl so the English page is untouched.
 */

/* ------------------------------------------------------------------
 * Typeface
 *
 * The design uses Cinzel Decorative and Alegreya; neither has Arabic
 * glyphs. Every Elementor rule reads the family from a custom property,
 * so redefining those properties here reskins the whole page while every
 * font-size, weight, line-height and letter-spacing stays exactly as the
 * English page defines it. Noto Naskh Arabic is already self-hosted in
 * assets/vendor/uploads/elementor/google-fonts/ (weights 400-700).
 * ------------------------------------------------------------------ */
.elementor-page-rtl {
	--e-global-typography-primary-font-family: "Noto Naskh Arabic";
	--e-global-typography-secondary-font-family: "Noto Naskh Arabic";
	--e-global-typography-text-font-family: "Noto Naskh Arabic";
	--e-global-typography-accent-font-family: "Noto Naskh Arabic";
	--e-global-typography-2604b0b-font-family: "Noto Naskh Arabic";
	--e-global-typography-2883fad-font-family: "Noto Naskh Arabic";
	--e-global-typography-66defd7-font-family: "Noto Naskh Arabic";
	--e-global-typography-8e45c84-font-family: "Noto Naskh Arabic";
	--e-global-typography-91c7782-font-family: "Noto Naskh Arabic";
	--e-global-typography-af5f0ec-font-family: "Noto Naskh Arabic";
	--e-global-typography-ea414f5-font-family: "Noto Naskh Arabic";
}

/* The three widgets that hardcode Alegreya instead of using a property. */
.elementor-page-rtl .elementor-element-1c532509,
.elementor-page-rtl .elementor-element-170d1c68,
.elementor-page-rtl .elementor-element-60728dae,
.elementor-page-rtl .elementor-element-1c532509 *,
.elementor-page-rtl .elementor-element-170d1c68 *,
.elementor-page-rtl .elementor-element-60728dae * {
	font-family: "Noto Naskh Arabic", serif;
}

/* Icon fonts must keep their own family or the glyphs turn into boxes. */
.elementor-page-rtl i[class*="fa-"],
.elementor-page-rtl i[class*="eicon"],
.elementor-page-rtl .elementor-icon i,
.elementor-page-rtl .elementor-social-icon i,
.elementor-page-rtl .si-icon {
	font-family: inherit;
}

.elementor-page-rtl i.fab, .elementor-page-rtl i.fas, .elementor-page-rtl i.far { font-family: "Font Awesome 5 Free", "Font Awesome 5 Brands"; }
.elementor-page-rtl i.fab { font-family: "Font Awesome 5 Brands"; }
.elementor-page-rtl i[class*="eicon"] { font-family: eicons; }

/* ------------------------------------------------------------------
 * Direction
 * ------------------------------------------------------------------ */
.elementor-page-rtl { direction: rtl; }

/* ------------------------------------------------------------------
 * Mirrored alignment
 *
 * post-88.css pins these elements to an explicit physical side. RTL
 * has to mirror each one - a blanket rule can't, because it cannot
 * tell which side the English page chose. Generated from that file,
 * left <-> right, media queries preserved.
 * ------------------------------------------------------------------ */
.elementor-page-rtl .elementor-88 .elementor-element.elementor-element-5625f4c { text-align: left; }
.elementor-page-rtl .elementor-88 .elementor-element.elementor-element-80b9d3e { text-align: right; }
.elementor-page-rtl .elementor-88 .elementor-element.elementor-element-149b9c72 { text-align: right; }
.elementor-page-rtl .elementor-88 .elementor-element.elementor-element-7dc27a11 { text-align: left; }
.elementor-page-rtl .elementor-88 .elementor-element.elementor-element-6857e05c { text-align: right; }
.elementor-page-rtl .elementor-88 .elementor-element.elementor-element-3639d94c { text-align: right; }
.elementor-page-rtl .elementor-88 .elementor-element.elementor-element-4976c19a .elementor-icon-wrapper { text-align: right; }
.elementor-page-rtl .elementor-88 .elementor-element.elementor-element-170d1c68 .elementor-testimonial-wrapper { text-align: right; }
.elementor-page-rtl .elementor-88 .elementor-element.elementor-element-44270653 .elementor-icon-wrapper { text-align: right; }
.elementor-page-rtl .elementor-88 .elementor-element.elementor-element-60728dae .elementor-testimonial-wrapper { text-align: right; }
.elementor-page-rtl .elementor-88 .elementor-element.elementor-element-1f3af13e { text-align: right; }
.elementor-page-rtl .elementor-88 .elementor-element.elementor-element-41bf341d .elementor-widget-container { text-align: right; }
.elementor-page-rtl .elementor-88 .elementor-element.elementor-element-7f1a53c7 { text-align: right; }

@media (max-width: 767px) {
	.elementor-page-rtl .elementor-88 .elementor-element.elementor-element-b081b83 { text-align: right; }
	.elementor-page-rtl .elementor-88 .elementor-element.elementor-element-7dc27a11 { text-align: right; }
}

/* Tabs: titles align to the right edge. */
.elementor-page-rtl .elementor-tab-title,
.elementor-page-rtl .elementor-tab-content { text-align: right; }

/* Form fields and the submit button. */
.elementor-page-rtl .elementor-field-group { text-align: right; }
.elementor-page-rtl .elementor-field-textual { text-align: right; direction: rtl; }
.elementor-page-rtl .ely-form-message { text-align: right; }

/* Latin runs inside Arabic copy (phone numbers, e-mail, years).
   Excludes the header button: it is a tel: link too, and this rule's
   `display:inline-block` was overriding its flex layout, which left the
   icon stuck to the top of the button. The button sets `dir="ltr"` on the
   number span itself, so it does not need this. */
.elementor-page-rtl a[href^="tel:"]:not(.ely-btn),
.elementor-page-rtl a[href^="mailto:"]:not(.ely-btn) {
	direction: ltr;
	unicode-bidi: embed;
	display: inline-block;
}

/* Testimonials */
.elementor-page-rtl .elementor-testimonial-content,
.elementor-page-rtl .elementor-testimonial-name,
.elementor-page-rtl .elementor-testimonial-job { text-align: right; }

/* ------------------------------------------------------------------
 * Skip link
 *
 * Sinatra parks it off-canvas with `left: -9999rem`. In LTR that overflow
 * is clipped, but in RTL the left side is the scrollable one, so it added
 * roughly 160,000px of horizontal scroll to the page. Mirror the offset to
 * the side RTL clips, keeping the same show-on-focus behaviour.
 * ------------------------------------------------------------------ */
.elementor-page-rtl .skip-link {
	left: auto;
	right: -9999rem;
}

.elementor-page-rtl .skip-link:focus {
	left: auto;
	right: 6px;
}

/* Header actions use an explicit Latin face; Arabic needs its own. */
.elementor-page-rtl .ely-btn,
.elementor-page-rtl .ely-lang__opt {
	font-family: "Noto Naskh Arabic", serif;
}