/**
 * Design tokens for the theme's own chrome (header, footer, cards, nav).
 *
 * IMPORTANT: this file never redeclares --sbg-color-primary/secondary/accent/
 * etc. directly. Those are owned by the SmartBuyGuides Core plugin's
 * SBG_CSS_Vars module (prints an inline <style> in wp_head at priority 5,
 * before this stylesheet loads) and are driven by Theme Settings. If this
 * file redeclared the same custom property names in a plain :root rule, the
 * later-loading stylesheet would win the cascade and silently override
 * whatever color the site owner configured. Instead, every token below is
 * *composed* from the plugin's vars via var(--sbg-color-x, <fallback>), so
 * the fallback only ever applies when the plugin isn't installed at all.
 */

:root {
	/* Layout */
	--sbg-container-width: 1140px;
	--sbg-container-padding: 20px;
	--sbg-header-height: 76px;

	/* Compose theme-chrome tokens from the plugin's primitives (or fall back
	   to the same literal defaults the plugin itself ships, if it's absent). */
	--sbg-header-bg: var(--sbg-color-bg, #FFFFFF);
	--sbg-header-border: #E2E8F0;
	--sbg-footer-bg: var(--sbg-color-primary, #0F172A);
	--sbg-footer-text: #CBD5E1;
	--sbg-footer-heading-color: #FFFFFF;
	--sbg-body-text: var(--sbg-color-primary, #0F172A);
	--sbg-body-bg: var(--sbg-color-bg, #FFFFFF);
	--sbg-muted-text: #64748B;
	--sbg-border-color: #E2E8F0;
	--sbg-card-bg: #FFFFFF;
	--sbg-link-color: var(--sbg-color-secondary, #2563EB);
	--sbg-link-hover-color: #1D4ED8;
}

@media (min-width: 782px) {
	:root {
		--sbg-container-padding: 32px;
	}
}