/* Arabic override for cnhcpipe.com — load after /default/static/css/index.css.
   Scoped to the existing html[lang="ar"]. No HTML or JavaScript changes.
   Carousel tracks and navigation retain LTR; Arabic slide copy remains RTL.
   Based on the supplied English stylesheet, retrieved 2026-09-07.
   Source/cascade checked; rendered desktop/mobile verification remains pending. */

html[lang|="ar"] { direction: rtl; }
html[lang|="ar"] body { direction: rtl; text-align: start; }

/* Preserve slider movement, thumbnails, pagination and previous/next semantics. */
html[lang|="ar"] :is(.swiper, .swiper-wrapper, .sw-btn, .ban-sw-btn,
  .c1m2-caro1, .c1m2-caro2, #baguetteBox-overlay) { direction: ltr; }
html[lang|="ar"] .swiper-slide { direction: rtl; }
html[lang|="ar"] :is(video, audio, code, pre,
  input[type="tel"], input[type="email"], input[type="url"], input[type="number"],
  a[href^="tel:"], a[href^="mailto:"]) { direction: ltr; unicode-bidi: isolate; }
html[lang|="ar"] :is(input[type="tel"], input[type="email"], input[type="url"], input[type="number"]) { text-align: right; }

/* Component offsets and text-adjacent decorations, in primary cascade order.
   Transfer the original clearance with each marker; retain original breakpoints.
   Centering coordinates and alternating flex-row parity are intentionally retained. */
html[lang|="ar"] form .star::before {
  left: auto;
  right: 10px;
}

html[lang|="ar"] .snav .nav {
  right: auto;
  left: 2.5%;
}

html[lang|="ar"] .smnav {
  right: auto;
  left: -200%;
}

html[lang|="ar"] .smnavh {
  right: auto;
  left: 0px;
}

html[lang|="ar"] ul.topnav li {
  text-align: start;
}

html[lang|="ar"] ul.topnav li a {
  padding: 15px 5px;
  padding-right: 0px;
  padding-left: 50px;
}

html[lang|="ar"] ul.topnav ul li a {
  padding: 10px 5px;
  padding-left: 5px;
  padding-right: 20px;
}

html[lang|="ar"] ul.topnav ul ul li a {
  padding-left: 0;
  padding-right: 40px;
}

html[lang|="ar"] ul.topnav ul ul ul li a {
  padding-left: 0;
  padding-right: 60px;
}

html[lang|="ar"] ul.topnav span {
  right: auto;
  left: 0px;
}

html[lang|="ar"] .smnav form .iptc {
  padding-left: 0;
  padding-right: 15px;
  float: right;
}

html[lang|="ar"] .smnav form .ipsc {
  float: left;
}

html[lang|="ar"] .smnav form i {
  right: auto;
  left: 10px;
}

html[lang|="ar"] .hd-btn {
  margin-left: 0;
  margin-right: auto;
}

html[lang|="ar"] .search {
  margin-right: 12px;
  border-right: 0;
  border-left: 1px solid rgba(34, 34, 34, 0.5);
  padding-right: 0;
  padding-left: 18px;
  margin-left: 13px;
}

html[lang|="ar"] .search .search-form-box {
  right: auto;
  left: 0px;
}

html[lang|="ar"] .search form .search-close {
  right: auto;
  left: -30px;
}

html[lang|="ar"] .search .search-inp {
  padding-left: 0;
  padding-right: 14px;
}

html[lang|="ar"] .search .search-sub1 {
  right: auto;
  left: 0px;
}

html[lang|="ar"] .h-languages .h-earth {
  margin-right: 0;
  margin-left: 5px;
}

html[lang|="ar"] .h-languages .h-lang-btm {
  margin-left: 0;
  margin-right: 6px;
}

html[lang|="ar"] .h-country {
  margin-right: 0;
  margin-left: 5px;
}

html[lang|="ar"] .language-ul {
  right: auto;
  left: 0px;
}

html[lang|="ar"] .language-ul .h-country {
  margin-right: 0;
  margin-left: 5px;
}

html[lang|="ar"] .navigation {
  margin-left: 0;
  margin-right: auto;
}

html[lang|="ar"] .navigation .nav-dropdown::before {
  left: auto;
  right: 0;
}

html[lang|="ar"] .nav-dropdown .nav-dropdown {
  left: auto;
  right: 100%;
}

html[lang|="ar"] .nav-dropdown ul.drop-left {
  right: auto !important;
  left: 100% !important;
}

html[lang|="ar"] .nav-dropdown > li > ul.drop-left {
  left: 0;
  right: auto;
}

@media screen and (max-width: 1500px) {
  html[lang|="ar"] .search {
    padding-right: 0;
    padding-left: 10px;
    margin-right: 0;
    margin-left: 10px;
  }
}

@media screen and (max-width: 999px) {
  html[lang|="ar"] .head .head1 {
    padding: 0;
    margin-right: 0;
    margin-left: 50px;
  }

  html[lang|="ar"] .head .h-languages {
    margin-left: 0;
    margin-right: 10px;
  }
}

html[lang|="ar"] .m1-det li {
  padding: 26px 22px;
  padding-left: 22px;
  padding-right: 16px;
}

html[lang|="ar"] .m1-con em {
  padding-left: 0;
  padding-right: 28px;
}

html[lang|="ar"] .m1-con em::before {
  left: auto;
  right: 0;
}

@media screen and (max-width: 1400px) {
  html[lang|="ar"] .m1-det li {
    padding: 16px;
  }
}

html[lang|="ar"] .m2-b-con {
  left: auto;
  right: 0;
}

html[lang|="ar"] .m2-b-con::before {
  left: auto;
  right: 0;
}

html[lang|="ar"] .m2-con em {
  padding-left: 0;
  padding-right: 24px;
}

html[lang|="ar"] .m2-con em::before {
  left: auto;
  right: 0;
}

html[lang|="ar"] .m4-s-det li {
  padding: 26px 22px 25px 18px;
}

html[lang|="ar"] .m4-s-det li::before {
  left: auto;
  right: 100%;
  transform: translate(41.66%, -41.66%);
}

@media screen and (max-width: 999px) {
  html[lang|="ar"] .m4-s-det li {
    padding: 20px;
  }
}

html[lang|="ar"] .m5-s-tab li::before {
  left: auto;
  right: 0;
}

html[lang|="ar"] .m5-s-tab li::after {
  left: auto;
  right: 100%;
}

html[lang|="ar"] .m5-s-con em {
  padding-left: 0;
  padding-right: 25px;
}

html[lang|="ar"] .m5-s-con em::before {
  left: auto;
  right: 0;
}

html[lang|="ar"] .m5-s-l1 {
  padding-left: 0;
  padding-right: 80px;
}

@media screen and (max-width: 1400px) {
  html[lang|="ar"] .m5-s-l1 {
    padding-left: 0;
    padding-right: 0;
  }
}

html[lang|="ar"] .m6-time {
  left: auto;
  right: 0;
}

html[lang|="ar"] .m7-det {
  padding: 0 38px 61px 49px;
}

html[lang|="ar"] .m7-top {
  padding-left: 0;
  padding-right: 43px;
}

html[lang|="ar"] .m7-form .ver input {
  padding-right: 0;
  padding-left: 110px;
}

html[lang|="ar"] .m7-form .ver-code {
  right: auto;
  left: 1px;
}

@media screen and (max-width: 1400px) {
  html[lang|="ar"] .m7-top {
    padding-left: 0;
    padding-right: 20px;
  }

  html[lang|="ar"] .m7-det {
    padding: 0 20px 20px;
  }
}

@media screen and (max-width: 999px) {
  html[lang|="ar"] .m7-det {
    padding: 20px;
  }
}

html[lang|="ar"] .fop span {
  margin-left: 0;
  margin-right: 30px;
}

html[lang|="ar"] .ins-det {
  margin-left: 0;
  margin-right: auto;
  padding-right: 0;
  padding-left: 4.2708333333vw;
}

@media screen and (max-width: 767px) {
  html[lang|="ar"] .ins-det {
    margin: 0 auto;
    padding-right: 0;
    padding-left: 0;
  }
}

@media screen and (max-width: 999px) {
  html[lang|="ar"] .page-turn .sc input {
    margin-left: 0;
    margin-right: 0;
  }
}

html[lang|="ar"] .p1m1-r {
  padding: 25px 33px 49px 40px;
}

html[lang|="ar"] .p1m1-r-con em {
  padding-left: 0;
  padding-right: 22px;
}

html[lang|="ar"] .p1m1-r-con em::before {
  left: auto;
  right: 0;
}

html[lang|="ar"] .p1m5-con em {
  padding-left: 0;
  padding-right: 26px;
}

html[lang|="ar"] .p1m5-con em::before {
  left: auto;
  right: 0;
}

html[lang|="ar"] .p1m7-faq .faq-top i {
  margin-left: 0;
  margin-right: auto;
}

@media screen and (max-width: 999px) {
  html[lang|="ar"] .p1m1-r {
    padding: 20px;
  }
}

html[lang|="ar"] .inq .share {
  margin-right: 0;
  margin-left: auto;
}

html[lang|="ar"] .inq .share1 {
  margin-right: 0;
  margin-left: 5px;
}

html[lang|="ar"] .p2m5-con em {
  padding-left: 0;
  padding-right: 27px;
}

html[lang|="ar"] .p2m5-con em::before {
  left: auto;
  right: 0;
}

html[lang|="ar"] .p3m1-det {
  padding: 62px 48px 48px 41px;
}

html[lang|="ar"] .p3m1-btm li::before {
  left: auto;
  right: 113.29787234%;
  transform: translateX(50%);
}

html[lang|="ar"] .p3m2-line::before {
  left: auto;
  right: 0;
}

html[lang|="ar"] .p3m5-r-img {
  left: auto;
  right: 108.4335%;
  transform: translate(50%, -50%);
}

html[lang|="ar"] .p3m6-btm {
  padding: 25px 34px 19px 29px;
}

@media screen and (max-width: 999px) {
  html[lang|="ar"] .p3m1-det {
    padding: 20px;
  }

  html[lang|="ar"] .p3m6-btm {
    padding: 20px;
  }
}

html[lang|="ar"] .i1m1-r {
  padding: 44px 30px 80px 23px;
}

html[lang|="ar"] .i1m3-circle {
  right: auto;
  left: -65px;
}

@media screen and (max-width: 1400px) {
  html[lang|="ar"] .i1m1-r {
    padding: 20px;
  }
}

html[lang|="ar"] .i2m5-det li {
  padding: 19px 23px 28px 28px;
}

html[lang|="ar"] .move-on li:nth-child(2) .move-on-con {
  text-align: end;
}

@media screen and (max-width: 999px) {
  html[lang|="ar"] .i2m5-det li {
    padding: 16px;
  }

  html[lang|="ar"] .move-on li:nth-child(2) .move-on-con {
    text-align: start;
  }
}

html[lang|="ar"] .c1m1-l-info {
  right: auto;
  left: -13.85991%;
}

html[lang|="ar"] .c1m1-con em {
  padding-left: 0;
  padding-right: 25px;
}

html[lang|="ar"] .c1m1-con em::before {
  left: auto;
  right: 0;
}

html[lang|="ar"] .c1m3-b-con {
  left: auto;
  right: 0;
}

@media screen and (max-width: 999px) {
  html[lang|="ar"] .c1m1-l-info {
    right: auto;
    left: 0;
  }
}

html[lang|="ar"] .f1m1-info li::before {
  left: auto;
  right: 100%;
  transform: translate(50%, -50%);
}

html[lang|="ar"] .pr1m1-det>li {
  padding-left: 0;
  padding-right: 20px;
}

html[lang|="ar"] .pr1m1-det>li::before {
  left: auto;
  right: 0;
}

html[lang|="ar"] .pr1m1-det>li::after {
  left: auto;
  right: 3px;
}

html[lang|="ar"] .pr1m1-con em {
  padding-left: 0;
  padding-right: 25px;
}

html[lang|="ar"] .pr1m1-con em::before {
  left: auto;
  right: 0;
}

html[lang|="ar"] .pr1m1-con li {
  padding-left: 0;
  padding-right: 25px;
}

html[lang|="ar"] .pr1m1-con li::before {
  left: auto;
  right: 0;
}

html[lang|="ar"] .n1m1-time i {
  margin-right: 0;
  margin-left: 5px;
}

html[lang|="ar"] .net .share1 {
  margin-right: 0;
  margin-left: 5px;
}

html[lang|="ar"] .move-on2 li:nth-child(2) .move-on-con {
  text-align: start;
}

html[lang|="ar"] .n2m1-r {
  padding: 36px 20px 36px 24px;
}

html[lang|="ar"] .n2m1-r-title::before {
  left: auto;
  right: -20px;
}

@media screen and (max-width: 999px) {
  html[lang|="ar"] .n2m1-r {
    padding: 20px;
  }
}

html[lang|="ar"] .ce1m1-con em {
  padding-left: 0;
  padding-right: 26px;
}

html[lang|="ar"] .ce1m1-con em::before {
  left: auto;
  right: 0;
}

html[lang|="ar"] .ce1m3-det li {
  padding: 22px 20px 25px 24px;
}

@media screen and (max-width: 1400px) {
  html[lang|="ar"] .ce1m3-det li {
    padding: 20px;
  }
}

html[lang|="ar"] .q1m2-det li i {
  left: auto;
  right: 103.69%;
  transform: translate(50%, -50%);
}

html[lang|="ar"] .q1m3-t-r-con ul li {
  padding-left: 0;
  padding-right: 24px;
}

html[lang|="ar"] .q1m3-t-r-con ul li::before {
  left: auto;
  right: 0;
}

html[lang|="ar"] .q1m5-s-title {
  left: auto;
  right: 0;
}

html[lang|="ar"] .q1m5-s-title::before {
  left: auto;
  right: 0;
}

html[lang|="ar"] .t1m2-list li::after {
  left: auto;
  right: 107.783%;
  transform: translate(50%, -50%);
}

html[lang|="ar"] .t1m2-list li:nth-child(3) {
  margin-right: 0;
  margin-left: 50%;
}

html[lang|="ar"] .t1m2-list li:nth-child(4) {
  margin-left: 0;
  margin-right: auto;
}

@media screen and (max-width: 999px) {
  html[lang|="ar"] .t1m2-list li:nth-child(3) {
    margin-right: 0;
    margin-left: 0;
  }
}

html[lang|="ar"] .pro2m3-l .pro2m3-con em {
  padding-left: 0;
  padding-right: 20px;
}

html[lang|="ar"] .pro2m3-l .pro2m3-con em::before {
  left: auto;
  right: 0;
}

html[lang|="ar"] .fa1m1-faq .faq-top i {
  margin-left: 0;
  margin-right: auto;
}

html[lang|="ar"] .co2m1-con em {
  padding-left: 0;
  padding-right: 25px;
}

html[lang|="ar"] .co2m1-con em::before {
  left: auto;
  right: 9px;
}

html[lang|="ar"] .g2m-r-title::before {
  left: auto;
  right: -35px;
}

@media screen and (min-width: 1000px) {
  html[lang|="ar"] .g2m2 {
    padding: 50px 0 70px;
  }
}

html[lang|="ar"] .g2m2 {
  padding-right: 0;
  padding-left: 57px;
}

html[lang|="ar"] .g2m2::before {
  right: auto;
  left: 0;
}

html[lang|="ar"] .g2m6-con em {
  padding-left: 0;
  padding-right: 26px;
}

html[lang|="ar"] .g2m6-con em::before {
  left: auto;
  right: 0;
}

@media screen and (max-width: 1400px) {
  html[lang|="ar"] .g2m-r-title::before {
    left: auto;
    right: -20px;
  }
}

@media screen and (max-width: 999px) {
  html[lang|="ar"] .g2m2 {
    padding-right: 0;
    padding-left: 0;
  }

  html[lang|="ar"] .g2m2::before {
    right: auto;
    left: 50%;
    transform: translateX(-50%);
  }
}

html[lang|="ar"] .pop-form {
  left: auto;
  right: 0px;
}

html[lang|="ar"] .pop-form .pf-close {
  right: auto;
  left: 54px;
}

html[lang|="ar"] .pop-formn {
  right: 5%;
  left: 5%;
}

html[lang|="ar"] .pf-title {
  padding-right: 0;
  padding-left: 50px;
}

html[lang|="ar"] .pf-form .ver input {
  padding-right: 0;
  padding-left: 120px;
}

html[lang|="ar"] .pf-form .ver-code {
  right: auto;
  left: 1px;
}

@media screen and (max-width: 999px) {
  html[lang|="ar"] .pop-form .pf-close {
    right: auto;
    left: 20px;
  }
}

html[lang|="ar"] .m-formcountry .drop-btn i {
  right: auto;
  left: 20px;
}

html[lang|="ar"] .m-formcountry .drop-btn svg {
  right: auto;
  left: 20px;
}

@media screen and (min-width:1000px) {
  html[lang|="ar"] .p2m-t-list li:first-child {
    margin-left: 0;
    margin-right: auto;
  }

  html[lang|="ar"] .p2m-t-list li:last-child {
    margin-right: 0;
    margin-left: auto;
  }
}

@media screen and (max-width:999px) {
  html[lang|="ar"] .p2m-t-list a {
    text-align: start;
  }
}

@media screen and (max-width: 999px) {
  html[lang|="ar"] .head .head1 {
    right: auto;
    left: 2.5%;
  }

  html[lang|="ar"] .head2 {
    margin: 0 auto;
  }
}

@media screen and (max-width: 400px) {
  html[lang|="ar"] .head2 {
    margin-left: 0;
    margin-right: 0;
  }
}

/* Nested navigation opens toward the reading direction; edge fallback reverses it.
   Importance matches the existing .drop-left rules in the primary CSS. */
html[lang|="ar"] .nav-dropdown .nav-dropdown { left: auto; right: 100%; }
html[lang|="ar"] .nav-dropdown ul.drop-left { right: auto !important; left: 100% !important; }
html[lang|="ar"] .navigation .nav-dropdown { max-width: 95vw; white-space: normal; }
html[lang|="ar"] .nav-dropdown li a { line-height: 1.5; }

/* Mirror only horizontal glyphs, never the whole button or brand image.
   Exclude all observed carousel control classes and the lightbox. */
html[lang|="ar"] :is(.icon-right, .icon-left, .icon-right1, .icon-left1, .icon-right7, .icon-left7):not(:where(.sw-btn *, .ban-sw-btn *,
  .ban-next, .ban-prev, .m2-next, .m2-prev, .m3-next, .m3-prev,
  .p1m6-next, .p1m6-prev, .p2m1-next, .p2m1-prev, .p2ma-next, .p2ma-prev,
  .f1m2-next, .f1m2-prev, .f1m3-next, .f1m3-prev, .q1m7-next, .q1m7-prev,
  #baguetteBox-overlay *))::before { display: inline-block; transform: scaleX(-1); }

/* The collapsed mobile chevron points left; expanded chevron points down. */
html[lang|="ar"] ul.topnav span { transform: scaleX(-1); }
html[lang|="ar"] ul.topnav span.nav-hide { transform: rotate(90deg); }

/* Diagram arrows follow the reversed process flow; checkmark images stay intact. */
html[lang|="ar"] .p3m5-r-img img { scale: -1 1; }

/* Preserve the primary form clearance when its mobile shorthand padding wins. */
html[lang|="ar"] .m7-form .ver input { padding-left: 110px; padding-right: 15px; }
html[lang|="ar"] .pf-form .ver input { padding-left: 120px; padding-right: 14px; }
@media screen and (max-width: 999px) {
  html[lang|="ar"] .pf-form .ver input { padding-right: 10px; }
}

/* A centered vertical connector overrides the generic horizontal connector. */
html[lang|="ar"] .t1m2-list li:nth-child(3)::after {
  left: 50%; right: auto; transform: translate(-50%, -50%) rotate(90deg);
}
html[lang|="ar"] ul.topnav ul ul li a,
html[lang|="ar"] ul.topnav ul ul ul li a { padding-left: 5px; }
@media screen and (max-width: 1500px) {
  html[lang|="ar"] .search { margin-right: 12px; }
}
@media screen and (max-width: 400px) {
  html[lang|="ar"] .head2 { margin-left: auto; margin-right: 0; }
}

/* Text-bearing actions: intrinsic width within the parent, with bounded labels.
   Icon-only carousel controls and ordinary article/navigation links are excluded. */
html[lang|="ar"] :is(.hd-btn a, .ban-btn a, .m1-btn a, .m2-btn a, .m3-btn a,
  .ins-btn a, .p2m1-btn a, .m7-form .form-btn button, .pf-form .pf-form-btn input) {
  max-width: 100%; min-width: 0; box-sizing: border-box; white-space: nowrap;
  overflow: hidden; text-overflow: ellipsis;
}
html[lang|="ar"] :is(.m1-btn a, .m2-btn a, .m3-btn a, .p2m1-btn a) > span {
  min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
}
html[lang|="ar"] :is(.ban-btn a, .m1-btn a, .m2-btn a, .m3-btn a,
  .p2m1-btn a, .m7-form .form-btn button) > i { flex-shrink: 0; }


/* Screenshot review: single project cards align right without reversing a track.
   Keep the slide width calculated by Swiper. Only the one-item case is changed. */
html[lang|="ar"] :is(.m3-sw, .p1m6-sw, .p2ma-sw) > .swiper-wrapper:has(> .swiper-slide:only-child) {
  justify-content: flex-end;
}
html[lang|="ar"] :is(.m3-sw, .p1m6-sw, .p2ma-sw) > .swiper-wrapper > .swiper-slide:only-child {
  /* Swiper writes the inter-slide gap inline even when there is no next slide. */
  margin-left: 0 !important;
  margin-right: 0 !important;
}

/* Inquiry-list bent arrow: mirror its horizontal component, retaining “up”. */
html[lang|="ar"] .page-turn .sc .icon-rise-full::before {
  display: inline-block;
  transform: scaleX(-1);
}

/* jqZoom writes left:100% inline on mouse entry. Its window is a sibling of
   .p2m1-sw2 inside .p2m1-caro2; keep its pixel scrolling in LTR. */
@media screen and (min-width: 1000px) {
  html[lang|="ar"] .p2m1-caro2 > .zoomdiv {
    left: auto !important;
    right: calc(100% + 10px);
    direction: ltr;
  }
}

/* Accommodate translated labels without compressing the desktop navigation. */
html[lang|="ar"] .navigation > li > .nav-dropdown {
  width: max-content;
  min-width: 220px;
  max-width: min(360px, 95vw);
}
/* Factory carousel: the control group remains at the RTL row start (right).
   Its internal previous / fraction / next order stays LTR. */
html[lang|="ar"] .f1m2-btm { direction: rtl; }
html[lang|="ar"] .f1m2-btm .sw-btn,
html[lang|="ar"] .f1m2-pag { direction: ltr; }
html[lang|="ar"] .f1m2-btm .sw-btn {
  width: max-content;
  flex: 0 0 auto;
  justify-content: flex-start;
  gap: 12px;
}
html[lang|="ar"] .f1m2-btm .f1m2-pag {
  width: auto;
  margin: 0;
  flex: 0 0 auto;
}
html[lang|="ar"] .f1m2-scroll {
  flex: 1 1 0%;
  min-width: 0;
  direction: ltr;
  overflow: hidden;
  clip-path: inset(0);
  border-radius: 3px;
}
html[lang|="ar"] .f1m2-scroll .swiper-scrollbar-drag {
  max-width: 100%;
  box-sizing: border-box;
}
html[lang|="ar"] .f1m2-pag {
  flex-shrink: 0;
  white-space: nowrap;
  unicode-bidi: isolate;
}

/* All four primary-CSS uses of right.png are directional triangle bullets.
   This also covers .q1m1 and .t1m1 through the shared .p1m1-r-con selector.
   Their existing RTL position and text clearance remain in effect. */
html[lang|="ar"] .p1m1-r-con em::before,
html[lang|="ar"] .p3m6-btm li::before,
html[lang|="ar"] .q1m3-t-r-con ul li::before,
html[lang|="ar"] .pro2m3-l .pro2m3-con em::before {
  transform: scaleX(-1);
  flex-shrink: 0;
}
.contact-us{
    left:0;
    right:unset;
}