@charset "UTF-8";
/*!
 * Azura Clinic — استایل RTL
 * ===============================================================
 * فقط وقتی بارگذاری می‌شود که `is_rtl()` درست باشد (inc/enqueue.php)،
 * یعنی روی سایت انگلیسی فعلی **صفر بایت** اضافه می‌کند.
 *
 * قاعده‌ی ثابت: هر چیزی که وابسته به جهت است اینجا می‌آید، نه داخل قالب‌ها —
 * تا نسخه‌ی انگلیسی دست‌نخورده بماند.
 *
 * ───────────────────────────────────────────────────────────────
 * وضعیت (پایان فاز ۱۸)
 * ───────────────────────────────────────────────────────────────
 * ✅ فاز ۹: بوت‌استرپ چپ‌به‌راست پیش‌فرض شد و `css/bootstrap.rtl.min.css`
 *    فقط پشت `is_rtl()` می‌آید. یعنی همه‌ی ابزارک‌های خود بوت‌استرپ
 *    (`ms-*`، `me-*`، `text-start`، `float-*`، گریدها) خودشان آینه می‌شوند.
 * ✅ فاز ۱۸: قفل LTR روی شماره تلفن، ایمیل، قیمت، ساعت و تاریخ (پایین‌تر).
 * ⏳ فاز ۲۰: آینه‌کردن CSS خودِ قالب. اندازه‌گیری ۲۰۲۶-۰۸-۲۵ روی ۲۷ فایل
 *    CSS زنده‌ی قالب: **۴۰۵ اعلان جهت‌دار فیزیکی** که بوت‌استرپ RTL آن‌ها را
 *    نمی‌گیرد —
 *      main.css ۲۰۳ · elementor.css ۶۱ · azura-theme.css ۳۱ ·
 *      templates/* ~۸۳ · بقیه ~۲۷
 *    تفکیک: right ۸۹ · left ۸۳ · text-align ۷۳ · margin-left ۵۱ ·
 *    margin-right ۴۴ · padding-right ۲۳ · padding-left ۲۰ · direction ۱۲ ·
 *    float ۴ · border-* ۶
 *    ⚠ راه درست، بازنویسی آن‌ها با خاصیت‌های منطقی
 *    (`margin-inline-start`، `inset-inline-start`، `text-align: start`) در
 *    خودِ همان فایل‌هاست — نه وصله‌ی متقابل اینجا. وصله‌ی متقابل خاصیت‌بودن را
 *    بالا می‌برد و همان دامی است که فاز ۱۱ و ۱۵ دو بار خوردند.
 */

/* ═══════════════════════════════════════════════════════════════
   ۱) جهت پایه
   ═══════════════════════════════════════════════════════════════ */
[dir="rtl"] body {
    direction: rtl;
    text-align: right;
}

/* ═══════════════════════════════════════════════════════════════
   ۲) قفل LTR — شماره تلفن، ایمیل، قیمت، ساعت، تاریخ  (فاز ۱۸)
   ═══════════════════════════════════════════════════════════════
   خواسته‌ی فاز ۱۸ «dir="ltr" برای شماره تلفن، ایمیل، قیمت و ساعت» بود.
   اینجا با CSS انجام شده، نه با صفت روی مارک‌آپ، به دو دلیل:

     ۱) صفت `dir` در خودِ استاندارد HTML دقیقاً به‌صورت همین دو خاصیت
        (`direction` + `unicode-bidi: isolate`) تعریف شده — پس نتیجه یکسان است.
     ۲) گذاشتن `dir="ltr"` در قالب‌ها، خروجی HTML **نسخه‌ی انگلیسی** را هم
        عوض می‌کرد. با CSS، انگلیسی بایت‌به‌بایت دست‌نخورده می‌ماند.

   `isolate` نه `embed`: کاراکترهای خنثای دو طرف (مثل «:» و «-») نباید به
   داخل یا بیرون رشته‌ی لاتین سُر بخورند.
*/

[dir="rtl"] :where(
    a[href^="tel:"],
    a[href^="mailto:"],
    .fancy-phone-number,
    .azura-ltr,
    time
) {
    direction: ltr;
    unicode-bidi: isolate;
}

/* شماره‌ی دکمه‌ی «Call Center» هدر.
   ⚠ `.ah-btn-title` را دکمه‌ی «Book an Appointment» هم دارد و آن یکی باید
   ترجمه و RTL شود — پس انتخابگر با خودِ لینک واتس‌اپ محدود شده. */
[dir="rtl"] #azura-header .ah-cta a[href*="whatsapp"] :where(.ah-btn-title) {
    direction: ltr;
    unicode-bidi: isolate;
}

/* ورودی‌های تلفن و ایمیل فرم‌ها — کاربر رقم لاتین تایپ می‌کند. */
[dir="rtl"] :where(
    input[type="tel"],
    input[type="email"],
    input[type="url"],
    #phone, #c_phone, #email, #c_email, #c_captcha
) {
    direction: ltr;
    text-align: right;
}

/* بلوک‌هایی که ممکن است لاتین یا عربی باشند (ساعت کاری، آدرس، تماس المنتور).
   `plaintext` جهت را از **خودِ متن** می‌گیرد: رشته‌ی لاتین LTR می‌شود و
   رشته‌ی عربی RTL — پس یک قاعده هر دو زبان را درست نگه می‌دارد. */
[dir="rtl"] :where(
    .elementor-icon-box-description,
    .footer-bg .text-lg-center > span,
    .contact-sidebar .contact-value
) {
    unicode-bidi: plaintext;
}

/* قیمت‌ها: «OMR ۲۵» یک ران لاتینِ پیوسته است و الگوریتم دوجهته خودش درست
   می‌چیندش. مشکل فقط جایی است که بازه با جداکننده بیاید («OMR 70 to OMR 164»)
   — همان بلوک قیمت صفحه‌ی سرویس. */
[dir="rtl"] :where(.azura-price-value, .starting-price-value, .price-range-value) {
    direction: ltr;
    unicode-bidi: isolate;
}

/* ═══════════════════════════════════════════════════════════════
   ۳) اصلاح‌های جهت‌دارِ قطعیِ خودِ قالب
   ═══════════════════════════════════════════════════════════════ */
/* ⚠ فاز ۲۰: وصله‌ی `.azura-nav-list` از اینجا برداشته شد.
   قاعده‌ی پایه در `css/azura-theme.css` به `text-align: start` تبدیل شد، پس
   خودش در RTL راست می‌شود. نگه‌داشتن هر دو یعنی دو منبع برای یک چیز — و
   وصله‌ی متقابل خاصیت‌بودن را هم بالا می‌برد (دام فاز ۱۱ و ۱۵). */
[dir="rtl"] #azura-header .ah-nav .sub-menu { text-align: right; }

/* ⚠ فاز ۲۰: وصله‌ی `[dir="rtl"] .copyright { text-align: right }` برداشته شد.
   قاعده‌ی پایه در `css/main.css:1418` **وسط‌چین** است و این وصله فقط سمت عربی
   را راست‌چین می‌کرد — یعنی دو زبان دو ظاهر متفاوت برای یک بلوک یکسان.
   کپی‌رایت یک خط کوتاه وسطِ فوتر است و جهت‌دار نیست، پس در هر دو زبان وسط. */

/* فهرست «On This Page» (فاز ۱۱) از `padding-inline-start` استفاده می‌کند،
   پس خودش درست می‌ماند و اینجا قاعده‌ای لازم ندارد. */

/* ═══════════════════════════════════════════════════════════════
   ۴) فونت عربی — DIN Next Arabic  (فاز ۱۸)
   ═══════════════════════════════════════════════════════════════
   خودِ `@font-face` **اینجا نیست**: از فیلتر `azura_font_face_css` در
   `inc/enqueue.php` می‌آید، تا با بقیه‌ی فونت‌ها از یک مرکز صف شود و
   `azura_preload_fonts()` هم بتواند پریلودش کند (قاعده‌ی فاز ۳ و ۶:
   هیچ `@import` و هیچ `<link>` خامی).

   پشته آنجا `'DIN Next Arabic', YekanBakh, sans-serif` است — یعنی حرف عربی از
   فونت عربی و رقم و لاتین از همان فونت انگلیسی سایت می‌آید. عمدی است:
   اندازه‌گیری نشان داد لاتینِ داخل فونت عربی **همان** DIN Next است
   (فاصله ۲۴۰ · کپیتال ۶۸۰ · x-height ۴۷۹ · رقم ۵۴۲، مو‌به‌مو یکی)، پس
   حذفش از فایل عربی ۱۱٫۶ کیلوبایت کم کرد بدون هیچ تفاوت بصری.

   ⚠ ارتفاع خط: متریک این فونت `1200/-270/0` است در برابر `781/-219/200`
   لاتین، یعنی `line-height: normal` در عربی ۱٫۴۷ می‌شود نه ۱٫۲۰. این **درست**
   است (حرکات عربی بالاتر می‌نشینند و ۶۶ تا ۸۴ گلیف واقعاً از ascent لاتین
   بالاتر جوهر دارند). اگر جایی چیدمان باز شد، اینجا `line-height` صریح بگذار —
   **متریک فونت را دست نزن**، وگرنه در موتورهایی که به `usWinAscent` کلیپ
   می‌کنند، بالای حرف بریده می‌شود.
*/

/* پله‌ی امن برای بلوک‌های متنی که به `normal` تکیه دارند. */
[dir="rtl"] :where(p, li, dd, blockquote, .html-content) {
    line-height: 1.9;
}

/* ══════════════════════════════════════════════════════════════════
   فاز ۲۰ — سه اصلاح RTL که کارفرما ۲۰۲۶-۰۸-۲۷ گزارش کرد
   ══════════════════════════════════════════════════════════════════ */

/* ۱) ساب‌منو: در azura-theme.css با `left: 0 !important` لنگر می‌اندازد. روی صفحه‌ی
      راست‌به‌چپ این یعنی منو از لبه‌ی *چپِ* آیتم به راست باز می‌شود، پس از زیر آیتم
      بیرون می‌زند و «پشت» به‌نظر می‌رسد. لنگر باید سمت راست باشد، و گوشه‌ی گردنشده
      هم آینه شود (در LTR گوشه‌ی بالا-چپ تیز است، در RTL باید بالا-راست تیز باشد).
      ⚠ `!important` اینجا لازم است چون قاعده‌ی مبدأ خودش `!important` دارد. */
[dir="rtl"] #azura-header .ah-nav ul li > ul.sub-menu,
[dir="rtl"] #azura-header .ah-nav ul li > ul.sub-menu.tw\:hidden {
    left: auto !important;
    right: 0 !important;
    border-radius: 12px 0 12px 12px !important;
}

/* ۲) دکمه‌های هدر: `.ah-btn { direction: ltr }` در azura-theme.css عمدی بود تا
      شماره‌ی تماس چپ‌به‌راست خوانده شود — ولی همان قاعده به دکمه‌ی «احجز موعدًا»
      هم می‌خورد و آیکون را در عربی سمت چپِ متن می‌انداخت. جهت را برمی‌گردانیم؛
      شماره‌ی تماس با قاعده‌ی اختصاصیِ بالاتر در همین فایل LTR می‌ماند. */
[dir="rtl"] #azura-header .ah-cta .ah-btn {
    direction: rtl;
}

/* ۳) کارت‌های CTA پای صفحه‌ی سرویس («اسأل عبر واتساب» و «احجز موعدًا الآن»).
      سه چیزشان جهت‌دار بود و در عربی برعکس می‌افتاد:
      • آیکون `fa-arrow-right` سخت‌نوشته است، پس در RTL به بیرونِ کارت اشاره
        می‌کرد نه به جلو. فقط خودِ گلیف آینه می‌شود، نه دایره — وگرنه انیمیشن
        هاور در فضای آینه‌شده حرکت می‌کرد.
      • هاور فلش را `translateX(4px)` به راست می‌بُرد؛ در عربی «جلو» چپ است.
      • برق عبوری (`::after`) از چپ به راست می‌رفت؛ آینه شد.
      ⚠ تصحیح: بار اول اینجا نوشتم «`margin-left:auto` با `direction:rtl` خودش فلش
        را به لبه‌ی چپ می‌برد» — این **غلط بود** و اندازه‌گیری نشده بود. در RTL
        `margin-left:auto` فضای آزاد را سمت *چپِ* فلش می‌ریزد و آن را ۸۸px از لبه
        دور می‌کند. درمانش اینجا نیست: در single-services.css به
        `margin-inline-start:auto` تبدیل شد که هر دو جهت را با یک اعلان می‌گیرد. */
[dir="rtl"] .service-cta-card .cta-arrow > i {
    transform: scaleX(-1);
}
[dir="rtl"] .service-cta-card:hover .cta-arrow {
    transform: translateX(-4px);
}
[dir="rtl"] .service-cta-card::after {
    left: auto;
    right: -75%;
    transition: right 0.7s ease;
}
[dir="rtl"] .service-cta-card:hover::after {
    left: auto;
    right: 130%;
}