/* ============================================
   Ballesta Official Website - RTL Stylesheet
   For Arabic (ar) language
   Created: 2026-07-28
   ============================================ */

/* ===== 1. Base Direction ===== */
[dir="rtl"] {
  direction: rtl;
  text-align: right;
}

/* ===== 2. Font Stack - Arabic first ===== */
[dir="rtl"] {
  --font-display: 'Cairo', 'Inter', -apple-system, BlinkMacSystemFont, sans-serif;
}

/* ===== 3. Navbar ===== */
[dir="rtl"] nav ul li:first-child {
  margin-left: 0;
  margin-right: 32px;
}
[dir="rtl"] nav ul li:last-child {
  margin-right: 0;
  margin-left: 32px;
}

/* ===== 4. Dropdown Menu ===== */
[dir="rtl"] .sub-root .sub-list {
  left: auto !important;
  right: calc(100% - 8px) !important;
}
[dir="rtl"] .sub-root .sub-menu-arrow {
  margin-left: 0;
  margin-right: auto;
}
[dir="rtl"] .sub-root .sub-menu-arrow i::before {
  content: "\f053";  /* fa-chevron-left */
}
[dir="rtl"] .sub-root .sub-list::before {
  left: auto;
  right: -6px;
  border-left: none;
  border-right: 1px solid var(--hairline);
  border-bottom: 1px solid var(--hairline);
  border-top: none;
  transform: rotate(-45deg);
}
[dir="rtl"] .sub-sub-root .sub-sub-list {
  left: auto !important;
  right: calc(100% - 8px) !important;
}
[dir="rtl"] .sub-sub-root .sub-sub-list::before {
  left: auto;
  right: -6px;
}
[dir="rtl"] .sub-list-bridge {
  left: auto;
  right: -16px;
}

/* ===== 5. Mobile Menu Panel ===== */
[dir="rtl"] .mobile-menu-panel {
  right: auto;
  left: 0;
  transform: translateX(-100%);
  box-shadow: 4px 0 24px rgba(0,0,0,.08);
}
[dir="rtl"] .mobile-menu-panel.open {
  transform: translateX(0);
}
[dir="rtl"] .mobile-menu-panel .mm-sub .mm-item {
  padding: 10px 16px 10px 0;
}
[dir="rtl"] .mm-arrow.open {
  transform: rotate(-90deg);
}

/* ===== 6. Footer ===== */
[dir="rtl"] .footer-cert-logo {
  margin: 30px 40px 0 0;
}

/* ===== 7. Hero / Page Hero ===== */
[dir="rtl"] .hero-overlay {
  background:
    radial-gradient(ellipse 80% 60% at 80% 50%, rgba(27,58,110,.15) 0%, transparent 70%),
    linear-gradient(to bottom, transparent 40%, rgba(0,0,0,.7) 100%);
}

/* ===== 8. Solution Card Tag ===== */
[dir="rtl"] .solution-tag,
#solutions .solution-tag,
[dir="rtl"] #solutions .solution-tag {
  right: auto;
  left: 24px;
}

/* ===== 9. Feature Cards (if any have directional inline styles) ===== */
[dir="rtl"] .feature-card {
  text-align: right;
}

/* ===== 10. Page Hero Text ===== */
[dir="rtl"] .page-hero {
  text-align: right;
}

/* ===== 11. Contact / Form Inputs ===== */
[dir="rtl"] input,
[dir="rtl"] textarea {
  text-align: right;
}

/* ===== 12. Mobile Footer Brand Column ===== */
@media (max-width: 768px) {
  [dir="rtl"] .footer-grid > div:first-child {
    text-align: center;
  }
  [dir="rtl"] .mobile-menu-panel .mm-sub .mm-item {
    padding: 10px 16px 10px 0;
  }
}

/* ===== 13. Breadcrumbs & Page Content ===== */
[dir="rtl"] .container,
[dir="rtl"] section {
  direction: rtl;
}

/* ===== 14. Gallery & Cards ===== */
[dir="rtl"] .gallery-item,
[dir="rtl"] .product-card,
[dir="rtl"] .category-card,
[dir="rtl"] .model-card,
[dir="rtl"] .case-card {
  text-align: right;
}

/* ===== 15. CTA Section ===== */
[dir="rtl"] .cta-section {
  text-align: right;
}
@media (max-width: 768px) {
  [dir="rtl"] .cta-section {
    text-align: center !important;
  }
}