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

[data-palette="ember"] {
    color-scheme: dark;
    --site-id: ember;
    --site-label: "Ember";
    --site-canvas: #100804;
    --site-panel: #1c120c;
    --site-raised: #2a1a10;
    --site-text: #fff6ec;
    --site-muted: #e0c3a8;
    --site-line: #8a5a32;
    --site-primary: #ffb020;
    --site-accent: #ff6a3d;
    --site-on-primary: #1a0e04;
    --site-success: #3dd68c;
    --site-warning: #ffe14a;
    --site-danger: #ff4d3a;
    --site-info: #ffd09a;
    --bs-body-bg: var(--site-canvas);
    --bs-body-bg-rgb: 16, 8, 4;
    --bs-body-color: var(--site-text);
    --bs-body-color-rgb: 255, 246, 236;
    --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: 255, 176, 32;
    --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="ember"] .btn-primary {
    color: var(--site-on-primary);
}