/* ===================================================================== SmartPact — Dashboard bootstrap CSS The dashboard at /user/* now renders its own SmartPact-themed React chrome (sidebar, topbar, footer) via a nested MUI ThemeProvider in UserDashboard.js. This file only handles the *bootstrap* moment — between the HTML reaching the browser and React mounting — so the page never flashes the public marketing chrome or a white canvas. Activated by (set by dashboard-shell.js as soon as the path matches /user/*). ===================================================================== */ body.sp-dash{ margin:0; background:#000 !important; color:#FFFFFF; font-family:"Geist", "Inter", system-ui, -apple-system, sans-serif; -webkit-font-smoothing:antialiased; display:block !important; min-height:100vh; } /* Hide the public marketing header/footer everywhere inside /user/*. The React dashboard has its own. */ body.sp-dash .sp-header, body.sp-dash .sp-footer, body.sp-dash [data-sp-header], body.sp-dash [data-sp-footer]{ display:none !important; } body.sp-dash #root{ min-height:100vh; } body.sp-dash ::selection{ background:#D4FF3A; color:#000; } body.sp-dash ::-webkit-scrollbar{ width:9px; height:9px; } body.sp-dash ::-webkit-scrollbar-track{ background:#000; } body.sp-dash ::-webkit-scrollbar-thumb{ background:rgba(255,255,255,0.12); border-radius:6px; } body.sp-dash ::-webkit-scrollbar-thumb:hover{ background:rgba(255,255,255,0.22); } /* ───────────────────────────────────────────────────────────────── "Coming soon" sidebar items — Distribute group Tagged by dashboard-shell.js via .sp-soon on the nav-item element. ───────────────────────────────────────────────────────────────── */ body.sp-dash .sp-soon{ opacity: 0.48 !important; cursor: not-allowed !important; filter: saturate(0.6); position: relative; pointer-events: auto !important; } /* Block clicks on children, keep the badge clickable-through */ body.sp-dash .sp-soon > *:not(.sp-soon-badge){ pointer-events: none !important; } /* Kill any active/hover background MUI would normally paint */ body.sp-dash .sp-soon:hover, body.sp-dash .sp-soon:focus, body.sp-dash .sp-soon.Mui-selected, body.sp-dash .sp-soon[aria-selected="true"]{ background-color: transparent !important; background: transparent !important; } /* Soft overlay so the item visually pushes back */ body.sp-dash .sp-soon::before{ content: ""; position: absolute; inset: 0; border-radius: inherit; background: rgba(0,0,0,0.18); pointer-events: none; } /* The badge itself */ body.sp-dash .sp-soon-badge{ display: inline-flex; align-items: center; justify-content: center; margin-left: auto; padding: 2px 8px; font-family: "Geist", "Inter", system-ui, -apple-system, sans-serif; font-size: 9.5px; font-weight: 600; letter-spacing: .14em; text-transform: uppercase; line-height: 1; height: 18px; border-radius: 999px; color: #D4FF3A; background: rgba(212, 255, 58, 0.10); border: 1px solid rgba(212, 255, 58, 0.30); white-space: nowrap; flex-shrink: 0; pointer-events: none; position: absolute; right: 12px; top: 50%; transform: translateY(-50%); z-index: 2; }