/* Khmer webfont for all NIE surfaces: website, portal, desk and the LMS SPA.
 *
 * Inter / InterVar (used by frappe and the LMS frontend) carry no Khmer glyphs,
 * so Koh Santepheap is *appended* to the existing stacks rather than replacing
 * them: Latin keeps rendering in Inter, Khmer falls through per-glyph. That
 * avoids fighting the built SPA stylesheet for specificity on every component.
 *
 * Moul is display-only (headings/brand) — it is a heavy Muol-style face and is
 * unreadable at body size, so it is never put in the inherited stack.
 */
@import url("https://fonts.googleapis.com/css2?family=Koh+Santepheap:wght@100;300;400;700;900&family=Moul&display=swap");

:root {
	--nie-khmer: "Koh Santepheap", "Khmer OS", "Noto Sans Khmer", "Noto Serif Khmer";
	--nie-khmer-display: "Moul", "Khmer OS Muol Light", var(--nie-khmer), serif;
}

/* SPA + website: `html` prefix outranks the build's bare `body {}` rule */
html body,
html body .font-sans {
	font-family: InterVar, Inter, ui-sans-serif, system-ui, var(--nie-khmer), sans-serif,
		"Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji";
}

/* desk: frappe declares the stack on .page-container/.navbar, not only body */
.desk-page,
.page-container,
.navbar,
.modal,
.form-control,
.frappe-control {
	font-family: Inter, ui-sans-serif, system-ui, var(--nie-khmer), sans-serif;
}

/* Tailwind preflight gives form controls `font: inherit`, but frappe's website
 * theme re-declares them — keep Khmer reachable in inputs either way. */
button,
input,
optgroup,
select,
textarea {
	font-family: inherit;
}

/* Khmer stacks subscripts below the baseline and vowel signs above it; the
 * Latin-tuned 1.5 leading collides. Only applied when the page is Khmer. */
html[lang="km"] body,
[data-lang="km"] {
	line-height: 1.9;
}

/* opt-in display class for headings/brand marks */
.nie-moul {
	font-family: var(--nie-khmer-display);
	font-weight: 400;
}