@import url("https://fonts.googleapis.com/css2?family=Montserrat:wght@400;500;600;700;800&display=swap");

:root{
  --font-ui:"Segoe UI",Arial,Tahoma,sans-serif;
  --font-display:Montserrat,"Segoe UI",Arial,Tahoma,sans-serif;
}

/*
  One inherited UI font authority.
  Do not use `body * { ... !important }`: that blocks component/editor font changes.
*/
html,
body,
.admin-app,
.shell,
.sidebar,
.main,
.topbar,
.card,
.project-list,
.sections,
.dialog-head,
.editor-panel,
.rich-toolbar,
.dialog-actions,
.toast{
  font-family:var(--font-ui);
}

/* Native controls inherit the same Vietnamese-safe UI font. */
button,
.button,
input,
select,
textarea{
  font-family:var(--font-ui)!important;
}

/*
  Table/header text is explicitly pinned to the UI stack because the page has
  many old inline rules with font shorthands.
*/
.project-table-head,
.project-table-head > span,
.project-item,
.project-item > *,
#categoryList .category-table-head,
#categoryList .category-table-head > span,
#categoryList .section-box{
  font-family:var(--font-ui)!important;
  font-kerning:normal;
  text-rendering:optimizeLegibility;
}

/* Brand/display areas may use Montserrat. */
.brand strong,
.site-home span,
.footer-brand{
  font-family:var(--font-display)!important;
}

/*
  IMPORTANT:
  Set only the editor's DEFAULT font.
  Never force `.rich-editor *` because fontName creates child markup
  (e.g. <font face="Georgia"> / inline font-family) that must be allowed to win.
*/
.rich-editor{
  font-family:var(--font-ui);
}

/* Explicit diagnostic samples. */
.font-test-arial{
  font-family:Arial,sans-serif!important;
}
.font-test-montserrat{
  font-family:Montserrat,Arial,sans-serif!important;
}

/* Preserve icon font faces. */
.fa,.fa::before,[class*="fa-"],[class*="fa-"]::before{
  font-family:FontAwesome!important;
}
[class*="ion-"],[class*="ion-"]::before{
  font-family:Ionicons!important;
}
[class*="icon-"],[class*="icon-"]::before{
  font-family:et-line!important;
}