/* ============================================================
   AppxSoft — RTL / LTR adjustments
   The design uses CSS logical properties, so both directions are
   covered by the same stylesheet. Only true asymmetries live here.
   ============================================================ */

/* Ensure the document direction is set even before [dir] on body */
html[dir="rtl"] body.customers {
    direction: rtl;
    text-align: start;
}

html[dir="ltr"] body.customers {
    direction: ltr;
    text-align: start;
}

/* Bootstrap 3 uses float:left on columns; bootstrap-arabic overrides it for
   RTL. Re-assert safe behavior for our own grid usages only. */
[dir="rtl"] .appx-nav-link,
[dir="rtl"] .appx-nav-count {
    text-align: start;
}

/* Dropdown language submenu: base rule uses logical inset-inline (auto-flips).
   Only the PHYSICAL Bootstrap fallbacks need an RTL mirror here —
   never re-assert inset-inline-* (that would cancel the logical flip). */
[dir="rtl"] .appx-profile .dropdown-submenu > .dropdown-menu {
    left: auto;
    right: 100%;
}

/* Arabic numerals & latin snippets inside Arabic text stay readable */
[dir="rtl"] .stats-numbers,
[dir="rtl"] .appx-stat-value {
    font-feature-settings: "kern";
}

/* RTL: toast stacks physical fallback (no-logical-properties
   browsers) — app dir is RTL, so stacks sit on the right
   (inline-start side). Modern browsers use inset-inline-start
   from appx-components.css and flip automatically.
   (Legacy .float-alert kept mirrored for the same reason.) */
[dir="rtl"] #appx-toasts {
    right: var(--appx-space-5);
    left: auto;
}
[dir="rtl"] .alert.float-alert {
    right: 20px;
    left: auto;
}
[dir="rtl"] .dataTables_wrapper .dataTables_filter {
    text-align: start;
}

[dir="rtl"] .dataTables_wrapper .dataTables_paginate {
    float: none;
    text-align: center;
}

/* RTL: breadcrumbs + directional icons follow reading direction.
   Bootstrap's "›" separator is LTR-only, so mirror it in RTL. */
[dir="rtl"] .breadcrumb {
    direction: rtl;
}

[dir="rtl"] .breadcrumb > li + li::before {
    content: "\2039";
}

[dir="rtl"] .fa-angle-right::before {
    content: "\f104";
}

[dir="rtl"] .fa-arrow-right::before {
    content: "\f060";
}

[dir="rtl"] .fa-arrow-left::before {
    content: "\f061";
}

/* RTL: keep flex truncation working (min-width:0) inside cards/tables */
[dir="rtl"] .appx-card-body,
[dir="rtl"] .appx-content {
    min-width: 0;
}