/*
 * Locked In Fightwear brand foundations: self-hosted fonts and colour tokens.
 * Elementor's global colours and fonts (the kit) hold the same values for pages; these
 * tokens are for screens Elementor does not style (WooCommerce cart, checkout, account).
 * Fonts: Cinzel and Montserrat variable, latin subset, SIL Open Font License 1.1
 * (assets/fonts/OFL-*.txt), from Fontsource 5.3.0. Cinzel's vertical metrics are changed
 * (ascent 1060 / descent 310, was 976 / 372) so capitals sit in the middle of buttons at
 * 13-20px once browsers round them to whole pixels, not about 1px high; hence "-v2".
 */

@font-face {
	font-family: "Cinzel";
	font-style: normal;
	font-display: swap;
	font-weight: 400 900;
	src: url("../fonts/cinzel-latin-wght-v2.woff2") format("woff2-variations"),
		url("../fonts/cinzel-latin-wght-v2.woff2") format("woff2");
}

@font-face {
	font-family: "Montserrat";
	font-style: normal;
	font-display: swap;
	font-weight: 100 900;
	src: url("../fonts/montserrat-latin-wght.woff2") format("woff2-variations"),
		url("../fonts/montserrat-latin-wght.woff2") format("woff2");
}

:root {
	--lfw-black: #0d0d0d;
	--lfw-surface: #141414;
	--lfw-surface-2: #1f1f1f;
	--lfw-muted: #262626;
	--lfw-text: #f5f4f0;
	--lfw-text-muted: #999999;
	--lfw-gold: #d4af37;
	--lfw-gold-border: #423b24;
	--lfw-error: #7c1d1d;
	--lfw-gold-gradient: linear-gradient(135deg, #bf953f, #fcf6ba, #b38728, #fbf5b7, #aa771c);
	--lfw-font-heading: "Cinzel", Georgia, serif;
	--lfw-font-body: "Montserrat", Arial, sans-serif;
	/* Dropdown arrow: a gold chevron with the header icons' stroke. */
	--lfw-select-arrow: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23d4af37' stroke-width='1.75' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m6 9 6 6 6-6'/%3E%3C/svg%3E");
}

::selection {
	background: var(--lfw-gold);
	color: #000;
}

/* Gold gradient text, as on the old site: add the CSS class lfw-text-gold-gradient. */
.lfw-text-gold-gradient,
.lfw-text-gold-gradient .elementor-heading-title {
	background: var(--lfw-gold-gradient);
	-webkit-background-clip: text;
	background-clip: text;
	color: transparent;
}