/**
 * MX Blog Elementor Font Fix
 * 
 * This CSS file provides aggressive fixes for Elementor font inheritance issues
 * on custom template pages like the blog archive and single posts.
 */

/* Force header and menu to use Elementor global fonts */
.mx-header,
.mx-header *,
.mx-menu,
.mx-menu * {
    font-family: var(--e-global-typography-primary-font-family, inherit) !important;
    font-weight: var(--e-global-typography-primary-font-weight, inherit) !important;
}

/* Force Elementor global styles to apply across the site */
.mx-blog-archive,
.mx-blog-single,
.elementor-location-header,
.elementor-location-footer,
#page-wrapper,
body {
    --e-global-typography-primary-font-family: var(--e-global-typography-primary-font-family, inherit);
    --e-global-typography-secondary-font-family: var(--e-global-typography-secondary-font-family, inherit);
    --e-global-typography-text-font-family: var(--e-global-typography-text-font-family, inherit);
    --e-global-typography-accent-font-family: var(--e-global-typography-accent-font-family, inherit);
    --e-global-color-primary: var(--e-global-color-primary, inherit);
    --e-global-color-secondary: var(--e-global-color-secondary, inherit);
    --e-global-color-text: var(--e-global-color-text, inherit);
    --e-global-color-accent: var(--e-global-color-accent, inherit);
}

/* Force direct font inheritance for common menu elements */
.mx-header-menu,
.mx-header-menu li,
.mx-header-menu a,
.mx-header-nav,
.mx-header-nav li,
.mx-header-nav a,
.mx-menu-container,
.mx-menu-container li,
.mx-menu-container a,
nav.navigation,
nav.navigation li,
nav.navigation a {
    font-family: var(--e-global-typography-primary-font-family, inherit) !important;
}

/* Nuclear option - set all key fonts if above fails */
@media all {
    .mx-header,
    .mx-menu {
        font-family: 'Lato', sans-serif !important;
    }
}