/* ============================================================
   ARABIC / RTL STYLES - TEXT ONLY (Navbar & Footer excluded)
   ============================================================ */

/* When language is Arabic - set RTL for text content only */
html[lang="ar"] {
    direction: ltr; /* Keep page direction LTR */
}

html[lang="ar"] body {
    direction: ltr; /* Keep body direction LTR */
    font-family: 'Cairo', 'Inter', system-ui, sans-serif !important;
}

/* Apply RTL to main content text only - EXCLUDING navbar and footer */
html[lang="ar"] main,
html[lang="ar"] section:not(#stickyNav):not(footer),
html[lang="ar"] .legal-card,
html[lang="ar"] #overview,
html[lang="ar"] #process,
html[lang="ar"] #projects,
html[lang="ar"] #cta,
html[lang="ar"] .process-en,
html[lang="ar"] .process-ar {
    direction: rtl;
}

html[lang="ar"] main *,
html[lang="ar"] section:not(#stickyNav):not(footer) *,
html[lang="ar"] .legal-card *,
html[lang="ar"] #overview *,
html[lang="ar"] #process *,
html[lang="ar"] #projects *,
html[lang="ar"] #cta *,
html[lang="ar"] .process-en *,
html[lang="ar"] .process-ar * {
    direction: rtl;
    text-align: right;
}

/* ===== HERO SECTION - CENTER TEXT ===== */
html[lang="ar"] #home .text-center {
    text-align: center !important;
}

html[lang="ar"] #home h1,
html[lang="ar"] #home h1 *,
html[lang="ar"] #home p,
html[lang="ar"] #home p *,
html[lang="ar"] #home .inline-block,
html[lang="ar"] #home .inline-block *,
html[lang="ar"] #home .max-w-4xl,
html[lang="ar"] #home .max-w-4xl * {
    direction: rtl !important;
    text-align: center !important;
}

/* Hero badge - center */
html[lang="ar"] #home .inline-flex {
    direction: rtl !important;
    text-align: center !important;
}

html[lang="ar"] #home .inline-flex span {
    direction: rtl !important;
    text-align: center !important;
}

/* ===== LEGAL CARDS ===== */
html[lang="ar"] .legal-card {
    direction: rtl;
    text-align: right;
}

html[lang="ar"] .legal-card h3 {
    text-align: right;
}

html[lang="ar"] .legal-card ul {
    padding-right: 1.5rem;
    padding-left: 0;
}

html[lang="ar"] .legal-card ul li {
    text-align: right;
}

/* Center the badge at bottom of legal cards */
html[lang="ar"] .legal-card .text-center,
html[lang="ar"] .legal-card .badge-legal {
    text-align: center !important;
}

/* ===== OVERVIEW SECTION ===== */
html[lang="ar"] #overview h2,
html[lang="ar"] #overview h2 *,
html[lang="ar"] #overview p,
html[lang="ar"] #overview p *,
html[lang="ar"] #overview .text-arch-stone,
html[lang="ar"] #overview .text-arch-light {
    direction: rtl !important;
    text-align: right !important;
}

/* ===== PROCESS SECTION ===== */
html[lang="ar"] #process h2,
html[lang="ar"] #process h2 *,
html[lang="ar"] #process p,
html[lang="ar"] #process p *,
html[lang="ar"] #process h4,
html[lang="ar"] #process h4 * {
    direction: rtl !important;
    text-align: right !important;
}

html[lang="ar"] #process .text-center {
    text-align: center !important;
}

html[lang="ar"] #process .text-center h2,
html[lang="ar"] #process .text-center h2 *,
html[lang="ar"] #process .text-center p,
html[lang="ar"] #process .text-center p * {
    text-align: center !important;
}

/* ===== PROJECTS SECTION ===== */
html[lang="ar"] #projects h2,
html[lang="ar"] #projects h2 *,
html[lang="ar"] #projects p,
html[lang="ar"] #projects p * {
    direction: rtl !important;
    text-align: right !important;
}

html[lang="ar"] #projects .text-center {
    text-align: center !important;
}

html[lang="ar"] #projects .text-center h2,
html[lang="ar"] #projects .text-center h2 *,
html[lang="ar"] #projects .text-center p,
html[lang="ar"] #projects .text-center p * {
    text-align: center !important;
}

/* ===== CTA SECTION ===== */
html[lang="ar"] #cta h2,
html[lang="ar"] #cta h2 *,
html[lang="ar"] #cta p,
html[lang="ar"] #cta p * {
    direction: rtl !important;
    text-align: right !important;
}

/* ===== MARGIN/PADDING ADJUSTMENTS FOR RTL TEXT ===== */
html[lang="ar"] .mr-2 { margin-right: 0 !important; margin-left: 0.5rem !important; }
html[lang="ar"] .mr-3 { margin-right: 0 !important; margin-left: 0.75rem !important; }
html[lang="ar"] .mr-4 { margin-right: 0 !important; margin-left: 1rem !important; }
html[lang="ar"] .ml-2 { margin-left: 0 !important; margin-right: 0.5rem !important; }
html[lang="ar"] .ml-3 { margin-left: 0 !important; margin-right: 0.75rem !important; }
html[lang="ar"] .ml-4 { margin-left: 0 !important; margin-right: 1rem !important; }

html[lang="ar"] .pl-5 { padding-left: 0 !important; padding-right: 1.25rem !important; }
html[lang="ar"] .pr-5 { padding-right: 0 !important; padding-left: 1.25rem !important; }

/* ===== BORDER ADJUSTMENTS FOR RTL ===== */
html[lang="ar"] .border-l-2 { border-left: none !important; border-right: 2px solid rgba(212, 180, 140, 0.4) !important; }
html[lang="ar"] .border-r-2 { border-right: none !important; border-left: 2px solid rgba(212, 180, 140, 0.4) !important; }
html[lang="ar"] .rounded-r-2xl { border-radius: 0 !important; border-radius: 16px 0 0 16px !important; }
html[lang="ar"] .rounded-l-2xl { border-radius: 0 !important; border-radius: 0 16px 16px 0 !important; }

/* ===== TIMELINE STEPS RTL ===== */
html[lang="ar"] .timeline-step {
    border-left: none !important;
    border-right: 2px solid rgba(212, 180, 140, 0.3) !important;
    padding-left: 0 !important;
    padding-right: 2rem !important;
}

html[lang="ar"] .step-number {
    left: auto !important;
    right: -22px !important;
}

/* ===== PROCESS ARABIC VERSION ===== */
html[lang="ar"] .process-ar .timeline-step-ar {
    border-right: 2px solid rgba(200, 155, 60, 0.3) !important;
    border-left: none !important;
    padding-right: 2.5rem !important;
    padding-left: 0 !important;
}

html[lang="ar"] .process-ar .step-number-ar {
    right: -21px !important;
    left: auto !important;
}

/* ===== BUTTONS AND LINKS IN CONTENT ===== */
html[lang="ar"] .legal-card a {
    direction: rtl;
}

/* ===== BADGE ===== */
html[lang="ar"] .badge-legal {
    direction: rtl;
}

/* ===== ARABIC-ONLY CONTENT ===== */
html[lang="ar"] .arabic-only-badge {
    display: inline-block !important;
}

/* ===== EXCLUDE NAVBAR AND FOOTER FROM RTL ===== */
html[lang="ar"] #stickyNav,
html[lang="ar"] #stickyNav *,
html[lang="ar"] nav,
html[lang="ar"] nav *,
html[lang="ar"] footer,
html[lang="ar"] footer *,
html[lang="ar"] #mainfooter,
html[lang="ar"] #mainfooter *,
html[lang="ar"] #bottomsection,
html[lang="ar"] #bottomsection * {
    direction: ltr !important;
    text-align: left !important;
}

/* Keep brand and logo LTR */
html[lang="ar"] .brand-protect,
html[lang="ar"] .brand-protect *,
html[lang="ar"] .brand-logo,
html[lang="ar"] .brand-main,
html[lang="ar"] .brand-arch-id,
html[lang="ar"] .brand-arch-id2,
html[lang="ar"] [data-translate="false"] {
    direction: ltr !important;
    text-align: left !important;
}

/* Nav links - keep LTR */
html[lang="ar"] nav a,
html[lang="ar"] nav span,
html[lang="ar"] nav button,
html[lang="ar"] nav .text-arch-light,
html[lang="ar"] nav .text-arch-secondary {
    direction: ltr !important;
    text-align: left !important;
}

/* Phone and WhatsApp buttons - keep LTR */
html[lang="ar"] nav a[href^="tel"],
html[lang="ar"] nav a[href^="https://wa.me"],
html[lang="ar"] nav .fa-phone-alt,
html[lang="ar"] nav .fa-whatsapp {
    direction: ltr !important;
}

/* Footer links - keep LTR */
html[lang="ar"] footer a,
html[lang="ar"] footer h4,
html[lang="ar"] footer p,
html[lang="ar"] footer ul,
html[lang="ar"] footer li {
    direction: ltr !important;
    text-align: left !important;
}

/* Footer addresses - keep LTR */
html[lang="ar"] footer .glass-card,
html[lang="ar"] footer .flex.items-start,
html[lang="ar"] footer .flex-1,
html[lang="ar"] footer .text-arch-stone {
    direction: ltr !important;
    text-align: left !important;
}

/* Footer address text - keep LTR */
html[lang="ar"] footer .text-arch-stone.text-xs.leading-relaxed {
    direction: ltr !important;
    text-align: left !important;
}

/* Footer bottom section - keep LTR */
html[lang="ar"] #bottomsection .flex,
html[lang="ar"] #bottomsection p,
html[lang="ar"] #bottomsection a {
    direction: ltr !important;
    text-align: left !important;
}