/* ============================================================================ Participant V2 — Design Tokens (ala Shadcn di atas Bootstrap 5) Sumber kebenaran tunggal untuk warna, radius, shadow, spacing. Ubah nilai di sini → seluruh UI ikut berubah. Jangan hardcode warna di Blade. ============================================================================ */ :root { /* Neutral surface & text */ --v2-background: #f8f8f9; --v2-foreground: #0a0a0a; --v2-card: #ffffff; --v2-card-foreground: #0a0a0a; --v2-muted: #f4f4f5; --v2-muted-foreground: #71717a; --v2-border: #e4e4e7; --v2-input: #e4e4e7; --v2-ring: #18181b; /* Brand / primary — ganti dua nilai ini untuk menyesuaikan warna brand */ --v2-primary: #4f46e5; /* indigo lembut; ganti ke warna brand LKPB */ --v2-primary-foreground: #ffffff; --v2-primary-soft: #eef2ff; /* background lembut untuk chip/CTA */ /* Status & palet tombol */ --v2-success: #16a34a; --v2-success-soft: #dcfce7; --v2-warning: #d97706; --v2-warning-soft: #fef3c7; --v2-destructive: #dc2626; --v2-destructive-soft: #fee2e2; --v2-info: #0ea5e9; --v2-info-soft: #e0f2fe; --v2-secondary: #475569; /* slate — tombol netral gelap */ --v2-secondary-soft: #f1f5f9; --v2-dark: #18181b; --v2-dark-soft: #e4e4e7; /* Bentuk */ --v2-radius: 0.75rem; --v2-radius-sm: 0.5rem; --v2-radius-lg: 1rem; --v2-radius-pill: 999px; /* Elevasi — halus, khas Shadcn */ --v2-shadow-sm: 0 1px 2px 0 rgb(0 0 0 / 0.05); --v2-shadow-md: 0 4px 12px -2px rgb(0 0 0 / 0.08); --v2-shadow-lg: 0 12px 32px -8px rgb(0 0 0 / 0.12); /* Layout */ --v2-container-max: 560px; /* mobile-first: konten sempit walau di desktop */ --v2-topbar-h: 56px; --v2-bottomnav-h: 64px; /* Tipografi */ --v2-font: "Inter", system-ui, -apple-system, "Segoe UI", Roboto, sans-serif; } /* Dark mode opsional (aktif bila ). Belum wajib. */ :root[data-theme="dark"] { --v2-background: #0a0a0a; --v2-foreground: #fafafa; --v2-card: #131316; --v2-card-foreground: #fafafa; --v2-muted: #1c1c1f; --v2-muted-foreground: #a1a1aa; --v2-border: #27272a; --v2-input: #27272a; --v2-ring: #d4d4d8; --v2-primary-soft: #1e1b4b; --v2-success-soft: #052e16; --v2-warning-soft: #451a03; --v2-destructive-soft: #450a0a; --v2-info-soft: #082f49; --v2-secondary-soft: #1e293b; --v2-dark: #fafafa; --v2-dark-soft: #27272a; }