/* RTL overrides for Arabic. With dir="rtl" on <html>, flex rows already
   flow right-to-left, so we must NOT force flex-direction:row-reverse
   (that flips them back to left-to-right). These rules keep the layout
   right-aligned and let the longer Arabic menu wrap tidily. */
body.rtl{direction:rtl;text-align:right;font-family:'Segoe UI',Tahoma,'Noto Naskh Arabic',Arial,sans-serif}

/* Navigation: natural RTL order (first item on the right), allow wrapping
   so the extra menu items never overflow or overlap. */
.rtl .main-nav ul{flex-wrap:wrap;justify-content:flex-end;gap:2px}
.rtl .main-nav a{font-size:.9rem;padding:10px 11px}

/* Keep hero and centered sections centered. */
.rtl .hero,.rtl .section-title,.rtl .section-sub{text-align:center}
.rtl .hero-cta,.rtl .filter-bar,.rtl .tabs{justify-content:center}

/* Content blocks and their buttons align to the right. */
.rtl .card .card-body{text-align:right}
.rtl .cms-content{text-align:right}
.rtl .panel{text-align:right}
.rtl .site-main .container{text-align:right}

.rtl .event-meta{flex-direction:row-reverse}
.rtl .footer-grid{direction:rtl}

@media(max-width:720px){
  .rtl .main-nav ul{flex-direction:column;align-items:stretch}
}
