/* =========================================================================
   RTL patch.
   main.css is written with CSS logical properties, so almost everything
   mirrors automatically. Only the handful of physical values below need
   a direction-aware override.
   ========================================================================= */

body { direction: rtl; }

/* Numbers, phone numbers and Latin strings stay LTR inside Arabic text. */
[dir="rtl"] .etqan-header__phone span,
[dir="rtl"] .etqan-btn--ltr .etqan-btn__label,
[dir="rtl"] .etqan-contact-info__value[dir="ltr"],
[dir="rtl"] .etqan-stat__num,
[dir="rtl"] time,
[dir="rtl"] .etqan-lead-phone {
	direction: ltr;
	unicode-bidi: isolate;
}

/* The mobile drawer slides in from the right on RTL. */
[dir="rtl"] .etqan-drawer__panel { transform: translateX(-100%); }
[dir="rtl"] .etqan-drawer.is-open .etqan-drawer__panel { transform: translateX(0); }

/* Arrow icons point the correct way. */
[dir="rtl"] .etqan-card__more svg,
[dir="rtl"] .etqan-hero__actions .etqan-btn svg.etqan-icon--arrow-left { transform: none; }

[dir="rtl"] .etqan-card:hover .etqan-card__more svg { transform: translateX(-5px); }

/* Dotted connector between process steps runs right-to-left. */
[dir="rtl"] .etqan-process__step::after {
	background: repeating-linear-gradient(to left, var(--etqan-primary) 0 6px, transparent 6px 12px);
}

/* Select caret sits on the left in RTL (handled inline in main.css, restated
   here so the rule wins if Elementor resets the background shorthand). */
[dir="rtl"] .etqan-form select {
	background-position: left 1rem center;
	padding-inline-start: 2.5rem;
	padding-inline-end: 1rem;
}

/* Blockquote accent bar on the right. */
[dir="rtl"] blockquote { border-inline-start: 4px solid var(--etqan-primary); }

/* WordPress core alignment classes in RTL content. */
[dir="rtl"] .alignright { float: left; margin-inline-end: 0; margin-inline-start: 1.5rem; }
[dir="rtl"] .alignleft { float: right; margin-inline-start: 0; margin-inline-end: 1.5rem; }

/* Admin bar offset for the sticky header on RTL admin screens is identical,
   but keep the rule so the selector specificity matches main.css. */
[dir="rtl"] .admin-bar.has-sticky-header .etqan-header { inset-block-start: 32px; }

@media screen and (max-width: 782px) {
	.admin-bar.has-sticky-header .etqan-header { inset-block-start: 46px; }
}