/* Shared styles for localized pages: language switcher, RTL fixes and
   per-script font stacks. Linked from every page by i18n/build.py. */

.lang-switcher {
  margin: 24px auto 0;
  max-width: 1160px;
  font-size: 13px;
  color: var(--tertiary, #8A847E);
}
.lang-switcher h2 {
  font-family: inherit;
  font-size: 13px;
  font-weight: 600;
  letter-spacing: 0;
  margin: 0 0 8px;
  color: var(--secondary, #5C5752);
}
.lang-switcher ul {
  display: flex;
  flex-wrap: wrap;
  gap: 6px 16px;
  list-style: none;
  margin: 0;
  padding: 0;
}
.lang-switcher a {
  color: var(--secondary, #5C5752);
  text-decoration: underline;
  text-underline-offset: 3px;
}
.lang-switcher a:hover,
.lang-switcher a:focus-visible { color: var(--ink, #211F1C); }
.lang-switcher a[aria-current="page"] {
  color: var(--ink, #211F1C);
  font-weight: 600;
  text-decoration: none;
}
.footer .lang-switcher { padding: 0; }
.footer-inner:has(.footer-brand) + .lang-switcher { max-width: 1200px; }

/* Arabic: system-safe Arabic fonts, no synthetic italics or tracking. */
html[lang="ar"] {
  --font-display: 'Noto Naskh Arabic', 'Newsreader', Georgia, serif;
  --font-body: 'IBM Plex Sans Arabic', 'Inter', -apple-system, system-ui, sans-serif;
}
html[dir="rtl"] body * { letter-spacing: normal !important; }
html[dir="rtl"] em { font-style: normal; }

/* RTL layout fixes for the home page (index.html CSS) and topic.css. */
html[dir="rtl"] .feature.feature--reverse .feature-inner { direction: ltr; }
html[dir="rtl"] .feature.feature--reverse .feature-inner > * { direction: rtl; }
html[dir="rtl"] .pillars { text-align: right; }
html[dir="rtl"] .hero::before { right: auto; left: -200px; }
html[dir="rtl"] .article-body ul { margin: 0 22px 18px 0; }
html[dir="rtl"] .nav-cta span[aria-hidden="true"] { display: inline-block; transform: scaleX(-1); }
@media (max-width: 900px) {
  html[dir="rtl"] .feature.feature--reverse .feature-inner { direction: rtl; }
  html[dir="rtl"] .feature-bullets li { text-align: right; }
}