/*
 * YEnglish design tokens: the colours, type weights and shapes every page's stylesheet reads.
 * Loaded on every page before the theme styles (inc/assets_queue.php). Change a colour here, not in the pages.
 * The banner band keeps the brand purple; buttons, links and text use the same family, a little calmer.
 */
:root {
	/* Brand and actions */
	--ye-brand: #400095;
	--ye-deep: #43168f;
	--ye-deep-hover: #361075;
	--ye-mid: #55229f;
	--ye-accent: #6f3fc0;
	--ye-accent-strong: #57289f;

	/* Text */
	--ye-ink: #2a2533;
	--ye-text: #453f4f;
	--ye-muted: #6d6677;
	--ye-faint: #948c9f;

	/* Surfaces and lines */
	--ye-surface: #fff;
	--ye-paper: #faf8f5;
	--ye-tint: #f5f2fa;
	--ye-tint-soft: #faf8fd;
	--ye-tint-strong: #ece5f6;
	--ye-border: #e9e4ef;
	--ye-border-strong: #dcd3e8;
	--ye-border-accent: #cbb8e6;

	/* Warm accents */
	--ye-gold: #f2b544;
	--ye-sun: #f5c862;
	--ye-sun-soft: #f8d688;
	--ye-sun-ink: #2a1a50;

	/* Buying, saving, done */
	--ye-buy: #1e9c56;
	--ye-buy-strong: #177f46;
	--ye-sale: #b3355f;
	--ye-green: #1b7744;

	/* Night: the footer and the end of the home page path */
	--ye-night: #1c1640;

	/* Type: the site font (Bonyade Koodak VF) is variable, so headings can be bold without being heavy */
	--ye-w-body: 450;
	--ye-w-medium: 560;
	--ye-w-semibold: 640;
	--ye-w-bold: 700;
	--ye-w-heading: 740;
	--ye-w-display: 780;

	/* Shape and depth */
	--ye-radius-sm: 10px;
	--ye-radius: 16px;
	--ye-radius-lg: 24px;
	--ye-shadow-sm: 0 1px 2px rgba(42, 37, 51, .04), 0 4px 14px rgba(42, 37, 51, .05);
	--ye-shadow: 0 2px 6px rgba(42, 37, 51, .04), 0 14px 34px rgba(42, 37, 51, .08);
}

body {
	-webkit-font-smoothing: antialiased;
	-moz-osx-font-smoothing: grayscale;
}

::selection {
	background: var(--ye-tint-strong);
	color: var(--ye-ink);
}