/* ============================================================
   Open Vista — RTL overrides for Arabic — 2026-10-20
   Loaded only when the active language is Arabic (head.tpl).
   The document direction itself comes from <html dir="rtl">.
   ============================================================ */
html[dir="rtl"] body,
html[dir="rtl"] .ov-page-home,
html[dir="rtl"] #ov-store-cloudvps,
html[dir="rtl"] #ov-store-freelancepro {
    font-family: 'Cairo', 'Segoe UI', Tahoma, 'Noto Kufi Arabic', sans-serif;
    text-align: right;
}
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"] h1, html[dir="rtl"] h2,
html[dir="rtl"] h3, html[dir="rtl"] h4, html[dir="rtl"] h5, html[dir="rtl"] h6,
html[dir="rtl"] .ov-hero-title, html[dir="rtl"] .ov-section-title,
html[dir="rtl"] .ov-category-title, html[dir="rtl"] .ov-card-name,
html[dir="rtl"] .navbar-brand {
    font-family: 'Cairo', 'Segoe UI', Tahoma, 'Noto Kufi Arabic', sans-serif;
    letter-spacing: 0;
}

/* ---------- Bootstrap 4 direction-sensitive utilities ---------- */
html[dir="rtl"] .ml-auto { margin-left: 0 !important; margin-right: auto !important; }
html[dir="rtl"] .mr-auto { margin-right: 0 !important; margin-left: auto !important; }
html[dir="rtl"] .ml-0 { margin-left: 0 !important; margin-right: 0 !important; }
html[dir="rtl"] .mr-0 { margin-right: 0 !important; margin-left: 0 !important; }
html[dir="rtl"] .ml-1 { margin-left: 0 !important; margin-right: .25rem !important; }
html[dir="rtl"] .mr-1 { margin-right: 0 !important; margin-left: .25rem !important; }
html[dir="rtl"] .ml-2 { margin-left: 0 !important; margin-right: .5rem !important; }
html[dir="rtl"] .mr-2 { margin-right: 0 !important; margin-left: .5rem !important; }
html[dir="rtl"] .ml-3 { margin-left: 0 !important; margin-right: 1rem !important; }
html[dir="rtl"] .mr-3 { margin-right: 0 !important; margin-left: 1rem !important; }
html[dir="rtl"] .ml-4 { margin-left: 0 !important; margin-right: 1.5rem !important; }
html[dir="rtl"] .mr-4 { margin-right: 0 !important; margin-left: 1.5rem !important; }
html[dir="rtl"] .ml-5 { margin-left: 0 !important; margin-right: 3rem !important; }
html[dir="rtl"] .mr-5 { margin-right: 0 !important; margin-left: 3rem !important; }
html[dir="rtl"] .pl-1 { padding-left: 0 !important; padding-right: .25rem !important; }
html[dir="rtl"] .pr-1 { padding-right: 0 !important; padding-left: .25rem !important; }
html[dir="rtl"] .pl-2 { padding-left: 0 !important; padding-right: .5rem !important; }
html[dir="rtl"] .pr-2 { padding-right: 0 !important; padding-left: .5rem !important; }
html[dir="rtl"] .pl-3 { padding-left: 0 !important; padding-right: 1rem !important; }
html[dir="rtl"] .pr-3 { padding-right: 0 !important; padding-left: 1rem !important; }
html[dir="rtl"] .pl-4 { padding-left: 0 !important; padding-right: 1.5rem !important; }
html[dir="rtl"] .pr-4 { padding-right: 0 !important; padding-left: 1.5rem !important; }
html[dir="rtl"] .float-right { float: left !important; }
html[dir="rtl"] .float-left { float: right !important; }
html[dir="rtl"] .text-left { text-align: right !important; }
html[dir="rtl"] .text-right { text-align: left !important; }
html[dir="rtl"] .dropdown-menu-right { right: auto; left: 0; }
html[dir="rtl"] .dropdown-item { text-align: right; }
html[dir="rtl"] .custom-select {
    background-position: left .75rem center;
    padding-right: .75rem;
    padding-left: 2.25rem;
}
html[dir="rtl"] .input-group > .form-control:not(:last-child),
html[dir="rtl"] .input-group > .custom-select:not(:last-child) { border-radius: 0 .25rem .25rem 0; }
html[dir="rtl"] .input-group > .input-group-prepend > .btn,
html[dir="rtl"] .input-group > .input-group-prepend > .input-group-text { border-radius: .25rem 0 0 .25rem; }
html[dir="rtl"] .input-group > .input-group-append > .btn,
html[dir="rtl"] .input-group > .input-group-append > .input-group-text { border-radius: 0 .25rem .25rem 0; }
html[dir="rtl"] .list-inline-item:not(:last-child) { margin-right: 0; margin-left: .5rem; }
html[dir="rtl"] .breadcrumb-item + .breadcrumb-item { padding-left: 0; padding-right: .5rem; }
html[dir="rtl"] .breadcrumb-item + .breadcrumb-item::before {
    display: inline-block; padding-right: 0; padding-left: .5rem;
    content: "/"; transform: scaleX(-1);
}
html[dir="rtl"] .fa-arrow-right, html[dir="rtl"] .fa-arrow-left,
html[dir="rtl"] .fa-chevron-right, html[dir="rtl"] .fa-chevron-left,
html[dir="rtl"] .fa-angle-right, html[dir="rtl"] .fa-angle-left,
html[dir="rtl"] .fa-external-link-alt { transform: scaleX(-1); }
html[dir="rtl"] .ov-card-name-link .fa-arrow-right,
html[dir="rtl"] .ov-pcard-link i { transform: scaleX(-1); }

/* ---------- Header / navigation ---------- */
html[dir="rtl"] #header .navbar-brand { margin-right: 0 !important; margin-left: 1rem; }
html[dir="rtl"] #header .navbar-nav .nav-link { text-align: right; }
html[dir="rtl"] #header .navbar-nav.toolbar { flex-direction: row-reverse; }
html[dir="rtl"] .main-navbar-wrapper .navbar-nav { padding-right: 0; }
html[dir="rtl"] .dropdown-toggle::after { margin-left: 0; margin-right: .255em; }
html[dir="rtl"] .dropdown-menu { text-align: right; }
html[dir="rtl"] .topbar .mr-auto { margin-right: 0 !important; margin-left: auto !important; }

/* ---------- Custom OpenVista components ---------- */
html[dir="rtl"] .ov-hero, html[dir="rtl"] .ov-hero-inner,
html[dir="rtl"] .ov-section, html[dir="rtl"] .ov-section-head,
html[dir="rtl"] .ov-cta-band, html[dir="rtl"] .ov-final { text-align: right; }
html[dir="rtl"] .ov-hero-actions, html[dir="rtl"] .ov-hero-chips,
html[dir="rtl"] .ov-chips, html[dir="rtl"] .ov-final-cta { justify-content: flex-start; }
html[dir="rtl"] .ov-hero-chips, html[dir="rtl"] .ov-chips { padding-right: 0; }
html[dir="rtl"] .ov-global-points { padding-right: 1.2rem; }
html[dir="rtl"] .ov-category-head, html[dir="rtl"] .ov-card,
html[dir="rtl"] .ov-stat, html[dir="rtl"] .ov-dc-card,
html[dir="rtl"] .ov-included-item, html[dir="rtl"] .ov-faq-list details { text-align: right; }
html[dir="rtl"] .ov-price, html[dir="rtl"] .ov-card-cta { justify-content: flex-start; }
html[dir="rtl"] .ov-card-cta { flex-direction: row-reverse; }
html[dir="rtl"] .ov-footnote, html[dir="rtl"] .ov-login-note { text-align: right; }
html[dir="rtl"] .ov-faq-list summary { padding-right: 0; padding-left: 1.5rem; }
html[dir="rtl"] .ov-faq-list summary::after { right: auto; left: 0; }
html[dir="rtl"] .ov-pcard, html[dir="rtl"] .ov-tile { text-align: right; }
html[dir="rtl"] .ov-pcard-link, html[dir="rtl"] .ov-tile-label { direction: rtl; }

/* ---------- Footer ---------- */
html[dir="rtl"] .ov-footer { text-align: right; }
html[dir="rtl"] .ov-footer .ov-f-list { padding-right: 0; }
html[dir="rtl"] .ov-footer .ov-f-list i { margin-left: .5rem; margin-right: 0; }
html[dir="rtl"] .ov-footer-bottom { flex-direction: row-reverse; }

/* ---------- Sidebars, content, tables, forms ---------- */
html[dir="rtl"] .sidebar { text-align: right; }
html[dir="rtl"] .sidebar .list-group-item { text-align: right; }
html[dir="rtl"] .table th, html[dir="rtl"] .table td { text-align: right; }
html[dir="rtl"] .form-check { padding-left: 0; padding-right: 1.25rem; }
html[dir="rtl"] .form-check-input { margin-left: 0; margin-right: -1.25rem; }
html[dir="rtl"] .custom-control { padding-left: 0; padding-right: 1.5rem; }
html[dir="rtl"] .custom-control-label::before,
html[dir="rtl"] .custom-control-label::after { left: auto; right: -1.5rem; }
html[dir="rtl"] .alert { text-align: right; }
html[dir="rtl"] .card { text-align: right; }
html[dir="rtl"] .pagination { direction: ltr; }
html[dir="rtl"] .modal { text-align: right; }
html[dir="rtl"] .close { float: left; }
html[dir="rtl"] .nav-tabs .nav-link { text-align: right; }
html[dir="rtl"] .progress { direction: ltr; }
html[dir="rtl"] code, html[dir="rtl"] pre, html[dir="rtl"] .ov-lang-switch { direction: ltr; unicode-bidi: embed; }
html[dir="rtl"] .ov-specs { padding-right: 1.1rem; }
html[dir="rtl"] .ov-specs li::marker { unicode-bidi: plaintext; }

/* Long brand/technical strings inside Arabic sentences stay LTR */
html[dir="rtl"] .ov-price-amount, html[dir="rtl"] .ov-price-alt,
html[dir="rtl"] .ov-licence-logo { direction: ltr; }