/* C Électrique product foundation. Keep this file free of application selectors.
   FTMobile defines the visual reference: flat surfaces, restrained blue actions,
   readable system typography and 44 px touch targets. CBOX keeps its own logo. */
:root {
    --ce-font: "Segoe UI", system-ui, -apple-system, BlinkMacSystemFont, sans-serif;
    --ce-primary: #1a66c2;
    --ce-primary-strong: #124a8f;
    --ce-primary-soft: #e8f0fb;
    --ce-action-bg: #1a66c2;
    --ce-action-hover: #124a8f;
    --ce-bg: #f2f3f5;
    --ce-surface: #ffffff;
    --ce-surface-subtle: #f4f7fd;
    --ce-input: #ffffff;
    --ce-border: #d7dbe0;
    --ce-border-soft: #e8eaee;
    --ce-text: #26282c;
    --ce-muted: #646a71;
    --ce-success: #1d6b38;
    --ce-success-soft: #e6f4ea;
    --ce-success-border: #c3e6cf;
    --ce-warning: #8a5a10;
    --ce-warning-soft: #fff4e0;
    --ce-warning-border: #f5cc8a;
    --ce-danger: #a3302c;
    --ce-danger-soft: #fdecea;
    --ce-danger-border: #f3c4bf;
    --ce-radius: 6px;
    --ce-radius-large: 14px;
    --ce-target: 44px;
    --ce-space-1: 4px;
    --ce-space-2: 8px;
    --ce-space-3: 12px;
    --ce-space-4: 16px;
    --ce-space-6: 24px;
    --ce-space-8: 32px;
    --ce-text-xs: .75rem;
    --ce-text-small: .875rem;
    --ce-text-base: 1rem;
    --ce-title: 1.5rem;
    --ce-shadow: 0 2px 8px rgb(0 0 0 / 5%);
    --ce-shadow-menu: 0 8px 24px rgb(0 0 0 / 14%);
    color-scheme: light;
}

:root[data-theme="dark"] {
    --ce-primary: #7eb6fa;
    --ce-primary-strong: #a7cfff;
    --ce-primary-soft: #203c5e;
    --ce-bg: #111923;
    --ce-surface: #1a2634;
    --ce-surface-subtle: #223247;
    --ce-input: #162332;
    --ce-border: #3b4b5c;
    --ce-border-soft: #2b3b4d;
    --ce-text: #edf1f5;
    --ce-muted: #aab7c8;
    --ce-success: #91dbac;
    --ce-success-soft: #1b3a2a;
    --ce-success-border: #345b42;
    --ce-warning: #f5cf87;
    --ce-warning-soft: #3c321f;
    --ce-warning-border: #665331;
    --ce-danger: #ffb1aa;
    --ce-danger-soft: #452a2c;
    --ce-danger-border: #714046;
    --ce-shadow: 0 2px 8px rgb(0 0 0 / 15%);
    --ce-shadow-menu: 0 8px 24px rgb(0 0 0 / 30%);
    color-scheme: dark;
}

@media (prefers-color-scheme: dark) {
    :root:not([data-theme="light"]) {
        --ce-primary: #7eb6fa;
        --ce-primary-strong: #a7cfff;
        --ce-primary-soft: #203c5e;
        --ce-bg: #111923;
        --ce-surface: #1a2634;
        --ce-surface-subtle: #223247;
        --ce-input: #162332;
        --ce-border: #3b4b5c;
        --ce-border-soft: #2b3b4d;
        --ce-text: #edf1f5;
        --ce-muted: #aab7c8;
        --ce-success: #91dbac;
        --ce-success-soft: #1b3a2a;
        --ce-success-border: #345b42;
        --ce-warning: #f5cf87;
        --ce-warning-soft: #3c321f;
        --ce-warning-border: #665331;
        --ce-danger: #ffb1aa;
        --ce-danger-soft: #452a2c;
        --ce-danger-border: #714046;
        --ce-shadow: 0 2px 8px rgb(0 0 0 / 15%);
        --ce-shadow-menu: 0 8px 24px rgb(0 0 0 / 30%);
        color-scheme: dark;
    }
}