/* RTL Support for Arabic Language */

/* Global RTL Settings */
[dir="rtl"] {
    text-align: right;
    direction: rtl;
}

/* Typography */
[dir="rtl"] body {
    font-family: 'Cairo', 'Tajawal', 'Segoe UI', Tahoma, sans-serif;
}

/* Header and Navigation */
[dir="rtl"] .navbar-nav {
    margin-right: auto !important;
    margin-left: 0 !important;
}

[dir="rtl"] .navbar-nav .nav-item {
    margin-left: 20px;
    margin-right: 0;
}

[dir="rtl"] .navbar-nav .nav-item:last-child {
    margin-left: 0;
}

[dir="rtl"] .navbar-brand {
    margin-left: auto;
    margin-right: 0;
}

/* Dropdown Menu
   INVERTED until SUP-2026-0097: this said `right: auto; left: 0`, which IS
   Bootstrap's LTR default — so the "RTL override" restated the very thing it
   exists to reverse, and the Arabic menu anchored to its parent's LEFT edge and
   floated away from the item that opened it.
   Every other flip rule in this file was checked at the same time; this was the
   only one backwards. Pinned by tests/Site/RtlNavTest.php. */
[dir="rtl"] .dropdown-menu {
    text-align: right;
    right: 0;
    left: auto;
}

/* The SUBMENU caret drew TWICE (SUP-2026-0097): the theme supplies an IcoFont
   chevron via `content`, while Bootstrap's own triangle — made of BORDERS, not
   a glyph — was still painted underneath it. Measured: content "\f104" AND a
   5px solid border-top on the same pseudo-element, which is the stray dark mark
   on every row of the client's first screenshot. The glyph is the one we want,
   so those borders go.
   
   SCOPED TO THE SUBMENU ONLY, and that scope is the whole point. The TOP-LEVEL
   caret (.nav-item.dropdown, next to "الخدمات") has `content: ""` and IS its
   border triangle — style.css:461. My first attempt at this rule included it,
   which deleted the only arrow Arabic had: the client's second screenshot shows
   "الخدمات" with no arrow while the language switcher, a different selector,
   still had one. Never zero a border on a caret that has no glyph. */
[dir="rtl"] .dropdown-submenu > a.dropdown-toggle::after,
[dir="rtl"] .dropdown-submenu > .dropdown-toggle::after {
    border: 0;
}

/* Polish the panel itself — the client asked for it to look "طبيعي وكويس".
   One shape for both languages; only the anchoring differs. */
[dir="rtl"] .services-dropdown,
[dir="rtl"] .dropdown-submenu > .dropdown-menu {
    text-align: right;
}

[dir="rtl"] .language-dropdown {
    margin-left: 0;
    margin-right: 20px;
}

/* Forms */
[dir="rtl"] .form-group input,
[dir="rtl"] .form-control {
    text-align: right;
    direction: rtl;
}

[dir="rtl"] .form-group button[type="submit"] {
    left: 10px;
    right: auto;
}

/* Buttons */
[dir="rtl"] .btn {
    margin-left: 0;
    margin-right: 0;
}

[dir="rtl"] .btn_block .btn {
    margin-left: 0 !important;
}

/* Icons */
[dir="rtl"] .icofont-arrow-right::before {
    content: "\ea5c"; /* Left arrow */
}

[dir="rtl"] .icofont-arrow-left::before {
    content: "\ea5d"; /* Right arrow */
}

/* Lists */
[dir="rtl"] ul {
    padding-right: 0;
    padding-left: 20px;
}

[dir="rtl"] .feature_list li {
    text-align: right;
}

[dir="rtl"] .feature_list .icon {
    margin-left: 15px;
    margin-right: 0;
}

/* Cards and Boxes */
[dir="rtl"] .feature_box,
[dir="rtl"] .pannel_block,
[dir="rtl"] .steps_block {
    text-align: right;
}

/* Footer */
[dir="rtl"] footer .logo_side {
    text-align: right;
}

[dir="rtl"] footer .download_side {
    text-align: left;
}

[dir="rtl"] .social_media {
    padding-right: 0;
}

[dir="rtl"] .social_media li {
    margin-left: 10px;
    margin-right: 0;
}

[dir="rtl"] .social_media li:last-child {
    margin-left: 0;
}

/* Owl Carousel for RTL */
[dir="rtl"] .owl-carousel {
    direction: ltr;
}

[dir="rtl"] .owl-carousel .item {
    direction: rtl;
}

/* Counters and Statistics */
[dir="rtl"] .app_statstic li {
    text-align: right;
}

/* Service Section */
[dir="rtl"] .service_text {
    padding-right: 0;
    padding-left: 2rem;
}

[dir="rtl"] .service_text.right_side {
    padding-left: 0;
    padding-right: 2rem;
}

/* Newsletter */
[dir="rtl"] .news_letter form .form-group {
    position: relative;
}

[dir="rtl"] .news_letter form button {
    left: 0;
    right: auto;
}

/* App Buttons */
[dir="rtl"] .app_btn li {
    margin-left: 15px;
    margin-right: 0;
}

[dir="rtl"] .app_btn li:last-child {
    margin-left: 0;
}

/* Banner Section */
[dir="rtl"] .banner_text {
    text-align: right;
}

/* Flex Utilities */
[dir="rtl"] .flex-row-reverse {
    flex-direction: row !important;
}

/* Language Switcher Specific Styles */
.language-switcher {
    position: relative;
    display: inline-block;
}

.language-switcher .dropdown-toggle {
    background: transparent;
    border: 1px solid rgba(255, 255, 255, 0.3);
    color: #fff;
    padding: 8px 15px;
    border-radius: 25px;
    cursor: pointer;
    transition: all 0.3s;
    display: flex;
    align-items: center;
    gap: 8px;
}

.language-switcher .dropdown-toggle:hover {
    background: rgba(255, 255, 255, 0.1);
    border-color: rgba(255, 255, 255, 0.5);
}

.language-switcher .dropdown-menu {
    position: absolute;
    top: 100%;
    margin-top: 10px;
    background: #fff;
    border-radius: 10px;
    box-shadow: 0 5px 25px rgba(0, 0, 0, 0.15);
    padding: 10px 0;
    min-width: 150px;
    z-index: 1000;
    display: none;
}

.language-switcher .dropdown-menu.show {
    display: block;
}

.language-switcher .dropdown-item {
    padding: 10px 20px;
    color: #333;
    text-decoration: none;
    display: block;
    transition: all 0.3s;
    cursor: pointer;
}

.language-switcher .dropdown-item:hover {
    background: #f5f5f5;
    color: #7c3aed;
}

.language-switcher .dropdown-item.active {
    background: #7c3aed;
    color: #fff;
}

[dir="rtl"] .language-switcher .dropdown-menu {
    right: 0;
    left: auto;
}

/* Fixed Header Language Switcher */
header.fixed .language-switcher .dropdown-toggle {
    border-color: #333;
    color: #333;
}

header.fixed .language-switcher .dropdown-toggle:hover {
    background: rgba(0, 0, 0, 0.05);
    border-color: #000;
}

.how_it_inner .steps_block.step_border::after {
    content: "";
    position: absolute;
    right: calc(50% + 45px);
    left: auto;
    bottom: 20px;
    width: calc(100% - 60px);
    height: 1px;
    border-bottom: 1px dashed var(--dark-greay);
}

/* Policies and Articles Section */
[dir="rtl"] .our_resource {
    text-align: right;
    direction: rtl;
}

[dir="rtl"] .our_resource .container {
    direction: rtl;
}

[dir="rtl"] .our_resource .row {
    direction: rtl;
}

[dir="rtl"] .our_resource .section_title {
    text-align: right;
    direction: rtl;
}

[dir="rtl"] .our_resource .section_title .title_badge {
    display: inline-block;
    text-align: right;
}

[dir="rtl"] .articles_section {
    text-align: right;
    direction: rtl;
}

[dir="rtl"] .articles_section .container {
    direction: rtl;
}

[dir="rtl"] .blog_listings {
    direction: rtl;
}

[dir="rtl"] .blog_listings .listing_block {
    text-align: right;
    direction: rtl;
}

[dir="rtl"] .blog_listings .blog_text {
    text-align: right;
    direction: rtl;
}

[dir="rtl"] .blog_listings .blog_text h2 {
    text-align: right;
    direction: rtl;
}

[dir="rtl"] .blog_listings .blog_text h2 a {
    display: block;
    text-align: right;
}

[dir="rtl"] .blog_listings .blog_text > a {
    display: inline-block;
    text-align: right;
    direction: rtl;
}

[dir="rtl"] .blog_listings .blog_text a i {
    margin-left: 8px;
    margin-right: 0;
}

[dir="rtl"] .blog_listings .blog_info {
    direction: rtl;
    padding-right: 0;
    padding-left: 0;
    list-style: none;
    text-align: right;
}

[dir="rtl"] .blog_listings .blog_info li {
    display: inline-block;
    text-align: right;
}

[dir="rtl"] .blog_listings .authore_info {
    text-align: right;
    direction: rtl;
}

[dir="rtl"] .blog_listings .authore_info ul {
    padding-right: 0;
}

/* Blog Detail Section */
[dir="rtl"] .blog_detail_section {
    text-align: right;
    direction: rtl;
}

[dir="rtl"] .blog_detail_section .blog_head {
    text-align: right;
}

[dir="rtl"] .blog_detail_section .blog_head h1 {
    text-align: right;
    direction: rtl;
}

[dir="rtl"] .blog_detail_section .blog_info {
    direction: rtl;
    padding-right: 0;
    padding-left: 20px;
}

[dir="rtl"] .blog_detail_section .blog_info li {
    margin-left: 20px;
    margin-right: 0;
}

[dir="rtl"] .blog_detail_section .blog_info li:last-child {
    margin-left: 0;
}

[dir="rtl"] .blog_detail_section .blog_body {
    text-align: right;
    direction: rtl;
}

[dir="rtl"] .blog_detail_section .blog_body p,
[dir="rtl"] .blog_detail_section .blog_body h1,
[dir="rtl"] .blog_detail_section .blog_body h2,
[dir="rtl"] .blog_detail_section .blog_body h3,
[dir="rtl"] .blog_detail_section .blog_body h4,
[dir="rtl"] .blog_detail_section .blog_body h5,
[dir="rtl"] .blog_detail_section .blog_body h6 {
    text-align: right;
    direction: rtl;
}

[dir="rtl"] .blog_detail_section .blog_body ul,
[dir="rtl"] .blog_detail_section .blog_body ol {
    padding-right: 0;
    padding-left: 40px;
    text-align: right;
}

[dir="rtl"] .blog_detail_section .blog_body blockquote {
    border-left: none;
    border-right: 4px solid #ddd;
    padding-left: 0;
    padding-right: 20px;
    text-align: right;
}

/* Contact Section */
[dir="rtl"] .contact_section {
    text-align: right;
    direction: rtl;
}

[dir="rtl"] .contact_section .section_title {
    text-align: right;
}

[dir="rtl"] .contact_listing {
    direction: rtl;
}

[dir="rtl"] .contact_listing li {
    text-align: right;
    direction: rtl;
}

[dir="rtl"] .contact_listing li .icon {
    margin-left: 15px;
    margin-right: 0;
}

[dir="rtl"] .contact_listing li .lable {
    display: block;
    text-align: right;
}

/* Contact Form Section */
[dir="rtl"] .contact_form {
    direction: rtl;
}

[dir="rtl"] .contact_form .section_title {
    text-align: right;
}

[dir="rtl"] .contact_form .form-group {
    text-align: right;
}

[dir="rtl"] .contact_form input.form-control,
[dir="rtl"] .contact_form textarea.form-control {
    text-align: right;
    direction: rtl;
}

[dir="rtl"] .contact_form .btn_block {
    text-align: left;
}

[dir="rtl"] .contact_form .btn {
    margin-left: 0;
    margin-right: auto;
}

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

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

/* Alert Messages */
[dir="rtl"] .alert {
    text-align: right;
    direction: rtl;
}

[dir="rtl"] .alert ul {
    padding-right: 0;
    padding-left: 20px;
    text-align: right;
}

[dir="rtl"] .alert .close {
    float: left;
    margin-left: -20px;
    margin-right: 0;
}

/* Mobile Responsive */
@media (max-width: 768px) {
    [dir="rtl"] .navbar-toggler {
        margin-right: auto;
        margin-left: 0;
    }

    [dir="rtl"] .navbar-collapse {
        text-align: right;
    }
}
