/* Teewal · éléments communs à toutes les langues : suggestion de langue (bandeau ajouté par assets/site.js).
   Sélecteur de langue et mention « traduction » : assets/site.css. Propriétés logiques (RTL prêt). */
.lang-hint { background: var(--color-ink); color: var(--color-page); font-size: 14px; }
.lang-hint .wrap { display: flex; flex-wrap: wrap; align-items: center; gap: 4px 16px; padding-block: 6px; }
.lang-hint a { display: inline-flex; align-items: center; min-height: 44px; color: inherit; font-weight: 600; text-underline-offset: 3px; }
.lang-hint button { margin-inline-start: auto; min-height: 44px; min-width: 44px; border: 0; background: none; color: inherit; font: inherit; text-decoration: underline; text-underline-offset: 3px; cursor: pointer; }
.lang-hint :focus-visible { outline: 2px solid currentColor; outline-offset: 2px; }
/* Mobile : une seule ligne compacte ; la phrase reste lue par les lecteurs d'écran, le lien suffit à l'écran. */
@media (max-width: 640px) {
  .lang-hint { font-size: 13px; }
  .lang-hint .wrap { flex-wrap: nowrap; gap: 12px; padding-block: 0; }
  .lang-hint .wrap > span { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
  .lang-hint a, .lang-hint button { white-space: nowrap; }
}

/* De droite à gauche : les chevrons (›) sont retournés par le navigateur ; références et heures gardent leur sens de lecture.
   Les flèches écrites dans les textes (→) se traduisent : clé site.common.arrow (← en arabe). Les icônes de direction sont retournées. */
[dir="rtl"] .mono, [dir="rtl"] .small { unicode-bidi: plaintext; }
[dir="rtl"] .flip { transform: scaleX(-1); }
