/**
 * Cedar GO — RTL localization layer (MapTech preserved).
 * Scoped to [dir="rtl"]. Does not flip logos, photos, or app screenshots.
 */

/* Arabic-capable system stack (Inter lacks Arabic glyphs) */
html[lang^="ar"] body,
[dir="rtl"] body {
  font-family: "Segoe UI", Tahoma, "Arial Unicode MS", Arial, sans-serif;
  -webkit-font-smoothing: antialiased;
}

[dir="rtl"] {
  text-align: start;
}

/* ---- Language switcher (modern compact control) ---- */
.cg-lang-switch {
  position: relative;
  display: inline-flex;
  align-items: center;
  flex-shrink: 0;
  vertical-align: middle;
  z-index: 40;
}

/*
 * Keep lang switch at flex-end: right in LTR, left in RTL
 * (flex-horizontal uses direction:rtl under [dir=rtl]).
 * Do NOT use order:-99 in RTL — that pins it to flex-start (right).
 */
.header-right-side .flex-horizontal .cg-lang-switch--header {
  margin-inline-start: 10px;
  order: 99;
}

[dir="rtl"] .header-right-side .flex-horizontal .cg-lang-switch--header {
  order: 99;
  margin-inline-start: 10px;
  margin-inline-end: 0;
}

.cg-lang-flag {
  width: 18px;
  height: 13px;
  border-radius: 2px;
  display: block;
  flex-shrink: 0;
  overflow: hidden;
  box-shadow: inset 0 0 0 1px rgba(18, 20, 26, 0.12);
  background: #e8eaed;
}

.cg-lang-flag img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center;
}

.cg-lang-switch__trigger {
  appearance: none;
  margin: 0;
  border: 1px solid rgba(18, 20, 26, 0.12);
  border-radius: 999px;
  background: rgba(255, 255, 255, 0.72);
  backdrop-filter: blur(8px);
  -webkit-backdrop-filter: blur(8px);
  color: #12141a !important;
  font-size: 12px;
  font-weight: 650;
  letter-spacing: 0.06em;
  line-height: 1;
  cursor: pointer;
  display: inline-flex;
  flex-direction: row;
  flex-wrap: nowrap;
  align-items: center;
  gap: 6px;
  white-space: nowrap;
  padding: 7px 10px 7px 8px;
  min-height: 34px;
  transition:
    background-color 0.15s ease,
    border-color 0.15s ease,
    box-shadow 0.15s ease,
    color 0.15s ease;
}

.cg-lang-switch__trigger:hover {
  background: #fff;
  border-color: rgba(18, 20, 26, 0.2);
}

.cg-lang-switch__trigger:focus-visible {
  outline: none;
  box-shadow: 0 0 0 3px rgba(231, 6, 29, 0.22);
}

.cg-lang-switch.is-open .cg-lang-switch__trigger {
  background: #fff;
  border-color: rgba(18, 20, 26, 0.22);
}

.cg-lang-switch__code {
  color: inherit !important;
}

.cg-lang-switch__chevron {
  width: 10px;
  height: 10px;
  flex-shrink: 0;
  opacity: 0.55;
  transition: transform 0.18s ease, opacity 0.15s ease;
}

.cg-lang-switch.is-open .cg-lang-switch__chevron {
  transform: rotate(180deg);
  opacity: 0.8;
}

/* Light pages → dark control */
.header-wrapper .cg-lang-switch--header .cg-lang-switch__trigger,
.header-wrapper .cg-lang-switch--header .cg-lang-switch__code {
  /* color set by site-fixes light/dark rules */
}

/* Dark heroes → glass pill on dark */
.header-wrapper:has(.header-nav-link.dark-mode) .cg-lang-switch--header .cg-lang-switch__trigger {
  color: #fff !important;
  border-color: rgba(255, 255, 255, 0.28);
  background: rgba(255, 255, 255, 0.08);
}

.header-wrapper:has(.header-nav-link.dark-mode) .cg-lang-switch--header .cg-lang-switch__trigger:hover,
.header-wrapper:has(.header-nav-link.dark-mode) .cg-lang-switch--header.is-open .cg-lang-switch__trigger {
  background: rgba(255, 255, 255, 0.14);
  border-color: rgba(255, 255, 255, 0.4);
}

.header-wrapper:has(.header-nav-link.dark-mode) .cg-lang-switch--header .cg-lang-switch__code {
  color: #fff !important;
}

.header-wrapper:has(.header-nav-link.dark-mode) .cg-lang-switch--header .cg-lang-flag {
  box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.25);
}

/* Mobile menu panel is light → always dark control */
.header-nav-list-item.cg-lang-switch-mobile .cg-lang-switch__trigger,
.header-nav-list-item.cg-lang-switch-mobile .cg-lang-switch__code {
  color: #12141a !important;
  border-color: rgba(18, 20, 26, 0.12);
  background: #fff;
}

.cg-lang-switch__menu {
  position: absolute;
  top: calc(100% + 10px);
  inset-inline-end: 0;
  min-width: 188px;
  padding: 6px;
  border-radius: 14px;
  border: 1px solid rgba(18, 20, 26, 0.08);
  background: #fff;
  box-shadow:
    0 1px 2px rgba(18, 20, 26, 0.04),
    0 12px 32px rgba(18, 20, 26, 0.14);
  display: flex;
  flex-direction: column;
  gap: 2px;
  z-index: 50;
}

.cg-lang-switch__menu[hidden] {
  display: none !important;
}

.cg-lang-switch__option {
  display: flex;
  flex-direction: row;
  flex-wrap: nowrap;
  align-items: center;
  gap: 10px;
  min-height: 42px;
  padding: 8px 10px;
  border-radius: 10px;
  text-decoration: none !important;
  color: #1a1d24;
  font-size: 13.5px;
  font-weight: 560;
  white-space: nowrap;
  line-height: 1.2;
  transition: background 0.12s ease, color 0.12s ease;
}

.cg-lang-switch__option .cg-lang-flag {
  width: 22px;
  height: 15px;
}

.cg-lang-switch__option:hover,
.cg-lang-switch__option:focus-visible {
  background: #f4f5f7;
  outline: none;
}

.cg-lang-switch__option.is-active {
  background: #f4f5f7;
  color: #12141a;
  font-weight: 650;
}

.cg-lang-switch__option.is-active::after {
  content: "";
  width: 7px;
  height: 7px;
  margin-inline-start: auto;
  border-radius: 50%;
  background: #e7061d;
  flex-shrink: 0;
}

.cg-lang-switch__label {
  flex: 1;
  min-width: 0;
}

.header-right-side {
  display: flex;
  align-items: center;
  flex-wrap: nowrap;
}

/* Mobile menu language row */
.header-nav-list-item.cg-lang-switch-mobile {
  display: none;
  list-style: none;
}

@media screen and (max-width: 991px) {
  .header-nav-list-item.cg-lang-switch-mobile {
    width: 100%;
    display: flex;
    justify-content: center;
    margin: 8px 0 16px;
  }

  .header-nav-list-item.cg-lang-switch-mobile .cg-lang-switch__menu {
    left: 50%;
    right: auto;
    transform: translateX(-50%);
  }
}

@media (prefers-reduced-motion: reduce) {
  .cg-lang-switch__trigger {
    transition: none !important;
  }
}

/* ---- Structural RTL ---- */
[dir="rtl"] .header-content-wrapper,
[dir="rtl"] .flex-horizontal,
[dir="rtl"] .buttons-row,
[dir="rtl"] .social-media-flex,
[dir="rtl"] .cg-store-badges,
[dir="rtl"] .accordion-header.space-between,
[dir="rtl"] .card-link.card-title {
  direction: rtl;
}

[dir="rtl"] .header-logo-link.left {
  margin-inline-end: 0;
}

[dir="rtl"] .mg-left-16px {
  margin-left: 0 !important;
  margin-inline-start: 16px;
}

[dir="rtl"] .mg-left-auto-tablet {
  margin-left: 0;
  margin-inline-start: auto;
}

/* Two-column marketing layouts: mirror composition, not image pixels */
[dir="rtl"] .layout-image-left-v1-grid-2-col,
[dir="rtl"] .cta-grid-2-col._01,
[dir="rtl"] .grid-2-columns.features-grid-2-col._02,
[dir="rtl"] .grid-2-columns.feature-grid-2-col._01,
[dir="rtl"] .grid-2-columns.features-grid-2-col._06 {
  direction: rtl;
}

[dir="rtl"] .stat-grid,
[dir="rtl"] .footer-cards,
[dir="rtl"] .menu-grid-3-col,
[dir="rtl"] .w-layout-layout.features-v1 {
  direction: rtl;
}

[dir="rtl"] .text-center,
[dir="rtl"] .text-center---tablet,
[dir="rtl"] .flex-vertical.center.text-center {
  text-align: center;
}

[dir="rtl"] .text-left,
[dir="rtl"] p,
[dir="rtl"] h1,
[dir="rtl"] h2,
[dir="rtl"] h3,
[dir="rtl"] h4,
[dir="rtl"] .display-1,
[dir="rtl"] .display-2,
[dir="rtl"] .display-4,
[dir="rtl"] .card-title,
[dir="rtl"] label,
[dir="rtl"] .form-label {
  text-align: start;
}

[dir="rtl"] .text-center .display-1,
[dir="rtl"] .text-center .display-2,
[dir="rtl"] .text-center p,
[dir="rtl"] .flex-vertical.center.text-center .display-1,
[dir="rtl"] .flex-vertical.center.text-center .display-2,
[dir="rtl"] .flex-vertical.center.text-center p,
[dir="rtl"] .text-center---tablet .display-2,
[dir="rtl"] .text-center tablet .display-2 {
  text-align: center;
}

/* Directional arrows / chevrons */
[dir="rtl"] .card-arrow-diagonal-right,
[dir="rtl"] .line-rounded-icon.card-arrow-diagonal-right {
  display: inline-block;
  transform: scaleX(-1);
}

[dir="rtl"] .floating-card-arrow {
  inset-inline-start: auto;
  inset-inline-end: 24px;
}

/*
 * Driver feature slider arrows sit on the physical right (under RTL copy).
 * Mirror them to the left so they clear the heading, keep ← → order.
 */
[dir="rtl"] .btn-circle-secondary.slider-arrow.left---top-left {
  inset: -104px auto auto 0;
  right: auto !important;
  left: 0 !important;
}

[dir="rtl"] .btn-circle-secondary.slider-arrow.right---top-left {
  top: -104px;
  right: auto !important;
  left: 84px !important;
}

@media screen and (max-width: 991px) {
  [dir="rtl"] .btn-circle-secondary.slider-arrow.left---top-left {
    inset: auto auto -100px 0;
    right: auto !important;
    left: 0 !important;
  }

  [dir="rtl"] .btn-circle-secondary.slider-arrow.right---top-left {
    inset: auto auto -100px 80px;
    right: auto !important;
    left: 80px !important;
  }
}

@media screen and (max-width: 479px) {
  [dir="rtl"] .btn-circle-secondary.slider-arrow.left---top-left {
    bottom: -80px;
    right: auto !important;
    left: 0 !important;
  }

  [dir="rtl"] .btn-circle-secondary.slider-arrow.right---top-left {
    bottom: -80px;
    right: auto !important;
    left: 60px !important;
  }
}

[dir="rtl"] .accordion-side.right-side {
  margin-inline-start: 12px;
  margin-inline-end: 0;
}

/*
 * Keep LTR for emails, phones, codes.
 * Never force LTR on whole card/link wrappers that nest Arabic copy
 * (contact cards, hero tel rows) — only isolate the address itself.
 */
[dir="rtl"] .cg-ltr,
[dir="rtl"] .text-wrap-anywhere,
[dir="rtl"] input[type="email"],
[dir="rtl"] input[type="tel"],
[dir="rtl"] input[type="url"] {
  direction: ltr;
  unicode-bidi: isolate;
  text-align: left;
}

/* Leaf mailto/tel anchors (text only, no nested Arabic UI) */
[dir="rtl"] a[href^="mailto:"]:not(:has(*)),
[dir="rtl"] a[href^="tel:"]:not(:has(*)) {
  direction: ltr;
  unicode-bidi: isolate;
  text-align: left;
}

/* Contact cards: keep centered composition in RTL */
[dir="rtl"] .contact-link .flex-vertical.center .card-title,
[dir="rtl"] .contact-link .flex-vertical.center p {
  text-align: center;
}

[dir="rtl"] .contact-link .card-link.card-title {
  justify-content: center;
  gap: 8px;
}

[dir="rtl"] .grid-3-columns.gap-column-28px---row-32px {
  direction: rtl;
}

[dir="rtl"] label + input[type="email"],
[dir="rtl"] label + input[type="tel"] {
  text-align: left;
}

/* Help breadcrumbs */
[dir="rtl"] .breadcrumb-wrapper,
[dir="rtl"] .breadcrumbs,
[dir="rtl"] nav[aria-label="Breadcrumb"] {
  direction: rtl;
}

/* Application wizard RTL */
[dir="rtl"] .cg-app-wizard,
[dir="rtl"] .cg-app-wizard__progress,
[dir="rtl"] .cg-app-wizard__actions,
[dir="rtl"] .cg-app-wizard__review-title,
[dir="rtl"] .cg-app-wizard__review-list li {
  direction: rtl;
}

[dir="rtl"] .cg-app-wizard__field label,
[dir="rtl"] .cg-app-wizard legend {
  text-align: start;
}

[dir="rtl"] .cg-app-wizard input[type="email"],
[dir="rtl"] .cg-app-wizard input[type="tel"] {
  direction: ltr;
  text-align: left;
  unicode-bidi: isolate;
}

[dir="rtl"] .cg-app-wizard__review-val {
  unicode-bidi: plaintext;
}

/* Arabic line-height breathing room */
[dir="rtl"] .display-1,
[dir="rtl"] .display-2,
[dir="rtl"] .display-4,
[dir="rtl"] h1,
[dir="rtl"] h2,
[dir="rtl"] h3 {
  line-height: 1.35;
}

[dir="rtl"] p,
[dir="rtl"] .text-200,
[dir="rtl"] .accordion-title {
  line-height: 1.65;
}

[dir="rtl"] .btn-primary,
[dir="rtl"] .btn-secondary,
[dir="rtl"] .w-button {
  line-height: 1.4;
}

/* Do NOT flip decorative people/photos/logos/screenshots */
[dir="rtl"] .header-logo,
[dir="rtl"] .footer-logo,
[dir="rtl"] img.fit-cover,
[dir="rtl"] .card-picture img,
[dir="rtl"] .tab-image,
[dir="rtl"] .cg-store-badge img {
  transform: none !important;
}

/*
 * Final dark CTA: in LTR the map/route SVG sits in the right 52% panel.
 * In RTL the copy sits on the right, so move the panel to the left and
 * mirror the decorative route graphic so the “S” opens toward the text.
 * Fade the map into the black field so it does not sit on the headline.
 * (Decorative map only — not logos, people, or app screenshots.)
 */
[dir="rtl"] .bg-content-absolute.right.home-v1-cta-bg {
  inset: 0% auto 0% 0%;
  right: auto;
  left: 0;
  -webkit-mask-image: linear-gradient(to right, #000 42%, transparent 92%);
  mask-image: linear-gradient(to right, #000 42%, transparent 92%);
}

[dir="rtl"] .home-v1-cta-bg img.fit-cover,
[dir="rtl"] .home-v1-cta-bg img.object-position-left-0 {
  transform: scaleX(-1) !important;
  object-position: 0% 50%;
}

/* Help search modal RTL when page is Arabic */
[dir="rtl"] .cg-hs-dialog,
[dir="rtl"] .cg-hs-input,
[dir="rtl"] .cg-hs-results {
  direction: rtl;
  text-align: start;
}

[dir="rtl"] .cg-hs-input {
  text-align: start;
}