/**
 * Drink Bay Beer Design System - Design Tokens
 * Visual identity matching drinkbaybeer.com
 */

:root {
	/* DBB Brand Colors */
	--dbb-background: #ddd;
	--dbb-text: #1B2936;
	--dbb-primary: #C53117;
	--dbb-primary-hover: #f4b223;
	--dbb-secondary: #1B2936;
	--dbb-action: #C53117;
	--dbb-action-hover: #a52913;
	--dbb-border: #C53117;
	--dbb-mask: rgba(0, 0, 0, 0.6);

	/* Regional Color System */
	--dbb-sf: #f4b137;          /* San Francisco - Gold */
	--dbb-sv: #e0843d;          /* Silicon Valley - Orange */
	--dbb-nb: #a5a984;          /* North Bay - Olive/Sage */
	--dbb-co: #95b6bb;          /* Coast - Teal */
	--dbb-eb: #b096a5;          /* East Bay - Dusty Rose */
	--dbb-all: #B6ADA5;         /* All Bay - Warm Gray */

	/* Supporting Grays */
	--dbb-gray: #666;
	--dbb-lightgray: #999;
	--dbb-darkgray: #444649;
	--dbb-white: #fff;
	--dbb-black: #111;

	/* Typography */
	--dbb-font-family: "brandon-grotesque", "helvetica neue", sans-serif;
	--dbb-font-size-base: 16px;
	--dbb-font-weight-normal: 400;
	--dbb-font-weight-medium: 500;
	--dbb-font-weight-semibold: 600;
	--dbb-line-height-base: 1.4rem;

	/* Layout */
	--dbb-container-max-width: 1200px;
	--dbb-border-radius: 0.375rem;
	--dbb-transition: all 0.3s ease;
	--dbb-nav-height: 80px;
	--dbb-accent-height: 13px;
}

/* Background Color Classes */
.bg-gold { background-color: var(--dbb-sf); }
.bg-green { background-color: var(--dbb-nb); }
.bg-blue { background-color: var(--dbb-co); }
.bg-orange { background-color: var(--dbb-sv); }
.bg-purple { background-color: var(--dbb-eb); }
.bg-gray { background-color: var(--dbb-gray); }
.bg-darkgray { background-color: var(--dbb-darkgray); }

/* Text Color Classes */
.text-gold { color: var(--dbb-sf); }
.text-green { color: var(--dbb-nb); }
.text-blue { color: var(--dbb-co); }
.text-orange { color: var(--dbb-sv); }
.text-purple { color: var(--dbb-eb); }
.text-gray { color: var(--dbb-gray); }
.text-lightgray { color: var(--dbb-lightgray); }
.text-darkgray { color: var(--dbb-darkgray); }

/* Region Background Colors */
.region-bay { background-color: var(--dbb-black) !important; color: var(--dbb-white); }
.region-sf { background-color: var(--dbb-sf) !important; color: var(--dbb-white); }
.region-sv { background-color: var(--dbb-sv) !important; color: var(--dbb-white); }
.region-nb { background-color: var(--dbb-nb) !important; color: var(--dbb-white); }
.region-co { background-color: var(--dbb-co) !important; color: var(--dbb-white); }
.region-eb { background-color: var(--dbb-eb) !important; color: var(--dbb-white); }

/* Region Border Colors */
.region_border-bay { border-color: var(--dbb-black) !important; }
.region_border-sf { border-color: var(--dbb-sf) !important; }
.region_border-sv { border-color: var(--dbb-sv) !important; }
.region_border-nb { border-color: var(--dbb-nb) !important; }
.region_border-co { border-color: var(--dbb-co) !important; }
.region_border-eb { border-color: var(--dbb-eb) !important; }

/* Button Color Classes */
.btn-action { background-color: var(--dbb-action) !important; border-color: var(--dbb-action) !important; color: #fff; }
.btn-action:hover { background-color: var(--dbb-action-hover) !important; border-color: var(--dbb-action-hover) !important; }