/* ============================================================ Schuttert Sport Sales — tenant theme schuttertsportsales.com (sport-horse sales, equestrian) Palette source: CONFIRMED — read directly from the site's Elementor global colour kit (post-7.css), so these are the brand's own declared hex values, not visual estimates: --e-global-color-primary #BF4518 burnt-orange / rust --e-global-color-secondary #D75F2B brighter orange --e-global-color-text #3D3D3D neutral grey wordmark --e-global-color-accent #FDFDFD near-white surface (green) #26B26B used for positive cues (red) #B03535 used for error cues (peach) #FFBC7D soft warm highlight Cross-checked against the logo (Logo-SSS-def-primary-grey-text): dominant mark ~#C85020 sits between primary/secondary, wordmark ~#3D3D3D — fully consistent. No estimation drift on this one. Each colour token is oklch with the source hex in an inline comment for traceability. Structure mirrors the Grand Prix Sales tenant file. Only :root tokens here — no page redesign. ============================================================ */ :root { /* SURFACES Crisp near-white with a faint warm tint so backgrounds sit comfortably under the burnt-orange identity; text is the brand's neutral grey wordmark colour. */ --background: oklch(98.6% 0.004 60); /* warm near-white (brand #FDFDFD, faintly warmed) */ --foreground: oklch(36.0% 0.005 55); /* #3D3D3D brand grey */ --card: oklch(100% 0 0); /* pure white cards */ --card-foreground: oklch(36.0% 0.005 55); /* #3D3D3D */ --popover: oklch(100% 0 0); --popover-foreground: oklch(36.0% 0.005 55); /* PRIMARY The rust / burnt-orange brand colour. White text clears AA (~5.1:1), so it carries white foreground on buttons, headers and links. */ --primary: oklch(55.4% 0.166 38); /* #BF4518 */ --primary-foreground: oklch(99% 0 0); /* white */ /* ACCENT (highlight / CTA family) The brighter brand orange #D75F2B is the highlight tone. It is too light for white text (white only ~3.8:1), so — per the Stal Tops rule — it keeps the vivid brand value and pairs with a DARK foreground (brand grey, ~5.6:1) rather than being darkened away from the brand. */ --accent: oklch(62.8% 0.164 42); /* #D75F2B */ --accent-foreground: oklch(34% 0.005 55); /* dark brand grey on bright orange (AA 5.6:1) */ --accent-soft: oklch(84.4% 0.111 64); /* #FFBC7D peach — soft hover/fill, dark text */ --accent-strong: oklch(48% 0.155 37); /* deepened rust — pressed/active, white text (7.0:1) */ /* --accent-alt is editorial: a deep petrol-teal as a cool counterpoint to the warm-orange family (orange's complement). Chosen over the usual champagne-gold here because gold sits too close to the brand oranges to read as a distinct second tone. Swap if Schuttert defines its own secondary colour. */ --accent-alt: oklch(45% 0.07 215); /* deep petrol-teal (suggested) */ --accent-alt-foreground: oklch(99% 0 0); /* white (7.2:1) */ /* SECONDARY & MUTED Warm light neutrals so chrome stays in the brand's warm family. */ --secondary: oklch(95.5% 0.006 60); /* warm light fill */ --secondary-foreground: oklch(36.0% 0.005 55); /* #3D3D3D */ --muted: oklch(96.5% 0.005 60); /* warm muted surface */ --muted-foreground: oklch(50% 0.012 55); /* mid warm grey */ /* FUNCTIONAL / FEEDBACK Brand-adjacent where the brand defines them, hue-shifted only where they would collide with the warm-orange chrome. */ /* destructive: the warm-orange brand sits next to red, so this stays a cooler, darker TRUE red (hue ~25 vs primary hue ~38) to read clearly as "error" and not just another brand orange. */ --destructive: oklch(51.3% 0.160 25); /* #B03535 brand red, white text 6.2:1 */ --destructive-foreground: oklch(99% 0 0); /* white */ /* success: the brand green #26B26B, deepened to clear white-text AA for badge/fill use while staying clearly emerald and brighter-in-hue than the primary. */ --success: oklch(54% 0.130 156); /* derived from brand green #26B26B (white 4.8:1) */ --success-foreground: oklch(99% 0 0); /* white */ /* info: no blue exists in the brand, so a clean blue with no collision risk. */ --info: oklch(55% 0.130 250); /* clean blue, white 4.8:1 */ --info-foreground: oklch(99% 0 0); /* white */ /* warning: amber pushed toward yellow (hue ~82) and more saturated so it stays distinct from the warm peach accent-soft; carries dark text. */ --warning: oklch(75% 0.150 82); /* amber, dark text 9.3:1 */ --warning-foreground: oklch(30% 0.03 70); /* deep warm brown-grey */ /* BORDERS & FOCUS */ --border: oklch(90% 0.006 60); /* warm light grey */ --input: oklch(90% 0.006 60); --ring: var(--primary); /* focus ring uses the rust primary */ /* AUCTION STATUS COLORS Live should feel urgent and attention-grabbing. Active should feel positive/safe. Upcoming should feel informative. These map onto the functional colors above. */ --status-live: var(--destructive); --status-active: var(--success); --status-upcoming: var(--info); /* SHAPE Radius controls the default roundness of cards, buttons, inputs and badges. */ --radius: 0.5rem; /* ---------------------------------------------------------------------- LOCKING IN / ADJUSTING These values came straight from the Elementor global kit, so the core brand colours (primary, secondary, text, green, red, peach) are exact. The only editorial picks are: - --accent-alt (deep petrol-teal) — swap if there is an official secondary brand colour. - --success/--info/--warning hues — functional, nudged for contrast and to avoid clashing with the warm-orange chrome. Adjust freely. If you'd rather primary buttons use the brighter orange #D75F2B, swap --primary and --accent — but keep the dark foreground on #D75F2B, since white text on it fails AA (~3.8:1). ---------------------------------------------------------------------- */ }