/* Arabic and Russian corridor pages.
   The site shell is English and Turkish; these pages carry their own bar and
   footer instead of a navigation that would lead to untranslated sections. */

.rl10n-bar {
  display: flex; align-items: center; justify-content: space-between; gap: 16px;
  padding: 14px clamp(16px, 4vw, 34px);
  background: #0F1E33; color: #F5F4F0;
}
.rl10n-brand {
  color: #F5F4F0; text-decoration: none;
  font: 700 15px/1 Satoshi, 'Segoe UI', system-ui, sans-serif; letter-spacing: .16em;
}
.rl10n-langs {
  display: flex; align-items: center; gap: 12px;
  font: 600 12px/1 Satoshi, 'Segoe UI', system-ui, sans-serif; letter-spacing: .08em;
}
.rl10n-langs a { color: rgba(245, 244, 240, .68); text-decoration: none; }
.rl10n-langs a:hover, .rl10n-langs a:focus-visible { color: #F5F4F0; }
.rl10n-langs span { color: #C9A227; }

.rl10n-foot {
  padding: 30px clamp(16px, 4vw, 34px) 46px;
  background: #0F1E33; color: rgba(245, 244, 240, .76);
  font: 400 13px/1.75 Satoshi, 'Segoe UI', system-ui, sans-serif;
}
.rl10n-foot p { margin: 0 0 10px; max-width: 74ch; }
.rl10n-foot a { color: #C9A227; }

/* Arabic reads right to left; the shared components inherit the direction. */
.rl10n[dir="rtl"] { text-align: right; }
.rl10n[dir="rtl"] .crumb,
.rl10n[dir="rtl"] .rcard__b,
.rl10n[dir="rtl"] .route-others { text-align: right; }
.rl10n[dir="rtl"] .route-others { padding-right: 1.1em; padding-left: 0; }
.rl10n[dir="rtl"] .rcard__b b i { transform: scaleX(-1); display: inline-block; }
.rl10n[dir="rtl"] .ai-cpage-facts { direction: rtl; }

/* The maps are drawn west to east whatever the script does. */
.rl10n .rmap, .rl10n .rgrid { direction: ltr; }
.rl10n[dir="rtl"] .rcard__b { direction: rtl; }

/* The fact cards are ruled on their leading edge; in Arabic that is the right. */
.rl10n[dir="rtl"] .ai-cpage-facts div {
  border-left: 0; border-right: 2px solid #C8A96A; padding: 4px 16px 4px 0;
}

/* touch-type:start — generated by tools/touch-type.mjs, do not edit by hand */
/* iOS zooms the page when a focused control's text is under 16px and does not
   zoom back. max(16px, 1em) raises only what is below the floor: a control
   designed larger keeps its size, and nothing has to be listed by name — which
   matters, because the worst offenders inherit their size rather than being
   given one. Checkboxes and radios are left alone; they have no text. */
@media (pointer: coarse) {
  input:not([type="checkbox"]):not([type="radio"]),
  select,
  textarea { font-size: max(16px, 1em) !important; }
}
/* touch-type:end */