/* AgriHire Australia — Unified Design System */ /* Public anon key — safe to expose in client. RLS policies protect data access. */ /* ─── Instant nav skeleton (opt-in via body.ah-app) ────────────────────── Renders the dark nav bar IMMEDIATELY as the page loads, so users don't see a 500ms gap while Supabase auth completes before injectNav() draws the real nav. The pseudo-element disappears the moment body gets the `ah-nav-ready` class — which injectNav() sets after rendering. IMPORTANT: this is OPT-IN. Only pages that call injectNav() should declare . Public pages (homepage, login, terms, privacy, support, reset-app, etc.) have their own navs and MUST NOT include the class — otherwise the skeleton overlaps their real header. */ body.ah-app:not(.ah-nav-ready)::before { content: ''; display: block; position: fixed; top: 0; left: 0; right: 0; height: 52px; background: rgba(13, 27, 46, 0.97); border-bottom: 1px solid rgba(255,255,255,.08); z-index: 9998; pointer-events: none; } body.ah-app:not(.ah-nav-ready)::after { content: 'AgriHire'; display: block; position: fixed; top: 0; left: 20px; height: 52px; line-height: 52px; color: #4A9B3F; font-family: 'Playfair Display', serif; font-weight: 900; font-size: 20px; letter-spacing: 0.02em; z-index: 9999; pointer-events: none; } /* ─── Launch promo banner (visible during free period only) ───────────── The banner is injected by /js/agrihire-launch-config.js with id #ah-launch-banner. The CSS keeps nav + banner stacked correctly during the free period. */ #ah-launch-banner { position: fixed; top: 0; left: 0; right: 0; z-index: 10000; } body.ah-app:has(#ah-launch-banner) { padding-top: 92px !important; } body.ah-app:has(#ah-launch-banner):not(.ah-nav-ready)::before, body.ah-app:has(#ah-launch-banner) #ah-nav { top: 40px !important; } :root { /* Brand Colors (from official logo) */ --navy: #0D1B2E; --navy2: #132338; --navy3: #1A2E48; --agri: #4A9B3F; --agri2: #3A8A2F; --agribg: rgba(74,155,63,.10); --gold: #D4A843; --gold2: #E8C060; --goldbg: rgba(212,168,83,.10); --grass: #4A9B3F; --sage: #3A7A30; --cream: #F4F7F2; --mist: #EEF2EC; --white: #FFFFFF; /* Semantic Colors */ --red: #E74C3C; --redbg: rgba(231,76,60,.08); --blue: #2980B9; --bluebg: rgba(41,128,185,.10); --purple: #7C3AED; --purplebg:rgba(124,58,237,.10); --green: #27AE60; --teal: #16A085; --orange: #E67E22; /* Text */ --text: #0D1B2E; --sub: #5A7A6A; --subtext: #5A7A6A; --earth: #0D1B2E; --soil: #132338; --wheat: #D4A843; /* Borders */ --border: rgba(74,155,63,.15); --border2: rgba(74,155,63,.28); /* Shadows */ --shadow-sm: 0 1px 4px rgba(13,27,46,.06); --shadow-md: 0 4px 16px rgba(13,27,46,.10); --shadow-lg: 0 12px 40px rgba(13,27,46,.14); --shadow: 0 4px 24px rgba(13,27,46,.08); --card-r: 16px; } /* ═══ AgriHire Logo Component ═══ */ .ah-logo{display:inline-flex;align-items:center;gap:9px;text-decoration:none !important;} .ah-logo-icon{width:34px;height:34px;flex-shrink:0;} .ah-logo-text{font-family:'Playfair Display',serif;font-size:20px;font-weight:900;letter-spacing:-.3px;line-height:1;} .ah-logo-text .g{color:#4A9B3F;} .ah-logo-text .au{font-family:'DM Sans',sans-serif;font-size:14px;font-weight:700;color:#D4A843;letter-spacing:.03em;margin-left:4px;} /* Light variant (for dark backgrounds) */ .ah-logo-light .ah-logo-text{color:#fff;} /* Dark variant (for light backgrounds) */ .ah-logo-dark .ah-logo-text{color:#0D1B2E;} /* Large variant */ .ah-logo-lg .ah-logo-icon{width:48px;height:48px;} .ah-logo-lg .ah-logo-text{font-size:26px;} .ah-logo-lg .ah-logo-text .au{font-size:16px;} /* ═══ Mobile form-input minimum font-size (prevents iOS Safari zoom + helps older eyes) ═══ */ @media (max-width: 900px) { input:not([type=checkbox]):not([type=radio]):not([type=range]):not([type=file]):not([type=color]), select, textarea { font-size: 16px !important; } }