/* ============================================================
   Raab Group — Arabic / RTL layout
   ============================================================ */
html[dir="rtl"] body {
  font-family: "Tajawal", "Open Sans", "Poppins", sans-serif;
  text-align: right;
}

html[dir="rtl"] .me-auto {
  margin-right: 0 !important;
  margin-left: auto !important;
}

html[dir="rtl"] .ms-auto {
  margin-left: 0 !important;
  margin-right: auto !important;
}

html[dir="rtl"] .text-start {
  text-align: right !important;
}

html[dir="rtl"] .text-end {
  text-align: left !important;
}

/* Language switcher */
.lang-switch {
  display: inline-flex;
  align-items: center;
  gap: 0;
  border: 1px solid rgba(20, 131, 157, 0.35);
  border-radius: 999px;
  overflow: hidden;
  background: #fff;
  flex-shrink: 0;
  margin-inline-start: 12px;
  box-shadow: 0 2px 10px rgba(8, 47, 58, 0.06);
}

.lang-switch__btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 44px;
  padding: 6px 12px;
  font-size: 12px;
  font-weight: 800;
  letter-spacing: 0.04em;
  text-decoration: none;
  color: #0f6b80;
  background: transparent;
  border: 0;
  line-height: 1.2;
  transition: background 0.2s ease, color 0.2s ease;
}

.lang-switch__btn:hover {
  background: rgba(20, 131, 157, 0.08);
  color: #0a5263;
}

.lang-switch__btn.is-active {
  background: linear-gradient(135deg, #14839d, #0f6b80);
  color: #fff;
}

.topbar .lang-switch {
  border-color: rgba(255, 255, 255, 0.35);
  background: rgba(255, 255, 255, 0.12);
}

.topbar .lang-switch__btn {
  color: #fff;
}

.topbar .lang-switch__btn:hover {
  background: rgba(255, 255, 255, 0.15);
  color: #fff;
}

.topbar .lang-switch__btn.is-active {
  background: #e8a020;
  color: #1b1405;
}

.header .lang-switch {
  margin-inline-start: 10px;
}

@media (max-width: 1199px) {
  .header .lang-switch {
    margin-inline-end: 44px;
  }
}

/* RTL nav / dropdowns */
html[dir="rtl"] .navmenu ul {
  padding-right: 0;
}

html[dir="rtl"] .navmenu .dropdown ul {
  left: auto;
  right: 0;
}

html[dir="rtl"] .navmenu a i.toggle-dropdown,
html[dir="rtl"] .navmenu a .bi-chevron-down {
  margin-left: 0;
  margin-right: 6px;
}

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

html[dir="rtl"] .topbar__item i {
  margin-left: 6px;
  margin-right: 0;
}

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

html[dir="rtl"] .hero-badges {
  justify-content: flex-end;
}

html[dir="rtl"] .read-more i,
html[dir="rtl"] .bi-arrow-right {
  transform: scaleX(-1);
}

html[dir="rtl"] .feature-card,
html[dir="rtl"] .service-item,
html[dir="rtl"] .raab-vg-card,
html[dir="rtl"] .about-mission-box,
html[dir="rtl"] .contact-form-card {
  text-align: right;
}

html[dir="rtl"] .footer-links ul {
  padding-right: 0;
}

html[dir="rtl"] .footer-links li i {
  margin-left: 6px;
  margin-right: 0;
  transform: scaleX(-1);
}

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

html[dir="rtl"] .popupFormBlue,
html[dir="rtl"] .popupContentBlue {
  direction: rtl;
}

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

html[dir="rtl"] .service-quick-nav__item {
  text-align: center;
}

html[dir="rtl"] .counter-box,
html[dir="rtl"] .raab-heading {
  text-align: right;
}

html[dir="rtl"] .raab-heading.text-center {
  text-align: center !important;
}

html[dir="rtl"] .bi-chevron-right {
  transform: scaleX(-1);
}

/*
 * Right-rail side actions: docked state shows only the leading ~46px.
 * Under dir=rtl the icon is on the physical right, so Arabic label text
 * peeks through instead of the icon. Keep this rail LTR so icons stay visible.
 */
html[dir="rtl"] .business-suppliers-page .bs-side-actions,
html[dir="rtl"] .business-suppliers-page .bs-side-actions__btn {
  direction: ltr;
}

html[dir="rtl"] .business-suppliers-page .bs-side-actions__btn i {
  display: inline-flex !important;
  visibility: visible !important;
  opacity: 1 !important;
  flex-shrink: 0;
  font-family: "bootstrap-icons" !important;
  font-style: normal;
}

/* Process step arrows: sit on the “next” side in RTL and stay visible */
html[dir="rtl"] .business-suppliers-page .bs-process__arrow {
  right: auto;
  left: -34px;
  display: none;
  visibility: visible !important;
  opacity: 1 !important;
}

@media (min-width: 992px) {
  html[dir="rtl"] .business-suppliers-page .bs-process__arrow {
    display: inline-flex !important;
  }
}

html[dir="rtl"] .business-suppliers-page .bs-process__arrow .bi-arrow-right {
  display: inline-block;
  transform: scaleX(-1);
}

html[dir="rtl"] .business-suppliers-page .bs-process__list li,
html[dir="rtl"] .business-suppliers-page .bs-journey__step,
html[dir="rtl"] .business-suppliers-page .bs-standards__item {
  text-align: right;
}

html[dir="rtl"] .business-suppliers-page .bs-process__list li i,
html[dir="rtl"] .business-suppliers-page .bs-process__icon,
html[dir="rtl"] .business-suppliers-page .bs-journey__step-icon,
html[dir="rtl"] .business-suppliers-page .bs-standards__icon {
  display: inline-flex !important;
  visibility: visible !important;
  opacity: 1 !important;
  flex-shrink: 0;
}

html[dir="rtl"] .business-suppliers-page .bs-process__icon i,
html[dir="rtl"] .business-suppliers-page .bs-journey__step-icon i,
html[dir="rtl"] .business-suppliers-page .bs-process__list li i,
html[dir="rtl"] .business-suppliers-page .bs-standards__icon i {
  font-family: "bootstrap-icons" !important;
  font-style: normal;
  speak: never;
}

/* Keep check / nav icons visible beside Arabic text */
html[dir="rtl"] .bi::before {
  display: inline-block;
  font-family: "bootstrap-icons" !important;
}

@media (max-width: 991px) {
  html[dir="rtl"] .hero-actions {
    justify-content: center;
  }
  html[dir="rtl"] .hero-badges {
    justify-content: center;
  }
}