@import url('https://fonts.googleapis.com/css2?family=Roboto+Condensed:wght@400;700&family=Roboto:wght@400;500;700&display=swap'); /* ========================================================================== Navy MAX - tenant theme Loaded by App.razor only on navymax hosts (TenantHelper.StylesheetPath) and scoped through the theme-navymax class on (TenantHelper.ThemeClass). Palette and type taken from navymax.cz: navy surfaces, lime accent, Roboto with condensed uppercase headings, and square corners throughout. Styles the login screen and the boot loader; the rest keeps the default look. ========================================================================== */ .theme-navymax { --nm-navy: #212740; --nm-navy-2: #2C324A; --nm-navy-3: #353E65; --nm-lime: #D7DF21; --nm-lime-deep: #C3CB10; --nm-muted: #9093A0; --loader-accent: var(--nm-lime); /* consumed by Loader.razor */ --navbar-accent: var(--nm-lime); /* consumed by NavMenu.razor (E-Learning label) */ } /* navymax.cz rounds nothing - carrying that through is most of the brand read */ .theme-navymax .navbar, .theme-navymax .login-card, .theme-navymax .login-card .form-control, .theme-navymax .login-card .btn, .theme-navymax #blazor-loader .progress, .theme-navymax #blazor-loader .progress-bar { border-radius: 0; } /* ---------- Navbar ---------- */ .theme-navymax .navbar.bg-dark { background-color: var(--nm-navy) !important; /* bg-dark itself is !important */ border-bottom: 3px solid var(--nm-lime); } .theme-navymax .navbar .navbar-brand-title, .theme-navymax .navbar .navbar-app-label { font-family: 'Roboto Condensed', sans-serif; font-weight: 700; text-transform: uppercase; } .theme-navymax .navbar .navbar-app-label { font-size: 1.15rem; } .theme-navymax .navbar .nav-link, .theme-navymax .navbar .navbar-text { color: rgba(255, 255, 255, 0.75); } .theme-navymax .navbar .nav-link:hover, .theme-navymax .navbar .nav-link:focus, .theme-navymax .navbar .nav-link.active { color: var(--nm-lime); } .theme-navymax .navbar .border-secondary { border-color: var(--nm-navy-3) !important; } .theme-navymax .navbar .dropdown-menu { background-color: var(--nm-navy-2); border: 1px solid var(--nm-navy-3); border-radius: 0; } .theme-navymax .navbar .dropdown-item, .theme-navymax .navbar .dropdown-header { color: #fff; } .theme-navymax .navbar .dropdown-item:hover, .theme-navymax .navbar .dropdown-item:focus { background-color: rgba(215, 223, 33, 0.15); color: #fff; } /* The 3px lime rule under the fixed navbar eats into app.css's 80px clearance */ body.theme-navymax { margin-top: 85px; } /* ---------- Navy backdrop ---------- Painted whenever a boot/login surface is on show: 1. the login screen is rendered (prerendered or interactive - same DOM) 2. authenticated boot: the loader is the first element in */ body.theme-navymax:has(.login-page), body.theme-navymax:has(> #blazor-loader:first-child) { background: var(--nm-navy); background-attachment: fixed; } /* ---------- Boot loader ---------- */ body.theme-navymax:has(> #blazor-loader:first-child) #blazor-loader { color: #fff; font-family: 'Roboto', sans-serif; } .theme-navymax #blazor-loader .progress { background-color: var(--nm-navy-2); border: 1px solid var(--nm-navy-3); } /* ---------- Login card ---------- */ .theme-navymax .login-page { padding-top: 5vh; } .theme-navymax .login-card { background: var(--nm-navy-2); border: 1px solid var(--nm-navy-3); padding: 1.75rem 1.75rem 2rem; color: #fff; font-family: 'Roboto', sans-serif; } .theme-navymax .login-accent { height: 4px; margin: -1.75rem -1.75rem 1.4rem; background: var(--nm-lime); } .theme-navymax .login-title { font-family: 'Roboto Condensed', sans-serif; font-weight: 700; text-transform: uppercase; color: #fff; margin-bottom: 1.1rem; } .theme-navymax .login-card .form-label { font-family: 'Roboto Condensed', sans-serif; font-weight: 700; text-transform: uppercase; letter-spacing: 0.06em; font-size: 0.9rem; color: var(--nm-muted); } .theme-navymax .login-card .form-control { background-color: var(--nm-navy); border: 1px solid var(--nm-navy-3); color: #fff; } .theme-navymax .login-card .form-control:focus { background-color: var(--nm-navy); color: #fff; border-color: var(--nm-lime); box-shadow: 0 0 0 0.2rem rgba(215, 223, 33, 0.2); } .theme-navymax .login-card .form-control:disabled { background-color: var(--nm-navy); opacity: 0.65; } /* Bootstrap 5.0 here - direct overrides, no --bs-btn vars yet */ .theme-navymax .login-card .btn-primary, .theme-navymax .login-card .btn-primary:disabled { background-color: var(--nm-lime); border-color: var(--nm-lime); color: var(--nm-navy); font-family: 'Roboto Condensed', sans-serif; font-weight: 700; text-transform: uppercase; letter-spacing: 0.06em; font-size: 1.15rem; } .theme-navymax .login-card .btn-primary:hover, .theme-navymax .login-card .btn-primary:focus, .theme-navymax .login-card .btn-primary:active { background-color: var(--nm-lime-deep); border-color: var(--nm-lime-deep); color: var(--nm-navy); } .theme-navymax .login-card .btn-outline-secondary { border-color: var(--nm-navy-3); color: #fff; } .theme-navymax .login-card .btn-outline-secondary:hover { background-color: var(--nm-navy-3); border-color: var(--nm-navy-3); color: #fff; } .theme-navymax .login-card hr, .theme-navymax .login-card .text-muted { color: var(--nm-muted) !important; border-color: var(--nm-navy-3); }