/*
 * Titan Smart Energy - Arabic / RTL overrides
 * Load this file AFTER /default/static/css/main.css on the Arabic site.
 */

html,
body {
  direction: rtl;
  overflow-x: hidden;
}

body,
button,
input,
textarea,
select {
  font-family: Tahoma, Arial, "Noto Naskh Arabic", sans-serif;
}

/* Keep numerical, email and phone values naturally readable. */
input[type="email"],
input[type="tel"],
input[type="number"],
.j-hdata1,
.bannDate,
.projTxt,
.newsDate,
.footCopy {
  direction: ltr;
  unicode-bidi: plaintext;
}

/* Header and desktop navigation */
.navWrap {
  left: 0;
  right: 0;
  padding-left: 136px;
  padding-right: 120px;
}

.navWrap .navList > li {
  margin-right: 0;
  margin-left: 40px;
}

.navWrap .navList > li:last-child {
  margin-left: 0;
}

.navWrap .souLang {
  margin-left: 0;
  margin-right: 10px;
}

.navWrap .searchWrap {
  left: 0;
  right: auto;
}

.navWrap .searchBox {
  padding-left: 5px;
  padding-right: 0;
}

.navWrap .searchBox .searBtn {
  left: 0;
  right: auto;
}

.navWrap .navLang {
  margin-left: 0;
  margin-right: 41px;
}

.navWrap .navLang::after {
  left: auto;
  right: -22px;
}

.navWrap .qiuIcon {
  margin-left: 6px;
  margin-right: 0;
}

.navWrap .jianIcon {
  margin-left: 0;
  margin-right: 5px;
}

/* Dropdown / mega menu */
.navWrap .yiPull > li > p > a > img {
  margin-left: 10px;
  margin-right: 0;
}

.navWrap .pullIcon {
  margin-left: 0;
  margin-right: 10px;
}

.navWrap .zzList a,
.navWrap .erPull > li > a {
  padding-left: 11px;
  padding-right: 17px;
}

.navWrap .navList > li > ul {
  left: auto;
  right: 0;
}

.navWrap .navList > li > ul > li > ul {
  left: auto;
  right: 100%;
}

/* The service mega-menu has a four-column grid. Its source CSS removes the
   right margin from the fourth DOM item; in RTL that is the wrong visual edge. */
.navWrap .spItem {
  margin-right: 0;
  margin-left: 2.8%;
}

.navWrap .spItem:nth-child(4n) {
  margin-left: 0;
}

/* Mobile drawer and accordions */
.navWrap .menuBtn {
  margin-left: 0;
  margin-right: 20px;
}

.navWrap .mobileBox {
  left: 0;
  right: auto;
}

.navWrap .mobileBox .subIcon {
  left: 0;
  right: auto;
}

.navWrap .mobileBox .inpSea {
  margin-left: 10px;
  margin-right: 10px;
  text-align: right;
}

.navWrap .mobileBox .erPhone,
.navWrap .mobileBox .sanPhone {
  margin-left: 0;
  margin-right: 20px;
}

.navWrap .mobileBox .yiZhan {
  margin-left: 0;
  margin-right: 10px;
}

/* Hero content, buttons and directional icons */
.bannerSwiper .cont2 {
  left: auto;
  right: calc((100vw - 1400px) / 2);
}

.bannerSwiper .bannPrev {
  left: auto;
  right: 100px;
}

.bannerSwiper .bannNext {
  left: 100px;
  right: auto;
}

.moreBtn,
.bannPlay,
.soluBtn,
.newsBtn {
  direction: rtl;
}

.moreBtn .iconfont,
.soluBtn .iconfont,
.newsBtn .iconfont,
.phoneTxt .iconfont {
  display: inline-block;
  transform: scaleX(-1);
}

/* Directional glyphs are visual arrows, not text. Mirror them independently
   of the surrounding element so "next" points toward the RTL reading flow. */
.icon-right7,
.icon-left7,
.icon-arrow-right,
.icon-arrow-left,
.icon-youjiantou,
.chanBtn .iconfont,
.recoBtn .iconfont,
.newsBtn .iconfont {
  display: inline-block;
  transform: scaleX(-1) !important;
}

/* Common content rows that use a left icon / left padding in the shared CSS */
.soluWrap .soluIcon {
  margin-left: 20px;
  margin-right: 0;
}

.soluWrap .soluRight {
  margin-left: 0;
  margin-right: 120px;
}

.soluWrap .soluList a,
.soluWrap .soluTxt em {
  padding-left: 0;
  padding-right: 32px;
}

.soluWrap .soluList a::before,
.soluWrap .soluList a::after,
.soluWrap .soluTxt em::before,
.soluWrap .soluTxt em::after {
  left: auto;
  right: 0;
}

.soluWrap .soluList a::after,
.soluWrap .soluTxt em::after {
  right: 4px;
}

.projWrap .projPrev,
.relaWrap .relaPrev {
  left: auto;
  right: -160px;
}

.projWrap .projNext,
.relaWrap .relaNext {
  left: -160px;
  right: auto;
}

/* All reusable carousel pairs follow the same semantic order in RTL. */
.caseWrap .casePrev,
.relaWrap .relaPrev,
.otherWrap .otherPrev,
.deveWrap .devePrev,
.powerWrap .powerPrev {
  left: auto;
  right: -160px;
}

.caseWrap .caseNext,
.relaWrap .relaNext,
.otherWrap .otherNext,
.deveWrap .deveNext,
.powerWrap .powerNext {
  left: -160px;
  right: auto;
}

.projWrap .projPrev .iconfont,
.relaWrap .relaPrev .iconfont,
.projWrap .projNext .iconfont,
.relaWrap .relaNext .iconfont {
  display: inline-block;
  transform: scaleX(-1);
}

/* Products page: sidebar moves to the right and card CTA arrows point left. */
.chanWrap .chanRight {
  margin-left: 0;
  margin-right: 80px;
}

.chanWrap .chanTit span,
.chanWrap .chanIcon {
  margin-left: 0;
  margin-right: 10px;
}

.chanWrap .chanCate > li > div p img {
  margin-left: 10px;
  margin-right: 0;
}

.chanWrap .chanTxt {
  margin-left: 20px;
  margin-right: 0;
}

/* Product category tabs use edge auto-margins. Swap the DOM first/last
   exceptions, otherwise the active track is visibly offset in RTL. */
.prodWrap .cateItem:first-child {
  margin-left: 0;
  margin-right: auto;
}

.prodWrap .cateItem:last-child {
  margin-left: auto;
  margin-right: 0;
}

.prodWrap .cateAct {
  padding-left: 62px;
  padding-right: 20px;
}

/* Forms and footer */
.formWrap input,
.formWrap textarea,
.footWrap .footInput,
.searchBox input {
  text-align: right;
}

.formWrap .formItem .formIcon,
.footWrap .footRight .footIcon {
  margin-left: 10px;
  margin-right: 0;
}

.newsWrap .newsInfo,
.chanTop .chanSub,
.xiangmuWrap .xiangRight,
.xinwWrap .xinwRight,
.docuWrap .docuRight,
.faqWrap .faqRight,
.contactWrap .contactRight {
  margin-left: 0;
}

.newsWrap .newsInfo {
  margin-right: 20px;
}

.xiangmuWrap .xiangRight {
  margin-right: 59px;
}

.xinwWrap .xinwRight,
.docuWrap .docuRight,
.faqWrap .faqRight {
  margin-right: 60px;
}

.contactWrap .contactRight {
  margin-right: 57px;
}

/* Inner-page banner, breadcrumbs, application buttons and pagination. */
.neiBnner .crumWrap {
  left: auto;
  right: calc((100vw - 1400px) / 2);
  padding-left: 15px;
  padding-right: 0;
}

.neiBnner .neiBtn a,
.neiBnner .appBtn a,
.powerWrap .powerBtn a,
.pagingBox a {
  margin-left: 11px;
  margin-right: 0;
}

.neiBnner .appBtn a img,
.powerWrap .powerBtn a img {
  margin-left: 6px;
  margin-right: 0;
}

.pagingBox a:last-child {
  margin-left: 0;
}

/* Detail-page headings, tables, filters and accordion markers. */
.backTit,
.lowCont .lowTxt em {
  padding-left: 0;
  padding-right: 24px;
}

.backTit::before,
.lowCont .lowTxt em::before {
  left: auto;
  right: 0;
}

.caseWrap .caseTxt td:nth-child(1),
.lowWrap .caseTxt td:nth-child(1) {
  padding-left: 59px;
  padding-right: 0;
}

.caseWrap .caseTxt td:nth-child(1) img,
.lowWrap .caseTxt td:nth-child(1) img {
  margin-left: 15px;
  margin-right: 0;
}

.faqWrap .faqIcon,
.faqWrap .answTxt {
  margin-left: 0;
  margin-right: 10px;
}

.faqWrap .faqAnsw {
  padding-left: 22px;
  padding-right: 0;
}

.faqWrap .answTxt {
  padding-left: 44px;
  padding-right: 0;
}

.contactWrap .contactInfo {
  border-left: 1px solid rgba(102, 102, 102, 0.2);
  border-right: 0;
  padding-left: 23px;
  padding-right: 0;
}

/* Contact accordions use a more specific base transform, so override it here
   rather than relying on the generic arrow rule. */
.contactWrap .chanIcon {
  transform: scaleX(-1) !important;
}

.contactWrap .chanAct1 .chanIcon {
  transform: rotate(-90deg) !important;
}

.xiangLeft .chanIcon {
  transform: scaleX(-1) !important;
}

.xiangLeft .chanAct1 .chanIcon {
  transform: rotate(-90deg) !important;
}

/* Contact form: the source labels reserve space on the LTR side. Mirror the
   label/checkbox relationship and align text fields to the reading edge. */
.leaveWrap .leavInput,
.leaveWrap .leavMess,
.leaveWrap .m-formcountry .drop-btn {
  text-align: right;
}

.leaveWrap .m-formcountry .drop-btn i,
.leaveWrap .m-formcountry .drop-btn svg {
  left: 14px;
  right: auto;
}

/* Shared country selectors also appear in the footer and enquiry forms. */
.m-formcountry .drop-btn {
  text-align: right;
}

.m-formcountry .drop-btn i,
.m-formcountry .drop-btn svg {
  left: 14px;
  right: auto;
}

.m-formcountry .drop-list {
  left: auto;
  right: 0;
}

.leaveWrap .m-formcountry .drop-list {
  left: auto;
  right: 0;
}

.leaveWrap .checkItem label {
  margin-left: 0;
  margin-right: 9px;
}

.leaveWrap .checkItem,
.leaveWrap .agreBox {
  justify-content: flex-start;
}

.leaveWrap .agreInput {
  margin-left: 14px;
  margin-right: 0;
}

.leaveWrap .captItem .leavInput {
  padding-left: 100px;
  padding-right: 0;
}

.leaveWrap .captCode {
  left: 14px;
  right: auto;
}

/* News detail previous/next links and page controls. */
.fenYe a span,
.pagingBox a span,
.pagingBox1 a span,
.pagingBox a .iconfont,
.pagingBox1 a .iconfont {
  display: inline-block;
  transform: scaleX(-1) !important;
}

.fenYe a:nth-child(1) span {
  margin-left: 20px;
  margin-right: 0;
}

.fenYe a:nth-child(2) {
  flex-direction: row;
  justify-content: flex-start;
}

.fenYe a:nth-child(2) div {
  text-align: left;
}

.fenYe a:nth-child(2) span {
  margin-left: 0;
  margin-right: 20px;
}

.pagingBox,
.pagingBox1 {
  justify-content: flex-start;
}

.pagingBox a,
.pagingBox1 a {
  margin-left: 24px;
  margin-right: 0;
}

.pagingBox a:last-child,
.pagingBox1 a:last-child {
  margin-left: 0;
}

/* Energy-platform carousel uses a different 60px control offset. */
.powerWrap .powerPrev {
  left: auto;
  right: -60px;
}

.powerWrap .powerNext {
  left: -60px;
  right: auto;
}

.powerWrap .powerQie .iconfont,
.recoWrap .recoQie .iconfont,
.lifeWrap .lifeQues .iconfont {
  display: inline-block;
  transform: scaleX(-1) !important;
}

/* News previous/next keeps the same two-ended geometry as the English page:
   previous stays on the visual left and next stays on the visual right.
   Only the Arabic text itself remains RTL. */
.fenYe {
  direction: ltr;
}

.fenYe a:first-child {
  direction: ltr;
  flex-direction: row;
  justify-content: flex-start;
}

.fenYe a:first-child div {
  direction: rtl;
  text-align: left;
}

.fenYe a:first-child span {
  margin-left: 0;
  margin-right: 20px;
  transform: none !important;
}

.fenYe a:nth-child(2) {
  direction: ltr;
  flex-direction: row-reverse;
  justify-content: flex-end;
}

.fenYe a:nth-child(2) div {
  direction: rtl;
  text-align: right;
}

.fenYe a:nth-child(2) span {
  margin-left: 20px;
  margin-right: 0;
  transform: none !important;
}

/* Final guardrails for shared directional controls used by content supplied
   through the CMS. They cover icon names not present in the original templates. */
[class*="arrow-right"],
[class*="arrow-left"],
[class*="icon-right"],
[class*="icon-left"],
[class*="next"] .iconfont,
[class*="prev"] .iconfont {
  direction: ltr;
}

.footWrap .footCode {
  margin-left: 0;
  margin-right: 9px;
}

.footWrap .linkTxt a,
.footWrap .footRight a {
  margin-right: 0;
}

.footWrap .linkTxt a {
  margin-left: 20px;
}

.footWrap .footRight a {
  margin-left: 12px;
}

.footWrap .linkTxt a:last-child,
.footWrap .footRight a:last-child {
  margin-left: 0;
}

.contactWrap .contItem em,
.leaveWrap .captXing {
  margin-left: 8px;
  margin-right: 0;
}

/* Templates with fixed-width multi-column grids: swap source edge margins
   and their :nth-child() end-of-row exceptions. */
.saleWrap .saleItem,
.partWrap .partItem,
.fullWrap .fullItem,
.certWrap .ExpertList li {
  margin-right: 0;
}

.saleWrap .saleItem {
  margin-left: 2.2%;
}

.saleWrap .saleItem:nth-child(4n) {
  margin-left: 0;
}

.partWrap .partItem {
  margin-left: 7px;
}

.partWrap .partItem:nth-child(6n) {
  margin-left: 0;
}

.fullWrap .fullItem {
  margin-left: 7.6%;
}

.fullWrap .fullItem:nth-child(4n) {
  margin-left: 0;
}

.certWrap .ExpertList li {
  margin-left: 25px;
}

/* Technology, core and energy-platform templates. */
.coreWrap .coreBtn,
.recoWrap .recoQie span,
.techWrap .detaBtn a span {
  margin-left: 0;
  margin-right: 10px;
}

.techWrap .techBox {
  padding-left: 0;
  padding-right: 46px;
}

.techWrap .suoSwiper {
  padding-left: 2px;
  padding-right: 0;
}

.techWrap .detaCont {
  padding-left: 30px;
  padding-right: 0;
}

.techWrap .detaBtn a {
  margin-left: 24px;
  margin-right: 0;
}

.techWrap .detaBtn a:last-child {
  margin-left: 0;
}

.techWrap .scrollbar-track {
  left: 10px;
  right: auto;
}

.techWrap .dtPrev {
  left: auto;
  right: 0;
}

.techWrap .dtNext {
  left: 0;
  right: auto;
}

.enerWrap .enerBox {
  margin-left: 0;
  margin-right: calc((100vw - 1400px) / 2);
}

.powerWrap .powerBox {
  padding-left: 99px;
  padding-right: 73px;
}

/* R&D image overlay and media masks. */
.rdWrap .rdRight::after {
  left: 0;
  right: auto;
  background: linear-gradient(90deg, rgba(20, 50, 130, 0.94) 0%, rgba(59, 59, 59, 0) 53.37%);
}

.rdWrap .rdBlock {
  left: 0;
  right: auto;
  padding-left: 0;
  padding-right: 15px;
}

.recoWrap .recoMask {
  left: auto;
  right: 57px;
}

.fullWrap .fullBott {
  left: auto;
  right: 0;
  padding-left: 0;
  padding-right: 37px;
}

/* Open API and Power Core templates. */
.acceWrap .acceLeft {
  padding-left: 14px;
  padding-right: 20px;
}

.acceWrap .acceQues span {
  margin-left: 0;
  margin-right: 10px;
  transform: scaleX(-1);
}

.acceWrap .isShow span {
  transform: rotate(-90deg) !important;
}

.newsDetail .ndShare p {
  margin-left: 8px;
  margin-right: 0;
}

/* Social buttons follow the same visual-edge rule as the header links. */
.footWrap .footShare a {
  margin-left: 20px;
  margin-right: 0;
}

.footWrap .footShare a:last-child {
  margin-left: 0;
}

/* Fixed side tools belong on the reading-start edge in RTL. */
.sideNav {
  left: 8px;
  right: auto;
  border-radius: 0 20px 20px 0;
}

.sideNav .sideTop {
  border-radius: 0 20px 20px 0;
}

.sideNav .sideBtn {
  left: calc(100% + 2px);
  right: auto;
  border-radius: 0 10px 10px 0;
}

.sideNav .sideItem:nth-child(1) {
  border-radius: 0 20px 0 0;
}

.sideNav .sideItem:last-child {
  border-radius: 0 0 20px 0;
}

.sideNav .wxImg,
.sideNav .phoneTxt,
.sideNav .phoneTxt2 {
  left: calc(100% + 10px);
  right: auto;
}

@media (max-width: 1500px) {
  .navWrap .navList > li {
    margin-left: 15px;
  }

  .navWrap .navLang {
    margin-right: 20px;
  }

  .navWrap .navLang::after {
    right: -10px;
  }

  .bannerSwiper .cont2 {
    left: auto;
    right: 80px;
  }
}

@media (max-width: 1280px) {
  .chanWrap .chanRight {
    margin-left: 0;
    margin-right: 50px;
  }

  .bannerSwiper .bannPrev {
    left: auto;
    right: 20px;
  }

  .bannerSwiper .bannNext {
    left: 20px;
    right: auto;
  }

  .neiBnner .crumWrap {
    left: auto;
    right: 80px;
  }

  .enerWrap .enerBox {
    margin-left: 0;
    margin-right: 80px;
  }

  .partWrap .partItem {
    margin-left: 8px !important;
    margin-right: 0 !important;
  }

  .partWrap .partItem:nth-child(6n) {
    margin-left: 0 !important;
  }

  .fullWrap .fullItem {
    margin-left: 2.6%;
    margin-right: 0;
  }

  .fullWrap .fullItem:nth-child(4n) {
    margin-left: 0;
  }
}

@media (max-width: 1700px) {
  .projWrap .projPrev {
    left: auto;
    right: -70px;
  }

  .projWrap .projNext {
    left: -70px;
    right: auto;
  }

  .caseWrap .casePrev,
  .relaWrap .relaPrev,
  .otherWrap .otherPrev {
    left: auto;
    right: -70px;
  }

  .caseWrap .caseNext,
  .relaWrap .relaNext,
  .otherWrap .otherNext {
    left: -70px;
    right: auto;
  }
}

@media (max-width: 1000px) {
  .soluWrap .soluRight {
    margin-right: 40px;
  }

  .projWrap .projPrev {
    left: auto;
    right: 30%;
  }

  .projWrap .projNext {
    left: 30%;
    right: auto;
  }

  .chanWrap .chanRight {
    margin-right: 0;
  }

  .techWrap .techBox,
  .techWrap .detaCont {
    padding-right: 0;
  }

  .xiangmuWrap .xiangRight,
  .xinwWrap .xinwRight,
  .docuWrap .docuRight,
  .faqWrap .faqRight,
  .contactWrap .contactRight {
    margin-right: 0;
  }
}

@media (max-width: 750px) {
  .navWrap {
    padding-left: 20px;
    padding-right: 20px;
  }

  .soluWrap .soluRight {
    margin-right: 0;
  }

  .bannerSwiper .cont2 {
    right: 20px;
    width: calc(100% - 40px);
  }

  .sideNav {
    left: 0;
  }

  .neiBnner .crumWrap {
    right: 20px;
  }

  .enerWrap .enerBox {
    margin-right: 20px;
  }

  .powerWrap .powerBox {
    padding-left: 20px;
    padding-right: 20px;
  }

  .rdWrap .rdBlock {
    padding-right: 10px;
  }
}
.certWrap .ExpertList{
    direction:ltr;
}