/* ============================================================ guide.theme.css - GENERATED PER CLIENT by strategy-hub-builder -------------------------------------------------------------- This is the ONLY stylesheet rewritten per client. It defines: 1. the :root color tokens (chrome = client primary; signature gradients = distinct hues, mildly brand-tinted), and 2. the per-module identity rules (.guide-chip.c- + .swbtn.to-) generated from modules/_registry.json - one pair per installed module. guide.css is structural and references these vars; it never changes. HOW THE BUILDER FILLS THIS FILE (see references/02-theming.md): - #6A3D6E / #A862AF = client primary + its lighter partner (from design-system-creator tokens.css --color-primary). Drives the nav, --grad-brand, eyebrows, KPI default underline, TOC active. - #201122 / #3D223F / #6A3D6E = dark hero gradient stops, derived from the client primary (dark -> mid -> primary). Drives every hero. - The six --grad- values = the signature hues from references/07-color-slots.md, each OKLCH-nudged toward the client primary, with the distinctness guard applied (revert to the default hue if two collide or contrast fails). Defaults below = Bluebot set, and are a valid no-theme fallback on their own. - __MODULE_CHIP_RULES__ / __MODULE_SWBTN_RULES__ = one block per installed module, emitted from each module.json colorSlot. The four core blocks (topical/brand/ai/geo) are shown inline as the worked example; the add-module workflow appends green/pink/... the same way. ============================================================ */ :root{ /* --- structural neutrals + semantics (FIXED, copy verbatim) --- */ --ink:#11142a; --navy:#1b1e34; --navy-2:#0e1228; --bg:#eef3fb; --bg-2:#e6edf8; --card:#ffffff; --line:#dce5f2; --line-2:#e9eff7; --t1:#11142a; --t2:#475069; --t3:#8a93ab; --good:#16b981; --warn:#f59e0b; --bad:#ef4444; --money:#16b981; --money-2:#2bb673; --amber:#f5a623; --pink:#ec4899; --cyan:#8ed1fc; --sky:#5f91ce; --teal:#4aeadc; --shadow-sm:0 1px 2px rgba(17,20,42,.06),0 1px 3px rgba(17,20,42,.05); --shadow:0 6px 18px -6px rgba(20,40,90,.16),0 2px 6px -2px rgba(20,40,90,.08); --shadow-lg:0 24px 60px -18px rgba(15,30,70,.32),0 8px 20px -10px rgba(15,30,70,.18); --radius:18px; --radius-sm:12px; --nav-h:64px; --font:"Segoe UI",-apple-system,BlinkMacSystemFont,system-ui,Roboto,"Helvetica Neue",Arial,sans-serif; /* --- CLIENT CHROME (themed from extracted primary; default = Bluebot blue) --- */ --brand:#6A3D6E; /* default #1f4e9c */ --brand-2:#A862AF; /* default #0693e3 */ --grad-brand:linear-gradient(135deg,#6A3D6E 0%,#A862AF 100%); --grad-deep:linear-gradient(155deg,#201122 0%,#3D223F 45%,#6A3D6E 120%); /* default deep stops: #1b1e34 / #16224a / #1f4e9c */ /* --- SIGNATURE GUIDE GRADIENTS (distinct per module; brand-tinted) --- */ /* topical (blue) reuses --grad-brand. The rest are the wayfinding hues: */ --orange:#ff5f1f; --orange-2:#ff8a3d; --grad-orange:linear-gradient(135deg,#ff5f1f 0%,#ff9a3d 100%); --purple:#8b5cf6; --grad-purple:linear-gradient(135deg,#8b5cf6 0%,#6366f1 100%); --geo:#0e9f8e; --geo-2:#34d399; --grad-geo:linear-gradient(135deg,#0e9f8e 0%,#34d399 100%); --grad-money:linear-gradient(135deg,#16b981 0%,#4aeadc 100%); /* core module slots: green (local-seo) + magenta (social-search) */ --green:#15a34a; --grad-green:linear-gradient(135deg,#15a34a 0%,#4ade80 100%); --magenta:#db2777; --grad-magenta:linear-gradient(135deg,#db2777 0%,#f472b6 100%); /* agency-fixed flagship slot: lime (wellness-growth-os). NEVER client-tinted (see references/02-theming.md): the WGOS guide always renders agency navy + lime. */ --navy-wgos:#1d2d61; --lime:#a4bd23; --lime-2:#c3da4d; --grad-lime:linear-gradient(135deg,#a4bd23 0%,#c3da4d 100%); } /* ============================================================ PER-MODULE IDENTITY (generated from modules/_registry.json) One .guide-chip.c- + one .swbtn.to- block per module. The .swbtn muted text/border colors are derived from the slot hue. ============================================================ */ /* __MODULE_CHIP_RULES__ - worked example (the four core modules): */ .guide-chip.c-topical{background:var(--grad-brand)} .guide-chip.c-brand{background:var(--grad-orange)} .guide-chip.c-ai{background:var(--grad-purple)} .guide-chip.c-geo{background:var(--grad-geo)} .guide-chip.c-local{background:var(--grad-green)} .guide-chip.c-social{background:var(--grad-magenta)} .guide-chip.c-wgos{background:var(--grad-lime);color:#1d2d61} /* __MODULE_SWBTN_RULES__ - worked example (the four core modules): Emit ONE base rule per installed module, keyed by the module's navSlug (07-color-slots.md), and the navSlug MUST match the to- class the switcher writes - a mismatch (e.g. to-growth vs to-wgos) drops the button to the guide.css fallback color and verify.py check [5] FAILS the build. Each text tint must be a LIGHT shade of the slot hue (it sits on the dark nav pill); guide.css still guarantees a legible fallback if a rule is ever missing. */ .swbtn.to-topical{color:#a8c6f3;border-color:rgba(31,110,210,.6)} .swbtn.to-topical:hover{background:var(--grad-brand);color:#fff;border-color:transparent;box-shadow:0 5px 16px -4px rgba(6,147,227,.65)} .swbtn.to-brand{color:#ffc4a3;border-color:rgba(255,95,31,.55)} .swbtn.to-brand:hover{background:var(--grad-orange);color:#fff;border-color:transparent;box-shadow:0 5px 16px -4px rgba(255,95,31,.6)} .swbtn.to-ai{color:#cbb8f7;border-color:rgba(139,92,246,.6)} .swbtn.to-ai:hover{background:var(--grad-purple);color:#fff;border-color:transparent;box-shadow:0 5px 16px -4px rgba(139,92,246,.6)} .swbtn.to-geo{color:#86e6cf;border-color:rgba(14,159,142,.6)} .swbtn.to-geo:hover{background:var(--grad-geo);color:#fff;border-color:transparent;box-shadow:0 5px 16px -4px rgba(16,185,129,.6)} .swbtn.to-local{color:#9ce8b8;border-color:rgba(21,163,74,.6)} .swbtn.to-local:hover{background:var(--grad-green);color:#fff;border-color:transparent;box-shadow:0 5px 16px -4px rgba(21,163,74,.6)} .swbtn.to-social{color:#f7b3d4;border-color:rgba(219,39,119,.6)} .swbtn.to-social:hover{background:var(--grad-magenta);color:#fff;border-color:transparent;box-shadow:0 5px 16px -4px rgba(219,39,119,.6)} .swbtn.to-wgos{color:#d4e87a;border-color:rgba(164,189,35,.6)} .swbtn.to-wgos:hover{background:var(--grad-lime);color:#1d2d61;border-color:transparent;box-shadow:0 5px 16px -4px rgba(164,189,35,.55)}