@import url("https://fonts.googleapis.com/css2?family=Inter:wght@300;400;500;600;700;800&family=Kantumruy+Pro:wght@300;400;500;600;700;800&display=swap");
@import url("https://fonts.googleapis.com/css2?family=Battambang:wght@400;700&display=swap") print;

/*===== 

@import "tailwindcss"; ==========*/

@font-face {
  font-family: "Moul";
  src: url("/fonts/Moul-Regular.ttf") format("truetype");
  font-weight: 400;
  font-style: normal;
  font-display: swap;
}

:root {
  --font-english: "Inter", "Kantumruy Pro", "Noto Sans Khmer", "Segoe UI",
    "Helvetica Neue", Arial, sans-serif;
  --font-khmer: "Kantumruy Pro", "Inter", "Segoe UI", Arial, sans-serif;
  --font-khmer-print-body: "Battambang", "Khmer OS Battambang",
    "Kantumruy Pro", "Noto Sans Khmer", sans-serif;
  --font-khmer-print-title: "Moul", "Khmer OS Moul Light",
    "Khmer OS Muol Light", "Battambang", serif;

  /* Divider — Figma: Natural Color/200 (#E9EAEB) */
  --app-divider: #e9eaeb;
}

[data-mui-color-scheme="dark"],
.dark {
  --app-divider: rgba(255, 255, 255, 0.12);
}

* {
  box-sizing: border-box;
}

html,
body {
  min-height: 100%;
}

body {
  margin: 0;
  font-family: var(--font-english);
}

.moul-regular {
  font-family: "Moul", serif !important;
  font-weight: 400;
  font-style: normal;
}

/*========== English ==========*/
html[lang="en"],
html[lang="en"] body,
body[data-language="en"] {
  font-family: var(--font-english) !important;
}

/*========== Khmer: support km and kh ===========*/
html[lang="km"],
html[lang="km"] body,
html[lang="kh"],
html[lang="kh"] body,
body[data-language="km"],
body[data-language="kh"] {
  font-family: var(--font-khmer) !important;
}

/*========== Global form + MUI =========*/
button,
input,
textarea,
select,
.MuiTypography-root,
.MuiButton-root,
.MuiInputBase-root,
.MuiMenuItem-root,
.MuiListItemText-root,
.MuiTableCell-root,
.MuiChip-root,
.MuiTooltip-tooltip {
  font-family: inherit !important;
}

/*=========== English MUI ============*/
html[lang="en"] .MuiTypography-root,
html[lang="en"] .MuiButton-root,
html[lang="en"] .MuiInputBase-root,
html[lang="en"] .MuiMenuItem-root,
html[lang="en"] .MuiListItemText-root,
html[lang="en"] .MuiTableCell-root,
html[lang="en"] .MuiChip-root,
html[lang="en"] .MuiTooltip-tooltip,
body[data-language="en"] .MuiTypography-root,
body[data-language="en"] .MuiButton-root,
body[data-language="en"] .MuiInputBase-root,
body[data-language="en"] .MuiMenuItem-root,
body[data-language="en"] .MuiListItemText-root,
body[data-language="en"] .MuiTableCell-root,
body[data-language="en"] .MuiChip-root,
body[data-language="en"] .MuiTooltip-tooltip {
  font-family: var(--font-english) !important;
}

/*============= Khmer MUI ============*/
html[lang="km"] .MuiTypography-root,
html[lang="km"] .MuiButton-root,
html[lang="km"] .MuiInputBase-root,
html[lang="km"] .MuiMenuItem-root,
html[lang="km"] .MuiListItemText-root,
html[lang="km"] .MuiTableCell-root,
html[lang="km"] .MuiChip-root,
html[lang="km"] .MuiTooltip-tooltip,
html[lang="kh"] .MuiTypography-root,
html[lang="kh"] .MuiButton-root,
html[lang="kh"] .MuiInputBase-root,
html[lang="kh"] .MuiMenuItem-root,
html[lang="kh"] .MuiListItemText-root,
html[lang="kh"] .MuiTableCell-root,
html[lang="kh"] .MuiChip-root,
html[lang="kh"] .MuiTooltip-tooltip,
body[data-language="km"] .MuiTypography-root,
body[data-language="km"] .MuiButton-root,
body[data-language="km"] .MuiInputBase-root,
body[data-language="km"] .MuiMenuItem-root,
body[data-language="km"] .MuiListItemText-root,
body[data-language="km"] .MuiTableCell-root,
body[data-language="km"] .MuiChip-root,
body[data-language="km"] .MuiTooltip-tooltip,
body[data-language="kh"] .MuiTypography-root,
body[data-language="kh"] .MuiButton-root,
body[data-language="kh"] .MuiInputBase-root,
body[data-language="kh"] .MuiMenuItem-root,
body[data-language="kh"] .MuiListItemText-root,
body[data-language="kh"] .MuiTableCell-root,
body[data-language="kh"] .MuiChip-root,
body[data-language="kh"] .MuiTooltip-tooltip {
  font-family: var(--font-khmer) !important;
}

/*=========== MUI DataGrid force font ===========*/
.MuiDataGrid-root,
.MuiDataGrid-root *,
.MuiDataGrid-columnHeaders,
.MuiDataGrid-columnHeader,
.MuiDataGrid-columnHeaderTitle,
.MuiDataGrid-cell,
.MuiDataGrid-cellContent,
.MuiDataGrid-row,
.MuiDataGrid-footerContainer {
  font-family: inherit !important;
}

html[lang="km"] .MuiDataGrid-root,
html[lang="km"] .MuiDataGrid-root *,
html[lang="kh"] .MuiDataGrid-root,
html[lang="kh"] .MuiDataGrid-root *,
body[data-language="km"] .MuiDataGrid-root,
body[data-language="km"] .MuiDataGrid-root *,
body[data-language="kh"] .MuiDataGrid-root,
body[data-language="kh"] .MuiDataGrid-root * {
  font-family: var(--font-khmer) !important;
}

/*=========== MUI date picker force font ===========*/
/* The picker field and the calendar popup keep MUI's own Roboto, which has no
   Khmer letters, so a Khmer date fell back to a system font. The popup is
   rendered at the end of <body>, so these rules reach it too. */
.MuiPickersTextField-root,
.MuiPickersTextField-root *,
.MuiPickersInputBase-root,
.MuiPickersSectionList-root,
.MuiPickersPopper-root,
.MuiPickersPopper-root *,
.MuiPickersLayout-root,
.MuiPickersLayout-root * {
  font-family: inherit !important;
}

html[lang="km"] .MuiPickersTextField-root,
html[lang="km"] .MuiPickersTextField-root *,
html[lang="km"] .MuiPickersPopper-root,
html[lang="km"] .MuiPickersPopper-root *,
html[lang="kh"] .MuiPickersTextField-root,
html[lang="kh"] .MuiPickersTextField-root *,
html[lang="kh"] .MuiPickersPopper-root,
html[lang="kh"] .MuiPickersPopper-root *,
body[data-language="km"] .MuiPickersTextField-root,
body[data-language="km"] .MuiPickersTextField-root *,
body[data-language="km"] .MuiPickersPopper-root,
body[data-language="km"] .MuiPickersPopper-root *,
body[data-language="kh"] .MuiPickersTextField-root,
body[data-language="kh"] .MuiPickersTextField-root *,
body[data-language="kh"] .MuiPickersPopper-root,
body[data-language="kh"] .MuiPickersPopper-root *,
html[lang="km"] .MuiPickersLayout-root,
html[lang="km"] .MuiPickersLayout-root *,
html[lang="kh"] .MuiPickersLayout-root,
html[lang="kh"] .MuiPickersLayout-root *,
body[data-language="km"] .MuiPickersLayout-root,
body[data-language="km"] .MuiPickersLayout-root *,
body[data-language="kh"] .MuiPickersLayout-root,
body[data-language="kh"] .MuiPickersLayout-root * {
  font-family: var(--font-khmer) !important;
}

/*============ Force English font ==============*/
.font-en,
.font-en * {
  font-family: var(--font-english) !important;
}

/*============ Force Khmer font =============*/
.font-kh,
.font-kh * {
  font-family: var(--font-khmer) !important;
}