/* Arabic Article CSS — Article pages only */

/* Arabic Article: body text */
html[dir="rtl"] .article-content,
html[dir="rtl"] .article-content p,
html[dir="rtl"] .article-content .story-text,
html[dir="rtl"] .article-content h1,
html[dir="rtl"] .article-content h2,
html[dir="rtl"] .article-content h3,
html[dir="rtl"] .article-content .story-title,
html[dir="rtl"] .article-content .story-heading,
html[dir="rtl"] .article-content .story-subtitle {
    font-family: 'Tajawal', sans-serif !important;
    font-style: normal !important;
    direction: rtl;
    text-align: right;
}

/* Arabic header */

html[dir="rtl"] .header {
    direction: ltr !important;
}

html[dir="rtl"] .header .logo {
    order: 1 !important;
}

html[dir="rtl"] .header nav {
    order: 2 !important;
    direction: rtl !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
}

html[dir="rtl"] .header .flags {
    order: 3 !important;
    direction: ltr !important;
}

html[dir="rtl"] .article-content em,
html[dir="rtl"] .article-content i {
    font-style: normal !important;
}

/* Arabic Article: remove the decorative opening letter */
html[dir="rtl"] .article-content .story-text p:first-of-type::first-letter {
    float: none !important;
    margin: 0 !important;
    font-size: inherit !important;
    line-height: inherit !important;
    font-family: 'Tajawal', sans-serif !important;
    color: inherit !important;
    padding: 0 !important;
}

html[dir="rtl"] .article-content .drop-cap,
html[dir="rtl"] .article-content .dropcap,
html[dir="rtl"] .article-content .first-letter {
    display: none !important;
    margin: 0 !important;
}

/* Arabic Article: move the hero text left */
html[dir="rtl"] .article-hero .hero-content,
html[dir="rtl"] .article-hero .article-hero-content,
html[dir="rtl"] .hero .hero-content {
    left: auto !important;
    right: 10% !important;
    transform: none !important;
    text-align: right !important;
}