/* Palette: signal. Set data-palette="signal" on the page or on a preview card. */

[data-palette="signal"] {
    color-scheme: dark;
    --site-id: signal;
    --site-label: "Signal";
    --site-canvas: #05060a;
    --site-panel: #10131c;
    --site-raised: #1a1f2e;
    --site-text: #f5f7ff;
    --site-muted: #b7c0d9;
    --site-line: #46507a;
    --site-primary: #4c8dff;
    --site-accent: #7c5cff;
    --site-on-primary: #06101f;
    --site-success: #1ad98a;
    --site-warning: #ffcc00;
    --site-danger: #ff3b5c;
    --site-info: #2ee6ff;
    --bs-body-bg: var(--site-canvas);
    --bs-body-bg-rgb: 5, 6, 10;
    --bs-body-color: var(--site-text);
    --bs-body-color-rgb: 245, 247, 255;
    --bs-emphasis-color: #ffffff;
    --bs-secondary-color: var(--site-muted);
    --bs-secondary-bg: var(--site-panel);
    --bs-tertiary-bg: var(--site-raised);
    --bs-heading-color: var(--site-text);
    --bs-border-color: var(--site-line);
    --bs-primary: var(--site-primary);
    --bs-primary-rgb: 76, 141, 255;
    --bs-link-color: var(--site-primary);
    --bs-link-hover-color: var(--site-accent);
    --bs-card-bg: var(--site-panel);
    --bs-card-color: var(--site-text);
    --bs-card-border-color: var(--site-line);
    --bs-primary-bg-subtle: color-mix(in srgb, var(--site-primary) 18%, var(--site-canvas));
    --bs-primary-border-subtle: color-mix(in srgb, var(--site-primary) 48%, var(--site-canvas));
    --bs-primary-text-emphasis: var(--site-primary);
    --bs-success-bg-subtle: color-mix(in srgb, var(--site-success) 18%, var(--site-canvas));
    --bs-success-border-subtle: color-mix(in srgb, var(--site-success) 48%, var(--site-canvas));
    --bs-success-text-emphasis: var(--site-success);
    --bs-warning-bg-subtle: color-mix(in srgb, var(--site-warning) 18%, var(--site-canvas));
    --bs-warning-border-subtle: color-mix(in srgb, var(--site-warning) 48%, var(--site-canvas));
    --bs-warning-text-emphasis: var(--site-warning);
    --bs-danger-bg-subtle: color-mix(in srgb, var(--site-danger) 18%, var(--site-canvas));
    --bs-danger-border-subtle: color-mix(in srgb, var(--site-danger) 48%, var(--site-canvas));
    --bs-danger-text-emphasis: var(--site-danger);
    --bs-info-bg-subtle: color-mix(in srgb, var(--site-info) 18%, var(--site-canvas));
    --bs-info-border-subtle: color-mix(in srgb, var(--site-info) 48%, var(--site-canvas));
    --bs-info-text-emphasis: var(--site-info);
    background-color: var(--site-canvas);
    color: var(--site-text);
}

[data-palette="signal"] .btn-primary {
    color: var(--site-on-primary);
}