/** * Generic theme defaults. * * These are the fallback values only. At runtime `ThemeService` writes the theme JSON * (see src/app/services/theme.service.ts) as inline custom properties on , which * override everything declared here. There are deliberately no per-organisation blocks: * branding comes from the admin side, not from this file. */ :root { /* Typography */ --font-primary: "Noto Sans"; --font-secondary: sans-serif; /* Brand palette */ --brand-primary: #2f4050; --brand-info-color: #00bcd4; --brand-faclon-warning: #f44336; /* May be a colour or a gradient. */ --card-success-color: #1ab394; /** * Card-header / filled-surface fills. * * Primary and info default to their own flat brand colour with a diagonal sheen — * so an org that never opens the gradient fields still gets *its* colour (not a * hardcoded Material one) and still gets the raised look the headers had before. * `background` paints the layers in order: sheen on top, colour underneath. * * When the theme JSON does carry a brand*Gradient, ThemeService writes it inline * on and that replaces the whole value, sheen included. */ --brand-sheen: linear-gradient(60deg, rgba(255, 255, 255, 0.16), rgba(0, 0, 0, 0.16)); --brand-primary-gradient: var(--brand-sheen), var(--brand-primary); --brand-info-gradient: var(--brand-sheen), var(--brand-info-color); /** * Success carries no sheen by default: the stock success header is the flat brand * green (#1ab394, via --card-success-color) exactly as given. An org that wants a * raised or multi-stop success fill sets `brandSuccessGradient`, which replaces * this whole value. */ --brand-success-gradient: var(--card-success-color); /** * Warning is the other exception to the rule above. `neutralColor` * (--brand-faclon-warning) is red and drives warn buttons and toggles, but warning * card headers have always been orange — deriving this one from the flat colour * would turn every warning header red. The stock orange stays the default; an org * that wants its own warning fill sets `brandWarningGradient` explicitly. */ --brand-warning-gradient: linear-gradient(60deg, #ffa726, #fb8c00); /* Driven by secondaryColor */ --sidebar-button-color: #1ab394; --fab-icon-color: #1ab394; --slide-toggle-success-color: #1ab394; /* Sidebar */ --brand-sidebar: #2f4050; --sidebar-font-color: #ffffff; --sidebar-active-background: #ffffff; --sidebar-active-color: #000000; /* No active-opacity variable: the active item is always fully opaque. A softer active state is a lighter --sidebar-active-background, not a transparency. */ /* Top navigation */ --nav-bg-color: #eeeeee; --nav-color: #908e8e; --nav-right-icon: #555555; --logo-icon-bg-color: #ffffff; --logo-icon-color: #999999; --nav-box-shadow: 0px 1px 3px 0px rgba(193, 193, 193, 0.3), 0px 4px 8px 5px rgba(193, 193, 193, 0.15); /* Footer — neutral by default so the stock layout is unchanged. */ --footer-bg-color: transparent; --footer-color: inherit; /* Not part of the theme JSON — static accent kept for backward compatibility. */ --brand-faclon-blue: #4294ff; }