/* RTL Support for Arabic Language */
body {
    direction: rtl;
    unicode-bidi: embed;
    font-family: 'Tajawal', 'Inter', sans-serif;
    /* Adding Tajawal for Arabic */
}

/* Flip Layouts */
.site-header__inner {
    flex-direction: row-reverse;
}

.main-navigation ul {
    padding-left: 0;
    padding-right: 0;
}

.hero-container {
    direction: rtl;
    /* If the grid was specific about left/right, we might need to swap columns, 
       but 1fr 1fr usually handles auto-placement fine. 
       Just ensuring visual flow matches reading direction. */
}

/* .section-title::after is already centered, no RTL override needed */

/* Flip text alignments if needed */
.text-left {
    text-align: right;
}

.text-right {
    text-align: left;
}

/* Flip margins/paddings */
.mr-auto {
    margin-left: auto;
    margin-right: 0;
}

.ml-auto {
    margin-right: auto;
    margin-left: 0;
}

/* Mobile Menu */
@media (max-width: 768px) {
    .main-navigation ul {
        text-align: right;
    }
}

/* =========================================
   RTL Fixes for New Sections
   ========================================= */

/* Timeline - Move border to right */
.timeline {
    border-left: none;
    border-right: 2px solid var(--color-border);
    padding-left: 0;
    padding-right: var(--spacing-lg);
}

.timeline__item::before {
    left: auto;
    right: calc(-1 * var(--spacing-lg) - 7px);
}

/* Contact Details */
.contact-details li {
    align-items: flex-start;
    /* Ensure items align to start (right in LTR, but we want generally natural flow) */
}

/* Pagination arrows */
.pagination .prev {
    /* Flip arrow content if using pseudo-elements, or rely on text replacement */
}

/* Sidebar Widgets */
.widget-title {
    text-align: right;
    /* Default is usually left/start, but explicit right helps if overriden */
}