/* =========================================
   RTL Global Overrides
   ========================================= */

@font-face {
  font-family: Cairo;
  src: url("../fonts/Cairo-Regular.ttf");
}

/* Global Direction */
html,
body {
  direction: rtl;
  text-align: right;
  font-family: Cairo; /* Same font, unless you change for AR later */
}

/* Flip common paddings and margins */
* {
  unicode-bidi: embed;
}

/* =========================================
   Navigation
   ========================================= */

nav {
  flex-direction: row-reverse !important;
}

nav .logo-text,
nav span {
  text-align: right;
}

nav img {
  margin-right: 0;
  margin-left: 10px;
}

/* =========================================
   Hero/Banner
   ========================================= */

.hero-content {
  text-align: center; /* remains centered */
}

.hero-content h1,
.hero-content h2,
.hero-content h3 {
  direction: rtl;
}

/* If you have sliding text animation that assumes LTR */
.hero-text-group {
  direction: rtl;
}

/* =========================================
   Services Section
   ========================================= */

.services-container {
  direction: rtl;
}

.service-box {
  text-align: right;
}

.service-box i {
  margin-left: 10px;
  margin-right: 0;
}

/* =========================================
   About Section
   ========================================= */

.about-section {
  direction: rtl;
  text-align: justify; /* same as EN */
}

/* =========================================
   Team Section
   ========================================= */

.team-slider {
  direction: rtl;
}

.team-member {
  text-align: center; /* images and text centered */
}

.team-member h3,
.team-member p {
  direction: rtl;
}

/* =========================================
   Contact Section
   ========================================= */

.contact-form {
  direction: rtl;
  text-align: right;
}

.contact-details {
  direction: rtl;
  text-align: right;
}

.contact-details i {
  margin-left: 8px;
  margin-right: 0;
}

/* =========================================
   Footer
   ========================================= */

footer {
  direction: rtl;
  text-align: center;
}

.footer-nav {
  direction: ltr;
}

.footer-right {
  direction: ltr;
}

/* =========================================
   Utility Fixes for RTL
   ========================================= */

/* Swap margin-left/right utility classes if you use any */
.ml-auto {
  margin-left: 0 !important;
  margin-right: auto !important;
}
.mr-auto {
  margin-right: 0 !important;
  margin-left: auto !important;
}

/* Flip flex direction globally when needed */
.flex-row {
  flex-direction: row-reverse !important;
}