/* Other languages (js/i18n.js). Master copy: .tools/gen/i18n/site-files/css/i18n.css */
html.i18n-wait body{ visibility:hidden; }   /* until the translation is in place (the head script gives up after 4 s) */

/* the language picker in the header */
.lang-pick{ position:relative; display:inline-flex; flex:none; }
.lang-btn{ display:inline-flex; align-items:center; gap:.3rem; min-height:40px; padding:0 .6rem; border:1px solid rgba(127,127,127,.35); border-radius:999px; background:transparent; color:inherit; font:inherit; font-size:.75rem; font-weight:600; letter-spacing:.06em; cursor:pointer; }
.lang-btn:hover{ border-color:currentColor; }
.lang-btn:focus-visible, .lang-menu a:focus-visible{ outline:3px solid currentColor; outline-offset:2px; }
.lang-menu{ position:absolute; top:calc(100% + .45rem); inset-inline-end:0; z-index:200; min-width:11.5rem; margin:0; padding:.35rem; list-style:none; background:#fff; border:1px solid rgba(0,0,0,.12); border-radius:12px; box-shadow:0 14px 36px rgba(0,0,0,.16); }
.lang-menu[hidden]{ display:none; }
.lang-menu li{ margin:0; }
.lang-menu a{ display:block; padding:.55rem .75rem; border-radius:8px; color:#1d1a1c; text-decoration:none; font-size:.98rem; letter-spacing:0; text-transform:none; text-align:start; }
.lang-menu a:hover, .lang-menu a[aria-current]{ background:#f2ecee; }
.lang-menu a[aria-current]{ font-weight:700; }
@media (max-width:899px){ .lang-pick{ margin-inline-start:auto; } .lang-btn .lang-code{ display:inline; } }

/* the note on legal pages, which stay in English */
.i18n-legal-note{ margin:1rem auto; max-width:72ch; padding:.75rem 1rem; border:1px dashed rgba(127,127,127,.5); border-radius:10px; background:rgba(127,127,127,.08); font-size:.95rem; }

/* scripts that join or stack letters: no letter-spacing, no small caps */
html:lang(ar) *, html:lang(ur) *, html:lang(pa) *, html:lang(hi) *, html:lang(gu) *{ letter-spacing:0 !important; }
html:lang(ar), html:lang(ur), html:lang(pa), html:lang(hi), html:lang(gu){ line-height:1.75; }
html:lang(ur) body{ font-family:"Noto Nastaliq Urdu", "Jameel Noori Nastaleeq", "Noto Naskh Arabic", "Geeza Pro", system-ui, sans-serif; }
html:lang(ur) h1, html:lang(ur) h2, html:lang(ur) h3{ line-height:1.6; }

/* right to left: mirror the few things that are placed with left/right */
html[dir="rtl"] .burger{ margin-left:0; margin-right:auto; }
html[dir="rtl"] .link-arrow::after, html[dir="rtl"] .arrow{ display:inline-block; transform:scaleX(-1); }
/* the hidden "Skip to content" link waits off-screen on the side a right-to-left page can't scroll to */
html[dir="rtl"] a.skip-link{ left:auto; right:-9999px; }
html[dir="rtl"] a.skip-link:focus{ right:1rem; left:auto; }
html[dir="rtl"] a.hd-skip{ left:auto; right:-9999px; }          /* the pizza home page has its own skip link */
html[dir="rtl"] a.hd-skip:focus{ right:1rem; left:auto; }
html[dir="rtl"] .check-list li{ padding-left:0; padding-right:1.7rem; }       /* ticks on the reading side (studio lists) */
html[dir="rtl"] .check-list li::before{ left:auto; right:0; }
html[dir="rtl"] .strip{ direction:ltr; }   /* the moving photo strip runs the same way in every language */
/* Gurmukhi, Devanagari and Gujarati read small at the sizes chosen for Latin text: a little larger */
html:lang(pa), html:lang(hi), html:lang(gu){ font-size:106.25%; }
