/* ===== GLOBAL THEME — Chatbase-style: minimalist black-on-white ===== */ :root { /* Primary (accent) — flat near-black, chatbase-style */ --primary: #0a0a0a; --primary-mid: #1f1f1f; --primary-light: #4b4b4b; --primary-rgb: 10, 10, 10; --primary-mid-rgb: 31, 31, 31; --accent-rgb: 75, 75, 75; /* Accent colors */ --accent-blue: #2563eb; --accent-blue-rgb: 37, 99, 235; --accent-purple: #7c3aed; --orange: #f97316; /* Text — near-black on white (chatbase uses #0A0A0A not pure black) */ --text-heading: #0a0a0a; --text-body: #1f2937; --text-muted: #4b5563; --text-faint: #6b7280; --text-ghost: #9ca3af; /* Backgrounds — pure white with subtle section grays */ --bg-white: #ffffff; --bg-light: #fafafa; --bg-subtle: #f4f4f5; /* Borders — chatbase-style subtle light gray */ --border: #e5e7eb; --border-hover: #d1d5db; /* Status */ --success: #16a34a; --success-rgb: 22, 163, 74; --warning: #d97706; --warning-rgb: 217, 119, 6; --danger: #dc2626; --danger-rgb: 220, 38, 38; /* UI Components */ --logo-text: #0a0a0a; --header-backdrop: rgba(255, 255, 255, 0.85); --input-border: #e5e7eb; --input-placeholder: #9ca3af; --warning-bg: #fef3c7; --warning-text: #92400e; --scrollbar: #d1d5db; --scrollbar-light: #e5e7eb; /* Gradients — flat solid near-black (chatbase buttons are flat, not metallic) */ --gradient-primary: #0a0a0a; --gradient-blue: #0a0a0a; --gradient-accent: #1f1f1f; --gradient-bar: linear-gradient(to top, #1f1f1f, #0a0a0a); --gradient-line: linear-gradient(90deg, #1f1f1f, #0a0a0a); } /* ===== CHATBASE-STYLE BUTTON REFINEMENTS ===== Applies on ALL pages that use .btn-primary. Overrides per-page styles that came before this file in the cascade (which is why theme.css is linked last in ). */ .btn-primary { background: #0a0a0a !important; box-shadow: 0 1px 2px rgba(0, 0, 0, 0.05) !important; border: 1px solid #0a0a0a; transition: background 0.2s ease, transform 0.2s ease, box-shadow 0.2s ease; } .btn-primary:hover { background: #1f1f1f !important; transform: translateY(-1px) !important; box-shadow: 0 4px 12px rgba(0, 0, 0, 0.12) !important; } .btn-secondary { background: #ffffff !important; border: 1px solid var(--border) !important; color: var(--text-heading) !important; box-shadow: 0 1px 2px rgba(0, 0, 0, 0.04); transition: background 0.2s ease, border-color 0.2s ease, transform 0.2s ease; } .btn-secondary:hover { background: var(--bg-light) !important; border-color: var(--border-hover) !important; transform: translateY(-1px) !important; } /* ===== CHATBASE-STYLE CARDS / SHADOWS ===== Softer, less floaty shadows than the current heavy drop-shadow. */ .chat-demo-window { box-shadow: 0 4px 24px rgba(0, 0, 0, 0.06), 0 0 0 1px var(--border) !important; } /* ===== Global Wordmark Logo (W icon + WayToChat + AI CHATBOT subtitle) ===== Applied wherever