/* language switcher (all demo pages, hub and backend) */
.azl{display:inline-flex;position:relative}
.azl-btn{display:inline-flex;align-items:center;gap:6px;height:40px;padding:0 12px;border-radius:999px;border:1px solid currentColor;border-color:color-mix(in srgb,currentColor 35%,transparent);background:transparent;color:inherit;font:600 13px/1 system-ui,-apple-system,"Segoe UI",sans-serif;letter-spacing:.06em;cursor:pointer;transition:background .2s,border-color .2s}
.azl-btn:hover{background:color-mix(in srgb,currentColor 10%,transparent)}
.azl-btn svg{width:18px;height:18px;fill:none;stroke:currentColor;stroke-width:1.6}
.azl-pop{position:fixed;inset:0;z-index:2000;display:flex;align-items:center;justify-content:center;padding:16px;animation:azlin .25s ease both;font-family:system-ui,-apple-system,"Segoe UI",sans-serif}
.azl-pop.out{animation:azlin .2s ease reverse both}
@keyframes azlin{from{opacity:0}to{opacity:1}}
.azl-scrim{position:absolute;inset:0;background:rgba(10,14,16,.5);-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px)}
.azl-box{position:relative;width:min(760px,100%);max-height:min(86vh,760px);display:flex;flex-direction:column;background:#fbfaf7;color:#16191b;border-radius:24px;box-shadow:0 40px 120px -30px rgba(0,0,0,.6);overflow:hidden;animation:azlbox .4s cubic-bezier(.2,.7,.1,1) both}
@keyframes azlbox{from{transform:translateY(24px) scale(.97)}to{transform:none}}
.azl-h{display:flex;align-items:center;justify-content:space-between;padding:20px 22px 8px}
.azl-h strong{font-size:20px;font-weight:600}
.azl-x{width:38px;height:38px;border-radius:50%;border:0;background:#efece6;font-size:22px;line-height:1;cursor:pointer;color:#16191b}
.azl-q{margin:6px 22px 10px;height:46px;border-radius:14px;border:1px solid #ddd8ce;padding:0 16px;font:inherit;font-size:15px;background:#fff;color:#16191b}
.azl-list{overflow-y:auto;padding:0 22px 22px}
.azl-list h4{margin:16px 0 8px;font-size:11px;letter-spacing:.2em;text-transform:uppercase;color:#8b9093}
.azl-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(160px,1fr));gap:8px}
.azl-grid button{display:flex;justify-content:space-between;align-items:center;gap:8px;padding:12px 14px;border-radius:14px;border:1px solid #e8e4dc;background:#fff;color:#16191b;font:inherit;font-size:15px;text-align:start;cursor:pointer;transition:border-color .2s,transform .2s}
.azl-grid button:hover{border-color:#16191b;transform:translateY(-1px)}
.azl-grid button.on{background:#16191b;color:#fff;border-color:#16191b}
.azl-grid button small{font-size:11px;letter-spacing:.08em;opacity:.55}
.azl-grid button[hidden]{display:none}
@media (max-width:600px){.azl-pop{align-items:flex-end;padding:0}.azl-box{border-radius:22px 22px 0 0;max-height:88vh}.azl-grid{grid-template-columns:1fr 1fr}.azl-btn{height:36px;padding:0 10px}}
/* right-to-left basics */
[dir=rtl] .ic{transform:scaleX(-1)}
/* placements */
.demo-bar .azl-btn{height:30px;padding:0 10px;font-size:12px}
@media (max-width:760px){.demo-bar .azl-bar{display:none}}
.hd .azl{margin-inline-start:auto;margin-inline-end:10px}
.top .azl-top{margin-inline-start:8px}
.top .azl-top .azl-btn{height:40px;color:var(--ink,#16191b)}
.login-box{position:relative}
.login-lang{position:absolute;top:18px;inset-inline-end:18px}
.top-r .azl-btn{color:#f2efe9}
/* Latin logos built from letter spans keep their order in RTL */
[dir=rtl] .x-load-logo,[dir=rtl] .lf-title{direction:ltr}
/* italic accent word: room for the synthetic slant of non-Latin scripts */
.xw.em{margin-inline-end:.14em}
/* tall scripts (Arabic, Urdu, Indic, Thai) need more room than the Latin display line-heights */
:is([lang=ar],[lang=ur],[lang=hi],[lang=bn],[lang=th]) :is(h1,h2,h3){line-height:1.3!important}
:is([lang=ar],[lang=ur]) :is(h1,h2,h3) em{font-style:normal}
/* letter-spacing breaks Arabic joining and the Devanagari/Bengali headline bar */
:is([lang=ar],[lang=ur],[lang=hi],[lang=bn]) body *:not(.azl-grid small):not([lang=en]){letter-spacing:0!important}
/* monospace fonts render non-Latin scripts letter by letter: use the system face instead */
:is([lang=ar],[lang=ur],[lang=hi],[lang=bn],[lang=th],[lang=zh],[lang=ja],[lang=ko]) :is(.nr-mono,.nr-sub,.nr-coords,.x3-tlab small){font-family:system-ui,-apple-system,"Segoe UI",sans-serif}
/* language picker: the search field keeps its side margins in both directions */
.azl-q{width:auto;min-width:0;box-sizing:border-box;align-self:stretch;margin-inline:22px}
.azl-box,.azl-list{box-sizing:border-box}
.azl-grid{min-width:0}