/** * WavPOS Wallet Theme — Design tokens * * Single source of truth. The whole theme re-skins from this file. * The Customizer overrides --wv-brand and --wv-brand-ink inline in . * * CONTRAST RULE (do not "fix" this back): * --wv-brand (#60ccf7) is a LIGHT blue. White text on it is ~1.9:1 and FAILS. * Text drawn ON the brand fill uses --wv-brand-ink (dark). White is reserved * for the logo wordmark and large non-text glyphs only. * See the contrast audit in readme.txt — every pair below is measured. */ :root { /* Brand */ --wv-brand: #60ccf7; /* WavPOS blue — background / accent only */ --wv-brand-ink: #0a2a38; /* readable text drawn ON the brand fill */ --wv-brand-contrast: #ffffff; /* white — wordmark / large glyphs ON brand only */ /* Surfaces */ --wv-bg: #ffffff; --wv-fg: #16181d; /* body text — >=7:1 on --wv-bg */ --wv-muted: #5a6672; /* secondary text — >=4.5:1 on --wv-bg */ --wv-surface: #f5f7f9; /* cards, insets */ --wv-border: #dde3e8; /* Semantic — notices MUST be high-contrast and unmissable */ --wv-error-bg: #fdecea; --wv-error-fg: #8a1c14; --wv-error-border: #e0574c; --wv-success-bg: #e9f7ef; --wv-success-fg: #0a6b3b; --wv-success-border: #3fae74; --wv-info-bg: #e8f6fd; --wv-info-fg: #0a4a63; --wv-info-border: var(--wv-brand); /* Type & rhythm */ --wv-font: system-ui, -apple-system, "Segoe UI", Roboto, Helvetica, Arial, sans-serif; --wv-radius: 10px; --wv-tap: 44px; /* minimum touch target */ --wv-maxw: 640px; /* single-column content max width */ /* Spacing scale */ --wv-space-1: 4px; --wv-space-2: 8px; --wv-space-3: 12px; --wv-space-4: 16px; --wv-space-5: 24px; --wv-space-6: 32px; /* Focus */ --wv-focus: #0a4a63; /* solid outline colour — not color-mix() only */ }