/* KNM Gateway dashboard — sits on top of Bootstrap 5 + KNM.RazorComponents. Bootstrap supplies the form-control / card / navbar / modal classes; this file only adds dark-mode tokens + a few page-shell tweaks. */ /* FOUC prevention overlay — shown until the KNM loader fires window.load and adds .loaded. Lives in site.css (loaded in ) so it applies before the body paints. */ #knm-loading { position: fixed; inset: 0; z-index: 9999; background: var(--bs-body-bg, #fff); display: flex; align-items: center; justify-content: center; transition: opacity .3s ease; } #knm-loading.loaded { opacity: 0; pointer-events: none; } .knm-loading-spinner { width: 40px; height: 40px; border: 3px solid var(--bs-border-color, #e9ecef); border-top-color: var(--bs-primary, #0d6efd); border-radius: 50%; animation: knm-spin .6s linear infinite; } @keyframes knm-spin { to { transform: rotate(360deg); } } /* Default = dark theme tokens (matches html data-bs-theme="dark" / "system"-resolved-dark). */ :root, html[data-bs-theme="dark"] { --bg: #0e1116; --panel: #161b22; --line: #2a3140; --fg: #e6edf3; --muted: #8d96a0; --acc: #4ea1ff; --err: #ff6b6b; } /* Light theme tokens — kicked in by App.razor cookie resolver or system pref. */ html[data-bs-theme="light"] { --bg: #ffffff; --panel: #f5f7fa; --line: #dee2e6; --fg: #1f2329; --muted: #6c757d; --acc: #0d6efd; --err: #dc3545; } html, body { font-family: system-ui, -apple-system, "Segoe UI", Roboto, sans-serif; font-size: 14px; background: var(--bg) !important; color: var(--fg); } /* Sticky footer — body flex column so
grows to push