/*
 * brand_tokens.css
 * ----------------------------------------------------------------------------
 * Declares the brand design tokens as CSS custom properties together with
 * sensible fallbacks (the warm "Ramani" defaults).
 *
 * IMPORTANT: These are *defaults only*. The live values come from
 * "Cab Brand Settings" and are injected at render time by the dynamic <style>
 * block in templates/includes/brand_tokens.html (loaded by the base layout).
 * That <style> block redefines these same variables with the configured
 * values, so editing a colour or font in the Desk instantly re-skins the
 * entire site without touching this file. NOTHING here is brand-specific copy.
 */

:root {
	--brand-primary: #1C1A17;
	--brand-secondary: #F0EDE6;
	--brand-accent: #E0542B;
	--brand-accent-deep: #C2461F;
	--surface-light: #FAF8F4;
	--surface-secondary: #F0EDE6;
	--text-on-light: #2A2724;
	--text-on-dark: #F5F2EC;
	--muted-text: #6B645C;
	--hairline: #E2DDD3;
	--font-heading: "Playfair Display", serif;
	--font-body: "Inter", sans-serif;
}

/* ---- A few utility hooks that consume the tokens ------------------------- */

.brand-bg-primary { background-color: var(--brand-primary); }
.brand-bg-secondary { background-color: var(--brand-secondary); }
.brand-bg-accent { background-color: var(--brand-accent); }
.brand-text-primary { color: var(--brand-primary); }
.brand-text-accent { color: var(--brand-accent); }

h1, h2, h3, h4, h5, h6,
.brand-heading {
	font-family: var(--font-heading);
}

body,
.brand-body {
	font-family: var(--font-body);
}