/* RTL overrides for Arabic locales */
html[dir="rtl"] {
    width: 100%;
    max-width: 100%;
    overflow-x: hidden;
}

html[dir="rtl"] body {
    text-align: right;
    direction: rtl;
    overflow-x: hidden;
    width: 100%;
    max-width: 100%;
    position: relative;
    margin: 0 auto;
}

html[dir="rtl"] h2.current_issue_title.lead {
    letter-spacing: 0;
}

html[dir="rtl"] #mainContainer, .topHeader {
    width: 100%;
}

html[dir="rtl"] h2.headings {
    letter-spacing: 0;
}

html[dir="rtl"] 

html[dir="rtl"] .topHeader {
    float: right !important;
    width: 100%;
}

html[dir="rtl"] .mainNavigation {
    float: none !important;
    /*width: 100% !important;*/
    padding: 0 !important;
    background: transparent !important;
    height: auto;
    position: relative;
    z-index: 2;
}

html[dir="rtl"] #topMenuRight {
    float: left !important;
    text-align: right !important;
    padding-right: 0;
    padding-left: 15px;
    z-index: 10 !important;
    position: relative !important;
}

html[dir="rtl"] #topMenuRight .menu > li {
    float: right !important;
    border-right: none !important;
    border-left: 1px solid #fff;
}

html[dir="rtl"] #topMenuRight .fa {
    margin-right: 0 !important;
    margin-left: 4px !important;
}

/* Header and Navigation Structure */
html[dir="rtl"] .navbar-header {
    order: 2; /* Changed to push logo to the right */
    margin-left: 20px;
    margin-right: auto; /* Push everything else to the left */
}

/* Primary Menu Wrapper */
html[dir="rtl"] #primaryMenuWrp {
    display: flex;
    flex-direction: row; /* Changed from row-reverse to row */
    justify-content: space-between; /* Changed to space-between to separate elements */
    align-items: center;
    width: 100%;
    padding: 0 15px;
    box-sizing: border-box;
}

/* Main Navigation */
html[dir="rtl"] #main-navigation {
    margin: 0;
    padding: 0 20px 0 0;
    text-align: right;
    flex: 1;
    order: 0; /* Changed from 2 to 0 */
}

html[dir="rtl"] #main-navigation > ul {
    list-style: none;
    margin: 0;
    padding: 0;
    display: flex;
    justify-content: flex-end;
}

html[dir="rtl"] #main-navigation > ul > li {
    margin-left: 20px;
}



html[dir="rtl"] .pageTitleJrnlInfo {
    direction: rtl;
    text-align: right;
    background: linear-gradient(to left, rgba(0, 0, 0, 0.6), transparent); /* RTL direction */
}

html[dir="rtl"] .pageTitleJrnlInfo > span {
    direction: rtl;
    unicode-bidi: embed;
    display: inline-block;
    color: white;
}


/* Additional Links */
html[dir="rtl"] .additionalLinks {
    order: 99 !important;
    position: static !important;
    margin-left: 0 !important;
    margin-right: auto !important;
    z-index: 1 !important;
    text-align: left !important;
    display: flex;
    align-items: center;
    width: auto !important;
    flex: none !important;
    pointer-events: none;
    padding: 0 0 0 20px;
    white-space: nowrap;
}

html[dir="rtl"] .additionalLinks a {
    margin-left: 15px;
    text-decoration: none;
}

html[dir="rtl"] .additionalLinks a {
    margin-right: 0;
    margin-left: 15px;
}

html[dir="rtl"] .header-main nav .navbar-brand {
    float: right !important;
    margin-right: 0 !important;
    margin-left: 15px;
    background-position: right center !important;
}

/* Adjust dropdown menus for RTL */
html[dir="rtl"] .newDropDown ul {
    right: 0 !important;
    left: auto !important;
    text-align: right !important;
    min-width: 160px;
}

html[dir="rtl"] .newDropDown:hover ul {
    display: block;
    position: absolute;
    right: 0;
    left: auto;
}

/* Adjust breadcrumbs for RTL */
html[dir="rtl"] .breadcrumsWrpHD {
    float: right !important;
}

/* Adjust search and other elements */
html[dir="rtl"] .search-form .search-input {
    padding-right: 10px !important;
    padding-left: 40px !important;
}

/* Phone Verification RTL Styles */
html[dir="rtl"] .phone-verification {
    direction: rtl;
    display: flex;
    gap: 1;
    justify-content: flex-end;
}

html[dir="rtl"] .phone-verification input[type="tel"].form-control {
    direction: ltr; /* Keep numbers LTR */
    text-align: right;
    padding: 0.375rem 0.75rem;
    border-top-left-radius: 0 !important;
    border-bottom-left-radius: 0 !important;
    border-top-right-radius: 0.25rem !important;
    border-bottom-right-radius: 0.25rem !important;
    margin-right: -1px;
}

html[dir="rtl"] .phone-verification button {
    margin: 0;
    border-top-right-radius: 0 !important;
    border-bottom-right-radius: 0 !important;
    border-top-left-radius: 0.25rem !important;
    border-bottom-left-radius: 0.25rem !important;
    border-right: 1px solid rgba(0,0,0,0.1);
    order: -1; /* Move button to the left */
}

html[dir="rtl"] .phone-verification .btn-primary:hover,
html[dir="rtl"] .phone-verification .btn-primary:focus {
    z-index: 1;
    position: relative;
}

html[dir="rtl"] #otpStatus {
    text-align: right;
    direction: rtl;
}

/* OTP Popup RTL */
html[dir="rtl"] .otp-popup {
    text-align: right;
    direction: rtl;
}

html[dir="rtl"] .otp-buttons {
    justify-content: flex-start;
    flex-direction: row-reverse;
}

html[dir="rtl"] .otp-popup input[type="text"] {
    text-align: center;
    direction: ltr;
}

html[dir="rtl"] .verification-status {
    text-align: right;
    padding-right: 0.5rem;
}

html[dir="rtl"] .search-form .search-button {
    right: auto !important;
    left: 0 !important;
}

/* Adjust language toggle button */
html[dir="rtl"] .language-toggle {
    margin-left: 0 !important;
    margin-right: 10px !important;
}

/* Additional Links RTL - Positioned on the left */
html[dir="rtl"] .additionalLinks {
    order: 99 !important;
    position: static !important;
    margin-left: 0 !important;
    margin-right: auto !important;
    z-index: 1 !important;
    text-align: left !important;
    display: flex;
    align-items: center;
    width: auto !important;
    flex: none !important;
    pointer-events: none;
}
html[dir="rtl"] .additionalLinks a {
    pointer-events: auto;
}
html[dir="rtl"] #topMenuRight {
    z-index: 10 !important;
    position: relative !important;
    padding-left: 100px;
}

/* Remove any borders between links in RTL */
html[dir="rtl"] .additionalLinks a:not(:last-child) {
    border-left: 1px solid rgba(255, 255, 255, 0.2);
}

/* Main menu adjustments */
html[dir="rtl"] #primaryMenuWrp {
    position: relative;
    display: flex;
    align-items: center;
    z-index: 0 !important; /* Very low z-index so dropdown can appear above */
}

html[dir="rtl"] #main-navigation {
    position: relative;
    z-index: 2; /* Higher than additional links */
    flex: 1;
    padding-right: 0;
    padding-left: 0;
    margin-left: 0;
}

/* Ensure the additional links don't interfere with main menu clicks */
html[dir="rtl"] #main-navigation > li {
    position: relative;
    z-index: 3;
}

/* RTL layout for journal info components */
html[dir="rtl"] .journalInfoCol {
    direction: rtl;
    display: flex;
    flex-wrap: nowrap;
}

/* Add spacing between components */
html[dir="rtl"] .journalInfoCol > *:not(:last-child) {
    margin-left: 20px;
}

/* Ensure proper width for infojrnl */
html[dir="rtl"] .infojrnl {
    flex: 1;
}

/* Style for current issue info boxes */
html[dir="rtl"] .currentIssueInfo,
html[dir="rtl"] .currentIssueInfoAuthor {
    width: 200px; /* Adjust this to match your LTR width */
}

/* Simple RTL carousel flip */
html[dir="rtl"] .carousel-inner > .item {
    direction: ltr;
    text-align: right;
}

html[dir="rtl"] .carousel-inner > .item img {
    float: right;
    margin-left: 20px;
    margin-right: 0;
}

html[dir="rtl"] .carousel-indicators {
    right: 1;
	display: none;
}

/* Hide dropdown menu by default on mobile */
@media (max-width: 991px) {
    html[dir="rtl"] .dropdown-menu {
        display: none !important;
    }
    
    html[dir="rtl"] .mainNavigation .container {
        flex-direction: column;
        align-items: flex-start;
    }
    
    html[dir="rtl"] .navbar-header {
        width: 100%;
        text-align: right;
    }
    
    html[dir="rtl"] #primaryMenuWrp {
        width: 100%;
    }
    
    /* Show dropdown when parent has .open class */
    html[dir="rtl"] .open > .dropdown-menu {
        display: block !important;
    }
    
    /* Ensure proper dropdown positioning */
    html[dir="rtl"] .navbar-nav .open .dropdown-menu {
        position: absolute;
        float: right;
        right: 0;
        left: auto;
    }
}

/* RTL layout for article summary */
html[dir="rtl"] .article-summary.media {
    direction: rtl;
    text-align: right;
    border-left: none !important;
    border-right: 3px solid #777;
    padding-left: 0 !important;
    padding-right: 22px;
    margin-right: 0;
    margin-left: 0;
}

html[dir="rtl"] .article-summary.media .media-body {
    transform: scaleX(-1);
}

html[dir="rtl"] .article-summary.media .media-body > *:not(.galleryLinksWrp) {
    transform: scaleX(-1);
}

/* Gallery link text in issue table of contents */
html[dir="rtl"] .sections.issueTocPublishArticles .galleryLinksWrp .galley-link {
    display: inline-block;
    white-space: nowrap;
    padding: 4px;
}

html[dir="rtl"] .sections.issueTocPublishArticles .galleryLinksWrp .galley-link {
    transform: scaleX(-1);
}

/* RTL styling for View All Issues button */
html[dir="rtl"] .btn.read-more {
    direction: rtl;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    color: white !important;
}

html[dir="rtl"] .btn.read-more .glyphicon-chevron-right {
    transform: scaleX(-1);
    margin-right: 0;
    margin-left: 5px;
}

/* Twitter feed heading RTL */
html[dir="rtl"] .twitter-title {
    text-align: right;
    padding-right: 15px;
    margin-bottom: 15px;
    border-right: 3px solid #1DA1F2;
    border-left: none !important; /* Important to override other styles */
    padding-left: 0 !important; /* Remove left padding */
}

html[dir="rtl"] .context_optin .context_privacy {
    left: 9999px !important;
    right: auto !important;
    position: absolute !important;
}
html[dir="rtl"] .context_optin .context_privacy_visible {
    left: auto !important;
    right: 0 !important;
    position: relative !important;
}

html[dir="rtl"] .mainNavigation img {
    margin: 0px !important;
    max-height: 100px !important;
    max-height: 75px;
    padding-right: 100px;
}

html[dir="rtl"] #navigationUser {
    z-index: 999999 !important;
    position: absolute !important;
    border: 1px solid #ddd !important;
    box-shadow: 0 2px 10px rgba(0,0,0,0.1) !important;
    min-width: 200px !important;
    right: 0 !important;
    left: auto !important;
    top: 100% !important;
    display: none; /* Hidden by default */
}

html[dir="rtl"] .newDropDown:hover #navigationUser,
html[dir="rtl"] .newDropDown #navigationUser:hover,
html[dir="rtl"] .newDropDown.open #navigationUser {
    display: block !important; /* Show on hover */
    visibility: visible !important;
    opacity: 1 !important;
}

html[dir="rtl"] .newDropDown {
    position: relative !important;
    z-index: 999999 !important;
}


html[dir="rtl"] .fa {
    display: inline-block;
    font: normal normal normal 14px / 1 FontAwesome;
    font-size: inherit;
    text-rendering: auto;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    float: right;
}


html[dir="rtl"] #ann-more-link {
    margin-left: 0px;
    color: #c2491a;
    float: left !important;
}


html[dir="rtl"] .announcement-links {
    padding-right: 20px;
}

html[dir="rtl"] .announcement-shrt-dsc p {
    padding-right: 70px;
}

html[dir="rtl"] #ann-date {
    color: #777 !important;
    font-size: 14px !important;
    line-height: 19px;
    padding-right: 70px;
}

html[dir="rtl"] #newsslide {
    transform: scaleX(-1);
}

html[dir="rtl"] #newsslide *{
    transform: scaleX(-1);
    padding-right: 5px;
}

html[dir="rtl"] #newsslide-main *{
    transform: scaleX(-1);
}


[dir="rtl"] #latestnews-title::after,
[dir="rtl"] #newsarticle-title::after {
    border-left: none;
    border-right: 16px solid #ff6000;
    right: auto;
    left: -16px;
}


html[dir="rtl"] #newsslide-second{
    padding-right: 12px;
}

html[dir="rtl"] .bx-prev {
    font-size: 0;
}

html[dir="rtl"] .bx-next {
    font-size: 0;
}


html[dir="rtl"] #main-content {
    margin:12px;
}

html[dir="rtl"] legend {
    background: linear-gradient(to left, rgba(0, 0, 0, 0.6), transparent);
    padding: 6px;
    color: white;
}


html[dir="rtl"] .issueTocPublishArticles h2, .page-header h3, .page-header h1 {
    text-align: right;
}

.journals .media-list .nav-pills{margin-bottom: 10px; float: right; /*added*/}