@import '_content/Catalis.Starter.Shell/Catalis.Starter.Shell.eqmvczy79u.bundle.scp.css';

/* /Features/Samples/Demo.razor.rz.scp.css */
/*
 * Component-scoped styles for Demo.razor.
 *
 * Theme swatches use MudBlazor's runtime CSS custom properties
 * (--mud-palette-*) so they track the active theme automatically —
 * toggle dark/light in the user menu and the swatches swap with it.
 * No hex codes here; the canonical hex values live in StarterTheme.cs.
 */

.theme-swatch[b-nsre6jal2x] {
    display: inline-block;
    width: 24px;
    height: 24px;
    border-radius: 4px;
    border: 1px solid var(--mud-palette-lines-default);
    vertical-align: middle;
}

.theme-swatch.primary[b-nsre6jal2x] { background: var(--mud-palette-primary); }
.theme-swatch.secondary[b-nsre6jal2x] { background: var(--mud-palette-secondary); }
.theme-swatch.tertiary[b-nsre6jal2x] { background: var(--mud-palette-tertiary); }
.theme-swatch.error[b-nsre6jal2x] { background: var(--mud-palette-error); }
.theme-swatch.warning[b-nsre6jal2x] { background: var(--mud-palette-warning); }
.theme-swatch.info[b-nsre6jal2x] { background: var(--mud-palette-info); }
.theme-swatch.success[b-nsre6jal2x] { background: var(--mud-palette-success); }
.theme-swatch.appbar[b-nsre6jal2x] { background: var(--mud-palette-appbar-background); }
.theme-swatch.appbartext[b-nsre6jal2x] { background: var(--mud-palette-appbar-text); }
.theme-swatch.drawer[b-nsre6jal2x] { background: var(--mud-palette-drawer-background); }
.theme-swatch.drawertext[b-nsre6jal2x] { background: var(--mud-palette-drawer-text); }
.theme-swatch.surface[b-nsre6jal2x] { background: var(--mud-palette-surface); }
.theme-swatch.background[b-nsre6jal2x] { background: var(--mud-palette-background); }