/* ============================================
   RTL (Right-to-Left) — Arabic Layout
   Targeted overrides only — no global breaks
   ============================================ */

/* ─── Base Direction ─────────────────────── */
[dir="rtl"] {
    direction: rtl;
}

[dir="rtl"] body {
    font-family: 'Tajawal', 'Cairo', sans-serif;
    text-align: right;
}

/* ─── Typography ─────────────────────────── */
[dir="rtl"] h1,
[dir="rtl"] h2,
[dir="rtl"] h3,
[dir="rtl"] h4,
[dir="rtl"] h5,
[dir="rtl"] h6 {
    font-weight: 700;
    text-align: right;
}

[dir="rtl"] p,
[dir="rtl"] li,
[dir="rtl"] td,
[dir="rtl"] th,
[dir="rtl"] label {
    text-align: right;
}

/* Centered exceptions */
[dir="rtl"] .section-title h2,
[dir="rtl"] .section-title h3,
[dir="rtl"] .section-title p,
[dir="rtl"] .hero-content,
[dir="rtl"] .hero-content h1,
[dir="rtl"] .hero-content p,
[dir="rtl"] .cta-section,
[dir="rtl"] .cta-section h2,
[dir="rtl"] .cta-section p,
[dir="rtl"] .text-center,
[dir="rtl"] .text-center *,
[dir="rtl"] .stat-item,
[dir="rtl"] .stat-item *,
[dir="rtl"] .card-icon,
[dir="rtl"] .team-member,
[dir="rtl"] .testimonial-card {
    text-align: center;
}

/* ─── Navbar ─────────────────────────────── */
/*
  HTML order: [Logo] [Menu: الرئيسية ... اتصل بنا] [Hamburger]
  row-reverse → Visual: [Hamburger] [اتصل بنا ... الرئيسية] [Logo]
                                                               ↑ Logo on RIGHT ✓
  Menu row-reverse → الرئيسية on RIGHT, اتصل بنا on LEFT ✓
*/
[dir="rtl"] .navbar-container {
    flex-direction: row-reverse;
}

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

[dir="rtl"] .navbar-menu li a {
    font-size: 1rem;
    font-weight: 500;
}

/* ─── Icons ──────────────────────────────── */
[dir="rtl"] .card-body i,
[dir="rtl"] .footer-section i,
[dir="rtl"] .contact-info-card i {
    margin-left: 8px;
    margin-right: 0;
}

[dir="rtl"] .card-icon {
    display: block;
    margin: 0 auto 15px;
}

/* ─── Cards ──────────────────────────────── */
[dir="rtl"] .card-body {
    text-align: right;
}

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

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

/* ─── Lists ──────────────────────────────── */
[dir="rtl"] ul,
[dir="rtl"] ol {
    padding-right: 20px;
    padding-left: 0;
}

/* ─── Footer ─────────────────────────────── */
[dir="rtl"] .footer-section {
    text-align: right;
}

/* Phone/email/url always read left-to-right */
[dir="rtl"] .footer-contact-item {
    direction: ltr;
    text-align: right;
    display: flex;
    align-items: center;
    gap: 8px;
    flex-direction: row-reverse;
    justify-content: flex-end;
}

/* Phone/email/URL — keep LTR so numbers don't reverse */
[dir="rtl"] .footer-contact-item {
    direction: ltr;
    unicode-bidi: embed;
    text-align: right;
}

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

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

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

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

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

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

/* ─── About Section ──────────────────────── */
[dir="rtl"] .about-content,
[dir="rtl"] .about-text p {
    text-align: right;
}

/* ─── Floating Buttons ───────────────────── */
[dir="rtl"] .back-to-top {
    left: 30px;
    right: auto;
}

[dir="rtl"] .whatsapp-float {
    left: 30px;
    right: auto;
}

/* ─── Slider Arrows ──────────────────────── */
[dir="rtl"] .slider-arrow.prev {
    left: auto;
    right: 30px;
}

[dir="rtl"] .slider-arrow.next {
    right: auto;
    left: 30px;
}

/* ─── Mobile Menu ────────────────────────── */
@media (max-width: 991px) {
    [dir="rtl"] .navbar-menu {
        flex-direction: column;
        right: auto;
        left: -100%;
        transition: left 0.4s cubic-bezier(0.4, 0, 0.2, 1);
        box-shadow: 4px 0 24px rgba(0, 0, 0, 0.12);
        text-align: right;
    }

    [dir="rtl"] .navbar-menu.active {
        left: 0;
        right: auto;
    }

    [dir="rtl"] .navbar-menu li a:hover {
        padding-left: 12px;
        padding-right: 18px;
    }
}