/** * VertexCapitals Ultra-Premium Dual-Theme Engine (Light & Dark) * Seamlessly transitions between Executive Institutional Dark and Ultra-Clean Diamond Light. */ :root { --font-sans: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, 'Helvetica Neue', Arial, sans-serif; /* Light Mode Palette (Ultra-Clean Executive Porcelain) */ --bg-page-light: #f8fafc; --bg-card-light: #ffffff; --bg-card-secondary-light: #f1f5f9; --bg-header-light: rgba(255, 255, 255, 0.88); --border-light: #e2e8f0; --border-subtle-light: #cbd5e1; --text-primary-light: #0f172a; --text-secondary-light: #475569; --text-muted-light: #64748b; --shadow-luxury-light: 0 10px 30px -5px rgba(15, 23, 42, 0.04), 0 2px 6px -1px rgba(15, 23, 42, 0.02), 0 0 0 1px rgba(15, 23, 42, 0.05); --shadow-card-light: 0 4px 20px -2px rgba(15, 23, 42, 0.05), 0 0 0 1px rgba(15, 23, 42, 0.05); /* Dark Mode Palette (Deep Institutional Navy / Carbon) */ --bg-page-dark: #070a11; --bg-card-dark: #0c121e; --bg-card-secondary-dark: #101726; --bg-header-dark: rgba(12, 18, 30, 0.90); --border-dark: rgba(255, 255, 255, 0.08); --border-subtle-dark: #1e293b; --text-primary-dark: #f8fafc; --text-secondary-dark: #94a3b8; --text-muted-dark: #64748b; --shadow-luxury-dark: 0 20px 40px -10px rgba(0, 0, 0, 0.6), 0 0 0 1px rgba(255, 255, 255, 0.06); --shadow-card-dark: 0 10px 25px -5px rgba(0, 0, 0, 0.5), 0 0 0 1px rgba(255, 255, 255, 0.05); /* Universal Brand Colors */ --primary: #183EFA; --primary-hover: #1232d0; --primary-glow: rgba(24, 62, 250, 0.25); --emerald-accent: #10b981; --amber-accent: #f59e0b; --rose-accent: #f43f5e; } /* Light Theme (Default when .dark class is absent on ) */ html:not(.dark) body { background-color: var(--bg-page-light); color: var(--text-primary-light); background-image: radial-gradient(at 0% 0%, rgba(24, 62, 250, 0.03) 0px, transparent 50%), radial-gradient(at 100% 100%, rgba(16, 185, 129, 0.03) 0px, transparent 50%); } html.dark body { background-color: var(--bg-page-dark); color: var(--text-primary-dark); background-image: radial-gradient(at 0% 0%, rgba(24, 62, 250, 0.06) 0px, transparent 50%), radial-gradient(at 100% 100%, rgba(16, 185, 129, 0.04) 0px, transparent 50%); } /* Smooth Transitions */ body, header, aside, .theme-card, .theme-bg, input, select, textarea { transition: background-color 0.25s ease, border-color 0.25s ease, color 0.2s ease, box-shadow 0.25s ease; } /* Light Mode Logo Filter */ html:not(.dark) .brand-logo-adaptive { filter: brightness(0.12) contrast(1.1); } html.dark .brand-logo-adaptive { filter: brightness(2); } /* Theme Adaptive Utilities */ html:not(.dark) .theme-card { background-color: var(--bg-card-light); border-color: var(--border-light); box-shadow: var(--shadow-card-light); } html.dark .theme-card { background-color: var(--bg-card-dark); border-color: var(--border-dark); box-shadow: var(--shadow-card-dark); } html:not(.dark) .theme-input { background-color: var(--bg-card-secondary-light); border-color: var(--border-light); color: var(--text-primary-light); } html.dark .theme-input { background-color: var(--bg-card-secondary-dark); border-color: var(--border-subtle-dark); color: var(--text-primary-dark); } html:not(.dark) .theme-table-head { background-color: #f1f5f9; color: #475569; border-bottom: 1px solid #e2e8f0; } html.dark .theme-table-head { background-color: #070a11; color: #94a3b8; border-bottom: 1px solid rgba(255, 255, 255, 0.08); } html:not(.dark) .theme-table-row { border-bottom: 1px solid #f1f5f9; } html:not(.dark) .theme-table-row:hover { background-color: rgba(241, 245, 249, 0.6); } html.dark .theme-table-row { border-bottom: 1px solid rgba(255, 255, 255, 0.05); } html.dark .theme-table-row:hover { background-color: rgba(255, 255, 255, 0.03); } /* Theme Switcher Button Animation */ .theme-toggle-btn { position: relative; display: inline-flex; align-items: center; justify-content: center; width: 38px; height: 38px; border-radius: 12px; cursor: pointer; transition: all 0.2s cubic-bezier(0.4, 0, 0.2, 1); } html:not(.dark) .theme-toggle-btn { background-color: #f1f5f9; border: 1px solid #e2e8f0; color: #0f172a; } html:not(.dark) .theme-toggle-btn:hover { background-color: #e2e8f0; color: var(--primary); } html.dark .theme-toggle-btn { background-color: #101726; border: 1px solid #1e293b; color: #cbd5e1; } html.dark .theme-toggle-btn:hover { border-color: rgba(24, 62, 250, 0.4); color: #ffffff; } /* Custom Scrollbars */ html:not(.dark) ::-webkit-scrollbar { width: 8px; height: 8px; } html:not(.dark) ::-webkit-scrollbar-track { background: #f1f5f9; } html:not(.dark) ::-webkit-scrollbar-thumb { background: #cbd5e1; border-radius: 4px; } html:not(.dark) ::-webkit-scrollbar-thumb:hover { background: #94a3b8; } html.dark ::-webkit-scrollbar { width: 8px; height: 8px; } html.dark ::-webkit-scrollbar-track { background: #070a11; } html.dark ::-webkit-scrollbar-thumb { background: #1e293b; border-radius: 4px; } html.dark ::-webkit-scrollbar-thumb:hover { background: #334155; } /* Ensure legacy floating support button is completely removed */ .fixed.bottom-5.right-5.z-50, .fixed.bottom-5.right-5 { display: none !important; }