h1:focus { outline: none; } .valid.modified:not([type=checkbox]) { outline: 1px solid #26b050; } .invalid { outline: 1px solid #e50000; } .validation-message { color: #e50000; } .blazor-error-boundary { background: url(data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iNTYiIGhlaWdodD0iNDkiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgeG1sbnM6eGxpbms9Imh0dHA6Ly93d3cudzMub3JnLzE5OTkveGxpbmsiIG92ZXJmbG93PSJoaWRkZW4iPjxkZWZzPjxjbGlwUGF0aCBpZD0iY2xpcDAiPjxyZWN0IHg9IjIzNSIgeT0iNTEiIHdpZHRoPSI1NiIgaGVpZ2h0PSI0OSIvPjwvY2xpcFBhdGg+PC9kZWZzPjxnIGNsaXAtcGF0aD0idXJsKCNjbGlwMCkiIHRyYW5zZm9ybT0idHJhbnNsYXRlKC0yMzUgLTUxKSI+PHBhdGggZD0iTTI2My41MDYgNTFDMjY0LjcxNyA1MSAyNjUuODEzIDUxLjQ4MzcgMjY2LjYwNiA1Mi4yNjU4TDI2Ny4wNTIgNTIuNzk4NyAyNjcuNTM5IDUzLjYyODMgMjkwLjE4NSA5Mi4xODMxIDI5MC41NDUgOTIuNzk1IDI5MC42NTYgOTIuOTk2QzI5MC44NzcgOTMuNTEzIDI5MSA5NC4wODE1IDI5MSA5NC42NzgyIDI5MSA5Ny4wNjUxIDI4OS4wMzggOTkgMjg2LjYxNyA5OUwyNDAuMzgzIDk5QzIzNy45NjMgOTkgMjM2IDk3LjA2NTEgMjM2IDk0LjY3ODIgMjM2IDk0LjM3OTkgMjM2LjAzMSA5NC4wODg2IDIzNi4wODkgOTMuODA3MkwyMzYuMzM4IDkzLjAxNjIgMjM2Ljg1OCA5Mi4xMzE0IDI1OS40NzMgNTMuNjI5NCAyNTkuOTYxIDUyLjc5ODUgMjYwLjQwNyA1Mi4yNjU4QzI2MS4yIDUxLjQ4MzcgMjYyLjI5NiA1MSAyNjMuNTA2IDUxWk0yNjMuNTg2IDY2LjAxODNDMjYwLjczNyA2Ni4wMTgzIDI1OS4zMTMgNjcuMTI0NSAyNTkuMzEzIDY5LjMzNyAyNTkuMzEzIDY5LjYxMDIgMjU5LjMzMiA2OS44NjA4IDI1OS4zNzEgNzAuMDg4N0wyNjEuNzk1IDg0LjAxNjEgMjY1LjM4IDg0LjAxNjEgMjY3LjgyMSA2OS43NDc1QzI2Ny44NiA2OS43MzA5IDI2Ny44NzkgNjkuNTg3NyAyNjcuODc5IDY5LjMxNzkgMjY3Ljg3OSA2Ny4xMTgyIDI2Ni40NDggNjYuMDE4MyAyNjMuNTg2IDY2LjAxODNaTTI2My41NzYgODYuMDU0N0MyNjEuMDQ5IDg2LjA1NDcgMjU5Ljc4NiA4Ny4zMDA1IDI1OS43ODYgODkuNzkyMSAyNTkuNzg2IDkyLjI4MzcgMjYxLjA0OSA5My41Mjk1IDI2My41NzYgOTMuNTI5NSAyNjYuMTE2IDkzLjUyOTUgMjY3LjM4NyA5Mi4yODM3IDI2Ny4zODcgODkuNzkyMSAyNjcuMzg3IDg3LjMwMDUgMjY2LjExNiA4Ni4wNTQ3IDI2My41NzYgODYuMDU0N1oiIGZpbGw9IiNGRkU1MDAiIGZpbGwtcnVsZT0iZXZlbm9kZCIvPjwvZz48L3N2Zz4=) no-repeat 1rem/1.8rem, #b32121; padding: 1rem 1rem 1rem 3.7rem; color: white; } .blazor-error-boundary::after { content: "An error has occurred." } .darker-border-checkbox.form-check-input { border-color: #929292; } /* ========================================================= Salus — stili centralizzati e variabili di tema I colori "brand" derivano dalla palette MudBlazor (--mud-palette-*), così cambiando il MudTheme cambia anche il CSS custom. Per un tema alternativo: + override variabili. ========================================================= */ :root { --salus-primary: var(--mud-palette-primary, #b62424); --salus-secondary: var(--mud-palette-secondary, #7c7b7b); --salus-font-title: 'Raleway', sans-serif; --salus-font-body: 'Work Sans', sans-serif; --salus-bar: #5a8a96; --salus-bar-dark: #3f6b76; --salus-bar-grid: #ececec; --salus-bar-gridlabel: #bbbbbb; --salus-bar-axis: #cccccc; --salus-donut-track: #eeeeee; --salus-login-image: url('images/slider-materasso.jpg'); --salus-login-overlay: rgba(25, 15, 15, .58); --salus-field-border: #c4c4c4; } /* Esempio di tema alternativo (attivabile con ) */ [data-theme="verde"] { --salus-bar: #4f8a5a; --salus-bar-dark: #356b40; /* i colori primario/secondario arrivano dal MudTheme via --mud-palette-* */ } /* ---- App bar ---- */ .salus-appbar { border-bottom: 3px solid var(--salus-primary); } .salus-appbar__brand { display: flex; align-items: center; text-decoration: none; } .salus-appbar__logo { height: 36px; margin-right: 14px; } .salus-appbar__title { font-family: var(--salus-font-title); font-weight: 300; font-size: 1.05rem; color: var(--salus-secondary); letter-spacing: .5px; } /* ---- Schermata di login ---- */ .salus-auth { position: fixed; inset: 0; display: flex; align-items: center; justify-content: center; background: linear-gradient(var(--salus-login-overlay), var(--salus-login-overlay)), var(--salus-login-image) center center / cover no-repeat; overflow: auto; } .salus-auth__content { position: relative; z-index: 2; width: 100%; max-width: 420px; padding: 16px; } .salus-login-card { border-top: 4px solid var(--salus-primary); border-radius: 10px; } .salus-login-logo-wrap { text-align: center; margin-bottom: 8px; } .salus-login-logo { height: 64px; } .salus-login-subtitle { font-family: var(--salus-font-title); font-weight: 300; letter-spacing: 1px; color: var(--salus-secondary); } .salus-login-label { display: block; margin-bottom: 4px; font-size: .85rem; } .salus-login-field { width: 100%; padding: 10px; border: 1px solid var(--salus-field-border); border-radius: 6px; } .salus-login-btn { width: 100%; padding: 12px; border: none; border-radius: 6px; background: var(--salus-primary); color: #fff; font-size: 1rem; font-family: var(--salus-font-body); font-weight: 600; cursor: pointer; } /* ---- Utility ---- */ .salus-num { text-align: right; } .salus-card-fill { height: 100%; } .salus-panel { background: #f5f5f5; } .salus-panel-soft { background: #f7f1f1; } /* ---- Tabella fatturato ---- */ .salus-table-label { color: var(--salus-primary); } /* ---- Donut stati ordini ---- */ .salus-donut { display: flex; flex-direction: column; align-items: center; } .salus-donut__svg { width: 230px; height: 230px; } .salus-donut__track { stroke: var(--salus-donut-track); } .salus-donut__legend { margin-top: 8px; width: 100%; max-width: 300px; } .salus-donut__legend-row { display: flex; align-items: center; padding: 2px 0; } .salus-donut__swatch { width: 12px; height: 12px; border-radius: 2px; display: inline-block; margin-right: 8px; } .salus-donut__label { font-size: .85rem; } /* ---- Istogramma settimane ---- */ .salus-bar { width: 100%; } .salus-bar__rect { fill: var(--salus-bar); } .salus-bar__value { fill: var(--salus-bar-dark); font-weight: 600; font-family: var(--salus-font-body); } .salus-bar__grid { stroke: var(--salus-bar-grid); } .salus-bar__gridlabel { fill: var(--salus-bar-gridlabel); font-family: var(--salus-font-body); } .salus-bar__axis { stroke: var(--salus-bar-axis); } .salus-bar__weeklabel { fill: var(--salus-secondary); font-family: var(--salus-font-body); }