@charset "utf-8";
/*
 * WEINSPECTION 官网 —— 阿拉伯语（Ar 模块）文字右对齐样式
 *
 * 加载方式：head.html 按 Common/Conf/site_langs.php 的 rtl 标记条件引入，
 *           只有 /Ar 页面会请求本文件，其余 10 个语言站不付这份开销。
 * 放 statics/ 而不是各主题 Public/css/：规则全是元素级的，桌面端与手机端通用，
 *           存两份只会随时间漂移（同 contact_inquiry.js 的做法）。
 *
 * ── 边界：只做「文字右对齐」，不做整站 RTL 镜像 ──
 * 用户明确选了前者。所以本文件只碰 direction 与 text-align，绝不碰
 * float / left / right / padding-left / margin-left / border-left ——
 * 那些一改，栅格、导航、卡片就整体翻转了。
 * 因此这里刻意 **不给 body / html 设 direction**：direction 是继承属性，
 * 一旦挂到 body，flex 行（.stat-grid）、inline-block 流（导航项）、表格列序
 * 全都会跟着镜像。改为只挂到「自身承载文字、且不会是布局容器」的元素上：
 *   · li 的顺序由父 ul 决定（ul 保持 ltr），所以菜单不翻转；
 *   · td/th 的列序由 table 决定（table 保持 ltr），只有格内文字变向；
 *   · div 一律不挂 —— 站点用 div 做 flex 容器，挂了子项就换序。
 *     div 里的正文改由生成器逐个加 dir="rtl"（见 lib.php 的 we_rtl_text），
 *     只加在「没有元素子节点」的 div 上，那些不可能是布局容器。
 *
 * ── 特异性是刻意压低的 ──
 * 各页样式多为模板内联 <style>，位于 head 之后。用裸元素选择器（0,0,1）
 * 才能让刻意居中的排版继续赢：实测 32 个 Ar 模板里的 18 处 text-align:center
 * 全部是内联 style 属性或类选择器（≥0,1,0），都会被保留。
 * 只有共享组件（语言切换面板）需要压过它自己的类规则，才用 html[lang="ar"]
 * 前缀把特异性提到 (0,1,2)。
 *
 * 字体不动：站点基线是 Helvetica/Arial，Arial 自带阿拉伯字形，浏览器会按字形
 * 逐个回退，够用；改 body 的 font-family 会牵动整站字宽，得不偿失。
 * line-height 也不动：站内大量固定高度容器（.s4-top 542px、.city 50px 等），
 * 行高一放大就会溢出。
 */

/* ── 1. 正文文字：右起书写 + 右对齐 ─────────────────────────────── */
p, li, dd, dt, blockquote, label,
h1, h2, h3, h4, h5, h6,
td, th, caption, figcaption {
    direction: rtl;
    /* plaintext：段落方向由首个强方向字符决定，夹在阿语里的英文品牌名、
       型号、邮箱、网址仍按 LTR 正确成串，不会被 bidi 拆散或错位 */
    unicode-bidi: plaintext;
    text-align: right;
}

/* ── 2. 列表缩进换到右侧 ─────────────────────────────────────────
   li 变 rtl 后项目符号跑到右边，而 Bootstrap 的缩进在左侧，
   不换边符号就会顶到容器外。类选择器（如 .service-list）仍会赢。 */
ul, ol {
    margin-left: 0;
    margin-right: 25px;
    padding-left: 0;
}

/* ── 3. 保持英文的区域锁回 LTR ───────────────────────────────────
   用户要求首页 OUR EXHIBITIONS 与 ourfairs.html 的展会内容保持英文。
   那些卡片是 .s7* 的 div，本来就不在第 1 节的选择器里；这里再显式锁一道，
   免得日后有人给 div 加 direction 时把它们一起带跑。
   类选择器 (0,1,0) 高于第 1 节的裸元素选择器。 */
.s7, .s7-l, .s7-r, .s7-l-a, .s7-l-b, .s7-r-a, .s7-r-b,
.section7 .section-title {
    direction: ltr;
    unicode-bidi: embed;
    text-align: left;
}

/* ── 4. 共享语言切换面板（Public/langswitch.html）─────────────────
   该组件自带 <style>，在 body 里输出，位置晚于本文件；
   它自己的 .we-lang-panel{text-align:left} 是 (0,1,0)，
   所以这里用 html[lang="ar"] 前缀提到 (0,1,2) 才压得住。 */
html[lang="ar"] .we-lang-panel,
html[lang="ar"] .we-lang-panel-title,
html[lang="ar"] .we-lang-item,
html[lang="ar"] .we-lang-btn {
    direction: rtl;
    text-align: right;
}

/* 面板里语言本地名与英文名原是一左一右两列，方向翻了要跟着换边，
   否则两者会在同一侧重叠。仅限这个小组件，不涉及页面版式。

   两套主题的 langswitch.html 布局不同，而本文件是共享的，无法从
   .we-lang-en 自身区分，所以生成器给根 div 打了修饰类：
     · we-lang--row   手机端：.we-lang-en 是 float:right，.we-lang-item 带
                       overflow:hidden（clearfix），换边只需改成 float:left。
     · we-lang--stack 桌面端：.we-lang-en 本就是 display:block 两行堆叠，
                       父项没有 clearfix。这里绝不能加 float，否则它会脱离
                       文档流、压到下一个语言项上；只需把文字右对齐。 */
html[lang="ar"] .we-lang--row .we-lang-en {
    float: left;
    margin: 3px 10px 0 0 !important;
}

html[lang="ar"] .we-lang--stack .we-lang-en {
    text-align: right;
}

/* ── 5. 生成器漏网的 div 正文容器：补右对齐 ─────────────────────
   we_rtl_text 只给「无子标签且 ≥40 字符」的 div 加 dir="rtl"
   （lib.php 正则：<div\b([^>]*)>([^<]{40,})</div>）。于是凡含
   <br> / <strong> / <a> / <span> 或短文本的正文 div 全被漏掉，
   表现为业务页大量段落仍靠左。这里用 text-align:right 兜底 —— 不用
   direction：.hoverbg1 里 access.html 放了 float 的 province/city，挂
   direction 会连浮动一起镜像；text-align 只动行内文字，浮动块不受影响，
   足以满足「靠右」。统一用 html[lang="ar"] 前缀：既限定只作用 Ar 站，
   又把特异性提到 (0,2,1) 压过各页 <style> 里可能存在的同类 (0,1,0) 规则。 */
html[lang="ar"] .hoverbg1,
html[lang="ar"] .hoverbg2,
html[lang="ar"] .s10,
html[lang="ar"] .s11,
html[lang="ar"] .img-content {
    text-align: right;
}

/* 首页区块标题右对齐；但 OUR EXHIBITIONS 那个 .section-title 在 .section7 内，
   须保持英文左对齐。html[lang="ar"] .section-title 是 (0,2,1)，会盖过第 3 节的
   .section7 .section-title (0,2,0)，所以再补一条 (0,3,1) 显式锁回。 */
html[lang="ar"] .section-title {
    text-align: right;
}
html[lang="ar"] .section7 .section-title {
    text-align: left;
}

/* ── 6. 手机版折叠菜单右侧箭头（.panel-title-right）在 RTL 下翻转 ──────
   style2.css 用 ::before 渲染 fa-chevron-right 表示「进入该栏目」（向前）。
   RTL 里「向前/下一层」指向左侧，故把雪佛龙水平镜像，并让 hover 位移
   反向。scaleX(-1) 只翻图标不改布局；.top-nav 面板结构为手机端独有，
   桌面端不受影响。 */
html[lang="ar"] .top-nav .panel-title-right a::before {
    display: inline-block;
    transform: scaleX(-1);
}
html[lang="ar"] .top-nav .panel-title-right a:hover {
    transform: translateX(-2px);
}

/* ── 7. 内页 banner 文案层：整块右起 ───────────────────────────
   .innor-banner > div 是 img 的兄弟、绝对定位的文案覆盖层，只装标题与 <p>，
   既不是 flex 容器、内部也无 float，故可安全挂 direction —— 不同于第 5 节的
   .hoverbg1（那里有 float 的 province/city，挂 direction 会连浮动一起镜像，只能
   用 text-align）。direction 是文本方向属性，不改物理 left/top，banner 位置不动，
   只让 div 自身的裸标题文本右起（内部 <p> 已由第 1 节处理）。unicode-bidi:plaintext
   保证夹在阿语里的 WEINSPECTION 等英文品牌名仍按 LTR 成串。各页内联的
   text-align:center 特异性更高，居中排版照常保留。html[lang="ar"] 前缀把特异性
   提到 (0,2,1)，压过 style.css 的 .innor-banner div (0,1,1)；桌面与手机共用本文件。 */
html[lang="ar"] .innor-banner > div {
    direction: rtl;
    unicode-bidi: plaintext;
}
