/* Festival Nomade — styles i18n partagés : sélecteur de langue + RTL (texte) */

/* ---------- Sélecteur de langue ---------- */
.fn-lang{
  display:inline-flex;
  align-items:stretch;
  gap:2px;
  margin:0 14px;
  padding:3px;
  border:1px solid rgba(255,255,255,.28);
  border-radius:999px;
  background:rgba(0,0,0,.25);
  backdrop-filter:blur(6px);
  -webkit-backdrop-filter:blur(6px);
  line-height:1;
  flex:0 0 auto;
}
.fn-lang__btn{
  appearance:none;
  border:0;
  margin:0;
  cursor:pointer;
  padding:6px 11px;
  min-width:34px;
  border-radius:999px;
  background:transparent;
  color:rgba(255,255,255,.78);
  font-family:'Inter',system-ui,sans-serif;
  font-size:11px;
  font-weight:600;
  letter-spacing:.08em;
  text-transform:uppercase;
  line-height:1;
  transition:background .2s,color .2s;
}
.fn-lang__btn[lang="ar"]{font-size:14px;letter-spacing:0}
.fn-lang__btn:hover{color:#fff;background:rgba(255,255,255,.12)}
.fn-lang__btn.is-active{background:#fff;color:#0a0a0a}

/* En mode RTL, le sélecteur reste lisible de gauche à droite (codes de langue). */
html.lang-ar .fn-lang{direction:ltr}

.fn-lang-li{list-style:none;display:flex;align-items:center}

@media(max-width:900px){
  .fn-lang{margin:0;padding:3px}
  .fn-lang__btn{padding:8px 14px;min-width:38px;font-size:12px}
  /* Dans le menu burger (colonne), le sélecteur se place tout en bas. */
  .fn-lang-li{margin-top:auto;padding-top:24px;width:100%;justify-content:flex-start}
}

/* ---------- RTL : texte seulement, structure conservée ---------- */
/* L'attribut dir="rtl" sur <html> est conservé pour la sémantique, mais on
   rétablit un flux LTR au niveau de la structure (body → grilles/flex/marquee)
   afin de préserver l'ordre des colonnes (bento) et les animations. */
html.lang-ar body{direction:ltr;text-align:left}

/* On ré-applique ensuite direction:rtl + alignement + police arabe uniquement
   aux éléments porteurs de texte (spécificité supérieure → ils l'emportent). */
html.lang-ar :is(
  h1,h2,h3,h4,h5,p,li,blockquote,cite,figcaption,
  .eyebrow,.section__eyebrow,.hero__eyebrow,.hero__tagline,.hero__sub,
  .about__lead,.about__body,.about__big,.about__h,
  .s-head__r p,.s-head__sub,
  .stat__l,.day__tag,.day__desc,.day__date,.tl__year,.tl p,
  .pillar p,.khaima__lead,.contact__lead,.cd__l,.cd__v,
  .venue p,.programme__sub,.foot p,.foot__dir
){
  direction:rtl;
  text-align:right;
  font-family:'Noto Naskh Arabic','IBM Plex Sans Arabic','Cairo','Inter',system-ui,sans-serif;
}

/* Les éléments naturellement centrés le restent (titres de sections centrées). */
html.lang-ar :is(
  .quote-band blockquote,.quote-band cite,
  .foot p,.foot__dir,.marquee__track
){text-align:center}

/* Le menu déroulant mobile s'aligne à droite proprement. */
html.lang-ar .nav__links a{text-align:right;direction:rtl}

/* Garder chiffres/latin (dates, lakhaima.org, téléphone) en LTR au sein du RTL. */
html.lang-ar .ltr,
html.lang-ar [data-i18n] .ltr{
  direction:ltr;
  unicode-bidi:isolate;
  display:inline-block;
}
