/*
 * Vazirmatn — self-hosted.
 *
 * Self-hosted rather than served from Google Fonts, which is unreliable from
 * inside Iran. The variable file covers every weight in 109 KB, with static
 * Regular and Bold as a fallback for browsers without variable font support.
 *
 * Licence: SIL Open Font Licence 1.1 — see assets/fonts/OFL.txt.
 */

@font-face {
	font-family: 'Vazirmatn';
	src: url('../fonts/Vazirmatn-var.woff2') format('woff2-variations');
	font-weight: 100 900;
	font-style: normal;
	font-display: swap;
}

@supports not (font-variation-settings: 'wght' 400) {
	@font-face {
		font-family: 'Vazirmatn';
		src: url('../fonts/Vazirmatn-Regular.woff2') format('woff2');
		font-weight: 400;
		font-style: normal;
		font-display: swap;
	}

	@font-face {
		font-family: 'Vazirmatn';
		src: url('../fonts/Vazirmatn-Bold.woff2') format('woff2');
		font-weight: 700;
		font-style: normal;
		font-display: swap;
	}
}

/*
 * Replace the three IranYekan families the theme loads
 * (iranyekanwebmedium_FaNum, iranyekanwebregular_FaNum, IRANSansWeb_Light)
 * with one. The theme's own font stack is left in place as a fallback so
 * nothing disappears if the woff2 fails.
 */
:root {
	--rb-font: 'Vazirmatn', iranyekanwebmedium_FaNum, Tahoma, sans-serif;
}

/*
 * Elementor's kit stylesheet sets the page font through `.elementor-kit-N` on
 * the body and feeds every widget from four global typography variables.
 * Rebinding those variables is what actually changes the page — chasing it with
 * ever-higher specificity would leave the widgets on the old family.
 */
body[class*='elementor-kit-'] {
	--e-global-typography-primary-font-family: 'Vazirmatn';
	--e-global-typography-secondary-font-family: 'Vazirmatn';
	--e-global-typography-text-font-family: 'Vazirmatn';
	--e-global-typography-accent-font-family: 'Vazirmatn';

	font-family: var(--rb-font);
}

/*
 * Selectors are qualified with html/body because Woodmart prints its own
 * font-family rules into a <style> block in wp_head, after this file. Matching
 * specificity would lose on source order; this outranks it outright.
 */
html body,
html button,
html input,
html select,
html optgroup,
html textarea,
html .wd-nav > li > a,
html h1, html h2, html h3, html h4, html h5, html h6,
html .title,
html .wd-entities-title,
html .elementor-heading-title,
html .woodmart-title-container {
	font-family: var(--rb-font);
}

/*
 * The theme sets 14px, which is small for Persian — the script needs more
 * height than Latin to stay legible at the same apparent size.
 */
html body {
	font-size: 15.5px;
	line-height: 1.9;
}

/*
 * Catch-all.
 *
 * Elementor writes per-widget typography into uploads/elementor/css/post-N.css
 * with generated class selectors, and Woodmart styles the nav separately, so
 * individual overrides never finish the job — IRANSansWeb and IranYekan kept
 * surfacing on headings and menus. This is the one place !important is
 * warranted: the goal is a single typeface everywhere, and the losing
 * declarations are machine-generated and cannot be edited at source.
 *
 * Icon fonts are excluded by hand. They are glyph fonts, not text fonts, and
 * reassigning their family replaces every icon with a missing-glyph box.
 */
body,
body *:not(i):not(.fa):not([class^='fa-']):not([class*=' fa-']):not([class^='wd-icon']):not([class*=' wd-icon']):not([class*='woodmart-font']):not(.eicon):not([class^='eicon-']):not([class*=' eicon-']):not([class*='joinchat']):not([class*='joinchat'] *) {
	font-family: var(--rb-font) !important;
}

/* Persian headings need a little negative tracking at display sizes. */
h1, h2,
.rb-hero .rb-hero__title {
	letter-spacing: -0.01em;
}
