/* MAN Solar Arabic RTL interaction fixes: step order and language switcher reveal. */
html[lang="ar"] [data-ui="step-indicator-root"] > div:first-child {
  flex-direction: row !important;
  direction: ltr !important;
}

html[lang="ar"] [data-ui="step-indicator-root"] > div:first-child > div:not([data-ui]) {
  direction: rtl !important;
}

html[lang="ar"] [data-ui="step-indicator-line-bg-a"] {
  left: 20px !important;
  right: 20px !important;
}

html[lang="ar"] [data-ui="step-indicator-line-a"] {
  left: 20px !important;
  right: auto !important;
  transform-origin: left center !important;
}

html[lang="ar"] [class*="relative inline-flex"][class*="text-xs"][class*="select-none"] {
  direction: ltr !important;
  flex-direction: row !important;
  unicode-bidi: isolate !important;
}

html[lang="ar"] [class*="relative inline-flex"][class*="text-xs"][class*="select-none"] > [class*="absolute flex"][class*="rounded-full"] {
  left: 100% !important;
  right: auto !important;
  margin-left: 4px !important;
  margin-right: 0 !important;
  direction: ltr !important;
  flex-direction: row !important;
  transform-origin: left center !important;
  unicode-bidi: isolate !important;
}

html[lang="ar"] [class*="relative inline-flex"][class*="text-xs"][class*="select-none"] > [class*="absolute flex"][class*="rounded-full"][style*="opacity: 0"] {
  transform: translate(-100%, -50%) !important;
  clip-path: inset(0 100% 0 0) !important;
}

html[lang="ar"] [class*="relative inline-flex"][class*="text-xs"][class*="select-none"] > [class*="absolute flex"][class*="rounded-full"][style*="opacity: 1"] {
  transform: translate(0, -50%) !important;
  clip-path: inset(0 0 0 0) !important;
}
