/* ==========================================================================
   Union Fiber Industrial Company — RTL overrides
   Loaded only when $Lang === 'ar' (see header.php). Applies logical-property
   flips on top of css/style.css and css/home.css so we don't have to
   maintain a parallel RTL layout stylesheet for every rule.
   ========================================================================== */

html[dir="rtl"] body {
  font-family: 'Tajawal', 'Cairo', 'DM Sans', 'Segoe UI', Arial, sans-serif;
}
html[dir="rtl"] h1,
html[dir="rtl"] h2,
html[dir="rtl"] h3,
html[dir="rtl"] h4 {
  font-family: 'Cairo', 'Monda', 'Segoe UI', Arial, sans-serif;
}

/* Generic direction fixes */
html[dir="rtl"] { direction: rtl; }
html[dir="rtl"] .section-head--center { text-align: center; } /* unaffected, kept for clarity */
html[dir="rtl"] .spec-table th,
html[dir="rtl"] .spec-table td { text-align: right; }

/* Breadcrumb separator: mirror spacing */
html[dir="rtl"] .breadcrumbs li:not(:last-child)::after {
  margin-left: 0;
  margin-right: 6px;
}

/* Header / nav */
html[dir="rtl"] .nav-cta { margin-left: 0; margin-right: 10px; }
html[dir="rtl"] .main-nav ul { padding: 0; }
html[dir="rtl"] .dropdown { text-align: right; }
html[dir="rtl"] .has-dropdown > a span[aria-hidden="true"] { transform: scaleX(-1); display: inline-block; }

/* Eyebrow / lists that used left-aligned bullets or icons */
html[dir="rtl"] .feature-list li,
html[dir="rtl"] .check__list li,
html[dir="rtl"] .home-cta__checks li,
html[dir="rtl"] .hero-slider__trust-item,
html[dir="rtl"] .home-hero__trust-item {
  flex-direction: row-reverse;
}

/* Hero slider controls: mirror prev/next + numbered nav side */
html[dir="rtl"] .hero-slider__arrow--prev { left: auto; right: 24px; }
html[dir="rtl"] .hero-slider__arrow--next { right: auto; left: 24px; }
html[dir="rtl"] .hero-slider__nav { right: auto; left: 28px; }
@media (max-width: 768px) {
  html[dir="rtl"] .hero-slider__nav { right: auto; left: 16px; }
}

/* Product / industry / cert card icons and arrows */
html[dir="rtl"] .product-tile__link,
html[dir="rtl"] .product-card__arrow {
  flex-direction: row-reverse;
}
html[dir="rtl"] .product-tile__link svg { transform: scaleX(-1); }
html[dir="rtl"] .home-product-card__arrow svg,
html[dir="rtl"] .product-card__arrow svg { transform: scaleX(-1); }

/* Back-to-top / WhatsApp floating buttons: mirror corner */
html[dir="rtl"] #back-to-top { right: auto; left: 24px; }
html[dir="rtl"] .whatsapp-float { right: auto; left: 24px; }

/* Accordion plus/chevron icons */
html[dir="rtl"] .accordion-item__q { text-align: right; }
html[dir="rtl"] .accordion-item__q::after { margin-left: 0; margin-right: auto; }

/* Forms */
html[dir="rtl"] input,
html[dir="rtl"] textarea,
html[dir="rtl"] select {
  text-align: right;
}

/* Footer grid: text alignment follows RTL naturally via direction,
   no explicit overrides required beyond default block flow. */