/* * ============================================================ * affiliate.css — Buletina Affiliate Portal Shared Styles * Loaded by layouts/affiliate.blade.php on every page. * * Contains: * 1. CSS custom properties (design tokens) * 2. Reset & base body styles * 3. Dark mode overrides * * Page-specific styles live in @section('styles') in each * individual Blade view — they are injected into the * via @yield('styles') in the layout. * ============================================================ */ /* ── 1. Design Tokens ───────────────────────────────────────── */ :root { /* Buletina brand green */ --brand: #1D9E75; --brand-dark: #0F6E56; --brand-mid: #0F6E56; --brand-light: #C8EBE0; --brand-pale: #E8F7F2; /* Status accents */ --accent: #e76f51; --accent-pale: #fde8df; --gold: #f4a261; --gold-pale: #fef3e2; /* Text */ --text: #0D1B14; --text-muted: #374940; --text-faint: #5E7268; /* Surfaces */ --border: #D8E6DF; --surface: #F5FAF7; --surface-2: #EDF5F0; --white: #ffffff; /* Status tokens */ --pending: #e76f51; --confirmed: #0F6E56; --paid: #1D9E75; --tracking: #f4a261; --expired: #a0a0a0; /* Sidebar / topbar */ --sidebar: #0D1B14; /* Shape */ --radius: 8px; --radius-sm: 6px; } /* ── 2. Reset & Base ────────────────────────────────────────── */ *, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; } html { font-size: 100%; -webkit-text-size-adjust: 100%; } body { font-family: 'Sora', sans-serif; background: var(--surface); color: var(--text); font-size: 1rem; line-height: 1.6; min-height: 100vh; } /* ── 3. Dark Mode ───────────────────────────────────────────── */ [data-theme="dark"] { --brand: #2dbd8a; --brand-mid: #1D9E75; --brand-light: #1a3028; --brand-pale: #0f1f18; --text: #f0f0f0; --text-muted: #a8a8a8; --text-faint: #707070; --border: #2a2a2a; --surface: #0a0a0a; --surface-2: #111111; --white: #1a1a1a; --gold: #f4a261; --gold-pale: #1f1508; --sidebar: #000000; } [data-theme="dark"] .topbar { border-bottom-color: rgba(255,255,255,0.06); } [data-theme="dark"] #auth-gate { background: var(--surface); }