/* ═══════════ IMMOTEK — rtl.css v1.0 ═══════════
 * Actif uniquement quand <html dir="rtl"> (posé par i18n.js pour l'arabe).
 * Flex / grid s'inversent nativement avec dir=rtl ; ici : corrections ciblées.
 */

/* ── Typographie arabe ── */
html[dir="rtl"] body,
html[dir="rtl"] input, html[dir="rtl"] textarea, html[dir="rtl"] select, html[dir="rtl"] button {
  font-family: "IBM Plex Sans Arabic", Inter, system-ui, sans-serif;
}
html[dir="rtl"] h1, html[dir="rtl"] h2, html[dir="rtl"] h3, html[dir="rtl"] h4,
html[dir="rtl"] .svc-popup-text-col h3 {
  font-family: "IBM Plex Sans Arabic", "Space Grotesk", sans-serif;
  letter-spacing: 0 !important;          /* l'espacement casse les ligatures arabes */
}
html[dir="rtl"] * { text-transform: none; }  /* pas de capitales en arabe */
html[dir="rtl"] body { line-height: 1.75; }

/* ── Alignements ── */
html[dir="rtl"] .servicesSection .svc-grid,
html[dir="rtl"] .svc-adn-block,
html[dir="rtl"] .servicesSection .svc-bottom,
html[dir="rtl"] .knx-body,
html[dir="rtl"] .svc-popup-text-col,
html[dir="rtl"] .svc-popup-text-col h3,
html[dir="rtl"] .svc-popup-text-col p { text-align: right; }
html[dir="rtl"] .mobileNav a { text-align: left; }

/* ── Marges / bordures ── */
html[dir="rtl"] .knx-iot-plus { margin-right: 0; margin-left: 4px; }
html[dir="rtl"] .proj-modal-desc {
  border-left: 0; padding-left: 0;
  border-right: 2px solid rgba(232,168,56,.3); padding-right: 14px;
}

/* ── Éléments positionnés ── */
html[dir="rtl"] .langMenu        { right: auto; left: 0; }
html[dir="rtl"] .svc-popup-x     { right: auto; left: 12px; }
html[dir="rtl"] .proj-card-fam-dot { right: auto; left: 10px; }
html[dir="rtl"] .proj-modal-close  { right: auto; left: 16px; }
html[dir="rtl"] .proj-modal-counter { right: auto; left: 12px; }
html[dir="rtl"] .mat-widget-dot  { right: auto; left: 10px; }

/* Galerie : « précédent » à droite, « suivant » à gauche (sens de lecture arabe) */
html[dir="rtl"] .proj-modal-arrow.left  { left: auto; right: 12px; transform: scaleX(-1); }
html[dir="rtl"] .proj-modal-arrow.right { right: auto; left: 12px; transform: scaleX(-1); }

/* ── Restent en LTR : défilements logos, carte, chiffres, coordonnées ── */
html[dir="rtl"] .partners-track,
html[dir="rtl"] .clients-track,
html[dir="rtl"] .leaflet-container,
html[dir="rtl"] input[type="email"],
html[dir="rtl"] input[type="tel"] { direction: ltr; }
html[dir="rtl"] .leaflet-popup-content { direction: rtl; text-align: right; }
