/* Arabic / RTL overrides. Loaded by base.html only when the active language is right-to-left. */

@import url('https://fonts.googleapis.com/css2?family=Cairo:wght@400;500;600;700;800&display=swap');

html[dir="rtl"] body{ font-family:'Cairo','Segoe UI','Noto Sans Arabic',Tahoma,Arial,sans-serif; letter-spacing:0; }
html[dir="rtl"] *{ letter-spacing:0 !important; font-family:inherit; }

/* arrows that point "forward" should point left */
html[dir="rtl"] .typing-slider__btn svg,
html[dir="rtl"] .news-card__link svg,
html[dir="rtl"] .news-viewall svg,
html[dir="rtl"] .product-card__btn svg,
html[dir="rtl"] .partner-cta__btn svg,
html[dir="rtl"] .footer-contact__btn svg{ transform:scaleX(-1); }
html[dir="rtl"] .article-back svg{ transform:scaleX(-1); }

/* ---- Typing slider ---- */
/* (The image is NOT mirrored in Arabic any more: it is shown exactly as in
   English; only the text alignment below follows the page direction.) */
html[dir="rtl"] .typing-slider__title,
html[dir="rtl"] .typing-slider__subtitle,
html[dir="rtl"] .typing-slider__caption{
  direction:rtl;
  text-align:right;
}
html[dir="rtl"] .typing-slider__text-wrap,
html[dir="rtl"] .typing-slider__about{
  text-align:right;
}
@media (max-width:900px){
  html[dir="rtl"] .typing-slider__title,
  html[dir="rtl"] .typing-slider__subtitle,
  html[dir="rtl"] .typing-slider__caption,
  html[dir="rtl"] .typing-slider__about{
    text-align:center;
  }
}

/* Page hero / section headers that are hard-coded left-aligned in the base
   stylesheet for the English layout. */
html[dir="rtl"] .about-hero,
html[dir="rtl"] .pw-hero,
html[dir="rtl"] .pw-benefits__title,
html[dir="rtl"] .article-hero,
html[dir="rtl"] .contact-hero,
html[dir="rtl"] .catalog-hero{
  text-align:right;
}

/* quote bar flips side */
html[dir="rtl"] .about-quote{ border-left:0; border-right:4px solid var(--red); padding-left:0; padding-right:24px; }

/* lists / text blocks */
html[dir="rtl"] .bd-list{ padding-left:0; padding-right:1.2em; }
html[dir="rtl"] .bd-card, html[dir="rtl"] .pd-info, html[dir="rtl"] .news-card,
html[dir="rtl"] .contact-info, html[dir="rtl"] .contact-form, html[dir="rtl"] .pw-form{ text-align:right; }

/* ---- Business divisions carousel: the arrows now scroll correctly in
   RTL (fixed in script.js), but they also need to swap sides -- "prev"
   (back toward the start) sits on the right in RTL, "next" on the left --
   with their chevrons mirrored to point the right way. ---- */
html[dir="rtl"] .bd-arrow--prev{ left:auto; right:-22px; }
html[dir="rtl"] .bd-arrow--next{ right:auto; left:-22px; }
html[dir="rtl"] .bd-arrow svg{ transform:scaleX(-1); }
@media (max-width:1260px){
  html[dir="rtl"] .bd-arrow--prev{ left:auto; right:8px; }
  html[dir="rtl"] .bd-arrow--next{ right:auto; left:8px; }
}
@media (max-width:640px){
  html[dir="rtl"] .bd-arrow--prev{ left:calc(50% + 8px); right:auto; }
  html[dir="rtl"] .bd-arrow--next{ right:calc(50% + 8px); left:auto; }
}

/* nav underline + mobile menu underline grow from the right */
html[dir="rtl"] .desktop-nav__list a::after,
html[dir="rtl"] .menu-list a::after{ left:auto; right:0; }

/* phone numbers and emails stay left-to-right inside RTL text */
html[dir="rtl"] .contact-info__value[dir="ltr"], html[dir="rtl"] input[type="email"],
html[dir="rtl"] input[type="url"], html[dir="rtl"] input[type="tel"]{ direction:ltr; text-align:right; }

/* map is geographic: never mirror it */
html[dir="rtl"] .network-map svg{ direction:ltr; }

html[dir="rtl"] .product-card__cat{ left:auto; right:12px; }
html[dir="rtl"] .footer-links a:hover{ transform:translateX(-3px); }

/* Business divisions card grid */
html[dir="rtl"] .bd-grid .bd-card::before{ transform-origin:right center; }
html[dir="rtl"] .bd-list li{ padding-left:0; padding-right:14px; }
html[dir="rtl"] .bd-list li::before{ left:auto; right:0; }