/*
 * MEI Theme — RTL Stylesheet v3.0
 * Arabic / Right-to-Left overrides with full mobile support
 * ================================================ */

/* ================================================
   BASE DIRECTION
   ================================================ */

body {
    direction: rtl;
    text-align: right;
}


/* ================================================
   ARABIC TYPOGRAPHY
   ================================================ */

body,
.mei-article-content,
.mei-story-excerpt,
.mei-lead-excerpt,
.mei-card-excerpt,
.mei-archive-item-excerpt,
.mei-footer-about,
.mei-footer-newsletter-text {
    font-family: 'Noto Sans Arabic', 'Source Sans 3', sans-serif;
}

h1, h2, h3, h4, h5, h6,
.mei-site-title,
.mei-article-title,
.mei-lead-title,
.mei-story-title,
.mei-card-title,
.mei-sidebar-title,
.mei-archive-item-title,
.mei-archive-title,
.mei-page-title {
    font-family: 'Amiri', 'Playfair Display', Georgia, serif;
}


/* ================================================
   TICKER BAR
   ================================================ */

.mei-ticker-label {
    padding-right: 0;
    padding-left: 12px;
    border-right: none;
    border-left: 1px solid #2a3a50;
}

.mei-lang-toggle {
    padding-left: 0;
    padding-right: 14px;
    border-left: none;
    border-right: 1px solid #2a3a50;
}


/* ================================================
   HEADER
   ================================================ */

.mei-masthead {
    text-align: center;
}

.mei-header-top {
    direction: rtl;
}


/* ================================================
   NAVIGATION
   ================================================ */

.mei-nav-menu {
    justify-content: center;
}

/* Submenu drops from right in RTL */
.mei-nav-menu li ul {
    left: auto;
    right: 0;
}


/* ================================================
   3-COLUMN GRID — flip padding/borders
   ================================================ */

.mei-col-main {
    padding-right: 0;
    padding-left: 24px;
    border-right: none;
    border-left: 1px solid var(--mei-border);
}

.mei-col-sidebar {
    padding-left: 0;
    padding-right: 24px;
    border-left: none;
    border-right: 1px solid var(--mei-border);
}


/* ================================================
   4-COLUMN GRID — flip card borders
   ================================================ */

.mei-card {
    border-right: none;
    border-left: 1px solid var(--mei-border-light);
    padding-right: 0;
    padding-left: 20px;
}

.mei-card:last-child {
    border-left: none;
    padding-left: 0;
}


/* ================================================
   LEAD STORY
   ================================================ */

.mei-lead-image::after {
    left: auto;
    right: 0;
}


/* ================================================
   HOMEPAGE AD — RTL adjustments
   ================================================ */

.mei-ad-desc {
    font-family: 'Noto Sans Arabic', 'Source Sans 3', sans-serif;
}

.mei-ad-title {
    font-family: 'Noto Sans Arabic', 'Source Sans 3', sans-serif;
}


/* ================================================
   SIDEBAR STORIES — flip thumbnail position
   ================================================ */

.mei-sidebar-story {
    flex-direction: row-reverse;
}


/* ================================================
   ARTICLE CONTENT
   ================================================ */

.mei-article-header {
    text-align: right;
}

.mei-article-meta {
    text-align: right;
}

/* Arabic body text — more generous line-height for Arabic script */
.mei-article-content {
    line-height: 2;
}

.mei-article-content p {
    margin-bottom: 1.6rem;
}

/* Arabic subtitle needs more breathing room */
.mei-article-subtitle {
    line-height: 1.7;
}

/* Drop cap — disable in RTL (Arabic doesn't use drop caps) */
.mei-article-content > p:first-child::first-letter {
    float: none;
    font-size: inherit;
    margin: 0;
    color: inherit;
}

/* Blockquotes — border on right side */
.mei-article-content blockquote {
    border-left: none;
    border-right: 3px solid var(--mei-gold);
    padding: 16px 16px 16px 24px;
}

.mei-article-content blockquote::before {
    left: auto;
    right: 10px;
}

/* Lists — margin on right */
.mei-article-content ul,
.mei-article-content ol {
    margin: 0 1.5rem 1.4rem 0;
}

/* Article content headings — Arabic serif needs line-height adjustment */
.mei-article-content h2,
.mei-article-content h3 {
    line-height: 1.4;
}


/* ================================================
   TAGS — RTL flow
   ================================================ */

.mei-tags-label {
    margin-right: 0;
    margin-left: 8px;
}

.mei-tag {
    margin: 2px 0 2px 4px;
}

.mei-article-tags {
    text-align: right;
}


/* ================================================
   AUTHOR BIO — flip avatar position
   ================================================ */

.mei-author-bio {
    flex-direction: row-reverse;
    text-align: right;
}

.mei-author-info {
    text-align: right;
}


/* ================================================
   ARCHIVE LAYOUT
   ================================================ */

.mei-archive-lead {
    direction: rtl;
}


/* ================================================
   SEARCH OVERLAY
   ================================================ */

.mei-search-close {
    right: auto;
    left: 0;
}

.mei-search-box input[type="search"] {
    text-align: right;
}


/* ================================================
   FOOTER
   ================================================ */

.mei-footer-links {
    direction: ltr;
}

.mei-footer-bottom-inner {
    direction: rtl;
}

.mei-footer-grid {
    direction: rtl;
}

.mei-footer-menu {
    text-align: right;
}


/* ================================================
   PAGINATION
   ================================================ */

.mei-pagination {
    direction: rtl;
}

/* See all arrow */
.mei-see-all {
    direction: ltr;
}

/* Geometric divider */
.mei-category-section + .mei-category-section::before {
    content: '◇ ◇ ◇';
}


/* ================================================
   RESPONSIVE — TABLET (max 1024px)
   ================================================ */

@media (max-width: 1024px) {
    .mei-col-main {
        padding-left: 20px;
    }
}


/* ================================================
   RESPONSIVE — MOBILE (max 768px)
   Page-level RTL overrides only (grids, nav, footer).
   Article structure is identical to desktop.
   ================================================ */

@media (max-width: 768px) {

    /* Grid columns — remove all borders/padding when stacked */
    .mei-col-main {
        padding-left: 0;
        border-left: none;
    }

    .mei-col-sidebar {
        padding-right: 0;
        border-right: none;
    }

    /* Sidebar stories — stack vertically on small screens */
    .mei-sidebar-story {
        flex-direction: column;
    }

    /* Cards — remove side borders, use bottom borders */
    .mei-card {
        border-left: none;
        padding-left: 0;
        border-bottom: 1px solid var(--mei-border-light);
        padding-bottom: 16px;
    }

    .mei-card:last-child {
        border-bottom: none;
    }

    /* Archive lead — single column */
    .mei-archive-lead {
        grid-template-columns: 1fr;
    }

    /* Mobile nav — right align items */
    .mei-nav-menu {
        align-items: stretch;
        text-align: right;
    }

    .mei-nav-menu li a {
        text-align: right;
        justify-content: flex-end;
    }

    /* Footer stacks — center on mobile */
    .mei-footer-bottom-inner {
        text-align: center;
    }

    .mei-footer-menu {
        text-align: center;
    }

    /* Search overlay adjustments */
    .mei-search-close {
        left: 0;
        right: auto;
    }

    /* Ticker */
    .mei-ticker-label {
        padding-left: 8px;
    }
}