/* Global UI typography overrides — modern system font stack
   Scope: screen only (UI). Print styles are intentionally not affected. */

@media screen {
    :root {
        --font-sans: "Open Sans", apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, "Noto Sans", "Liberation Sans", sans-serif, "Apple Color Emoji", "Segoe UI Emoji";
        --font-mono: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace;
    }

    html, body {
        font-family: var(--font-sans);
        /* Keep existing base sizing; adjust if desired later */
        line-height: 1.5;
        -webkit-text-size-adjust: 100%;
        text-rendering: optimizeLegibility;
    }

    /* Ensure common UI controls inherit the base font */
    button,
    input,
    select,
    textarea {
        font-family: inherit !important;
    }

    /* jQuery UI often sets its own font; normalize to inherit */
    .ui-widget {
        font-family: inherit !important;
    }

    /* Normalize typical text containers to inherit without forcing icon fonts */
    p,
    a,
    li,
    label,
    small,
    strong,
    em,
    th,
    td,
    caption,
    h1,
    h2,
    h3,
    h4,
    h5,
    h6 {
        font-family: inherit;
    }

    /* TinyMCE editor content override (if content_style not set). This targets the content body inside the editor.
       Note: This will only apply if the skin allows external CSS to cascade; otherwise configure via tinymce.init({ content_style: '...' }) */
    .mce-content-body {
        font-family: var(--font-sans) !important;
        line-height: 1.5;
    }
}