/* RTL Styles for Persian/Arabic languages */
/* فقط متن و جهت‌گیری - بدون تغییر لایوت اصلی */

/* AzarMehr Variable Font */
@font-face {
    font-family: 'AzarMehr';
    src: url('../fonts/AzarMehr-v3.0/Variable/woff2/AzarMehr-FD[DSTY,KSHD,wght].woff2') format('woff2-variations'),
         url('../fonts/AzarMehr-v3.0/Variable/AzarMehr-FD[DSTY,KSHD,wght].ttf') format('truetype-variations');
    font-weight: 100 900;
    font-style: normal;
    font-display: swap;
}

/* Base RTL */
html[dir="rtl"] {
    direction: rtl;
}

html[dir="rtl"] body {
    font-family: 'AzarMehr', 'IRANSans', 'Vazir', 'Tahoma', sans-serif;
}

/* Text direction for content */
html[dir="rtl"] p,
html[dir="rtl"] h1,
html[dir="rtl"] h2,
html[dir="rtl"] h3,
html[dir="rtl"] h4,
html[dir="rtl"] h5,
html[dir="rtl"] h6,
html[dir="rtl"] span,
html[dir="rtl"] a,
html[dir="rtl"] li {
    direction: rtl;
}

/* Form inputs */
html[dir="rtl"] input,
html[dir="rtl"] textarea,
html[dir="rtl"] select {
    direction: rtl;
}

html[dir="rtl"] input::placeholder,
html[dir="rtl"] textarea::placeholder {
    direction: rtl;
}

/* Keep center-aligned inputs centered */
html[dir="rtl"] input.text-center,
html[dir="rtl"] input[type="search"].text-center {
    text-align: center;
}

/* Footer text alignment */
html[dir="rtl"] footer p,
html[dir="rtl"] footer span {
    direction: rtl;
}

/* News and product cards */
html[dir="rtl"] .News-card p,
html[dir="rtl"] .product-card p,
html[dir="rtl"] .Categories-Cards p,
html[dir="rtl"] .Categories-CardsPost p {
    direction: rtl;
}

/* Scroll button - keep on right for RTL */
html[dir="rtl"] #scroll-btn {
    right: 1rem;
    left: auto;
}

/* AzarMehr font class */
html[dir="rtl"] .AzarMehr {
    font-family: 'AzarMehr', 'Tahoma', sans-serif;
}

/* Variable font weight utilities for RTL */
html[dir="rtl"] .font-light {
    font-weight: 300;
}

html[dir="rtl"] .font-normal {
    font-weight: 400;
}

html[dir="rtl"] .font-medium {
    font-weight: 500;
}

html[dir="rtl"] .font-semibold {
    font-weight: 600;
}

html[dir="rtl"] .font-bold {
    font-weight: 700;
}

html[dir="rtl"] .font-extrabold {
    font-weight: 800;
}

/* جلوگیری از چسبیدن کلمات فارسی هنگام justify
   (کلاس word-tight با word-spacing منفی در فارسی کلمات را ادغام می‌کرد) */
html[dir="rtl"] .word-tight {
    word-spacing: normal;
}

html[dir="rtl"] .text-justify {
    text-justify: inter-word;
}

/* در RTL، فاصله‌گذاری منطقی برای آیکون‌های کنار متن */
html[dir="rtl"] .related-widget-wrapper {
    direction: rtl;
}

/* فلش‌های «مشاهده/بیشتر» نشانگر جلو هستند؛ در RTL باید به چپ اشاره کنند */
html[dir="rtl"] img[src*="Arrow-Right"],
html[dir="rtl"] img[src*="ArrowRight"],
html[dir="rtl"] img[src*="ArrowVector"] {
    transform: scaleX(-1);
}

/* رفع شکستن کدهای لاتین داخل متن فارسی (مثل «PV-100») توسط الگوریتم دوجهتی.
   plaintext باعث می‌شود جهت هر پاراگراف بر اساس اولین کاراکتر قوی تعیین شود و
   اجزای لاتین/عددی به‌درستی ایزوله شوند. */
html[dir="rtl"] h1,
html[dir="rtl"] h2,
html[dir="rtl"] h3,
html[dir="rtl"] h4,
html[dir="rtl"] .News-card p,
html[dir="rtl"] .product-card p,
html[dir="rtl"] .Categories-Cards p,
html[dir="rtl"] [class*="title"] {
    unicode-bidi: plaintext;
}

/* ===== هدر دسکتاپ در حالت راست‌چین: ترتیب منو =====
   راست→چپ باید باشد: خانه رسانه محصولات | لوگو | اخبار سوالات درباره تماس
   گروهِ محصولات (rightbar) به سمت راست و گروهِ ناوبری (leftbar) به سمت چپ. */
html[dir="rtl"] #hdr-right { order: 1; }
html[dir="rtl"] #hdr-left  { order: 2; }
/* ترتیب داخلی هر نوار طوری معکوس شود که از راست به چپ درست خوانده شود */
html[dir="rtl"] #hdr-right > ul { flex-direction: row-reverse; }
html[dir="rtl"] #hdr-left { flex-direction: row-reverse; }
/* سوییچر زبان باید راست‌ترین عنصرِ هدر بماند (قبل از «خانه») */
html[dir="rtl"] #hdr-right > #language-wrapper { order: -1; }

/* ===== صفحه‌ی Media: تاگل رادیویی Video/Photo در حالت راست‌چین =====
   اسلایدر در LTR از سمت چپ لنگر می‌شود؛ در RTL باید از راست لنگر شود و
   جابه‌جایی برچسبِ دوم (صورت/تصویر) به‌جای راست، به چپ باشد. */
.radio-slider {
    left: auto;
    right: 6px;
}
#video:checked ~ .radio-slider {
    transform: translateX(0%);
}
#photo:checked ~ .radio-slider {
    transform: translateX(calc(-100% + 4px));
}

/* ===== راست‌چین‌سازیِ عنوان‌ها/متن‌ها در RTL =====
   در طراحیِ اصلی (LTR) بعضی عنوان‌ها و متن‌ها با text-left چپ‌چین شده‌اند؛
   در RTL باید راست‌چین شوند (نام محصول، عنوان فرم‌ها، فوتر و ...).
   فقط در همان بریک‌پوینتی که نسخه‌ی LTR چپ‌چین می‌کرد، معکوس می‌کنیم. */
html[dir="rtl"] .text-left { text-align: right !important; }
@media (min-width: 768px)  { html[dir="rtl"] .md\:text-left { text-align: right !important; } }
@media (min-width: 1024px) { html[dir="rtl"] .lg\:text-left { text-align: right !important; } }
@media (min-width: 1280px) { html[dir="rtl"] .xl\:text-left { text-align: right !important; } }

/* ===== دکمه‌های تبِ صفحه‌ی محصول (اطلاعات/ویدیو/نمایش سه‌بعدی) =====
   در فارسی/عربی «نمایش سه‌بعدی» بلندتر است و دو خط می‌شد و قرینگی به‌هم می‌خورد؛
   یک‌خطی نگه می‌داریم و سایز/پدینگ را کمی فشرده می‌کنیم تا در یک سطر جا شود. */
/* نکته: id برابرِ "3D" با عدد شروع می‌شود و در CSS باید با سلکتورِ صفتی هدف گرفته شود */
html[dir="rtl"] [id="Information"],
html[dir="rtl"] [id="video"],
html[dir="rtl"] [id="3D"] { white-space: nowrap; padding-left: .75rem; padding-right: .75rem; }
html[dir="rtl"] [id="Information"] span,
html[dir="rtl"] [id="video"] span,
html[dir="rtl"] [id="3D"] span { font-size: .82rem; white-space: nowrap; }

/* =========================================================================
   فونت «پیدا» فقط برای فارسی (lang="fa") — عربی (ar) همان AzarMehr می‌ماند.
   اینجا (انتهای rtl.css) قرار دارد تا بر font-familyهای AzarMehrِ بالاتر
   (body خط ۲۰ و .AzarMehr خط ۷۶) که هم‌سطحِ specificity‌اند، غلبه کند.
   @font-face‌ها در peyda.css هستند (با @import در Styles.css لود می‌شوند).
   وزن متن‌ها از همان مَپِ font-light…extrabold بالاتر می‌آید؛ فقط تیترها Black.
   ========================================================================= */
html[lang="fa"] body,
html[lang="fa"] .AzarMehr,
html[lang="fa"] button,
html[lang="fa"] input,
html[lang="fa"] textarea,
html[lang="fa"] select {
    font-family: 'Peyda', 'AzarMehr', 'Tahoma', sans-serif;
}

/* تیترها → Peyda Black (۹۰۰): تگ‌های h1–h4، عنوان‌های گرادینتی (bg-clip-text)
   و هر المانی که کلاسِ کمکیِ .peyda-black بگیرد. */
html[lang="fa"] h1,
html[lang="fa"] h2,
html[lang="fa"] h3,
html[lang="fa"] h4,
html[lang="fa"] .bg-clip-text,
html[lang="fa"] .peyda-black {
    font-family: 'Peyda', sans-serif;
    font-weight: 900 !important;
}

/* عنوانِ کارت‌های اخبار (.News-card) در RTL: راست‌چین + وزن سنگین.
   line-clamp از display:-webkit-box استفاده می‌کند و text-align:start را
   فیزیکیْ چپ می‌گیرد، پس باید صریحاً راست‌چین شود. در فارسی فونت Peyda است
   → وزن 900 یعنی Peyda Black؛ در عربی AzarMehr سنگین. */
html[dir="rtl"] .News-card p {
    text-align: right;
    font-weight: 900 !important;
}

/* عنوان و دسته‌ی کارت‌های محصول (.pc-title/.pc-cat هم line-clamp = -webkit-box
   دارند) در فارسی/عربی باید راست‌چین خوانده شوند. */
html[dir="rtl"] .pc-title,
html[dir="rtl"] .pc-cat {
    text-align: right;
}

/* فوتر (xl): خطِ جداکننده‌ی بینِ ستون‌ها در LTR سمتِ چپ (border-l) است؛ در RTL
   باید سمتِ راست باشد وگرنه به‌جای «بینِ لوگو و ستون‌ها»، به لبه‌ی چپِ آخرین
   ستون (پشتِ «درباره ما») می‌افتد. اینجا بوردر را به راست منتقل می‌کنیم. */
@media (min-width:1280px){
  html[dir="rtl"] .ft-divider {
    border-left-width: 0 !important;
    border-right: 1px solid rgba(255,255,255,.2);
    padding-right: 1rem;
  }
}