/*------------------------------------------------------------------
  Version arabe (html dir="rtl") — chargee uniquement par les pages /ar/,
  apres bootstrap.rtl.min.css et style.css.

  Bootstrap RTL inverse deja ses utilitaires (ms-*, pe-*, text-start,
  start-0...). Ce fichier inverse les regles du theme ecrites en dur
  en gauche/droite dans style.css.
-------------------------------------------------------------------*/

:root {
  --font: "Cairo", "Outfit", sans-serif;
}

/* Un element decale vers la gauche (animations d'entree) ferait apparaitre
   une barre de defilement horizontale : en RTL, le debordement a gauche defile. */
body {
  overflow-x: clip;
}

/* L'arabe a besoin de plus d'interligne que l'Outfit : avec l'interligne
   d'origine (egal a la taille du texte), les lettres des grands titres
   debordaient sur le paragraphe suivant. */
p,
li,
.accordion-body {
  line-height: 1.8;
}

h1 {
  line-height: 1.25;
}

h2,
.heading-2,
h3 {
  line-height: 1.35;
}

h4,
h5,
h6 {
  line-height: 1.45;
}

/* Cartes : le texte, plus haut en arabe, etait coupe par l'effet de
   glissement au survol. On l'affiche directement. */
.why-wrap {
  transform: none;
}

/* Un numero de telephone ou un e-mail ne se coupe pas en fin de ligne */
span[dir="ltr"] {
  white-space: nowrap;
}

/* ---------- Formes decoratives (coins arrondis inverses) ---------- */
[class*="spacer-top-"],
[class*="spacer-bottom-"] {
  transform: scaleX(-1);
}

.home-hero .spacer-bottom-right {
  left: auto;
  right: -12px;
  margin-left: 0;
  margin-right: -30px;
}

.home-hero .spacer-bottom-left {
  right: auto;
  left: -12px;
}

.spacer-special-left {
  margin-left: 0;
  margin-right: -12px;
}

.spacer-special-right {
  margin-right: 0;
  margin-left: -12px;
}

@media only screen and (max-width: 1199.98px) {
  .home-hero .spacer-bottom-right {
    margin-right: 0;
  }
}

/* ---------- Fleches : elles pointent vers la gauche en arabe ---------- */
.bi-arrow-right-short::before,
.bi-arrow-right-circle-fill::before,
.bi-arrow-right::before,
.bi-chevron-right::before {
  transform: scaleX(-1);
}

/* Fleche des boutons principaux : en haut a gauche au repos, a gauche au survol */
.btn-cta-primary .btn-icon-primary {
  transform: rotate(40deg);
}

.btn-cta-primary:hover .btn-icon-primary {
  transform: rotate(0deg);
}

/* ---------- Elements poses dans un coin ---------- */
.hero-content h5 {
  padding: 0 0 10px 10px;
  border-bottom-right-radius: 0;
  border-bottom-left-radius: 10px;
}

.project.service-box h6,
.why-box.project h6 {
  border-bottom-right-radius: 0;
  border-bottom-left-radius: 10px;
  padding-right: 10px;
  padding-left: 15px;
}

.text-faqs {
  left: auto;
  right: 12px;
}

.text-faqs .wrapper-text {
  padding-right: 0;
  padding-left: 10px;
  border-bottom-right-radius: 0;
  border-bottom-left-radius: 25px;
}

.service-content {
  left: auto;
  right: 0;
}

.icon-service,
.team-social {
  left: auto;
  right: 0;
}

.icon-service .icon-inner {
  border-bottom-right-radius: 0;
  border-bottom-left-radius: 45px;
}

.team-social-inner {
  border-bottom-right-radius: 0;
  border-bottom-left-radius: 35px;
}

.impact-wrapper {
  left: auto;
  right: 0;
}

.impact-content {
  border-top-right-radius: 0;
  border-top-left-radius: 25px;
}

.team-info-wrapper {
  right: auto;
  left: 0;
}

.team-content {
  border-top-left-radius: 0;
  border-top-right-radius: 25px;
}

.story-box .qoute-ornament {
  right: auto;
  left: 0;
}

.story-box .qoute-inner {
  border-top-left-radius: 0;
  border-top-right-radius: 47px;
}

.bg-testimonial {
  right: auto;
  left: 0;
  border-bottom-left-radius: 0;
  border-bottom-right-radius: 25px;
}

.border-right-color {
  border-right: 0;
  border-left: 1px solid var(--heading-color-1);
}

.project-desc {
  right: auto;
  left: 62px;
}

.topbot-rounded-6 {
  border-top-right-radius: 0;
  border-bottom-right-radius: 0;
  border-top-left-radius: 25px;
  border-bottom-left-radius: 25px;
}

.why-box.project {
  border-top-right-radius: 25px;
  border-bottom-right-radius: 25px;
  border-top-left-radius: 0;
  border-bottom-left-radius: 0;
}

/* Bouton telephone de la barre laterale des pages services */
.card-cta.btn-pdf .icon-pdf {
  left: auto;
  right: 25px;
}

.card-cta.btn-pdf .btn-text {
  padding-left: 0;
  padding-right: 48px;
}

/* Avatars qui se chevauchent */
.ms-n15 {
  margin-left: 0;
  margin-right: -15px;
}

.logo-footer {
  object-position: right;
}

/* ---------- Formulaires ---------- */
.form select.form-select {
  padding-right: 0.75rem;
  padding-left: 45px;
}

.form.subscribe input {
  padding-left: 0;
  padding-right: 20px;
}

/* Telephones, e-mails : restent ecrits de gauche a droite */
input[type="email"],
input[type="tel"] {
  direction: ltr;
  text-align: right;
}

/* ---------- Menu ---------- */
.offcanvas-header .btn-close {
  margin-right: auto;
  margin-left: 0;
}

@media only screen and (min-width: 991.98px) {
  .dropdown:hover .dropdown-menu {
    left: auto;
    right: 10px;
  }
}

@media only screen and (max-width: 991.98px) {
  .nav-item.dropdown .dropdown-menu {
    left: auto;
    right: 0;
  }
}

@media only screen and (max-width: 768.98px) {
  .topbot-rounded-6 {
    border-top-left-radius: 0;
    border-bottom-left-radius: 25px;
    border-bottom-right-radius: 25px;
  }

  .why-box.project {
    border-top-right-radius: 0;
    border-top-left-radius: 25px;
    border-bottom-right-radius: 0;
    border-bottom-left-radius: 0;
  }

  .project-desc {
    left: 0;
  }
}

/* ---------- Animations d'entree, dans le sens de lecture ---------- */
[data-aos="fade-right"] {
  transform: translate3d(100px, 0, 0);
}

.fade.fade-right {
  transform: translateX(-20vw);
}

.fade.fade-right.show {
  transform: translateX(0);
}