/* =========================================
   Arabic & RTL Support Stylesheet
   ========================================= */

@import url('https://fonts.googleapis.com/css2?family=Cairo:wght@400;600;700;800&display=swap');

html[dir="rtl"] body {
  font-family: 'Cairo', 'Segoe UI', Tahoma, Arial, sans-serif;
  direction: rtl;
  text-align: right;
}

html[dir="rtl"] h1,
html[dir="rtl"] h2,
html[dir="rtl"] h3,
html[dir="rtl"] h4,
html[dir="rtl"] h5,
html[dir="rtl"] h6,
html[dir="rtl"] .button {
  font-family: 'Cairo', 'Segoe UI', Tahoma, Arial, sans-serif;
}

/* Language toggle button */
.lang-toggle-btn {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 6px 14px;
  font-size: 14px;
  font-weight: 600;
  border-radius: 30px;
  border: 1.5px solid #2f80ed;
  background-color: #fff;
  color: #2f80ed;
  cursor: pointer;
  transition: all 0.25s ease-in-out;
  line-height: 1.4;
  outline: none;
}

.lang-toggle-btn:hover {
  background-color: #2f80ed;
  color: #ffffff;
}

.lang-toggle-btn i {
  font-size: 16px;
}

/* Navbar layout in RTL */
html[dir="rtl"] .navbar-brand {
  margin-right: 0;
  margin-left: 2rem;
}

html[dir="rtl"] .navbar-nav.ms-auto {
  margin-left: 0 !important;
  margin-right: auto !important;
  padding-right: 0;
}

html[dir="rtl"] .header.header-6 .navbar-nav .nav-item {
  margin-left: 0;
  margin-right: 30px;
}

html[dir="rtl"] .header.header-6 .navbar-nav .nav-item:first-child {
  margin-right: 0;
}

html[dir="rtl"] .lang-toggle-wrapper {
  margin-right: 20px;
  margin-left: 0;
}

html[dir="ltr"] .lang-toggle-wrapper {
  margin-left: 20px;
  margin-right: 0;
}

/* Text alignments */
html[dir="rtl"] .text-center {
  text-align: center !important;
}

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

/* Hero Section */
html[dir="rtl"] .hero-section-wrapper-5 .hero-style-5 .hero-content-wrapper p {
  padding-right: 0;
  padding-left: 100px;
}

@media only screen and (max-width: 991px) {
  html[dir="rtl"] .hero-section-wrapper-5 .hero-style-5 .hero-content-wrapper p {
    padding-left: 0;
  }
}

/* About Section */
html[dir="rtl"] .about-content-wrapper ul {
  padding-right: 0;
}

html[dir="rtl"] .about-content-wrapper ul li {
  position: relative;
  padding-left: 0;
  padding-right: 35px;
}

html[dir="rtl"] .about-content-wrapper ul li i {
  position: absolute;
  right: 0;
  left: auto;
  top: 4px;
}

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

/* Chevrons and arrow directions */
html[dir="rtl"] .lni-chevron-right,
html[dir="rtl"] .lni-arrow-right {
  transform: rotate(180deg);
  display: inline-block;
}

/* Our Apps Section RTL */
html[dir="rtl"] .apps-section .section-title,
html[dir="rtl"] .apps-section .section-title h3,
html[dir="rtl"] .apps-section .section-title p {
  text-align: right !important;
}

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

/* Privacy Section */
html[dir="rtl"] .privacy-section .section-title {
  text-align: right !important;
}

html[dir="rtl"] .privacy-section .bg-white {
  text-align: right;
}

html[dir="rtl"] .privacy-section ul {
  padding-right: 1.5rem !important;
  padding-left: 0 !important;
}

/* Footer Section */
html[dir="rtl"] .footer-widget {
  text-align: right;
}

html[dir="rtl"] .footer-widget ul.links {
  padding-right: 0;
}

html[dir="rtl"] .contact-links li i {
  margin-right: 0 !important;
  margin-left: 8px !important;
}

html[dir="rtl"] .footer-widget ul.socials {
  padding-right: 0;
  justify-content: flex-start;
}

html[dir="rtl"] .footer-style-4 .widget-wrapper .footer-widget .socials li a {
  margin-right: 0;
  margin-left: 15px;
}

html[dir="rtl"] .footer-widget ul.download-app {
  padding-right: 0;
}

html[dir="rtl"] .footer-widget ul.download-app li a .icon {
  margin-right: 0;
  margin-left: 12px;
}

/* Scroll to top button */
html[dir="rtl"] .scroll-top {
  right: auto;
  left: 30px;
}

/* =========================================
   App Showcase Section (RTL)
   ========================================= */
html[dir="rtl"] .showcase-content {
  text-align: right;
}

html[dir="rtl"] .showcase-badge {
  flex-direction: row;
}

html[dir="rtl"] .showcase-feat-item {
  text-align: right;
  flex-direction: row;
}

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

html[dir="rtl"] .showcase-action .hero-btn-primary i {
  margin-left: 0;
  margin-right: 8px;
}

@media (max-width: 991px) {
  html[dir="rtl"] .showcase-grid {
    text-align: right;
  }
}