/**
 * Forest Remedy — design tokens.
 *
 * Leni's brand, in one place. Added 2026-09-15 (Jeremy: Forest Remedy keeps its own identity and
 * borrows the family's system *structure*, not its look).
 *
 * Every colour below is a value the site was ALREADY using, gathered from the Flatsome Customiser
 * and the three child-theme stylesheets — moving to tokens changed nothing on screen (checked by
 * comparing computed styles on the home, product and checkout pages before and after).
 *
 * Role names follow the family pattern (deep · mid · bright · soft · on), so a future brand refresh
 * is a change of values here, not a hunt through stylesheets.
 *
 * Keep in step with Appearance → Customise → Style → Colours, which Flatsome still owns:
 *   primary #5c6a5d = --fr-moss · secondary #3a4932 = --fr-deep · success #587548 = --fr-mid
 *   texts #3a3a3a = --fr-ink · links #587548 = --fr-mid · link hover #3a4932 = --fr-mid-hover
 *   top bar + footer background #3a4932 = --fr-deep (Header → Top Bar; Footer → Bottom)
 *
 * 2026-09-19 (polish pass 2) — same palette, darker where text sits on it. White on the pale sage
 * measured 2.46:1 and the leaf link 4.07:1, both under the 4.5:1 that small text needs. So the sage
 * moved to fills and lines, the Customiser primary became moss (white 5.71:1), links went one step
 * deeper (5.18:1 on white, 4.77:1 on mist), hover goes darker, not lighter, and the Customiser's
 * success colour (the "added to your cart" line) moved from #95ba91 (2.16:1) to the leaf. The old values are in
 * C:/Backups/forest-remedy-local/2026-09-19-polish-pass-2/settings-before.json.
 *
 * Emails cannot read CSS variables: the pickup note in inc/checkout.php repeats #f4f6f3 / #698659 /
 * #3a3a3a inline on purpose (the #698659 there is a decorative border, not text).
 */

:root {
	/* Brand colour */
	--fr-deep: #3a4932;        /* forest — headings, buttons, strong accents */
	--fr-deep-hover: #4a5c40;
	--fr-mid: #587548;         /* leaf — links, active states (5.18:1 on white) */
	--fr-mid-hover: #3a4932;   /* hover goes darker */
	--fr-mid-tint: rgba(88, 117, 72, 0.14);
	--fr-bright: #95ba91;      /* fresh green — success, highlights (never text on white) */
	--fr-moss: #5c6a5d;        /* Customiser primary — quiet buttons, white on it 5.71:1 */
	--fr-soft: #9ea89d;        /* sage — fills, lines and dividers only; never under white text */
	--fr-white: #ffffff;

	/* On the forest green (top bar, footer, market band) */
	--fr-on-deep: #ffffff;       /* 9.64:1 */
	--fr-on-deep-2: #dfe6da;     /* body text, 7.56:1 */
	--fr-on-deep-rule: rgba(255, 255, 255, 0.16);

	/* Neutrals — ink for text, mist for panels, lines for borders (lightest → darkest) */
	--fr-ink: #3a3a3a;
	--fr-ink-2: #4a4a4a;
	--fr-ink-3: #5a5a5a;
	--fr-ink-4: #6a6a6a;
	--fr-moss-ink: #5c6a5d;    /* muted green-grey, for notes under form fields */
	--fr-mist: #f4f6f3;
	--fr-mist-2: #eef2ec;
	--fr-line-1: #e8ebe6;
	--fr-line-2: #e4e7e2;
	--fr-line-3: #dfe4dc;
	--fr-line-4: #cfd6cc;
	--fr-line-grey: #dddddd;

	/* Type — Lato for everything, Dancing Script as the occasional hand-written accent */
	--fr-font: Lato, -apple-system, BlinkMacSystemFont, "Segoe UI", Helvetica, Arial, sans-serif;
	--fr-font-accent: "Dancing Script", cursive;

	/* Shape */
	--fr-radius-sm: 4px;
	--fr-radius: 8px;
	--fr-radius-lg: 14px;
	--fr-shadow-1: 0 1px 2px rgba(58, 73, 50, 0.08), 0 4px 14px rgba(58, 73, 50, 0.06);

	/* Motion — one easing and three speeds for everything that moves, on the site and in video */
	--fr-ease: cubic-bezier(0.2, 0.7, 0.2, 1);
	--fr-dur-fast: 150ms;
	--fr-dur: 300ms;
	--fr-dur-slow: 700ms;
}

@media (prefers-reduced-motion: reduce) {
	:root {
		--fr-dur-fast: 0ms;
		--fr-dur: 0ms;
		--fr-dur-slow: 0ms;
	}
}