/**
 * 阿拉伯语等 RTL 语言排版
 */
html[dir="rtl"],
html[dir="rtl"] body {
    direction: rtl;
}

html[dir="rtl"] body.site-body {
    text-align: right;
}

html[dir="rtl"] .site-nav-mobile-tools {
    margin-left: 0;
    margin-right: auto;
}

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

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

html[dir="rtl"] .site-menu > li > .nav-link-main,
html[dir="rtl"] .nav-dropdown-head {
    text-align: right;
}

html[dir="rtl"] .site-float-actions {
    right: auto;
    left: 0;
    border-radius: 0 12px 12px 0;
    border-right: 1px solid rgba(255, 255, 255, 0.22);
    border-left: none;
    box-shadow: 4px 8px 28px var(--el-color-primary-alpha-45);
}

html[dir="rtl"] .footer-col ul,
html[dir="rtl"] .site-menu,
html[dir="rtl"] .breadcrumb,
html[dir="rtl"] .pricing-features,
html[dir="rtl"] .help-sidebar-list {
    padding-right: 0;
    padding-left: 0;
}

html[dir="rtl"] .home-section-title.left,
html[dir="rtl"] .section-head.left,
html[dir="rtl"] .page-head-left {
    text-align: right;
}

html[dir="rtl"] .form-group label,
html[dir="rtl"] .control-label,
html[dir="rtl"] .pricing-card,
html[dir="rtl"] .market-card,
html[dir="rtl"] .news-card,
html[dir="rtl"] .help-article-body,
html[dir="rtl"] .checkout-panel,
html[dir="rtl"] .user-panel {
    text-align: right;
}

html[dir="rtl"] input:not([type="checkbox"]):not([type="radio"]),
html[dir="rtl"] textarea,
html[dir="rtl"] select,
html[dir="rtl"] .form-control {
    text-align: right;
}

html[dir="rtl"] .fa-angle-right,
html[dir="rtl"] .fa-angle-left,
html[dir="rtl"] .fa-chevron-right,
html[dir="rtl"] .fa-chevron-left,
html[dir="rtl"] .fa-long-arrow-right,
html[dir="rtl"] .fa-long-arrow-left,
html[dir="rtl"] .fa-arrow-right,
html[dir="rtl"] .fa-arrow-left {
    transform: scaleX(-1);
}

html[dir="rtl"] .lang-dropdown:hover .lang-dropdown-caret,
html[dir="rtl"] .lang-dropdown:focus-within .lang-dropdown-caret {
    transform: rotate(180deg) scaleX(-1);
}

html[dir="rtl"] .site-menu > li.has-dropdown:hover .nav-dropdown-toggle i,
html[dir="rtl"] .site-menu > li.has-dropdown.open .nav-dropdown-toggle i {
    transform: scaleX(-1);
}

@media (max-width: 768px) {
    html[dir="rtl"] .lang-dropdown-mobile .lang-dropdown-menu {
        right: auto;
        left: 0;
    }
}