/* rtl.css — 阿拉伯语专用 RTL 补丁
 * 仅在 /ar/ 目录下加载, 覆盖主站 styles.css 的方向规则
 * 不影响其他 11 种语言 */

/* ============================================================
   基础方向 & 字体
   ============================================================ */
html[dir="rtl"] body {
  direction: rtl;
  text-align: right;
  /* Cairo / Tajawal / Noto Naskh Arabic — 常用阿语 web 字体 */
  font-family: 'Tajawal', 'Cairo', 'Segoe UI', Tahoma, 'Arial Unicode MS', sans-serif;
  font-size: 16.5px; /* 阿语字符略大更易读 */
}

/* 数字和英文代号保持 LTR（产品型号、尺寸、公司名等） */
html[dir="rtl"] .ltr,
html[dir="rtl"] code,
html[dir="rtl"] .logo-text,
html[dir="rtl"] .pcard-meta,
html[dir="rtl"] .topbar-inner span {
  direction: ltr;
  unicode-bidi: embed;
}

/* ============================================================
   Topbar
   ============================================================ */
html[dir="rtl"] .topbar-inner {
  flex-direction: row-reverse;
}

/* ============================================================
   Header / Navigation
   ============================================================ */
html[dir="rtl"] .header-inner {
  flex-direction: row-reverse;
}

html[dir="rtl"] .mainnav ul {
  flex-direction: row-reverse;
}

html[dir="rtl"] .mainnav .dropdown {
  right: 0;
  left: auto;
  text-align: right;
}

html[dir="rtl"] .logo {
  flex-direction: row-reverse;
}

html[dir="rtl"] .logo-icon {
  margin-left: 10px;
  margin-right: 0;
}

/* ============================================================
   Hero
   ============================================================ */
html[dir="rtl"] .hero-inner {
  flex-direction: row-reverse;
}

html[dir="rtl"] .hero-btns {
  flex-direction: row-reverse;
  justify-content: flex-start;
}

html[dir="rtl"] .hero-stats {
  flex-direction: row-reverse;
  padding: 0;
}

html[dir="rtl"] .hero-stats li {
  text-align: right;
  border-left: none;
  border-right: 1px solid rgba(255,255,255,0.15);
  padding-right: 20px;
  padding-left: 0;
}

html[dir="rtl"] .hero-stats li:first-child {
  border-right: none;
  padding-right: 0;
}

/* ============================================================
   Trust strip (flags)
   ============================================================ */
html[dir="rtl"] .trust-flags {
  flex-direction: row-reverse;
}

/* ============================================================
   Sections & Grids
   ============================================================ */
html[dir="rtl"] .section-head {
  text-align: right;
}

html[dir="rtl"] .section-head.light {
  text-align: right;
}

/* 产品网格和应用网格 — 保持 grid 但条目内部右对齐 */
html[dir="rtl"] .product-grid .pcard,
html[dir="rtl"] .app-grid .app-card,
html[dir="rtl"] .feat,
html[dir="rtl"] .app-card {
  text-align: right;
}

html[dir="rtl"] .pcard-link {
  direction: rtl;
}

/* 翻转箭头方向 */
html[dir="rtl"] .pcard-link::after,
html[dir="rtl"] a.btn::after {
  transform: scaleX(-1);
}

/* ============================================================
   CTA strip
   ============================================================ */
html[dir="rtl"] .cta-inner {
  flex-direction: row-reverse;
  text-align: right;
}

/* ============================================================
   Page Header & Breadcrumb
   ============================================================ */
html[dir="rtl"] .page-header-inner,
html[dir="rtl"] .app-hero-inner {
  text-align: right;
}

html[dir="rtl"] .app-hero-inner {
  flex-direction: row-reverse;
}

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

/* ============================================================
   Product detail page
   ============================================================ */
html[dir="rtl"] .product-layout {
  direction: rtl;
}

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

html[dir="rtl"] .pd-highlights {
  flex-direction: row-reverse;
}

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

html[dir="rtl"] .pd-gallery-grid {
  direction: rtl;
}

html[dir="rtl"] .callout {
  text-align: right;
  border-left: none;
  border-right: 4px solid var(--accent, #E87722);
  padding-left: 20px;
  padding-right: 24px;
}

/* ============================================================
   Spec tables & Data tables
   ============================================================ */
html[dir="rtl"] .spec-table td,
html[dir="rtl"] .spec-table th {
  text-align: right;
}

html[dir="rtl"] .data-table td,
html[dir="rtl"] .data-table th {
  text-align: right;
}

/* 数字列保持 LTR 对齐（让 "5,653 m³/h" 正确显示） */
html[dir="rtl"] .data-table td:not(:first-child),
html[dir="rtl"] .data-table th:not(:first-child) {
  direction: ltr;
  unicode-bidi: embed;
  text-align: center;
}

/* ============================================================
   Contact page
   ============================================================ */
html[dir="rtl"] .contact-grid {
  direction: rtl;
}

html[dir="rtl"] .contact-list li {
  flex-direction: row-reverse;
  text-align: right;
}

html[dir="rtl"] .contact-ico {
  margin-left: 14px;
  margin-right: 0;
}

html[dir="rtl"] .contact-form label {
  text-align: right;
}

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

/* 邮箱和电话输入框保持 LTR（符合国际惯例） */
html[dir="rtl"] .contact-form input[type="email"],
html[dir="rtl"] .contact-form input[type="tel"] {
  direction: ltr;
  text-align: left;
}

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

html[dir="rtl"] .footer-grid > div {
  text-align: right;
}

html[dir="rtl"] .fmenu {
  padding: 0;
}

html[dir="rtl"] .footer-bar {
  text-align: center;
}

/* ============================================================
   Buttons & Links — arrow direction fix
   ============================================================ */
html[dir="rtl"] a[href]::after {
  /* 让形如 "→" 的箭头变成 "←" */
}

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

/* ============================================================
   Dropdown menu
   ============================================================ */
html[dir="rtl"] .has-drop .dropdown {
  right: 0;
  left: auto;
  text-align: right;
}

/* ============================================================
   Burger menu (mobile)
   ============================================================ */
html[dir="rtl"] .burger {
  margin-left: 0;
  margin-right: auto;
}

/* ============================================================
   Lightbox
   ============================================================ */
html[dir="rtl"] .lightbox-close {
  right: auto;
  left: 20px;
}

html[dir="rtl"] .lightbox-prev {
  left: auto;
  right: 20px;
  transform: translateY(-50%) scaleX(-1);
}

html[dir="rtl"] .lightbox-next {
  right: auto;
  left: 20px;
  transform: translateY(-50%) scaleX(-1);
}

/* ============================================================
   Video fallback
   ============================================================ */
html[dir="rtl"] .video-fallback {
  text-align: center;
}

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

html[dir="rtl"] .content ul,
html[dir="rtl"] .content ol {
  direction: rtl;
  text-align: right;
}

/* ============================================================
   Typography fine-tuning
   ============================================================ */
html[dir="rtl"] h1, html[dir="rtl"] h2, html[dir="rtl"] h3,
html[dir="rtl"] h4, html[dir="rtl"] h5, html[dir="rtl"] h6 {
  text-align: right;
  line-height: 1.4; /* 阿语需要略大行高 */
}

html[dir="rtl"] p {
  text-align: right;
  line-height: 1.8;
}

/* 邮箱、网址、型号等始终保持 LTR */
html[dir="rtl"] a[href^="mailto:"],
html[dir="rtl"] a[href^="tel:"],
html[dir="rtl"] a[href^="http"] {
  direction: ltr;
  unicode-bidi: embed;
  display: inline-block;
}

/* ============================================================
   Google Fonts import (Arabic web fonts)
   ============================================================ */
@import url('https://fonts.googleapis.com/css2?family=Tajawal:wght@400;500;700&family=Cairo:wght@400;600;700&display=swap');
