/* ============================================================
   NPE Tournament — Four Language Typography
   Path: app/static/css/locale-fonts.css
   Loaded AFTER every page-specific CSS, in both base templates.
   Persian: Vazirmatn | English: Inter
   Arabic: Noto Sans Arabic | Russian: Golos Text
   ============================================================ */

:root {
  --npe-font-ui: "Vazirmatn", Tahoma, "Segoe UI", sans-serif;
  --npe-font-latin: "Inter", "Segoe UI", Arial, sans-serif;
  --npe-font-code: Consolas, "Courier New", monospace;
  --npe-content-leading: 1.85;
}

html[data-locale="fa"] {
  --npe-font-ui: "Vazirmatn", "Noto Sans Arabic", Tahoma, sans-serif;
  --npe-content-leading: 1.9;
}

html[data-locale="ar"] {
  --npe-font-ui: "Noto Sans Arabic", "Vazirmatn", Tahoma, sans-serif;
  --npe-content-leading: 1.95;
}

html[data-locale="en"] {
  --npe-font-ui: "Inter", "Segoe UI", Arial, sans-serif;
  --npe-content-leading: 1.65;
}

html[data-locale="ru"] {
  --npe-font-ui: "Golos Text", "Inter", "Segoe UI", Arial, sans-serif;
  --npe-content-leading: 1.7;
}

html, body {
  font-family: var(--npe-font-ui);
}

body {
  font-family: var(--npe-font-ui) !important;
  line-height: var(--npe-content-leading);
}

/* In older CSS files a number of labels use font: ... Arial/Helvetica.
   Override only the FAMILY, leaving size, weight, and geometry intact. */
html[data-locale] body :is(
  h1, h2, h3, h4, h5, h6,
  p, span, strong, b, em, small, label,
  a, button, input, select, option, textarea,
  li, dt, dd, th, td, caption, legend, summary, figcaption
) {
  font-family: var(--npe-font-ui) !important;
}

/* Numbers, account IDs, and brand lettering remain stable in all scripts. */
html[data-locale] body :is(
  .brand-name, .footer-brand, .admin-brand-name,
  .topline-label, .topline-date, .admin-topbar-eyebrow,
  .lb-podium-profit, .lb-podium-percent, .lb-my-rank,
  .db-ltr, .admin-ltr, .ap-mono, .av-mono,
  .an-mono, .as-mono, .an-ids-textarea,
  [data-npe-numeric]
) {
  font-family: var(--npe-font-latin) !important;
  font-variant-numeric: tabular-nums;
}

html[data-locale] body :is(code, pre, kbd, samp, [data-npe-code]) {
  font-family: var(--npe-font-code) !important;
}

/* Language selector contains all four scripts at the same time.
   A broad fallback stack keeps Arabic, Persian and Cyrillic readable. */
html[data-locale] body .npe-locale-select,
html[data-locale] body .npe-locale-select option {
  font-family: "Vazirmatn", "Noto Sans Arabic", "Golos Text", "Inter", Tahoma, Arial, sans-serif !important;
  font-size: 12px;
  font-weight: 650;
  line-height: 1.75;
  min-width: 0;
}

html[data-locale] body .npe-locale-box {
  direction: ltr;
  unicode-bidi: isolate;
  flex-shrink: 0;
}

/* Ensure text direction truly matches chosen language on both shells. */
html[data-locale="fa"], html[data-locale="ar"] { direction: rtl; }
html[data-locale="en"], html[data-locale="ru"] { direction: ltr; }

html[data-locale="fa"] .admin-shell,
html[data-locale="ar"] .admin-shell,
html[data-locale="fa"] .admin-auth-layout,
html[data-locale="ar"] .admin-auth-layout { direction: rtl; }

html[data-locale="en"] .admin-shell,
html[data-locale="ru"] .admin-shell,
html[data-locale="en"] .admin-auth-layout,
html[data-locale="ru"] .admin-auth-layout { direction: ltr; }

/* The fixed right-aligned label layouts must adapt to LTR interfaces. */
html[data-locale="en"] :is(.npe-locale-box, .admin-topbar, .admin-sidebar, .site-nav, .admin-table, .lb-table),
html[data-locale="ru"] :is(.npe-locale-box, .admin-topbar, .admin-sidebar, .site-nav, .admin-table, .lb-table) {
  text-align: start;
}

html[data-locale="en"] :is(.admin-table, .lb-table, .db-table),
html[data-locale="ru"] :is(.admin-table, .lb-table, .db-table) { text-align: left; }

/* Natural Arabic shaping, and no artificial Latin letter spacing in Arabic scripts. */
html[data-locale="fa"] :is(h1,h2,h3,h4,h5,h6),
html[data-locale="ar"] :is(h1,h2,h3,h4,h5,h6) {
  letter-spacing: normal;
}

html[data-locale="ar"] body { line-height: 1.95; }

/* Russian words are often longer: buttons should not clip or overlap. */
html[data-locale="ru"] :is(.btn, .admin-btn, .nav-link) {
  white-space: normal;
  overflow-wrap: anywhere;
  text-align: center;
}

/* Font-specific polish to keep panels breathable. */
html[data-locale="fa"] body :is(input, textarea, select, button),
html[data-locale="ar"] body :is(input, textarea, select, button) {
  line-height: 1.75;
}

@media (max-width: 720px) {
  html[data-locale] body .npe-locale-select { font-size: 11px; }
}
