/* Jadara — RTL overrides, loaded only when the site is displayed in Arabic. */

body.lang-ar{
  font-family:'Cairo','Barlow',sans-serif;
}
body.lang-ar h1, body.lang-ar h2, body.lang-ar h3{
  font-family:'Cairo','Cinzel',serif;
}

/* Eyebrow accent line: mirror the little dash + text order */
body.lang-ar .eyebrow{flex-direction:row-reverse;}
body.lang-ar .eyebrow::before{margin-left:0;}
body.lang-ar .hero-tag{flex-direction:row-reverse;}
body.lang-ar .hero-tag::before{margin-left:0;}

/* Nav: keep logo centered, but mirror which side the carousel/menu sit on */
body.lang-ar .nav-links{flex-direction:row-reverse;}

/* Side navigation flag slides out the other direction in RTL */
body.lang-ar{ }
html[dir="rtl"] .side-nav{right:auto;left:1.6rem;}
html[dir="rtl"] .side-nav-flag{
  right:auto;left:100%;
  margin-right:0;margin-left:0.7rem;
  transform:translateY(-50%) translateX(-8px);
  clip-path:polygon(10px 0,100% 0,100% 100%,10px 100%,0 50%);
}
html[dir="rtl"] .side-nav-item:hover .side-nav-flag{
  transform:translateY(-50%) translateX(0);
}

/* Product / component / spec grids read naturally in RTL since they're
   grid-based, but text blocks need right alignment */
html[dir="rtl"] .about-text,
html[dir="rtl"] .product-body,
html[dir="rtl"] .modal-body,
html[dir="rtl"] .contact-grid{
  text-align:right;
}

html[dir="rtl"] .contact-info-item{
  text-align:right;
}

/* Scroll progress bar fills from the right in RTL reading direction */
html[dir="rtl"] .scroll-progress{left:auto;right:0;}

/* Lightbox close / modal close buttons stay comfortably reachable */
html[dir="rtl"] .modal-close{right:auto;left:1.2rem;}
html[dir="rtl"] .about-facilities-list li{padding-left:0;padding-right:1.6rem;}
html[dir="rtl"] .about-facilities-list li::before{left:auto;right:0;}
html[dir="rtl"] .product-card{flex-direction:row-reverse;}
@media(max-width:760px){
  html[dir="rtl"] .product-card{flex-direction:column;}
}

@media(max-width:760px){
  html[dir="rtl"] .nav-links{
    right:auto;left:0;
    border-left:none;border-right:1px solid var(--line-strong);
    transform:translateX(-100%);
  }
  html[dir="rtl"] .nav-links.open{transform:translateX(0);}
}