/* Arabic RTL styles - only applied when dir="rtl" is set */

/* Import Alexandria font only when RTL is active */
html[dir="rtl"] {
  direction: rtl;
  font-family: 'Alexandria', 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif, 'Arabic UI Text', 'Geeza Pro' !important;
  font-size: 14px;
}

/* Import font only when RTL context exists */
@supports (direction: rtl) {
  @import url('https://fonts.googleapis.com/css2?family=Alexandria:wght@300;400;700;800&display=swap');
}

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

/* Font weight adjustments for Arabic headings - RTL only */
html[dir="rtl"] h1 {
  font-family: 'Alexandria', 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;
  font-weight: 700;
  line-height: 1.6;
  font-size: 2rem;
}

html[dir="rtl"] h2 {
  font-family: 'Alexandria', 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;
  font-weight: 700;
  line-height: 1.6;
  font-size: 1.6rem;
}

html[dir="rtl"] h3 {
  font-family: 'Alexandria', 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;
  font-weight: 700;
  line-height: 1.6;
  font-size: 1.3rem;
}

html[dir="rtl"] h4 {
  font-family: 'Alexandria', 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;
  font-weight: 700;
  line-height: 1.6;
  font-size: 1.1rem;
}

html[dir="rtl"] .hero h1 {
  font-family: 'Alexandria', 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;
  font-size: clamp(2rem, 3.5vw, 2.8rem);
  line-height: 1.5;
  font-weight: 800;
}

/* Adjust spacing for Arabic text */
html[dir="rtl"] p {
  font-family: 'Alexandria', 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;
  line-height: 1.9;
  font-size: 0.9rem;
}

html[dir="rtl"] .lead {
  font-family: 'Alexandria', 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;
  line-height: 1.9;
  font-size: 1rem;
}

html[dir="rtl"] .muted {
  font-family: 'Alexandria', 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;
  line-height: 1.8;
  font-size: 0.85rem;
}

/* Navigation adjustments for RTL */
html[dir="rtl"] .nav-inner {
  flex-direction: row-reverse;
}

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

html[dir="rtl"] .brand-name {
  margin-left: 12px;
  margin-left: 0;
  font-family: 'Alexandria', 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;
  font-weight: 700;
  font-size: 1rem;
}

html[dir="rtl"] .pill {
  margin-right: 8px;
  margin-left: 0;
  font-family: 'Alexandria', 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;
  font-size: 0.75rem;
}

/* Hero section RTL */
html[dir="rtl"] .hero .wrap {
  direction: rtl;
}

/* Feature icons RTL positioning */
html[dir="rtl"] .feature i {
  margin-right: 0;
  margin-left: 10px;
}

html[dir="rtl"] h3 i {
  margin-right: 0;
  margin-left: 10px;
}

html[dir="rtl"] h2 i {
  margin-right: 0;
  margin-left: 10px;
}

/* Setup steps RTL */
html[dir="rtl"] .setup-step {
  direction: rtl;
}

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

/* Contact section icons RTL */
html[dir="rtl"] .contact i {
  margin-right: 0;
  margin-left: 6px;
}

/* Modal content RTL */
html[dir="rtl"] .modal-content {
  direction: rtl;
  text-align: right;
}

html[dir="rtl"] .install-step {
  direction: rtl;
}

html[dir="rtl"] .install-step .step-number {
  margin-left: 16px;
  margin-right: 0;
}

/* Button adjustments for RTL */
html[dir="rtl"] .btn {
  direction: rtl;
  font-family: 'Alexandria', 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;
  font-size: 0.9rem;
}

html[dir="rtl"] .dl-actions {
  direction: rtl;
}

html[dir="rtl"] .cta-row {
  direction: rtl;
}

/* Badge positioning for RTL */
html[dir="rtl"] .badges {
  direction: rtl;
}

html[dir="rtl"] .badge {
  margin: 0 4px;
  font-family: 'Alexandria', 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;
  font-size: 0.7rem;
}

/* Footer RTL */
html[dir="rtl"] .footer {
  direction: rtl;
}

html[dir="rtl"] .footer > div > div {
  direction: rtl;
}

/* Grid adjustments for RTL */
html[dir="rtl"] .grid-3,
html[dir="rtl"] .dl-grid {
  direction: rtl;
}

html[dir="rtl"] .feature-list {
  direction: rtl;
}

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

/* Ensure all text elements use Alexandria - RTL only */
html[dir="rtl"] * {
  font-family: 'Alexandria', 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif !important;
}

/* Removed global font rule to prevent affecting English page */

/* Font size adjustments for Arabic - RTL only */
html[dir="rtl"] {
  font-size: 14px;
}

html[dir="rtl"] .tag {
  font-size: 0.8rem;
}

/* Icon spacing adjustments for RTL */
html[dir="rtl"] i {
  margin-right: 0 !important;
  /* margin-left: 8px !important; */
}

html[dir="rtl"] h3 i,
html[dir="rtl"] h4 i {
  margin-left: 10px !important;
  margin-right: 0 !important;
}

/* FontAwesome icon fixes */
html[dir="rtl"] .fas,
html[dir="rtl"] .far,
html[dir="rtl"] .fab {
  display: inline-block !important;
  font-style: normal !important;
  font-variant: normal !important;
  text-rendering: auto !important;
  -webkit-font-smoothing: antialiased !important;
  font-family: "Font Awesome 6 Free" !important;
  font-weight: 900 !important;
}

html[dir="rtl"] .fab {
  font-family: "Font Awesome 6 Brands" !important;
  font-weight: 400 !important;
}

html[dir="rtl"] .far {
  font-weight: 400 !important;
}

/* Ensure icons are visible and properly sized */
html[dir="rtl"] i.fas,
html[dir="rtl"] i.far,
html[dir="rtl"] i.fab {
  width: auto !important;
  height: auto !important;
  font-size: inherit !important;
}

/* Back to Top Button positioned on left for RTL */
html[dir="rtl"] .back-to-top {
  left: 30px;
  right: auto;
}

@media (max-width: 768px) {
  html[dir="rtl"] .back-to-top {
    left: 20px;
    right: auto;
  }
}