/*
 * Vazirmatn, self-hosted.
 *
 * The variable WOFF2 carries the whole 100-900 range and, unlike the Google
 * build, the Persian digits (U+06F0-U+06F9) are real glyphs in the font, so
 * numbers never fall back to another face. Nothing here depends on a CDN.
 */

@font-face {
	font-family: 'Vazirmatn';
	src: url('fonts/Vazirmatn-Variable.woff2') format('woff2'), url('fonts/Vazirmatn-Regular.ttf') format('truetype');
	font-weight: 100 900;
	font-style: normal;
	font-display: swap;
}

:root {
	--mk-font: 'Vazirmatn', system-ui, -apple-system, 'Segoe UI', Tahoma, sans-serif;

	/* Woodmart reads its typography from custom properties. */
	--woodmart-font-family-base: var(--mk-font);
	--woodmart-font-family-headings: var(--mk-font);
	--woodmart-font-family-text: var(--mk-font);
}

/*
 * Elementor writes its global fonts on `body`, so the values have to be
 * declared on `html body` to outrank them regardless of stylesheet order.
 */
html body {
	--e-global-typography-font-family: var(--mk-font);
	--e-global-typography-primary-font-family: var(--mk-font);
	--e-global-typography-secondary-font-family: var(--mk-font);
	--e-global-typography-text-font-family: var(--mk-font);
	--e-global-typography-accent-font-family: var(--mk-font);
	--e-global-typography-button-font-family: var(--mk-font);
	--e-global-typography-post-font-family: var(--mk-font);
	--e-global-typography-widget-font-family: var(--mk-font);
}

body,
.site-content,
.woodmart-layout,
.page-wrapper,
.page-content,
.woocommerce,
article,
h1,
h2,
h3,
h4,
h5,
h6,
.entry-title,
.page-title,
.widget-title,
.woocommerce-loop-product__title,
.product_title,
button,
input,
select,
textarea,
label,
legend,
caption,
table,
th,
td,
.woodmart-nav-menu,
.woodmart-btn,
.button,
.woocommerce-button,
.price,
.woocommerce-Price-amount,
.added_to_cart,
.woocommerce-message,
.woocommerce-info,
.woocommerce-notice,
.breadcrumbs,
.pagination,
.tag,
.onsale {
	font-family: var(--mk-font);
}

/*
 * Elementor prints a literal font-family on its own widgets, so the custom
 * properties above are not enough there. Only the text widgets are forced;
 * the icon widgets keep the icon fonts they need.
 */
.elementor-widget-heading .elementor-heading-title,
.elementor-widget-text-editor .elementor-text-editor,
.elementor-widget-post-title .elementor-post-title,
.elementor-widget-post-content .elementor-widget-container,
.elementor-widget-post-excerpt .elementor-post-excerpt,
.elementor-widget-button .elementor-button,
.elementor-widget-menu-anchor .elementor-menu-anchor,
.elementor-widget-image .wp-caption-text,
.elementor-widget-icon-list-item .elementor-icon-list-item-text,
.elementor-widget-testimonial .elementor-testimonial-content,
.elementor-widget-accordion .elementor-accordion-title,
.elementor-widget-tabs .elementor-tab-title,
.elementor-widget-toggle .elementor-toggle-title,
.elementor-widget-social-icons .elementor-social-icon,
.elementor-widget-form .elementor-form .elementor-field,
.elementor-widget-heading-block .elementor-heading-block-title {
	font-family: var(--mk-font) !important;
}
