/**
 * IPLink design tokens.
 *
 * Colours and the font family are read from the theme.json presets
 * (--wp--preset--*), so the Gutenberg palette and the CSS cannot drift apart.
 * The hex after each comma is only a fallback: change a colour in theme.json.
 */

:root {
	/* Brand */
	--ipl-navy:       var(--wp--preset--color--ipl-navy, #0E1B2A);
	--ipl-navy-soft:  var(--wp--preset--color--ipl-navy-soft, #1B3A5C);
	--ipl-blue:       var(--wp--preset--color--ipl-blue, #1668D9);
	--ipl-blue-hover: var(--wp--preset--color--ipl-blue-hover, #1150AF);

	/* Neutrals */
	--ipl-black:      var(--wp--preset--color--ipl-black, #111418);
	/* #4B5563, not the brief's #6B7280: that measured 4.50:1 on light gray and 4.26:1 on the tinted sections. */
	--ipl-gray-text:  var(--wp--preset--color--ipl-gray-text, #4B5563);
	--ipl-gray-line:  var(--wp--preset--color--ipl-gray-line, #E3E6EA);
	--ipl-gray-bg:    var(--wp--preset--color--ipl-gray-bg, #F5F7FA);
	--ipl-white:      var(--wp--preset--color--ipl-white, #FFFFFF);

	/* Status. Green is #15803D, not the brief's #16A34A: that measured 3.30:1 on white and fails AA as text. */
	--ipl-green:      var(--wp--preset--color--ipl-green, #15803D);
	--ipl-red:        var(--wp--preset--color--ipl-red, #D93636);

	/* Rhythm */
	--ipl-radius:     10px;
	--ipl-radius-sm:  6px;
	--ipl-section-y:  clamp(48px, 7vw, 96px);
	--ipl-gap:        24px;

	/* Type */
	/* Digits 0–9 come from «Vazirmatn Digits» (Persian shapes, theme.json) — see the note at the end. */
	--ipl-font:       var(--wp--preset--font-family--vazirmatn, 'Vazirmatn Digits', Vazirmatn, Tahoma, sans-serif);
	--ipl-font-latin-digits: Vazirmatn, Tahoma, sans-serif;
	--ipl-lh-body:    1.8;
	--ipl-lh-heading: 1.55;

	/* Focus */
	--ipl-focus-ring:   2px solid var(--ipl-blue);
	--ipl-focus-offset: 2px;
}

/*
 * Hand the tokens to WoodMart so its own components (header, menus, forms,
 * buttons, product cards) follow the brand without per-component overrides.
 *
 * `html:root` (specificity 0,1,1) outranks the `:root` block WoodMart generates
 * from its theme settings, whichever of the two is printed later — no !important.
 */
html:root {
	--wd-text-font:        var(--ipl-font);
	--wd-title-font:       var(--ipl-font);
	--wd-text-font-size:   15px; /* WoodMart's 14px is too small for Persian script. */
	--wd-text-line-height: var(--ipl-lh-body);
	--wd-text-color:       var(--ipl-black);
	--wd-title-color:      var(--ipl-navy);

	--wd-primary-color:     var(--ipl-blue);
	--wd-alternative-color: var(--ipl-navy-soft);
	--wd-link-color:        var(--ipl-blue);
	--wd-link-color-hover:  var(--ipl-blue-hover);

	--wd-entities-title-color:       var(--ipl-navy);
	--wd-entities-title-color-hover: var(--ipl-blue);

	--wd-brd-radius:            var(--ipl-radius-sm);
	--wd-form-brd-radius:       var(--ipl-radius-sm);
	--wd-form-brd-width:        1px;
	--wd-form-brd-color:        var(--ipl-gray-line);
	--wd-form-brd-color-focus:  var(--ipl-blue);

	--btn-accented-bgcolor:       var(--ipl-blue);
	--btn-accented-bgcolor-hover: var(--ipl-blue-hover);
	--btn-accented-brd-radius:    var(--ipl-radius-sm);

	/* Persian is a joined script with no letter case: never uppercase it. */
	--wd-title-transform:          none;
	--wd-entities-title-transform: none;
	--wd-header-el-transform:      none;
	--wd-widget-title-transform:   none;
	--btn-accented-transform:      none;
	--btn-default-transform:       none;
	--btn-transform:               none;

	/*
	 * Focus rings. WoodMart's base-accessibility.css already draws a :focus-visible
	 * outline from these variables and switches the colour to white inside its
	 * dark colour schemes; only the look is rebranded here (solid blue, not dotted black).
	 */
	--wd-otl-style:        solid;
	--wd-otl-width:        2px;
	--wd-otl-offset:       var(--ipl-focus-offset);
	--wd-otl-color-scheme: var(--ipl-blue);
}

/*
 * Utility: hidden visually, still read by screen readers (e.g. form labels).
 */
.ipl-visually-hidden {
	position: absolute;
	width: 1px;
	height: 1px;
	margin: -1px;
	padding: 0;
	overflow: hidden;
	clip-path: inset(50%);
	white-space: nowrap;
	border: 0;
}

/*
 * Persian digits. The site font stack starts with «Vazirmatn Digits»: Vazirmatn's Farsi-Digits
 * edition cut down to 0–9 (assets/fonts/vazirmatn-digits, ~4 KB per weight, OFL). Its
 * unicode-range covers only the digits, so every other character still comes from Vazirmatn.
 * The text itself keeps 0–9: links (tel:), copy-paste, search and SEO see ordinary digits.
 *
 * Email addresses and code keep English digits; add .ipl-latin-digits to anything else that must.
 */
:is(a[href^="mailto:"], code, kbd, pre, samp, .ipl-latin-digits) {
	font-family: var(--ipl-font-latin-digits);
}