/* Per-language font stacks for the pages that are styled by Home.css / Register.css instead of pooltransact.css
   (landing and sign-up). Same stacks as the "Per-language font stacks" block in pooltransact.css.
   Load this AFTER Home.css/Register.css. Home.css reads its font from --font-sans, so the variable is
   overridden as well as the body/heading rules. */
html:lang(ar) {
    --font-sans: 'Segoe UI', Tahoma, 'Noto Sans Arabic', Arial, sans-serif;
}

html:lang(zh-Hans) {
    --font-sans: 'Microsoft YaHei', 'PingFang SC', 'Noto Sans SC', 'Hiragino Sans GB', sans-serif;
}

:lang(ar) body,
:lang(ar) h1, :lang(ar) h2, :lang(ar) h3, :lang(ar) h4, :lang(ar) h5, :lang(ar) h6 {
    font-family: 'Segoe UI', Tahoma, 'Noto Sans Arabic', Arial, sans-serif;
}

:lang(zh-Hans) body,
:lang(zh-Hans) h1, :lang(zh-Hans) h2, :lang(zh-Hans) h3, :lang(zh-Hans) h4, :lang(zh-Hans) h5, :lang(zh-Hans) h6 {
    font-family: 'Microsoft YaHei', 'PingFang SC', 'Noto Sans SC', 'Hiragino Sans GB', sans-serif;
}

/* Russian: the system/Inter body stack already covers Cyrillic; only the Space Grotesk headings need a replacement. */
:lang(ru) h1, :lang(ru) h2, :lang(ru) h3, :lang(ru) h4, :lang(ru) h5, :lang(ru) h6 {
    font-family: 'Inter', 'Segoe UI', Arial, sans-serif;
}

/* Elements that name a monospace/Inter font of their own (sign-up section labels and fields, the Lagos tag, .mono): a
   monospace fallback has no proper Arabic shaping and no Han glyphs, so those two languages use their own stack there. */
html:lang(ar) {
    --font-mono: ui-monospace, Consolas, 'Segoe UI', Tahoma, 'Noto Sans Arabic', Arial, sans-serif;
}

html:lang(zh-Hans) {
    --font-mono: 'Microsoft YaHei', 'PingFang SC', 'Noto Sans SC', 'Hiragino Sans GB', sans-serif;
}

:lang(ar) .form-input {
    font-family: 'Segoe UI', Tahoma, 'Noto Sans Arabic', Arial, sans-serif;
}

:lang(ar) .form-section-label,
:lang(ar) .pr-lagos-tag,
:lang(ar) .mono {
    font-family: 'JetBrains Mono', ui-monospace, Consolas, 'Segoe UI', Tahoma, 'Noto Sans Arabic', Arial, sans-serif;
}

:lang(zh-Hans) .form-input {
    font-family: 'Microsoft YaHei', 'PingFang SC', 'Noto Sans SC', 'Hiragino Sans GB', sans-serif;
}

:lang(zh-Hans) .form-section-label,
:lang(zh-Hans) .pr-lagos-tag,
:lang(zh-Hans) .mono {
    font-family: 'JetBrains Mono', ui-monospace, Consolas, 'Microsoft YaHei', 'PingFang SC', 'Noto Sans SC', 'Hiragino Sans GB', monospace;
}

/* ---------- language selector (_LanguageSwitcher) on the pages that do not load Bootstrap ----------
   The partial renders <form class="pt-lang-switcher"><select>; Bootstrap's form-select classes do nothing here, so
   style it like the page's own controls (same look as the footer's ".lang-curr select"). */
#siteHeader .pt-lang-switcher,
.mobile-nav .pt-lang-switcher {
    margin: 0;
}

#siteHeader .pt-lang-switcher select,
.mobile-nav .pt-lang-switcher select {
    background: var(--white, #fff);
    border: 1px solid var(--line, #E7E7E7);
    color: var(--ink-700, #3B3A39);
    padding: 6px 10px;
    border-radius: var(--radius-btn, 8px);
    font: inherit;
    font-size: 13.5px;
    cursor: pointer;
    min-width: 8.5rem;
}

#siteHeader .pt-lang-switcher select:hover,
#siteHeader .pt-lang-switcher select:focus {
    border-color: var(--blue-700, #0F6CBD);
    outline: none;
}

/* The drawer's links are full-width rows; give the selector its own row at the bottom. */
.mobile-nav .pt-lang-switcher {
    padding: 14px 0;
}

.mobile-nav .pt-lang-switcher select {
    width: 100%;
}

/* ---------- landing, PoolRide photo: the "Lagos" caption and the floating chip share the bottom edge ----------
   In English the caption already runs a little under the chip; translated captions and chips are longer, so keep
   them side by side: the caption wraps inside the left half of the photo instead of sliding under the chip. */
@media (min-width: 576px) {
  html:not(:lang(en)) .pr-lagos-tag {
    max-width: calc(50% - 40px);
    white-space: normal;
    line-height: 1.35;
    border-radius: 16px;
  }
}