/* ============================================
   RTL (Right-to-Left) STYLES - ARABIC SUPPORT
   File: rtl-style.css
   Font: Alexandria
============================================ */

/* RTL Base Styles */
[dir="rtl"] body,
body.rtl {
  direction: rtl;
  text-align: right;
  font-family: var(--font-family-alexandria);
}

[dir="rtl"],
.rtl {
  direction: rtl;
}

/* ============================================
   GENERAL RTL ADJUSTMENTS
============================================ */

/* Text Alignment */
[dir="rtl"] h1,
[dir="rtl"] h2,
[dir="rtl"] h3,
[dir="rtl"] h4,
[dir="rtl"] h5,
[dir="rtl"] h6,
[dir="rtl"] p,
[dir="rtl"] li {
  text-align: right;
}

/* Float Reversals */
[dir="rtl"] .float-left {
  float: right;
}

[dir="rtl"] .float-right {
  float: left;
}

/* Margin and Padding Reversals */
[dir="rtl"] .mr-1 { margin-left: 0.25rem; margin-right: 0; }
[dir="rtl"] .mr-2 { margin-left: 0.5rem; margin-right: 0; }
[dir="rtl"] .mr-3 { margin-left: 1rem; margin-right: 0; }
[dir="rtl"] .mr-4 { margin-left: 1.5rem; margin-right: 0; }

[dir="rtl"] .ml-1 { margin-right: 0.25rem; margin-left: 0; }
[dir="rtl"] .ml-2 { margin-right: 0.5rem; margin-left: 0; }
[dir="rtl"] .ml-3 { margin-right: 1rem; margin-left: 0; }
[dir="rtl"] .ml-4 { margin-right: 1.5rem; margin-left: 0; }

[dir="rtl"] .pr-1 { padding-left: 0.25rem; padding-right: 0; }
[dir="rtl"] .pr-2 { padding-left: 0.5rem; padding-right: 0; }
[dir="rtl"] .pr-3 { padding-left: 1rem; padding-right: 0; }
[dir="rtl"] .pr-4 { padding-left: 1.5rem; padding-right: 0; }

[dir="rtl"] .pl-1 { padding-right: 0.25rem; padding-left: 0; }
[dir="rtl"] .pl-2 { padding-right: 0.5rem; padding-left: 0; }
[dir="rtl"] .pl-3 { padding-right: 1rem; padding-left: 0; }
[dir="rtl"] .pl-4 { padding-right: 1.5rem; padding-left: 0; }

/* ============================================
   HEADER & NAVIGATION - RTL
============================================ */

/* Logo */

/* Navigation Menu */
/* [dir="rtl"] .nav-menu {
  flex-direction: row-reverse;
} */

[dir="rtl"] .nav-menu li {
  margin-left: 32px;
  margin-right: 0;
}

[dir="rtl"] .nav-menu li:last-child {
  margin-left: 0;
}

/* Navigation Buttons */
/* [dir="rtl"] .nav-buttons {
  flex-direction: row-reverse;
} */

[dir="rtl"] .language-selector {
  margin-left: 0;
  margin-right: 20px;
}

[dir="rtl"] .btn-login {
  margin-left: 12px;
  margin-right: 0;
}

/* Language Dropdown Arrow */
[dir="rtl"] .language-current svg {
  margin-left: 0;
  margin-right: 8px;
  transform: scaleX(-1);
}

/* Mobile Menu */
[dir="rtl"] .hamburger {
  left: 20px;
  right: auto;
}



/* ============================================
   HERO SECTION - RTL
============================================ */

[dir="rtl"] .hero-content {
  text-align: right;
}

[dir="rtl"] .hero-title {
  text-align: right;
}

[dir="rtl"] .hero-subtitle {
  text-align: right;
}

[dir="rtl"] .hero-buttons {
  justify-content: flex-start;
}

[dir="rtl"] .btn-primary {
  margin-left: 16px;
  margin-right: 0;
}

/* Hero Background Elements */
[dir="rtl"] .hero-pattern {
  right: auto;
  left: 0;
  transform: scaleX(-1);
}

[dir="rtl"] .hero-wave {
  transform: scaleX(-1);
}

/* ============================================
   ABOUT SECTION - RTL
============================================ */

[dir="rtl"] .about-content {
  flex-direction: row-reverse;
}

[dir="rtl"] .about-text {
  text-align: right;
  padding-left: 0;
  padding-right: 60px;
}

[dir="rtl"] .about-image {
  margin-right: 0;
  margin-left: 60px;
}

/* Title Underline */
[dir="rtl"] .title-underline {
  left: auto;
  right: 0;
}

/* ============================================
   FEATURES/SERVICES GRID - RTL
============================================ */

[dir="rtl"] .feature-card,
[dir="rtl"] .service-card {
  text-align: right;
}

[dir="rtl"] .feature-icon,
[dir="rtl"] .service-icon {
  margin-left: 0;
  margin-right: 0;
}

/* ============================================
   STATS SECTION - RTL
============================================ */

[dir="rtl"] .stat-card {
  text-align: center;
}

/* ============================================
   HOW IT WORKS / PROCESS - RTL
============================================ */

[dir="rtl"] .process-step {
  text-align: right;
}

[dir="rtl"] .process-step-number {
  margin-left: 0;
  margin-right: 0;
}

[dir="rtl"] .process-step-title {
  text-align: right;
}

[dir="rtl"] .process-step-description {
  text-align: right;
}

/* Process Cards Layout */
[dir="rtl"] .process-steps-grid {
  direction: rtl;
}

/* ============================================
   BLOG SECTION - RTL
============================================ */

[dir="rtl"] .blog-card {
  text-align: right;
}

[dir="rtl"] .blog-content h3 {
  text-align: right;
}

[dir="rtl"] .blog-content p {
  text-align: right;
}

[dir="rtl"] .btn-read-more {
  flex-direction: row-reverse;
}

[dir="rtl"] .read-more-icon {
  margin-left: 0;
  margin-right: 8px;
  transform: scaleX(-1);
}

/* Blog Carousel Navigation */
[dir="rtl"] .carousel-prev {
  left: auto;
  right: -60px;
}

[dir="rtl"] .carousel-next {
  right: auto;
  left: -60px;
}

[dir="rtl"] .carousel-prev svg,
[dir="rtl"] .carousel-next svg {
  transform: scaleX(-1);
}

/* ============================================
   PARTNERS SECTION - RTL
============================================ */

[dir="rtl"] .partners-carousel-prev {
  left: auto;
  right: -60px;
}

[dir="rtl"] .partners-carousel-next {
  right: auto;
  left: -60px;
}

[dir="rtl"] .partners-carousel-prev svg,
[dir="rtl"] .partners-carousel-next svg {
  transform: scaleX(-1);
}

/* ============================================
   CTA SECTION - RTL
============================================ */

[dir="rtl"] .cta-box {
  text-align: center;
}

[dir="rtl"] .cta-box h2 {
  text-align: center;
}

[dir="rtl"] .cta-box p {
  text-align: center;
}

/* ============================================
   FOOTER - RTL
============================================ */

[dir="rtl"] .footer-content {
  flex-direction: row-reverse;
  text-align: right;
}

[dir="rtl"] .footer-column {
  text-align: right;
}

[dir="rtl"] .footer-column h4 {
  text-align: right;
}

[dir="rtl"] .footer-column ul {
  text-align: right;
}

[dir="rtl"] .footer-column ul li {
  text-align: right;
}

/* Company Info Icons */
/* [dir="rtl"] .info-item {
  flex-direction: row-reverse;
  text-align: right;
} */

[dir="rtl"] .info-icon {
  margin-left: 16px;
  margin-right: 0;
}

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

/* App Downloads */
/* [dir="rtl"] .app-downloads {
  flex-direction: row-reverse;
} */

[dir="rtl"] .app-download {
  margin-left: 0;
  margin-right: 12px;
}

[dir="rtl"] .app-download:last-child {
  margin-right: 0;
}

/* Footer Bottom */
[dir="rtl"] .footer-bottom {
  text-align: center;
}

/* ============================================
   PAGE HERO (SECONDARY PAGES) - RTL
============================================ */

[dir="rtl"] .page-hero-content {
  text-align: right;
}

[dir="rtl"] .page-hero-content h1 {
  text-align: center;

}

[dir="rtl"] .page-hero-content p {
  text-align: center;
}



[dir="rtl"] .page-hero-wave {
  transform: scaleX(-1);
}

/* ============================================
   ABOUT US PAGE - RTL
============================================ */

[dir="rtl"] .about-section-content {
  flex-direction: row-reverse;
}

[dir="rtl"] .about-section-text {
  text-align: right;
}

[dir="rtl"] .about-logo-overlay {
  left: -6%;
  right: auto;
}

[dir="rtl"] .about-feature-item {
  text-align: right;
}

[dir="rtl"] .about-feature-icon {
  left: auto;
  right: 50%;
  transform: translateX(50%) translateY(-7%);
}

[dir="rtl"] .about-feature-content {
  text-align: center;
}

/* ============================================
   HOW TO WORK PAGE - RTL
============================================ */

[dir="rtl"] .how-process-section {
  text-align: right;
}

[dir="rtl"] .how-process-title {
  text-align: center;
}

/* ============================================
   FEATURES PAGE - RTL
============================================ */

[dir="rtl"] .feat-text-content {
  text-align: right;
}

[dir="rtl"] .feat-section-title {
  text-align: center;
}

[dir="rtl"] .feat-service-card {
  text-align: center;
}

/* ============================================
   BLOG DETAILS PAGE - RTL
============================================ */

[dir="rtl"] .blog-detail-content {
  direction: rtl;
}

[dir="rtl"] .blog-detail-intro {
  border-left: none;
  border-right: 4px solid var(--secondary);
  padding-left: 0;
  padding-right: 20px;
  font-size: 16px;
  line-height: 30px;
  text-align: right;
}

[dir="rtl"] .blog-detail-text {
  text-align: right;
}

[dir="rtl"] .blog-detail-text h2,
[dir="rtl"] .blog-detail-text h3 {
  text-align: right;
}

[dir="rtl"] .blog-detail-text ul,
[dir="rtl"] .blog-detail-text ol {
  padding-left: 0;
  padding-right: 30px;
}

[dir="rtl"] .blog-detail-highlight {
  border-left: none;
  border-right: 4px solid var(--secondary);
  text-align: center;
}

[dir="rtl"] .benefit-item {
  flex-direction: row-reverse;
  text-align: right;
}

[dir="rtl"] .benefit-icon {
  margin-left: 0;
  margin-right: 20px;
}

[dir="rtl"] .blog-detail-tags {
  text-align: right;
}

[dir="rtl"] .share-buttons {
  flex-direction: row-reverse;
}

/* Sidebar */
[dir="rtl"] .blog-detail-sidebar {
  text-align: right;
}

[dir="rtl"] .author-info {
  flex-direction: row-reverse;
}

[dir="rtl"] .author-avatar {
  margin-left: 16px;
  margin-right: 0;
}

[dir="rtl"] .related-post-item {
  flex-direction: row-reverse;
}

[dir="rtl"] .related-post-image {
  margin-left: 16px;
  margin-right: 0;
}

[dir="rtl"] .categories-list li a {
  text-align: right;
}

/* ============================================
   FORMS - RTL
============================================ */

[dir="rtl"] input,
[dir="rtl"] textarea,
[dir="rtl"] select {
  text-align: right;
  direction: rtl;
}

[dir="rtl"] label {
  text-align: right;
}

[dir="rtl"] .form-group {
  text-align: right;
}

[dir="rtl"] .btn-send {
  font-family: var(--font-family-alexandria);
  letter-spacing: 0;
  text-transform: none;
}

/* Checkbox and Radio */
[dir="rtl"] input[type="checkbox"],
[dir="rtl"] input[type="radio"] {
  margin-left: 8px;
  margin-right: 0;
}

/* ============================================
   BUTTONS - RTL
============================================ */

[dir="rtl"] button,
[dir="rtl"] .btn {
  direction: rtl;
  font-family: var(--font-family-alexandria);
}

[dir="rtl"] [class*="btn-"] {
  font-family: var(--font-family-alexandria);
}

[dir="rtl"] button svg,
[dir="rtl"] .btn svg {
  margin-left: 0;
  margin-right: 8px;
}

/* Icon Buttons */
[dir="rtl"] .icon-left {
  margin-left: 0;
  margin-right: 8px;
  order: 2;
}

[dir="rtl"] .icon-right {
  margin-right: 0;
  margin-left: 8px;
  order: -1;
}

/* ============================================
   ANIMATIONS - RTL
============================================ */

/* Reverse slide animations */
[dir="rtl"] .animate__slideInLeft {
  animation-name: slideInRight;
}

[dir="rtl"] .animate__slideInRight {
  animation-name: slideInLeft;
}

[dir="rtl"] .animate__fadeInLeft {
  animation-name: fadeInRightShort;
}

[dir="rtl"] .animate__fadeInRight {
  animation-name: fadeInLeftShort;
}

/* RTL Animation Keyframes */
@keyframes fadeInRightShortRTL {
  from {
    opacity: 0;
    transform: translate3d(30px, 0, 0);
  }
  to {
    opacity: 1;
    transform: translate3d(0, 0, 0);
  }
}

@keyframes fadeInLeftShortRTL {
  from {
    opacity: 0;
    transform: translate3d(-30px, 0, 0);
  }
  to {
    opacity: 1;
    transform: translate3d(0, 0, 0);
  }
}

/* ============================================
   RESPONSIVE RTL ADJUSTMENTS
============================================ */

/* Tablet (768px and below) */
@media (max-width: 768px) {
  [dir="rtl"] .container {
    padding: 0 20px;
  }

  [dir="rtl"] .nav-menu {
    text-align: right;
  }

  [dir="rtl"] .hero-content {
    text-align: center;
  }

  [dir="rtl"] .about-content {
    flex-direction: column;
  }

  [dir="rtl"] .about-text {
    padding-right: 0;
  }

  [dir="rtl"] .footer-content {
    flex-direction: column;
  }

  [dir="rtl"] .mobile-text h2{
    text-align: center;
  }
  [dir="rtl"] .mobile-text p{
    text-align: center;
  }
  [dir="rtl"] .cta-box h2{
    font-size: 20px;
  }
  [dir="rtl"] .contact-form-wrapper h2{
    font-size: 30px;
  }

    [dir="rtl"] .hamburger svg {
        width: 26px;
        height: 26px;
    }

    [dir="rtl"] .page-hero-content h1{
      font-size: 22px !important;
    }
}


/* Mobile (480px and below) */
@media (max-width: 480px) {
  [dir="rtl"] .container {
    padding: 0 16px;
  }

  [dir="rtl"] .hero-buttons {
    flex-direction: column;
    align-items: stretch;
  }

  [dir="rtl"] .btn-primary {
    margin-left: 0;
    margin-bottom: 12px;
  }

  [dir="rtl"] .blog-detail-intro {
    padding-right: 16px;
  }

  [dir="rtl"] .mobile-text h2{
    text-align: center;
  }
  [dir="rtl"] .mobile-text p{
    text-align: center;
  }
  [dir="rtl"] .cta-box h2{
    font-size: 20px;
  }
  [dir="rtl"] .contact-form-wrapper h2{
    font-size: 30px;
  }

  [dir="rtl"] .about-text p{
    text-align: center;
  }

  [dir="rtl"] .hero-text h1{
    text-align: center;
  }

  [dir="rtl"] .hero-text p{
    text-align: center;
  }

}

/* ============================================
   UTILITY CLASSES - RTL
============================================ */

[dir="rtl"] .text-left {
  text-align: right !important;
}

[dir="rtl"] .text-right {
  text-align: left !important;
}

[dir="rtl"] .border-left {
  border-left: none !important;
  border-right: 1px solid var(--border-color) !important;
}

[dir="rtl"] .border-right {
  border-right: none !important;
  border-left: 1px solid var(--border-color) !important;
}

/* ============================================
   CUSTOM RTL FIXES
============================================ */

/* Fix for icons that should not flip */
[dir="rtl"] .no-flip {
  transform: scaleX(-1);
}

/* Fix for numbers and English text in RTL context */
[dir="rtl"] .ltr-content {
  direction: ltr;
  display: inline-block;
}

/* Social Media Icons (shouldn't flip) */
[dir="rtl"] .social-icons svg,
[dir="rtl"] .share-btn svg {
  transform: scaleX(1);
}

/* Logo (shouldn't flip) */
[dir="rtl"] .logo img {
  transform: scaleX(1);
}


[dir="rtl"] .section-title 
{
  text-align: center !important;
    margin-bottom: 40px;
    font-size: 25px;
    line-height: 44px;
} 

[dir="rtl"] .stats-subtitle{
  text-align: center !important;
} 



[dir="rtl"] .footer-links ul li a{
  font-size: 16px;
}
[dir="rtl"] .hero-badge span{
  font-size: 10px;
}
[dir="rtl"] .hero-text h1{
  font-size: 30px;
  line-height: 60.6px;
}
[dir="rtl"] .about-text h2 {
  font-size: 30px;
  line-height: 50.4px;
}


[dir="rtl"] .about-feature-content h3 {
  text-align: center !important;
}
[dir="rtl"] .about-feature-content p {
  text-align: center !important ;
}


/* ============================================
   RTL SVG ICON FLIPPING
============================================ */

/* Flip navigation arrows */
[dir="rtl"] .carousel-nav svg,
[dir="rtl"] .partners-carousel-prev svg,
[dir="rtl"] .partners-carousel-next svg,
[dir="rtl"] .carousel-prev svg,
[dir="rtl"] .carousel-next svg {
  transform: scaleX(-1);
}

/* Flip arrow icons in buttons and links */
[dir="rtl"] .btn-read-more svg,
[dir="rtl"] .btn-read-more-about svg,
[dir="rtl"] .btn-contact svg {
  transform: scaleX(-1);
}

/* Flip language dropdown arrow */
[dir="rtl"] .language-current svg,
[dir="rtl"] .language-current-mobile svg {
  transform: scaleX(-1);
}

/* Flip mobile menu toggle icon if needed */
[dir="rtl"] .mobile-menu-toggle svg {
  transform: scaleX(-1);
}

[dir="rtl"] .nav-menu{
  gap: 10px;
}
[dir="rtl"] .nav-menu a{
  margin-left: 0px;
  font-size: 13px;

}

[dir="rtl"] .footer-tagline{
  font-size: 18px;
}

/* ============================================
   RTL MOBILE HEADER FIXES
============================================ */

/* Mobile Header Actions - Fix positioning for RTL */
@media (max-width: 1024px) {
  [dir="rtl"] .navbar {
    flex-direction: row-reverse;
  }


  

  /* Hamburger menu first (left side) */
  [dir="rtl"] .mobile-header-actions .hamburger {
    order: 1;
  }

  [dir="rtl"] .mobile-header-actions .btn-mobile-action {
    order: 2;
  }

  [dir="rtl"] .mobile-header-actions .language-selector-mobile {
    order: 3;
  }

  [dir="rtl"] .language-dropdown-mobile {
    right: auto;
    left: 0;
  }

}

/* You can add more specific SVG selectors here as needed */

/* ============================================
   END OF RTL STYLES
============================================ */