/**
 * RTL 语言（阿拉伯语）特殊样式
 * 当 HTML 设置 dir="rtl" 时自动应用
 */

/* ==================== 基础 RTL 设置 ==================== */

[dir="rtl"] {
  direction: rtl;
}

/* ==================== 文本对齐 ==================== */

[dir="rtl"] .text-left {
  text-align: right;
}

[dir="rtl"] .text-right {
  text-align: left;
}

/* ==================== Header 导航 RTL ==================== */

[dir="rtl"] .header .logo {
  margin-right: 0;
  margin-left: auto;
}

[dir="rtl"] .nav-web {
  margin-right: auto;
  margin-left: 0;
}

[dir="rtl"] .nav-link span {
  border-right: none;
  border-left: 1px solid #dcdee2;
}

[dir="rtl"] .nav-item:last-child span {
  border-left: none;
}

/* 下拉菜单位置 */
[dir="rtl"] .nav-dropdown {
  right: auto;
  left: 0;
}

[dir="rtl"] .nav-dropdown.operation {
  right: auto;
  left: 84px;
}

/* 下拉菜单内部布局 */
[dir="rtl"] .nav-web .nav-dropdown-list {
  padding: 0 34px 0 10px;
}

[dir="rtl"] .nav-dropdown div {
  border-left: 1px solid #dddddd;
  border-right: none;
}

/* ==================== 移动端导航 RTL ==================== */

[dir="rtl"] .nav-mobile {
  flex-direction: row-reverse;
}

[dir="rtl"] .nav-mobile-menu {
  text-align: right;
}

[dir="rtl"] .nav-mobile-link::after {
  right: auto;
  left: 0;
  transform: translateY(-50%) scaleX(-1);
}

[dir="rtl"] .nav-mobile-list {
  padding: 10px 15px 10px 0;
}

[dir="rtl"] .nav-mobile-list img {
  margin-right: 0;
  margin-left: 8px;
}

[dir="rtl"] .nav-mobile-item .nav-dropdown-list {
  padding: 0 34px 0 10px;
}

/* 三角形箭头方向 */
[dir="rtl"] .suffix-triangle::after {
  right: auto;
  left: 0;
  border-left: 6px solid #515a6e;
  border-right: none;
}

/* ==================== 行业案例下拉菜单 RTL ==================== */

[dir="rtl"] #Navigation_content_service-test {
  right: auto;
  left: -8px;
}

[dir="rtl"] #Navigation_content_service-test li > span {
  margin-right: 0;
  margin-left: 5px;
}

/* ==================== 语言选择器 RTL ==================== */

[dir="rtl"] .language-selector {
  margin-right: 0;
  margin-left: 20px;
}

/* ==================== Banner RTL ==================== */

[dir="rtl"] .banner-content {
  text-align: right;
}

[dir="rtl"] .banner .buttonGroup {
  justify-content: flex-end;
}

/* ==================== 产品卡片 RTL ==================== */

[dir="rtl"] .product-card {
  text-align: right;
}

[dir="rtl"] .product-content img {
  margin-right: 0;
  margin-left: 12px;
}

/* ==================== 标题链接 RTL ==================== */

[dir="rtl"] .titlelink .main-box {
  flex-direction: row-reverse;
}

[dir="rtl"] .titlelink .main-box .page-link {
  justify-content: flex-start;
}

[dir="rtl"] .titlelink .main-box .page-link > span {
  margin-left: 0;
  margin-right: 1px;
}

/* ==================== 卡片组件 RTL ==================== */

[dir="rtl"] .card-box-component15 .card-title > span,
[dir="rtl"] .card-box-group22 .card-title > span {
  margin-right: 0;
  margin-left: 9px;
}

[dir="rtl"] .platform-positioning-card-group .title-box > img {
  margin-right: 0;
  margin-left: 25px;
}

[dir="rtl"] .platform-positioning-card-group .icon-box > img {
  margin-right: 0;
  margin-left: 0;
}

/* ==================== 组件 RTL ==================== */

[dir="rtl"] .component01 > img {
  margin-right: 0;
  margin-left: 15px;
}

/* ==================== Footer RTL ==================== */

[dir="rtl"] .footer-container {
  text-align: right;
}

/* ==================== 表单 RTL ==================== */

[dir="rtl"] input[type="text"],
[dir="rtl"] input[type="email"],
[dir="rtl"] input[type="tel"],
[dir="rtl"] textarea {
  text-align: right;
}

/* ==================== 按钮 RTL ==================== */

[dir="rtl"] .btn .icon {
  margin-left: 0;
  margin-right: 8px;
}

/* ==================== 列表 RTL ==================== */

[dir="rtl"] .marker li {
  padding-right: 20px;
  padding-left: 0;
}

/* ==================== 响应式 RTL ==================== */

@media only screen and (max-width: 1439px) {
  [dir="rtl"] .nav-dropdown.operation {
    right: auto;
    left: calc(50% - 550px);
  }
}

@media only screen and (max-width: 1099px) {
  [dir="rtl"] .nav-dropdown {
    right: auto;
    left: 0;
  }

  [dir="rtl"] .nav-web .nav-dropdown-list {
    padding: 0 28px 0 0;
  }

  [dir="rtl"] .nav-dropdown a {
    padding: 0 28px 0 59px;
  }

  [dir="rtl"] .header {
    padding: 0 24px;
  }

  [dir="rtl"] #Navigation_content_service-test {
    right: auto;
    left: -12px;
  }
}

@media only screen and (max-width: 767px) {
  [dir="rtl"] .header {
    padding: 0 12px;
  }

  [dir="rtl"] .nav-mobile {
    flex-direction: row-reverse;
  }

  [dir="rtl"] .nav-mobile-menu {
    margin: 0 6px;
  }

  [dir="rtl"] .nav-mobile-list {
    padding: 10px 0 10px 15px;
  }

  [dir="rtl"] .titlelink .main-box .title {
    display: none;
  }
}

/* ==================== 逻辑属性支持（推荐） ==================== */

/* 对于新代码，推荐使用 CSS 逻辑属性 */
/* margin-inline-start 替代 margin-left */
/* margin-inline-end 替代 margin-right */
/* padding-inline-start 替代 padding-left */
/* padding-inline-end 替代 padding-right */
/* border-inline-start 替代 border-left */
/* border-inline-end 替代 border-right */
/* text-align: start 替代 text-align: left */
/* text-align: end 替代 text-align: right */

/* ==================== RTL 特效 ==================== */

/* 需要水平翻转的图标/图片 */
[dir="rtl"] .icon-flip {
  transform: scaleX(-1);
}

/* 箭头图标翻转 */
[dir="rtl"] .arrow-left,
[dir="rtl"] .arrow-right {
  transform: scaleX(-1);
}

/* 分隔符翻转 */
[dir="rtl"] .separator-vertical {
  transform: scaleX(-1);
}

/* ==================== 阿拉伯语字体优化 ==================== */

[dir="rtl"] body {
  font-family: "Arial", "Tahoma", "Microsoft Sans Serif", sans-serif;
}

/* 阿拉伯语数字 */
[dir="rtl"] .arabic-numbers {
  font-feature-settings: "ss01" on;
}

/* ==================== 特殊组件 RTL ==================== */

/* 面包屑 */
[dir="rtl"] .breadcrumb li:not(:first-child)::before {
  content: "◀";
  margin-right: 0;
  margin-left: 8px;
}

/* 进度条 */
[dir="rtl"] .progress-bar {
  direction: ltr; /* 进度条通常保持从左到右 */
}

/* 滑块 */
[dir="rtl"] .slider {
  direction: ltr;
}

/* ==================== Flex 布局 RTL ==================== */

/* 需要保持方向的 flex 容器 */
[dir="rtl"] .flex-ltr {
  direction: ltr;
}

/* 需要反转的 flex 容器 */
[dir="rtl"] .flex-reverse {
  flex-direction: row-reverse;
}

/* ==================== Grid 布局 RTL ==================== */

/* Grid 布局会自动适应 RTL，通常不需要特殊处理 */

/* ==================== 动画 RTL ==================== */

/* 从右侧滑入 */
@keyframes slideInFromRight {
  from {
    transform: translateX(100%);
  }
  to {
    transform: translateX(0);
  }
}

[dir="rtl"] .slide-in {
  animation: slideInFromRight 0.3s ease-out;
}
