/* CityCalc — RTL adjustments. Only takes effect when html[dir="rtl"]. */

[dir="rtl"] body,
[dir="rtl"] input,
[dir="rtl"] button,
[dir="rtl"] textarea,
[dir="rtl"] select {
  font-family: 'Tajawal', 'Inter', -apple-system, BlinkMacSystemFont, sans-serif;
}

/* Use a polished Arabic display face for headings while keeping serif accents
   for English brand marks. */
[dir="rtl"] h1, [dir="rtl"] h2, [dir="rtl"] h3, [dir="rtl"] h4,
[dir="rtl"] .headline, [dir="rtl"] .side-title,
[dir="rtl"] .pp-title, [dir="rtl"] .panel-title,
[dir="rtl"] .article-title, [dir="rtl"] .thread-title {
  font-family: 'Tajawal', 'Inter', -apple-system, sans-serif;
  letter-spacing: 0;
  font-weight: 600;
}

/* Brand mark stays in Latin script for visual continuity. */
[dir="rtl"] .logo {
  font-family: 'Playfair Display', serif;
  direction: ltr;
  unicode-bidi: isolate;
}

/* Search bar mirroring */
[dir="rtl"] .search { padding: 4px 22px 4px 4px; }
[dir="rtl"] .search-icon { margin-right: 0; margin-left: 14px; }

/* Side panel and lists in RTL */
[dir="rtl"] .sidebar { border-right: none; border-left: 1px solid var(--border); }

/* Mirror "→" style affordances */
[dir="rtl"] .cmp-go::after,
[dir="rtl"] .more::after {
  /* leave glyphs as authored; we use ← in i18n strings instead */
}

/* Form inputs naturally right-align in RTL — keep editorial spacing. */
[dir="rtl"] .field-label { text-align: right; }
[dir="rtl"] input, [dir="rtl"] textarea, [dir="rtl"] select { text-align: right; }

/* Footer */
[dir="rtl"] .footer-links { flex-direction: row-reverse; }

/* Language switch */
.lang-switch {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  margin-inline-start: 14px;
  padding-inline-start: 14px;
  border-inline-start: 1px solid var(--border, rgba(10,15,28,.14));
  font-size: 12px;
  color: var(--ink-3, #4A5568);
}
.lang-switch .lang-opt {
  color: var(--ink-3, #4A5568);
  text-decoration: none;
  transition: color .15s;
}
.lang-switch .lang-opt:hover { color: var(--ink, #0A0F1C); }
.lang-switch .lang-opt.on { color: var(--ink, #0A0F1C); font-weight: 600; }
.lang-switch .lang-sep { color: var(--ink-4, #94A3B8); }
[dir="rtl"] .lang-switch [lang="ar"] { font-family: 'Tajawal', sans-serif; }

/* Subtle "English content currently shown" notice */
.en-notice {
  margin: 12px 0;
  padding: 8px 12px;
  font-size: 12px;
  color: var(--ink-3, #4A5568);
  background: rgba(184,137,61,.06);
  border-inline-start: 2px solid var(--gold, #B8893D);
  border-radius: 4px;
}

@media (max-width: 640px) {
  .lang-switch { margin-inline-start: 8px; padding-inline-start: 8px; }
}