/* ======================================================================
   RTL overrides for the Binduz template (originally built LTR).
   Load this file AFTER bootstrap.min.css, default.css and style.css.
   Keep this file additive: only fix directional properties that the
   original LTR stylesheets get wrong when the document is `dir="rtl"`.
   ====================================================================== */

html[dir="rtl"],
html[dir="rtl"] body {
    overflow-x: hidden;
    max-width: 100%;
}

html[dir="rtl"] body {
    direction: rtl;
    text-align: right;
    font-family: 'Cairo', 'Font Awesome 5 Pro', sans-serif;
}

/* Headings / titles should inherit the Arabic font too */
html[dir="rtl"] h1,
html[dir="rtl"] h2,
html[dir="rtl"] h3,
html[dir="rtl"] h4,
html[dir="rtl"] h5,
html[dir="rtl"] h6,
html[dir="rtl"] .binduz-er-title {
    font-family: 'Cairo', sans-serif;
}

/* Generic float flips used throughout the template */
html[dir="rtl"] .float-end {
    float: left !important;
}

html[dir="rtl"] .float-start {
    float: right !important;
}

html[dir="rtl"] .text-end {
    text-align: left !important;
}

html[dir="rtl"] .text-start {
    text-align: right !important;
}

/* Navbar / offcanvas menu */
html[dir="rtl"] .binduz-er-news-offcanvas_menu_wrapper {
    right: auto;
    left: 0;
    margin-right: 0;
    margin-left: -310px;
}

html[dir="rtl"] .binduz-er-news-offcanvas_menu_wrapper.binduz-er-news-active {
    margin-left: 0;
}

html[dir="rtl"] .navbar-nav {
    padding-right: 0;
}

html[dir="rtl"] .binduz-er-header-nav .navbar-brand.logo {
    margin-left: 0;
    margin-right: 0;
}

/* Header right-side icons (search toggle / offcanvas hamburger). The base
   stylesheet spaces these with margin-left/padding-left/border-left, which
   assumes LTR visual order; under dir="rtl" the flex row is mirrored so the
   gap needs to move to the opposite (right) side to look centred/even. */
html[dir="rtl"] .navbar .binduz-er-navbar-btn .binduz-er-widget a {
    margin-left: 0;
    margin-right: 20px;
    padding-left: 0;
    padding-right: 20px;
    border-left: 0;
    border-right: 1px solid #E0E0E0;
}

html[dir="rtl"] .navbar .binduz-er-navbar-btn .binduz-er-widget a:first-child {
    border-right: 0;
}

html[dir="rtl"] .navbar .binduz-er-navbar-btn .binduz-er-toggle-btn {
    margin-left: 0;
    margin-right: 20px;
}

/* Meta / icon spacing: the template uses left-margins next to icons,
   flip to right-margins so icon + text read naturally in RTL */
html[dir="rtl"] .binduz-er-meta-date i,
html[dir="rtl"] .binduz-er-meta-list i,
html[dir="rtl"] .fal,
html[dir="rtl"] .far,
html[dir="rtl"] .fas,
html[dir="rtl"] .fab {
    margin-left: 5px;
    margin-right: 0;
}

/* Author / post list items: thumb + content sit side by side */
html[dir="rtl"] .binduz-er-author-item,
html[dir="rtl"] .binduz-er-sidebar-latest-post-item {
    text-align: right;
}

/* Breadcrumb separators */
html[dir="rtl"] .binduz-er-breadcrumb-box ul li {
    float: right;
}

/* Pagination (Bootstrap 5 markup via Paginator::useBootstrapFive()).
   `.pagination` is a flex row; under dir="rtl" the browser already reverses
   the visual order of flex items, but Bootstrap's borders/radii and the
   negative overlap margin are written with physical left/right properties,
   so the "rounded first/last corner" and the border overlap end up on the
   wrong side. Mirror them explicitly. */
html[dir="rtl"] .pagination {
    padding-right: 0;
    justify-content: center;
}

html[dir="rtl"] .page-link {
    margin-left: 0;
    margin-right: -1px;
}

html[dir="rtl"] .page-item:first-child .page-link {
    margin-right: 0;
    border-top-left-radius: 0;
    border-bottom-left-radius: 0;
    border-top-right-radius: 0.25rem;
    border-bottom-right-radius: 0.25rem;
}

html[dir="rtl"] .page-item:last-child .page-link {
    border-top-right-radius: 0;
    border-bottom-right-radius: 0;
    border-top-left-radius: 0.25rem;
    border-bottom-left-radius: 0.25rem;
}

/* binduz-er-pagination wrapper used across public listing pages */
html[dir="rtl"] .binduz-er-pagination {
    text-align: center;
}

html[dir="rtl"] .binduz-er-pagination .pagination {
    display: inline-flex;
}

/* Footer widgets */
html[dir="rtl"] .binduz-er-footer-menu-list ul,
html[dir="rtl"] .binduz-er-copyright-menu {
    padding-right: 0;
    text-align: right;
}

html[dir="rtl"] .binduz-er-copyright-menu.float-lg-end {
    float: left !important;
}

/* Back to top button: mirror to the opposite corner */
html[dir="rtl"] .binduz-er-back-to-top {
    right: auto;
    left: 30px;
}

/* Form input icons (search / newsletter) */
html[dir="rtl"] .binduz-er-input-box i {
    left: auto;
    right: 20px;
}

html[dir="rtl"] .binduz-er-input-box input {
    padding-right: 45px;
    padding-left: 15px;
}

/* Tags / social share rows */
html[dir="rtl"] .binduz-er-social-share-tag {
    flex-direction: row-reverse;
}