/* ========================================================================== Tokens de couleur du desktop web (CCA.Web.Desktop). Le mobile garde les siens (CcaTheme.cs) : les rares valeurs de marque communes sont recopiées, voir la section « Marque ». Nommage : clé XAML de CCA-X sans le préfixe « CCA », PascalCase → kebab, « _ » et « . » → « - », suffixe « Brush » retiré. CCADarkColor_Text → --cca-dark-color-text. Un grep de la clé dans Colors.xaml retrouve la source. Clair : valeurs CCA-X telles quelles. ARGB WPF (#AARRGGBB) converti en #RRGGBBAA. Sombre : PROPOSÉ, approuvé clé par clé par Luc (CCADocs/Briefs/port-web/fondation.md, Palette). Thème par attribut : [data-theme] se redéfinit pour tout le sous-arbre de l'élément qui le porte, ce qui permet d'afficher les deux thèmes côte à côte (page /tokens). cca-theme.js pose l'attribut sur selon Windows. Aucun composant n'écrit une couleur en dur : il lit ces variables. ========================================================================== */ :root, [data-theme="light"] { color-scheme: light; /* ---- Marque (commune mobile + desktop) ---- dark-color = BrandBlue / TopBarBackground du mobile ; light-color = Secondary du mobile. */ --cca-main-color: #6B92BC; --cca-dark-color: #3B658C; --cca-light-color: #9CC2EF; --cca-main-color-text: #000000; --cca-dark-color-text: #FFFFFF; --cca-light-color-text: #000000; /* ---- Colors.xaml : généraux ---- */ --cca-temp-dark: #102027; --cca-temp-dark-border: #2F5E72; --cca-controls-background: #00000022; --cca-checked-color: #1E90FF; --cca-alert-color: #FF5722; --cca-alert-color-dark: #D84315; --cca-alert-color-yellow: #FFFF66; --cca-alert-color-text: #FFFFFF; --cca-error-color: #F6685E; --cca-error-color-dark: #F6685E; --cca-error-color-text: #000000; --cca-success-color: #008000; --cca-success-color-text: #FFFFFF; /* ---- Colors.xaml : variation (hausse / baisse / avertissement) ---- */ --cca-variation-up-color: #B4392F; --cca-variation-up-background: #FBF1EF; --cca-variation-up-border: #F0DCD8; --cca-variation-down-color: #2E7D5B; --cca-variation-down-background: #F6FAF7; --cca-variation-down-border: #CFE4D6; --cca-variation-none-color: #B0BDC9; --cca-warning-color: #8A6410; --cca-warning-background: #FDF7E9; --cca-warning-border: #EDDFBC; /* ---- Colors.xaml : action (créer / mettre à jour) ---- */ --cca-action-create-color: #2E7D5B; --cca-action-create-background: #EEF5EF; --cca-action-update-color: #2F6FA8; --cca-action-update-background: #EEF4FA; /* ---- Colors.xaml : cellules, états ---- */ --cca-read-only-cell-color: #C0C0C0; --cca-read-only-cell-color-text: #000000; --cca-cell-border-color: #808080; --cca-sub-menu-opened-color: #000000AA; --cca-deactivated-color: #FF3333; --cca-deactivated-color-text: #000000; --cca-inactive-grid-column-color: #C0C0C0; /* ---- Colors.xaml : transactions ---- */ --cca-billing-invoice-color-dark: #0A7DDB; --cca-billing-invoice-color: #2196F3; --cca-billing-invoice-color-text: #FFFFFF; --cca-billing-order-color: #009688; --cca-billing-order-color-text: #FFFFFF; --cca-billing-quote-color: #CC2900; --cca-billing-quote-color-text: #FFFFFF; --cca-billing-loan-color: #C7C229; --cca-billing-loan-color-text: #FFFFFF; --cca-billing-rental-color: #FFA700; --cca-billing-rental-color-text: #1B1B1B; --cca-billing-periodic-color: #3F51B5; --cca-billing-periodic-color-text: #FFFFFF; --cca-billing-consignment-color: #00BCD4; --cca-billing-consignment-color-text: #FFFFFF; --cca-purchasing-purchase-color: #085391; --cca-purchasing-purchase-color-text: #FFFFFF; --cca-purchasing-receipt-color: #9B0000; --cca-purchasing-receipt-color-text: #FFFFFF; --cca-purchasing-quote-color: #C7C229; --cca-purchasing-quote-color-text: #FFFFFF; --cca-work-order-standard-color: #CC8800; --cca-work-order-standard-color-text: #FFFFFF; --cca-work-order-periodic-color-light: #B4BBE4; --cca-work-order-periodic-color: #3F51B5; --cca-work-order-periodic-color-text: #FFFFFF; --cca-transaction-available-color: #66BB6A; --cca-transaction-partial-availability-color: #FFEE58; --cca-transaction-not-available-color: #EF5350; /* ---- Colors.xaml : divers ---- */ --cca-icon-inversed-color: #000000; --cca-icon-color: #FFFFFF; --cca-specification-alert-color: #FFD54F; --cca-specification-alert-color-text: #000000; --cca-specification-alert-color-empty: #808080; --cca-tax-fee-color: #E6FFE6; --cca-waiver-color: #FFAB91; --cca-archived-transaction-color: #FF9800; --cca-archived-transaction-color-text: #000000; --cca-recommandation-color: #81C784; --cca-prep-offix-billed-order-color: #EF5350; --cca-prep-offix-billed-order-color-text: #000000; --cca-prep-offix-not-billed-order-color: #FF9800; --cca-prep-offix-not-billed-order-color-text: #000000; --cca-prep-offix-default-order-color: #FFFFFF; --cca-prep-offix-default-order-color-text: #000000; /* ---- Colors.xaml : boutons ---- */ --cca-button-mouse-over-background-color: #62727B55; --cca-button-mouse-over-selected-background-color: #BBBBBB; --cca-button-mouse-over-border-brush-color: #102027AA; --cca-button-is-pressed-background-color: #8998A1AA; --cca-button-disabled-color: #00000088; --cca-button-disabled-background-color: #FFFFFF40; --cca-disabled-text-color: #5A5A5A; --cca-prompt-button-color-text: #3B658C; --cca-button-has-items: #FFD54F; --cca-button-has-no-items: transparent; /* ---- Colors.xaml : alertes de service ---- */ --cca-service-alert-color-level1: #9CCC65; --cca-service-alert-color-level1-text: #000000; --cca-service-alert-color-level2: #FFF59D; --cca-service-alert-color-level2-text: #000000; --cca-service-alert-color-level3: #E57373; --cca-service-alert-color-level3-text: #000000; --cca-service-alert-color-neutral: #CFD8DC; --cca-service-alert-color-neutral-text: #000000; --cca-service-alert-color-level1-border: #7CB342; --cca-service-alert-color-level2-border: #F9A825; --cca-service-alert-color-level3-border: #E53935; --cca-service-alert-color-neutral-border: #90A4AE; /* ---- Colors.xaml : fenêtres, menus contextuels ---- */ --cca-read-only-text-box-background-color: #BBBBBB; --cca-gift-card-payment-color: #B23926; --cca-gift-card-payment-color-text: #FFFFFF; --cca-window-close-mouse-over-background: #C42B1C; --cca-window-close-mouse-over-color: #FFFFFF; --cca-context-menu-background-color: #FCFCFC; --cca-context-menu-item-hover-color: #DEE0E1; --cca-context-menu-item-pressed-color: #C4C4C4; --cca-menu-selected-background-color: #00000022; /* ---- Colors.xaml : grille maison ---- */ --cca-grid-background: #FFFFFF; --cca-grid-alt-row-background: #FAFAF9; --cca-grid-cell-background: #FFFFFF; --cca-grid-cell-foreground: #1F1F1C; --cca-grid-cell-border: #D9D8D4; --cca-grid-cell-nav-background: #D0DEF2; --cca-grid-cell-nav-border: #3B82D9; --cca-grid-cell-edit-border: #3B82D9; --cca-grid-row-active-background: #EDF3FC; --cca-grid-manual-background: #FDF6E3; --cca-grid-manual-foreground: #7D5A0B; --cca-grid-highlight-background: #FBE08A; --cca-grid-read-only-background: #F5F5F3; --cca-grid-read-only-foreground: #9A9A95; --cca-grid-calc-foreground: #A3A29D; --cca-grid-error-background: #FEF0F0; --cca-grid-error-foreground: #C23030; --cca-grid-error-selected-border: #7C3AED; --cca-grid-error-selected-background: #F5E5F1; --cca-grid-header-background: #EDEDEB; --cca-grid-header-foreground: #5A5A56; --cca-grid-header-border: #CCCBC6; --cca-grid-group-header-background: #E4EFF9; --cca-grid-group-header-foreground: #1A5CA0; --cca-grid-group-footer-background: #EDF3FA; --cca-grid-group-footer-border: #B0CBE6; /* ---- ChartColors.Light.xaml ---- */ --cca-chart-palette1: #3B82D9; --cca-chart-palette2: #14B8A6; --cca-chart-palette3: #F59E0B; --cca-chart-palette4: #8B5CF6; --cca-chart-palette5: #EF4444; --cca-chart-palette6: #06B6D4; --cca-chart-other: #B9B9B4; --cca-chart-palette1-gradient: linear-gradient(to bottom, #4B90E2, #93BEF0); --cca-chart-palette2-gradient: linear-gradient(to bottom, #22C3B0, #86E5DB); --cca-chart-area-line: #3B82D9; --cca-chart-area-fill: linear-gradient(to bottom, #3B82D966, #3B82D900); --cca-chart-track: #EAEAE7; --cca-chart-axis: #E4E3DF; --cca-chart-label: #6B6B66; --cca-chart-center-text: #1F2937; --cca-chart-positive: #16A34A; --cca-chart-negative: #DC2626; --cca-chart-badge-positive-background: #DCFCE7; --cca-chart-badge-negative-background: #FEE2E2; --cca-chart-tooltip-background: #FFFFFF; --cca-chart-tooltip-foreground: #1F2937; --cca-chart-tooltip-border: #E5E7EB; --cca-chart-crosshair: #C4C7CD; /* ---- Shell : couleurs codées en dur dans le XAML de CCA-X, devenues tokens ---- */ --cca-dashboard-background: #B6C8D1; /* Views/Dashboard.xaml:11 */ --cca-content-background: #FFFFFF; /* Styles/Windows.xaml:270 */ --cca-sub-menu-background: #62727BEE; /* Menu/SubMenu.xaml:18 */ --cca-menu-item-background: #00000022; /* Styles/Menus.xaml:206 ; Menu/MainMenu.xaml:33,40 */ --cca-top-bar-separator: #00000044; /* Styles/Windows.xaml:182 */ --cca-window-bar-separator: #00000022; /* Styles/Windows.xaml:104 */ --cca-footer-text: #FFFFFF; /* Styles/Windows.xaml:372,462 */ --cca-shadow-menu-title: 0 0 8px #000000BF; /* Styles/Controls.xaml:972 MenuTitleShadowEffect */ --cca-shadow-bottom: 0 1px 5px #00000080; /* Styles/Controls.xaml:942 BorderShadowEffect270 */ } [data-theme="dark"] { color-scheme: dark; /* ---- Marque : alignée sur le sombre du mobile ---- */ --cca-main-color: #7DA3CC; --cca-dark-color: #2A4965; --cca-light-color: #1A2233; --cca-main-color-text: #0D2A45; --cca-dark-color-text: #E0E0E0; --cca-light-color-text: #E0E0E0; /* ---- Colors.xaml : généraux ---- */ --cca-temp-dark: #0B1519; --cca-temp-dark-border: #264B5B; --cca-controls-background: #FFFFFF14; --cca-checked-color: #4DA3FF; --cca-alert-color: #FF7A50; --cca-alert-color-dark: #E0602F; --cca-alert-color-yellow: #D9D95A; --cca-alert-color-text: #FFFFFF; --cca-error-color: #E24B4A; --cca-error-color-dark: #E24B4A; --cca-error-color-text: #000000; --cca-success-color: #2E7D32; --cca-success-color-text: #FFFFFF; /* ---- Colors.xaml : variation ---- */ --cca-variation-up-color: #F48771; --cca-variation-up-background: #3A1F1C; --cca-variation-up-border: #5A2E29; --cca-variation-down-color: #6FCF97; --cca-variation-down-background: #16291F; --cca-variation-down-border: #27463A; --cca-variation-none-color: #6F7C88; --cca-warning-color: #E6C56C; --cca-warning-background: #3E3A1F; --cca-warning-border: #5C5325; /* ---- Colors.xaml : action ---- */ --cca-action-create-color: #6FCF97; --cca-action-create-background: #16291F; --cca-action-update-color: #7DA3CC; --cca-action-update-background: #1A2233; /* ---- Colors.xaml : cellules, états ---- */ --cca-read-only-cell-color: #2A2A2A; --cca-read-only-cell-color-text: #CCCCCC; --cca-cell-border-color: #5A5A5A; --cca-sub-menu-opened-color: #000000AA; --cca-deactivated-color: #E24B4A; --cca-deactivated-color-text: #000000; --cca-inactive-grid-column-color: #2A2A2A; /* ---- Colors.xaml : transactions (texte blanc ≥ 4,5:1) ---- */ --cca-billing-invoice-color-dark: #0A6BBD; --cca-billing-invoice-color: #1976D2; --cca-billing-invoice-color-text: #FFFFFF; --cca-billing-order-color: #00796B; --cca-billing-order-color-text: #FFFFFF; --cca-billing-quote-color: #B02400; --cca-billing-quote-color-text: #FFFFFF; --cca-billing-loan-color: #7A771A; --cca-billing-loan-color-text: #FFFFFF; --cca-billing-rental-color: #E69500; --cca-billing-rental-color-text: #1B1B1B; --cca-billing-periodic-color: #3F51B5; --cca-billing-periodic-color-text: #FFFFFF; --cca-billing-consignment-color: #00838F; --cca-billing-consignment-color-text: #FFFFFF; --cca-purchasing-purchase-color: #0B5FA5; --cca-purchasing-purchase-color-text: #FFFFFF; --cca-purchasing-receipt-color: #A31515; --cca-purchasing-receipt-color-text: #FFFFFF; --cca-purchasing-quote-color: #7A771A; --cca-purchasing-quote-color-text: #FFFFFF; --cca-work-order-standard-color: #A86F00; --cca-work-order-standard-color-text: #FFFFFF; --cca-work-order-periodic-color-light: #2B3160; --cca-work-order-periodic-color: #3F51B5; --cca-work-order-periodic-color-text: #FFFFFF; --cca-transaction-available-color: #4CAF50; --cca-transaction-partial-availability-color: #D4C23A; --cca-transaction-not-available-color: #E24B4A; /* ---- Colors.xaml : divers ---- */ --cca-icon-inversed-color: #E0E0E0; --cca-icon-color: #E0E0E0; --cca-specification-alert-color: #C9A227; --cca-specification-alert-color-text: #000000; --cca-specification-alert-color-empty: #6E6E73; --cca-tax-fee-color: #16291F; --cca-waiver-color: #5A2E29; --cca-archived-transaction-color: #E08600; --cca-archived-transaction-color-text: #000000; --cca-recommandation-color: #4E8F52; --cca-prep-offix-billed-order-color: #C62828; --cca-prep-offix-billed-order-color-text: #FFFFFF; --cca-prep-offix-not-billed-order-color: #E08600; --cca-prep-offix-not-billed-order-color-text: #000000; --cca-prep-offix-default-order-color: #1E1E1E; --cca-prep-offix-default-order-color-text: #E0E0E0; /* ---- Colors.xaml : boutons ---- */ --cca-button-mouse-over-background-color: #FFFFFF1F; --cca-button-mouse-over-selected-background-color: #3A3A3E; --cca-button-mouse-over-border-brush-color: #FFFFFF33; --cca-button-is-pressed-background-color: #FFFFFF33; --cca-button-disabled-color: #FFFFFF61; --cca-button-disabled-background-color: #FFFFFF0F; --cca-disabled-text-color: #8A8A8A; --cca-prompt-button-color-text: #7DA3CC; --cca-button-has-items: #C9A227; --cca-button-has-no-items: transparent; /* ---- Colors.xaml : alertes de service ---- */ --cca-service-alert-color-level1: #5B8A3A; --cca-service-alert-color-level1-text: #000000; --cca-service-alert-color-level2: #BDB35A; --cca-service-alert-color-level2-text: #000000; --cca-service-alert-color-level3: #C25454; --cca-service-alert-color-level3-text: #000000; --cca-service-alert-color-neutral: #3A4145; --cca-service-alert-color-neutral-text: #E0E0E0; --cca-service-alert-color-level1-border: #7CB342; --cca-service-alert-color-level2-border: #F9A825; --cca-service-alert-color-level3-border: #E53935; --cca-service-alert-color-neutral-border: #607D8B; /* ---- Colors.xaml : fenêtres, menus contextuels ---- */ --cca-read-only-text-box-background-color: #2A2A2A; --cca-gift-card-payment-color: #B23926; --cca-gift-card-payment-color-text: #FFFFFF; --cca-window-close-mouse-over-background: #C42B1C; --cca-window-close-mouse-over-color: #FFFFFF; --cca-context-menu-background-color: #2A2B30; --cca-context-menu-item-hover-color: #3A3B40; --cca-context-menu-item-pressed-color: #45464B; --cca-menu-selected-background-color: #FFFFFF14; /* ---- GridColors.Dark.xaml (les deux « error-selected » absentes du fichier : proposées) ---- */ --cca-grid-background: #1E1E1E; --cca-grid-alt-row-background: #252526; --cca-grid-cell-background: #1E1E1E; --cca-grid-cell-foreground: #DCDCDC; --cca-grid-cell-border: #3F3F46; --cca-grid-cell-nav-background: #094771; --cca-grid-cell-nav-border: #007ACC; --cca-grid-cell-edit-border: #007ACC; --cca-grid-row-active-background: #2A2D2E; --cca-grid-manual-background: #3E3A1F; --cca-grid-manual-foreground: #E6C56C; --cca-grid-highlight-background: #574A1E; --cca-grid-read-only-background: #2A2A2A; --cca-grid-read-only-foreground: #888888; --cca-grid-calc-foreground: #9A9A95; --cca-grid-error-background: #5A1F1F; --cca-grid-error-foreground: #F48771; --cca-grid-error-selected-border: #A78BFA; --cca-grid-error-selected-background: #3B2A4F; --cca-grid-header-background: #2D2D30; --cca-grid-header-foreground: #CCCCCC; --cca-grid-header-border: #3F3F46; --cca-grid-group-header-background: #1E3A5F; --cca-grid-group-header-foreground: #9CDCFE; --cca-grid-group-footer-background: #1A3550; --cca-grid-group-footer-border: #3B5876; /* ---- ChartColors.Dark.xaml ---- */ --cca-chart-palette1: #60A5FA; --cca-chart-palette2: #2DD4BF; --cca-chart-palette3: #FBBF24; --cca-chart-palette4: #A78BFA; --cca-chart-palette5: #F87171; --cca-chart-palette6: #22D3EE; --cca-chart-other: #6E6E73; --cca-chart-palette1-gradient: linear-gradient(to bottom, #60A5FA, #3B6FB0); --cca-chart-palette2-gradient: linear-gradient(to bottom, #2DD4BF, #1E8478); --cca-chart-area-line: #60A5FA; --cca-chart-area-fill: linear-gradient(to bottom, #60A5FA66, #60A5FA00); --cca-chart-track: #3A3A3E; --cca-chart-axis: #3F3F46; --cca-chart-label: #A1A1A6; --cca-chart-center-text: #F3F4F6; --cca-chart-positive: #4ADE80; --cca-chart-negative: #F87171; --cca-chart-badge-positive-background: #14532D; --cca-chart-badge-negative-background: #4C1D1D; --cca-chart-tooltip-background: #2A2B30; --cca-chart-tooltip-foreground: #F3F4F6; --cca-chart-tooltip-border: #3F3F46; --cca-chart-crosshair: #55585F; /* ---- Shell ---- */ --cca-dashboard-background: #1C2328; --cca-content-background: #121212; --cca-sub-menu-background: #2B3338EE; --cca-menu-item-background: #00000022; --cca-top-bar-separator: #00000044; --cca-window-bar-separator: #FFFFFF1A; --cca-footer-text: #E0E0E0; --cca-shadow-menu-title: 0 0 8px #000000BF; --cca-shadow-bottom: 0 1px 5px #00000080; }