/**
 * Do not edit directly, this file was auto-generated.
 */

.sncf-groupe {
  --wcs-primitive-size-10: 1px;
  --wcs-primitive-size-20: 2px;
  --wcs-primitive-size-40: 4px;
  --wcs-primitive-size-60: 6px;
  --wcs-primitive-size-80: 8px;
  --wcs-primitive-size-100: 10px;
  --wcs-primitive-size-120: 12px;
  --wcs-primitive-size-140: 14px;
  --wcs-primitive-size-160: 16px;
  --wcs-primitive-size-180: 18px;
  --wcs-primitive-size-200: 20px;
  --wcs-primitive-size-240: 24px;
  --wcs-primitive-size-280: 28px;
  --wcs-primitive-size-300: 30px;
  --wcs-primitive-size-320: 32px;
  --wcs-primitive-size-360: 36px;
  --wcs-primitive-size-400: 40px;
  --wcs-primitive-size-420: 42px;
  --wcs-primitive-size-480: 48px;
  --wcs-primitive-size-560: 56px;
  --wcs-primitive-size-640: 64px;
  --wcs-primitive-size-720: 72px;
  --wcs-primitive-size-800: 80px;
  --wcs-primitive-size-1200: 120px;
  --wcs-primitive-size-none: 0px;
  --wcs-primitive-size-max: 99999px;
  --wcs-primitive-spacing-0: 0px;
  --wcs-primitive-spacing-2: 2px;
  --wcs-primitive-spacing-4: 4px;
  --wcs-primitive-spacing-6: 6px;
  --wcs-primitive-spacing-8: 8px;
  --wcs-primitive-spacing-12: 12px;
  --wcs-primitive-spacing-16: 16px;
  --wcs-primitive-spacing-20: 20px;
  --wcs-primitive-spacing-24: 24px;
  --wcs-primitive-spacing-32: 32px;
  --wcs-primitive-spacing-40: 40px;
  --wcs-primitive-spacing-48: 48px;
  --wcs-primitive-spacing-56: 56px;
  --wcs-primitive-spacing-64: 64px;
  --wcs-primitive-spacing-72: 72px;
  --wcs-primitive-spacing-80: 80px;
  --wcs-primitive-spacing-88: 88px;
  --wcs-primitive-spacing-96: 96px;
  --wcs-primitive-spacing-104: 104px;
  --wcs-primitive-spacing-112: 112px;
  --wcs-primitive-spacing-120: 120px;
  --wcs-primitive-spacing-128: 128px;
  --wcs-primitive-spacing-136: 136px;
  --wcs-primitive-spacing-144: 144px;
  --wcs-primitive-color-transparent: rgba(0, 0, 0, 0);
  --wcs-primitive-color-backdrop: rgba(0, 26, 73, 0.4);
  --wcs-primitive-color-bleu-primaire-100: #e8f3f7;
  --wcs-primitive-color-bleu-primaire-200: #d1e6ef;
  --wcs-primitive-color-bleu-primaire-300: #8fc1d7;
  --wcs-primitive-color-bleu-primaire-400: #0088b3;
  --wcs-primitive-color-rouge-100: #f9ebe9;
  --wcs-primitive-color-rouge-200: #f2d7d3;
  --wcs-primitive-color-rouge-300: #de9991;
  --wcs-primitive-color-rouge-400: #d52b1e;
  --wcs-primitive-color-ambre-100: #fdfaf0;
  --wcs-primitive-color-ambre-200: #fcf5e1;
  --wcs-primitive-color-ambre-300: #f7e7b6;
  --wcs-primitive-color-ambre-400: #eed484;
  --wcs-primitive-color-ambre-500: #daaa00;
  --wcs-primitive-color-ambre-600: #8c7122;
  --wcs-primitive-color-ambre-700: #4a412a;
  --wcs-primitive-color-ambre-800: #3b3422;
  --wcs-primitive-color-orange-100: #fff7f1;
  --wcs-primitive-color-orange-200: #fff0e2;
  --wcs-primitive-color-orange-300: #ffdbb9;
  --wcs-primitive-color-orange-400: #fdbe87;
  --wcs-primitive-color-orange-500: #dc582a;
  --wcs-primitive-color-orange-600: #a02f08;
  --wcs-primitive-color-orange-700: #4f2910;
  --wcs-primitive-color-orange-800: #3f210d;
  --wcs-primitive-color-corail-100: #fff8f7;
  --wcs-primitive-color-corail-200: #fff1ef;
  --wcs-primitive-color-corail-300: #fddcd5;
  --wcs-primitive-color-corail-400: #f8c1b8;
  --wcs-primitive-color-corail-500: #f2827f;
  --wcs-primitive-color-corail-600: #d53f34;
  --wcs-primitive-color-corail-700: #612132;
  --wcs-primitive-color-corail-800: #4e1a28;
  --wcs-primitive-color-rose-100: #fef7fb;
  --wcs-primitive-color-rose-200: #fdeff8;
  --wcs-primitive-color-rose-300: #f3deef;
  --wcs-primitive-color-rose-400: #efbae1;
  --wcs-primitive-color-rose-500: #f59bbb;
  --wcs-primitive-color-rose-600: #d71f60;
  --wcs-primitive-color-rose-700: #3f2a56;
  --wcs-primitive-color-rose-800: #322245;
  --wcs-primitive-color-parme-100: #f9f7fb;
  --wcs-primitive-color-parme-200: #f3eef7;
  --wcs-primitive-color-parme-300: #e0d3ee;
  --wcs-primitive-color-parme-400: #c7b2de;
  --wcs-primitive-color-parme-500: #6558b1;
  --wcs-primitive-color-parme-600: #2f3279;
  --wcs-primitive-color-parme-700: #00205b;
  --wcs-primitive-color-parme-800: #001a49;
  --wcs-primitive-color-bleu-100: #f5f9fc;
  --wcs-primitive-color-bleu-200: #eaf2f9;
  --wcs-primitive-color-bleu-300: #c4dcec;
  --wcs-primitive-color-bleu-400: #a4c8e1;
  --wcs-primitive-color-bleu-500: #0084d4;
  --wcs-primitive-color-bleu-600: #006aaa;
  --wcs-primitive-color-bleu-700: #003865;
  --wcs-primitive-color-bleu-800: #002d51;
  --wcs-primitive-color-bleu-900: #001d33;
  --wcs-primitive-color-vert-100: #f7fbfa;
  --wcs-primitive-color-vert-200: #e8f6f2;
  --wcs-primitive-color-vert-300: #c7e8e1;
  --wcs-primitive-color-vert-400: #a1d6ca;
  --wcs-primitive-color-vert-500: #00b388;
  --wcs-primitive-color-vert-600: #008566;
  --wcs-primitive-color-vert-700: #154734;
  --wcs-primitive-color-vert-800: #11392a;
  --wcs-primitive-color-alpha-light-005: rgba(255, 255, 255, 0.05);
  --wcs-primitive-color-alpha-light-010: rgba(255, 255, 255, 0.1);
  --wcs-primitive-color-alpha-light-020: rgba(255, 255, 255, 0.2);
  --wcs-primitive-color-alpha-light-030: rgba(255, 255, 255, 0.3);
  --wcs-primitive-color-alpha-light-040: rgba(255, 255, 255, 0.4);
  --wcs-primitive-color-alpha-light-050: rgba(255, 255, 255, 0.5);
  --wcs-primitive-color-alpha-light-060: rgba(255, 255, 255, 0.6);
  --wcs-primitive-color-alpha-light-070: rgba(255, 255, 255, 0.7);
  --wcs-primitive-color-alpha-light-080: rgba(255, 255, 255, 0.8);
  --wcs-primitive-color-alpha-light-090: rgba(255, 255, 255, 0.9);
  --wcs-primitive-color-alpha-dark-005: rgba(0, 0, 0, 0.05);
  --wcs-primitive-color-alpha-dark-010: rgba(0, 0, 0, 0.1);
  --wcs-primitive-color-alpha-dark-020: rgba(0, 0, 0, 0.2);
  --wcs-primitive-color-alpha-dark-030: rgba(0, 0, 0, 0.3);
  --wcs-primitive-color-alpha-dark-040: rgba(0, 0, 0, 0.4);
  --wcs-primitive-color-alpha-dark-050: rgba(0, 0, 0, 0.5);
  --wcs-primitive-color-alpha-dark-060: rgba(0, 0, 0, 0.6);
  --wcs-primitive-color-alpha-dark-070: rgba(0, 0, 0, 0.7);
  --wcs-primitive-color-alpha-dark-080: rgba(0, 0, 0, 0.8);
  --wcs-primitive-color-alpha-dark-090: rgba(0, 0, 0, 0.9);
  --wcs-primitive-color-neutral-0: #ffffff;
  --wcs-primitive-color-neutral-100: #f4f5f6;
  --wcs-primitive-color-neutral-200: #f2f2f2;
  --wcs-primitive-color-neutral-300: #d7d7d7;
  --wcs-primitive-color-neutral-400: #b9b9b9;
  --wcs-primitive-color-neutral-500: #a0a0a0;
  --wcs-primitive-color-neutral-600: #747678;
  --wcs-primitive-color-neutral-700: #4d4f53;
  --wcs-primitive-color-neutral-800: #333333;
  --wcs-primitive-color-neutral-900: #121212;
  --wcs-primitive-color-neutral-1000: #000000;
  --wcs-primitive-color-critical-100: #fcf3f3; /** Rouge Feu 100 */
  --wcs-primitive-color-critical-200: #f9e7e7; /** Rouge Feu 200 */
  --wcs-primitive-color-critical-300: #f4cfcf; /** Rouge Feu 300 */
  --wcs-primitive-color-critical-400: #e38686; /** Rouge Feu 400 */
  --wcs-primitive-color-critical-500: #c80e0e; /** Rouge Feu 500 */
  --wcs-primitive-color-critical-600: #960b0b; /** Rouge Feu 600 */
  --wcs-primitive-color-critical-700: #640707; /** Rouge Feu 700 */
  --wcs-primitive-color-critical-800: #320404; /** Rouge Feu 800 */
  --wcs-primitive-font-size-250: 10px;
  --wcs-primitive-font-size-275: 11px;
  --wcs-primitive-font-size-300: 12px;
  --wcs-primitive-font-size-325: 13px;
  --wcs-primitive-font-size-350: 14px;
  --wcs-primitive-font-size-400: 16px;
  --wcs-primitive-font-size-450: 18px;
  --wcs-primitive-font-size-500: 20px;
  --wcs-primitive-font-size-550: 22px;
  --wcs-primitive-font-size-600: 24px;
  --wcs-primitive-font-size-700: 28px;
  --wcs-primitive-font-size-750: 30px;
  --wcs-primitive-font-size-800: 32px;
  --wcs-primitive-font-size-900: 36px;
  --wcs-primitive-font-size-1000: 40px;
  --wcs-primitive-font-size-1050: 42px;
  --wcs-primitive-font-size-1100: 44px;
  --wcs-primitive-font-size-1200: 48px;
  --wcs-primitive-font-size-1300: 52px;
  --wcs-primitive-font-size-1400: 56px;
  --wcs-primitive-font-size-1500: 60px;
  --wcs-primitive-font-size-1600: 64px;
  --wcs-primitive-font-size-1700: 68px;
  --wcs-primitive-font-size-1800: 72px;
  --wcs-primitive-font-weight-100: 100;
  --wcs-primitive-font-weight-300: 300;
  --wcs-primitive-font-weight-400: 400;
  --wcs-primitive-font-weight-500: 500;
  --wcs-primitive-font-weight-800: 800;
  --wcs-primitive-font-weight-900: 900;
  --wcs-primitive-font-line-height-100: 1;
  --wcs-primitive-font-line-height-110: 1.1;
  --wcs-primitive-font-line-height-120: 1.2;
  --wcs-primitive-font-line-height-140: 1.4;
  --wcs-primitive-duration-0: 0ms;
  --wcs-primitive-duration-50: 50ms;
  --wcs-primitive-duration-100: 100ms;
  --wcs-primitive-duration-150: 150ms;
  --wcs-primitive-duration-200: 200ms;
  --wcs-primitive-duration-300: 300ms;
  --wcs-primitive-duration-350: 350ms;
  --wcs-primitive-duration-400: 400ms;
  --wcs-primitive-duration-1000: 1000ms;
  --wcs-primitive-duration-1500: 1500ms;
  --wcs-primitive-duration-2000: 2000ms;
  --wcs-primitive-breakpoints-mobile: 320px;
  --wcs-primitive-breakpoints-tablet: 769px;
  --wcs-primitive-breakpoints-desktop: 1024px;
  --wcs-primitive-breakpoints-high-definition: 1280px;
  --wcs-primitive-breakpoints-widescreen: 1440px;
  --wcs-primitive-breakpoints-fullhd: 1920px;
  --wcs-semantic-border-radius-none: 0; /** No border-radius */
  --wcs-semantic-border-width-none: 0; /** No border */
  --wcs-semantic-border-style-focus-base: dashed; /** Focus style for base elements like button, dropdown, counter, switch... */
  --wcs-semantic-border-style-focus-control: solid; /** Focus style for control elements like input, select, textarea... */
  --wcs-semantic-color-text-inverse: #ffffff; /** Inverse color for contrast (mostly white) */
  --wcs-semantic-font-size-base: 16px; /** Base font size, equivalent to 1rem */
  --wcs-semantic-font-size-s: 15px; /** Smaller font size */
  --wcs-semantic-font-size-m: 16px; /** Medium font size, equivalent to base font-size */
  --wcs-semantic-font-size-l: 17px; /** Larger font size */
  --wcs-semantic-font-style-control-placeholder: normal; /** Placeholder font-size (previously in italic) */
  --wcs-primitive-size-base: var(--wcs-primitive-size-80);
  --wcs-primitive-color-primary: var(--wcs-primitive-color-bleu-700);
  --wcs-semantic-size-base: var(--wcs-primitive-size-80); /** Base size for calculation */
  --wcs-semantic-size-xl: var(--wcs-primitive-size-560); /** Size XL for multi-size components */
  --wcs-semantic-size-l: var(--wcs-primitive-size-480); /** Size L for multi-size components */
  --wcs-semantic-size-m: var(--wcs-primitive-size-400); /** Size M for multi-size components (default) */
  --wcs-semantic-size-s: var(--wcs-primitive-size-320); /** Size S for multi-size components */
  --wcs-semantic-size-xs: var(--wcs-primitive-size-240); /** Size XS for multi-size components */
  --wcs-semantic-border-radius-base: var(--wcs-primitive-size-100); /** Base border-radius */
  --wcs-semantic-border-radius-full: var(--wcs-primitive-size-max); /** Circular, full rounded border-radius */
  --wcs-semantic-border-width-default: var(--wcs-primitive-size-10); /** Default border-width */
  --wcs-semantic-border-width-large: var(--wcs-primitive-size-20); /** Larger border-width, used for focus border especially */
  --wcs-semantic-border-width-larger: var(--wcs-primitive-size-40); /** Largest border-width */
  --wcs-semantic-color-border-brand: var(--wcs-primitive-color-bleu-700); /** Brand border color */
  --wcs-semantic-color-border-primary: var(--wcs-primitive-color-neutral-600); /** Primary border color */
  --wcs-semantic-color-border-secondary: var(--wcs-primitive-color-neutral-300); /** Secondary border color */
  --wcs-semantic-color-border-disabled: var(--wcs-primitive-color-neutral-400); /** Disabled border color */
  --wcs-semantic-color-border-selected: var(--wcs-primitive-color-bleu-700); /** Selected border color */
  --wcs-semantic-color-border-critical: var(--wcs-primitive-color-critical-500); /** Critical border color */
  --wcs-semantic-color-border-warning: var(--wcs-primitive-color-ambre-500); /** Warning border color */
  --wcs-semantic-color-border-information: var(--wcs-primitive-color-bleu-800); /** Information border color */
  --wcs-semantic-color-border-success: var(--wcs-primitive-color-vert-500); /** Success border color */
  --wcs-semantic-color-border-action-secondary-default: var(--wcs-primitive-color-bleu-700); /** Default border color for secondary elements like button, dropdown... */
  --wcs-semantic-color-border-action-secondary-hover: var(--wcs-primitive-color-bleu-800); /** Hover border color for secondary elements like button, dropdown... */
  --wcs-semantic-color-border-action-secondary-press: var(--wcs-primitive-color-bleu-900); /** Pressed border color for secondary elements like button, dropdown... */
  --wcs-semantic-color-border-action-secondary-disabled: var(--wcs-primitive-color-neutral-300); /** Disabled border color for secondary elements like button, dropdown... */
  --wcs-semantic-color-border-focus-base: var(--wcs-primitive-color-bleu-800); /** Border color on focus for base elements like button, dropdown, counter, switch... */
  --wcs-semantic-color-border-focus-base-on-secondary: var(--wcs-primitive-color-neutral-0); /** Border color on focus for base elements when placed on secondary or dark background */
  --wcs-semantic-color-border-focus-alt: var(--wcs-primitive-color-bleu-700); /** Alternative border color on focus for control elements like input, select, textarea... */
  --wcs-semantic-color-border-focus-alt-on-secondary: var(--wcs-primitive-color-neutral-0); /** Alternative border color on focus for control elements when placed on secondary or dark background */
  --wcs-semantic-color-border-control-indicator-default: var(--wcs-primitive-color-neutral-600); /** Default border color of a form-field indicator: radio, checkbox */
  --wcs-semantic-color-border-control-indicator-selected: var(--wcs-primitive-color-bleu-700); /** Selected border color of a form-field indicator: radio, checkbox */
  --wcs-semantic-color-border-control-indicator-hover: var(--wcs-primitive-color-bleu-600); /** Hovered border color of a form-field indicator: radio, checkbox */
  --wcs-semantic-color-background-action-primary-default: var(--wcs-primitive-color-bleu-700); /** Default primary background for elements like button, dropdown... */
  --wcs-semantic-color-background-action-primary-disabled: var(--wcs-primitive-color-neutral-200); /** Disabled primary background for element like a button, dropdown, switch... */
  --wcs-semantic-color-background-action-primary-hover: var(--wcs-primitive-color-bleu-800); /** Can be used by primary elements which must have a hover state (button, dropdown...) */
  --wcs-semantic-color-background-action-primary-press: var(--wcs-primitive-color-bleu-900); /** Can be used by primary elements which must have a press (CSS active) state (nav-item) */
  --wcs-semantic-color-background-action-primary-selected-default: var(--wcs-primitive-color-bleu-900); /** Can be used by primary elements which must have a selected state (nav-item) */
  --wcs-semantic-color-background-action-primary-selected-hover: var(--wcs-primitive-color-bleu-900); /** Can be used by primary elements which must have a hover state while selected (nav-item) */
  --wcs-semantic-color-background-action-primary-selected-press: var(--wcs-primitive-color-bleu-900); /** Can be used by primary elements which must have a hover state while pressed (nav-item) */
  --wcs-semantic-color-background-action-secondary-default: var(--wcs-primitive-color-transparent); /** Default secondary background for elements like button, dropdown... */
  --wcs-semantic-color-background-action-secondary-disabled: var(--wcs-primitive-color-transparent); /** Disabled secondary background for element like a button, dropdown, switch... */
  --wcs-semantic-color-background-action-secondary-selected-disabled: var(--wcs-primitive-color-neutral-0); /** Background of a disabled active secondary action (select option) */
  --wcs-semantic-color-background-action-secondary-focus: var(--wcs-primitive-color-transparent); /** Background of a focused secondary action (button, select option) */
  --wcs-semantic-color-background-action-tertiary-default: var(--wcs-primitive-color-transparent); /** Default tertiary background for elements like button, dropdown... */
  --wcs-semantic-color-background-action-tertiary-disabled: var(--wcs-primitive-color-transparent); /** Disabled tertiary background for element like a button, dropdown, switch... */
  --wcs-semantic-color-background-action-neutral-default: var(--wcs-primitive-color-transparent); /** Default neutral background for elements like dropdown menu item */
  --wcs-semantic-color-background-action-neutral-hover: var(--wcs-primitive-color-neutral-100); /** Hovered neutral background for element like dropdown menu item */
  --wcs-semantic-color-background-action-neutral-press: var(--wcs-primitive-color-neutral-300); /** Pressed neutral background for element like dropdown menu item */
  --wcs-semantic-color-background-action-neutral-disabled: var(--wcs-primitive-color-transparent); /** Disabled neutral background for element like dropdown menu item */
  --wcs-semantic-color-background-action-critical-default: var(--wcs-primitive-color-critical-500); /** Default critical background color */
  --wcs-semantic-color-background-action-critical-hover: var(--wcs-primitive-color-critical-600); /** Hovered critical background color */
  --wcs-semantic-color-background-action-critical-press: var(--wcs-primitive-color-critical-700); /** Pressed critical background color */
  --wcs-semantic-color-background-action-critical-disabled: var(--wcs-primitive-color-neutral-200); /** Disabled success background color */
  --wcs-semantic-color-background-action-information-default: var(--wcs-primitive-color-bleu-600); /** Default information background color */
  --wcs-semantic-color-background-action-information-hover: var(--wcs-primitive-color-bleu-700); /** Hovered information background color */
  --wcs-semantic-color-background-action-information-press: var(--wcs-primitive-color-bleu-800); /** Pressed information background color */
  --wcs-semantic-color-background-action-information-disabled: var(--wcs-primitive-color-neutral-200); /** Disabled success background color */
  --wcs-semantic-color-background-action-success-default: var(--wcs-primitive-color-vert-500); /** Default success background color */
  --wcs-semantic-color-background-action-success-hover: var(--wcs-primitive-color-vert-600); /** Hovered success background color */
  --wcs-semantic-color-background-action-success-press: var(--wcs-primitive-color-vert-800); /** Pressed success background color */
  --wcs-semantic-color-background-action-success-disabled: var(--wcs-primitive-color-neutral-200); /** Disabled success background color */
  --wcs-semantic-color-background-action-warning-default: var(--wcs-primitive-color-ambre-500); /** Default warning background color */
  --wcs-semantic-color-background-action-warning-hover: var(--wcs-primitive-color-ambre-600); /** Hovered warning background color */
  --wcs-semantic-color-background-action-warning-press: var(--wcs-primitive-color-ambre-700); /** Pressed warning background color */
  --wcs-semantic-color-background-action-warning-disabled: var(--wcs-primitive-color-neutral-200); /** Disabled warning background color */
  --wcs-semantic-color-background-control-default: var(--wcs-primitive-color-transparent); /** Default background of control like input, select, textarea... */
  --wcs-semantic-color-background-control-disabled: var(--wcs-primitive-color-transparent); /** Disabled background of control like input, select, textarea... */
  --wcs-semantic-color-background-control-indicator-selected: var(--wcs-primitive-color-bleu-700); /** Selected background color of a form-field indicator: radio, checkbox */
  --wcs-semantic-color-background-control-indicator-hover: var(--wcs-primitive-color-bleu-800); /** Hovered background color of a form-field indicator: radio, checkbox */
  --wcs-semantic-color-background-control-indicator-disabled: var(--wcs-primitive-color-neutral-300); /** Disabled background color of a form-field indicator: radio, checkbox */
  --wcs-semantic-color-background-surface-brand: var(--wcs-primitive-color-bleu-700); /** Brand background color for surface */
  --wcs-semantic-color-background-surface-body: var(--wcs-primitive-color-neutral-0); /** Body background color */
  --wcs-semantic-color-background-surface-primary: var(--wcs-primitive-color-neutral-0); /** Background of a surface like a card, modal, overlay of a select... */
  --wcs-semantic-color-background-surface-secondary: var(--wcs-primitive-color-neutral-100); /** Background of a secondary surface like a switch, counter... */
  --wcs-semantic-color-background-surface-tertiary: var(--wcs-primitive-color-neutral-300); /** Tertiary background (used for background of prefix and suffix of control, also in other components) */
  --wcs-semantic-color-background-surface-inverse: var(--wcs-primitive-color-neutral-800); /** Inverse background for contrast (mostly black) */
  --wcs-semantic-color-background-surface-critical-default: var(--wcs-primitive-color-critical-500); /** Default critical background color */
  --wcs-semantic-color-background-surface-critical-light: var(--wcs-primitive-color-critical-300); /** Light critical background color */
  --wcs-semantic-color-background-surface-critical-lighter: var(--wcs-primitive-color-critical-200); /** Lighter critical background color */
  --wcs-semantic-color-background-surface-critical-lightest: var(--wcs-primitive-color-critical-100); /** Lightest critical background color */
  --wcs-semantic-color-background-surface-information-default: var(--wcs-primitive-color-bleu-700); /** Default information background color */
  --wcs-semantic-color-background-surface-information-light: var(--wcs-primitive-color-bleu-300); /** Light information background color */
  --wcs-semantic-color-background-surface-information-lighter: var(--wcs-primitive-color-bleu-200); /** Lighter information background color */
  --wcs-semantic-color-background-surface-information-lightest: var(--wcs-primitive-color-bleu-100); /** Lightest information background color */
  --wcs-semantic-color-background-surface-success-default: var(--wcs-primitive-color-vert-600); /** Default success background color */
  --wcs-semantic-color-background-surface-success-light: var(--wcs-primitive-color-vert-300); /** Light success background color */
  --wcs-semantic-color-background-surface-success-lighter: var(--wcs-primitive-color-vert-200); /** Lighter success background color */
  --wcs-semantic-color-background-surface-success-lightest: var(--wcs-primitive-color-vert-100); /** Lightest success background color */
  --wcs-semantic-color-background-surface-warning-default: var(--wcs-primitive-color-ambre-500); /** Default warning background color */
  --wcs-semantic-color-background-surface-warning-light: var(--wcs-primitive-color-ambre-300); /** Light warning background color */
  --wcs-semantic-color-background-surface-warning-lighter: var(--wcs-primitive-color-ambre-200); /** Lighter warning background color */
  --wcs-semantic-color-background-surface-warning-lightest: var(--wcs-primitive-color-ambre-100); /** Lightest warning background color */
  --wcs-semantic-color-background-surface-accent-light: var(--wcs-primitive-color-bleu-300); /** Light accent background color, used by nav-item indicator and grid rows */
  --wcs-semantic-color-background-surface-accent-lighter: var(--wcs-primitive-color-bleu-200); /** Lighter accent background color, used by grid rows and segmented-button background (radio options) */
  --wcs-semantic-color-background-surface-accent-lightest: var(--wcs-primitive-color-bleu-100); /** Lightest accent background color, used by segmented-button background (radio options) */
  --wcs-semantic-color-background-surface-accent-dark: var(--wcs-primitive-color-bleu-600); /** Dark accent background color */
  --wcs-semantic-color-background-surface-accent-darker: var(--wcs-primitive-color-bleu-700); /** Darker accent background color */
  --wcs-semantic-color-background-surface-accent-darkest: var(--wcs-primitive-color-bleu-800); /** Darkest accent background color */
  --wcs-semantic-color-background-backdrop: var(--wcs-primitive-color-backdrop); /** The layer behind a surface (modal) */
  --wcs-semantic-color-foreground-brand: var(--wcs-primitive-color-bleu-700); /** Brand foreground color */
  --wcs-semantic-color-foreground-primary: var(--wcs-primitive-color-neutral-0); /** Primary foreground color */
  --wcs-semantic-color-foreground-disabled: var(--wcs-primitive-color-neutral-400); /** Disabled foreground color */
  --wcs-semantic-color-foreground-critical: var(--wcs-primitive-color-critical-500); /** Critical foreground color */
  --wcs-semantic-color-foreground-warning: var(--wcs-primitive-color-ambre-700); /** Warning foreground color */
  --wcs-semantic-color-foreground-information: var(--wcs-primitive-color-bleu-800); /** Information foreground color */
  --wcs-semantic-color-foreground-success: var(--wcs-primitive-color-vert-500); /** Success foreground color */
  --wcs-semantic-color-foreground-on-accent: var(--wcs-primitive-color-bleu-700); /** Foreground color on top of an accent background */
  --wcs-semantic-color-foreground-inverse: var(--wcs-primitive-color-neutral-800); /** Inverse foreground for contrast (mostly black) */
  --wcs-semantic-color-foreground-action-secondary-default: var(--wcs-primitive-color-bleu-700); /** The layer on top of a secondary background */
  --wcs-semantic-color-foreground-action-secondary-hover: var(--wcs-primitive-color-bleu-800); /** The layer on top of a secondary background when hovered */
  --wcs-semantic-color-foreground-action-secondary-press: var(--wcs-primitive-color-bleu-900); /** The layer on top of a secondary background when pressed */
  --wcs-semantic-color-foreground-action-tertiary-default: var(--wcs-primitive-color-bleu-700); /** The layer on top of a tertiary background */
  --wcs-semantic-color-foreground-action-tertiary-hover: var(--wcs-primitive-color-bleu-800); /** The layer on top of a tertiary background when hovered */
  --wcs-semantic-color-foreground-action-tertiary-press: var(--wcs-primitive-color-bleu-900); /** The layer on top of a tertiary background when pressed */
  --wcs-semantic-color-foreground-action-critical-default: var(--wcs-primitive-color-neutral-0); /** Default critical foreground color */
  --wcs-semantic-color-foreground-action-critical-hover: var(--wcs-primitive-color-neutral-0); /** Hovered critical foreground color */
  --wcs-semantic-color-foreground-action-critical-press: var(--wcs-primitive-color-neutral-0); /** Pressed critical foreground color */
  --wcs-semantic-color-foreground-action-information-default: var(--wcs-primitive-color-neutral-0); /** Default information foreground color */
  --wcs-semantic-color-foreground-action-information-hover: var(--wcs-primitive-color-neutral-0); /** Hovered information foreground color */
  --wcs-semantic-color-foreground-action-information-press: var(--wcs-primitive-color-neutral-0); /** Pressed information foreground color */
  --wcs-semantic-color-foreground-action-success-default: var(--wcs-primitive-color-neutral-0); /** Default success foreground color */
  --wcs-semantic-color-foreground-action-success-hover: var(--wcs-primitive-color-neutral-0); /** Hovered success foreground color */
  --wcs-semantic-color-foreground-action-success-press: var(--wcs-primitive-color-neutral-0); /** Pressed success foreground color */
  --wcs-semantic-color-foreground-action-warning-default: var(--wcs-primitive-color-neutral-0); /** Default warning foreground color */
  --wcs-semantic-color-foreground-action-warning-hover: var(--wcs-primitive-color-neutral-0); /** Hovered warning foreground color */
  --wcs-semantic-color-foreground-action-warning-press: var(--wcs-primitive-color-neutral-0); /** Pressed warning foreground color */
  --wcs-semantic-color-foreground-control-indicator-selected: var(--wcs-primitive-color-neutral-0); /** Selected foreground color of a form-field indicator: radio, checkbox */
  --wcs-semantic-color-foreground-control-indicator-hover: var(--wcs-primitive-color-neutral-0); /** Hovered foreground color of a form-field indicator: radio, checkbox */
  --wcs-semantic-color-foreground-control-indicator-disabled: var(--wcs-primitive-color-neutral-0); /** Disabled foreground color of a form-field indicator: radio, checkbox */
  --wcs-semantic-color-text-primary: var(--wcs-primitive-color-neutral-800); /** Primary color for text like heading, label */
  --wcs-semantic-color-text-secondary: var(--wcs-primitive-color-neutral-700); /** Secondary color for text like paragraph */
  --wcs-semantic-color-text-tertiary: var(--wcs-primitive-color-neutral-600); /** Tertiary color for text like placeholder */
  --wcs-semantic-color-text-disabled: var(--wcs-primitive-color-neutral-400); /** Disabled color for text */
  --wcs-semantic-color-text-critical: var(--wcs-primitive-color-critical-500); /** Main color to indicate an error state */
  --wcs-semantic-color-text-link-default: var(--wcs-primitive-color-bleu-700); /** Default text color for link */
  --wcs-semantic-color-text-link-hover: var(--wcs-primitive-color-bleu-800); /** Hovered text color for link */
  --wcs-semantic-color-text-link-visited: var(--wcs-primitive-color-bleu-700); /** Visited text color for link */
  --wcs-semantic-color-text-link-disabled: var(--wcs-primitive-color-neutral-400); /** Disabled text color for link */
  --wcs-semantic-color-text-link-inverse: var(--wcs-primitive-color-neutral-0); /** Inverse text color for link */
  --wcs-semantic-color-ripple-action-primary: var(--wcs-primitive-color-neutral-0); /** Ripple applied to an primary action background (on a button, dropdown...) */
  --wcs-semantic-color-ripple-action-secondary: var(--wcs-primitive-color-bleu-700); /** Ripple applied to an secondary action background (on a button, dropdown...) */
  --wcs-semantic-color-ripple-action-tertiary: var(--wcs-primitive-color-bleu-700); /** Ripple applied to an secondary action background (on a button, dropdown...) */
  --wcs-semantic-color-ripple-control: var(--wcs-primitive-color-bleu-700); /** Ripple applied to an control (select) */
  --wcs-semantic-font-size-heading-1: var(--wcs-primitive-font-size-1050); /** Level 1 title heading */
  --wcs-semantic-font-size-heading-2: var(--wcs-primitive-font-size-900); /** Level 2 title heading */
  --wcs-semantic-font-size-heading-3: var(--wcs-primitive-font-size-750); /** Level 3 title heading */
  --wcs-semantic-font-size-heading-4: var(--wcs-primitive-font-size-600); /** Level 4 title heading */
  --wcs-semantic-font-size-heading-5: var(--wcs-primitive-font-size-500); /** Level 5 title heading */
  --wcs-semantic-font-size-heading-6: var(--wcs-primitive-font-size-450); /** Level 6 title heading */
  --wcs-semantic-font-size-body-1: var(--wcs-primitive-font-size-500); /** Body text for introduction or catchphrases */
  --wcs-semantic-font-size-body-2: var(--wcs-primitive-font-size-450); /** Body text only for news, blog for a more comfortable reading */
  --wcs-semantic-font-size-body-3: var(--wcs-primitive-font-size-400); /** Default body text for common paragraphs */
  --wcs-semantic-font-size-label-1: var(--wcs-primitive-font-size-400); /** Text used for buttons, links or other standard-sized actions */
  --wcs-semantic-font-size-label-2: var(--wcs-primitive-font-size-350); /** Text used for buttons, links or other smaller-sized actions */
  --wcs-semantic-font-size-label-3: var(--wcs-primitive-font-size-300); /** Text used for buttons, links or other even-smaller-sized actions */
  --wcs-semantic-font-size-caption-1: var(--wcs-primitive-font-size-400); /** Use for minor mentions, captions or other information */
  --wcs-semantic-font-size-caption-2: var(--wcs-primitive-font-size-350); /** Use for even-minor mentions, captions or other information */
  --wcs-semantic-font-size-caption-3: var(--wcs-primitive-font-size-300); /** Use for even-more-minor mentions, captions or other information */
  --wcs-semantic-font-line-height-base: var(--wcs-primitive-font-line-height-100); /** Base line-height */
  --wcs-semantic-font-line-height-medium: var(--wcs-primitive-font-line-height-120); /** Higher line-height */
  --wcs-semantic-font-line-height-large: var(--wcs-primitive-font-line-height-140); /** Highest line-height */
  --wcs-semantic-font-weight-black: var(--wcs-primitive-font-weight-900); /** Avenir Black font weight */
  --wcs-semantic-font-weight-heavy: var(--wcs-primitive-font-weight-800); /** Avenir Heavy font weight */
  --wcs-semantic-font-weight-medium: var(--wcs-primitive-font-weight-500); /** Avenir Medium font weight */
  --wcs-semantic-font-weight-roman: var(--wcs-primitive-font-weight-400); /** Avenir Roman font weight */
  --wcs-semantic-font-weight-book: var(--wcs-primitive-font-weight-300); /** Avenir Book font weight */
  --wcs-semantic-font-weight-light: var(--wcs-primitive-font-weight-100); /** Avenir Light font weight */
  --wcs-semantic-spacing-small: var(--wcs-primitive-size-40); /** Small spacing */
  --wcs-semantic-spacing-large: var(--wcs-primitive-size-160); /** Large spacing */
  --wcs-semantic-spacing-base-025: var(--wcs-primitive-spacing-2); /** Base spacing x0.25 */
  --wcs-semantic-spacing-base-05: var(--wcs-primitive-spacing-4); /** Base spacing x0.5 */
  --wcs-semantic-spacing-base-150: var(--wcs-primitive-spacing-12); /** Base spacing x1.5 */
  --wcs-semantic-spacing-base-200: var(--wcs-primitive-spacing-16); /** Base spacing x2 */
  --wcs-semantic-spacing-base-250: var(--wcs-primitive-spacing-20); /** Base spacing x2.5 */
  --wcs-semantic-spacing-base-300: var(--wcs-primitive-spacing-24); /** Base spacing x3 */
  --wcs-semantic-spacing-base-400: var(--wcs-primitive-spacing-32); /** Base spacing x4 */
  --wcs-semantic-spacing-base-500: var(--wcs-primitive-spacing-40); /** Base spacing x5 */
  --wcs-semantic-spacing-base-600: var(--wcs-primitive-spacing-48); /** Base spacing x6 */
  --wcs-semantic-spacing-base-700: var(--wcs-primitive-spacing-56); /** Base spacing x7 */
  --wcs-semantic-spacing-base-800: var(--wcs-primitive-spacing-64); /** Base spacing x8 */
  --wcs-semantic-spacing-base-900: var(--wcs-primitive-spacing-72); /** Base spacing x9 */
  --wcs-semantic-spacing-base-1000: var(--wcs-primitive-spacing-80); /** Base spacing x10 */
  --wcs-semantic-spacing-base-1100: var(--wcs-primitive-spacing-88); /** Base spacing x11 */
  --wcs-semantic-spacing-base-1200: var(--wcs-primitive-spacing-96); /** Base spacing x12 */
  --wcs-semantic-motion-duration-feedback-fast: var(--wcs-primitive-duration-50); /** Motion duration for faster feedbacks */
  --wcs-semantic-motion-duration-feedback-base: var(--wcs-primitive-duration-150); /** Motion duration for feedbacks like transitions for moving arrows, transitioning backgrounds */
  --wcs-semantic-motion-duration-feedback-slow: var(--wcs-primitive-duration-200); /** Motion duration for slow feedbacks */
  --wcs-semantic-motion-duration-feedback-slower: var(--wcs-primitive-duration-350); /** Motion duration for slower feedbacks */
  --wcs-semantic-motion-duration-animation-fast: var(--wcs-primitive-duration-1000); /** Motion duration for fast animations like spinner growing mode */
  --wcs-semantic-motion-duration-animation-base: var(--wcs-primitive-duration-1500); /** Motion duration for long animations like spinner, skeleton */
  --wcs-semantic-motion-duration-animation-slow: var(--wcs-primitive-duration-2000); /** Motion duration for slow animations */
  --wcs-semantic-color-border-control-focus: var(--wcs-semantic-color-border-focus-alt); /** Focus border color for control elements like input, select, textarea... */
  --wcs-semantic-color-border-control-indicator-disabled: var(--wcs-semantic-color-border-disabled); /** Disabled border color of a form-field indicator: radio, checkbox */
  --wcs-semantic-color-background-action-secondary-hover: var(--wcs-semantic-color-background-surface-accent-lightest); /** Can be used by secondary elements which must have a hover state (button, dropdown...) */
  --wcs-semantic-color-background-action-secondary-press: var(--wcs-semantic-color-background-surface-accent-lighter); /** Can be used by secondary elements which must have a press state (button, dropdown...) */
  --wcs-semantic-color-background-action-secondary-selected-default: var(--wcs-semantic-color-background-surface-accent-lightest); /** Background of an active secondary action (select option) */
  --wcs-semantic-color-background-action-secondary-selected-hover: var(--wcs-semantic-color-background-surface-accent-lighter); /** Background of a hovered active secondary action (select option) */
  --wcs-semantic-color-background-action-secondary-selected-press: var(--wcs-semantic-color-background-surface-accent-light); /** Background of a pressed (CSS active) secondary action (select option) */
  --wcs-semantic-color-background-action-tertiary-hover: var(--wcs-semantic-color-background-surface-accent-lightest); /** Can be used by tertiary elements which must have a hover state (button, dropdown...) */
  --wcs-semantic-color-background-action-tertiary-press: var(--wcs-semantic-color-background-surface-accent-lighter); /** Can be used by tertiary elements which must have a press state (button, dropdown...) */
  --wcs-semantic-color-background-control-readonly: var(--wcs-semantic-color-background-surface-secondary); /** Readonly background of control like input, select, textarea... */
  --wcs-semantic-color-background-control-indicator-default: var(--wcs-semantic-color-background-surface-secondary); /** Default background color of a form-field indicator: radio, checkbox */
  --wcs-semantic-color-foreground-action-primary-default: var(--wcs-semantic-color-foreground-primary); /** The layer on top of a primary background */
  --wcs-semantic-color-foreground-action-primary-hover: var(--wcs-semantic-color-foreground-primary); /** The layer on top of a primary background when hovered */
  --wcs-semantic-color-foreground-action-primary-press: var(--wcs-semantic-color-foreground-primary); /** The layer on top of a primary background when pressed */
  --wcs-semantic-color-foreground-action-neutral-default: var(--wcs-semantic-color-text-primary); /** Default neutral foreground for elements like dropdown menu item */
  --wcs-semantic-color-foreground-action-neutral-hover: var(--wcs-semantic-color-text-primary); /** Hovered neutral foreground for element like dropdown menu item */
  --wcs-semantic-color-foreground-action-neutral-press: var(--wcs-semantic-color-text-primary); /** Pressed neutral foreground for element like dropdown menu item */
  --wcs-semantic-color-text-link-neutral: var(--wcs-semantic-color-text-primary); /** Active text color for link */
  --wcs-semantic-spacing-base: var(--wcs-semantic-size-base); /** Base spacing, can be used for calculation */
}

/* Components Overrides */
.sncf-groupe wcs-switch {
    --wcs-switch-dot-color-default: var(--wcs-primitive-color-neutral-600);
    --wcs-switch-dot-color-selected: var(--wcs-primitive-color-neutral-0);
    --wcs-switch-dot-color-disabled: var(--wcs-primitive-color-neutral-600);
}

.sncf-groupe wcs-footer {
    --wcs-footer-background-color: var(--wcs-primitive-color-bleu-700);
}

.sncf-groupe wcs-galactic {
    --wcs-galactic-background-color: var(--wcs-primitive-color-bleu-700);
}

.sncf-groupe wcs-galactic-menu {
    --wcs-semantic-color-border-focus-base: var(--wcs-semantic-color-border-focus-base-on-secondary);
}

/* wcs-tooltip */
.sncf-groupe .tippy-box[data-theme~='dark'] {
    --wcs-semantic-color-text-primary: var(--wcs-semantic-color-text-inverse);
    --wcs-semantic-color-border-focus-base: var(--wcs-semantic-color-border-focus-base-on-secondary);
    --wcs-semantic-color-border-focus-alt: var(--wcs-semantic-color-border-focus-alt-on-secondary);
}

.sncf-groupe .wcs-secondary {
    --wcs-semantic-color-background-action-primary-default: var(--wcs-primitive-color-neutral-700);
    --wcs-semantic-color-background-surface-brand: var(--wcs-primitive-color-neutral-700);

    --wcs-semantic-color-foreground-action-primary-default: var(--wcs-primitive-color-neutral-0);
    --wcs-semantic-color-foreground-action-secondary-default: var(--wcs-primitive-color-neutral-700);
    --wcs-semantic-color-foreground-action-tertiary-default: var(--wcs-primitive-color-neutral-700);

    --wcs-semantic-color-border-action-secondary-default: var(--wcs-primitive-color-neutral-700);

    --wcs-semantic-color-ripple-action-primary: var(--wcs-primitive-color-neutral-0);
    --wcs-semantic-color-ripple-action-secondary: var(--wcs-primitive-color-neutral-700);
    --wcs-semantic-color-ripple-action-tertiary: var(--wcs-primitive-color-neutral-700);
}

.sncf-groupe .wcs-success {
    --wcs-semantic-color-background-action-primary-default: var(--wcs-primitive-color-vert-500);
    --wcs-semantic-color-background-surface-brand: var(--wcs-primitive-color-vert-500);

    --wcs-semantic-color-foreground-action-primary-default: var(--wcs-primitive-color-neutral-800);
    --wcs-semantic-color-foreground-action-secondary-default: var(--wcs-primitive-color-vert-500);
    --wcs-semantic-color-foreground-action-tertiary-default: var(--wcs-primitive-color-vert-500);

    --wcs-semantic-color-border-action-secondary-default: var(--wcs-primitive-color-vert-500);

    --wcs-semantic-color-ripple-action-primary: var(--wcs-primitive-color-neutral-800);
    --wcs-semantic-color-ripple-action-secondary: var(--wcs-primitive-color-vert-500);
    --wcs-semantic-color-ripple-action-tertiary: var(--wcs-primitive-color-vert-500);
}

.sncf-groupe .wcs-warning {
    --wcs-semantic-color-background-action-primary-default: var(--wcs-primitive-color-ambre-500);
    --wcs-semantic-color-background-surface-brand: var(--wcs-primitive-color-ambre-500);

    --wcs-semantic-color-foreground-action-primary-default: var(--wcs-primitive-color-neutral-800);
    --wcs-semantic-color-foreground-action-secondary-default: var(--wcs-primitive-color-ambre-500);
    --wcs-semantic-color-foreground-action-tertiary-default: var(--wcs-primitive-color-ambre-500);

    --wcs-semantic-color-border-action-secondary-default: var(--wcs-primitive-color-ambre-500);

    --wcs-semantic-color-ripple-action-primary: var(--wcs-primitive-color-neutral-800);
    --wcs-semantic-color-ripple-action-secondary: var(--wcs-primitive-color-ambre-500);
    --wcs-semantic-color-ripple-action-tertiary: var(--wcs-primitive-color-ambre-500);
}

.sncf-groupe .wcs-info {
    --wcs-semantic-color-background-action-primary-default: var(--wcs-primitive-color-bleu-primaire-400);
    --wcs-semantic-color-background-surface-brand: var(--wcs-primitive-color-bleu-primaire-400);

    --wcs-semantic-color-foreground-action-primary-default: var(--wcs-primitive-color-neutral-0);
    --wcs-semantic-color-foreground-action-secondary-default: var(--wcs-primitive-color-bleu-primaire-400);
    --wcs-semantic-color-foreground-action-tertiary-default: var(--wcs-primitive-color-bleu-primaire-400);

    --wcs-semantic-color-border-action-secondary-default: var(--wcs-primitive-color-bleu-primaire-400);

    --wcs-semantic-color-ripple-action-primary: var(--wcs-primitive-color-neutral-0);
    --wcs-semantic-color-ripple-action-secondary: var(--wcs-primitive-color-bleu-primaire-400);
    --wcs-semantic-color-ripple-action-tertiary: var(--wcs-primitive-color-bleu-primaire-400);
}

.sncf-groupe .wcs-critical {
    --wcs-semantic-color-background-action-primary-default: var(--wcs-primitive-color-rouge-400);
    --wcs-semantic-color-background-surface-brand: var(--wcs-primitive-color-rouge-400);

    --wcs-semantic-color-background-action-neutral-default: var(--wcs-primitive-color-critical-100);
    --wcs-semantic-color-background-action-neutral-hover: var(--wcs-primitive-color-critical-200);
    --wcs-semantic-color-background-action-neutral-press: var(--wcs-primitive-color-critical-300);

    --wcs-semantic-color-foreground-action-neutral-default: var(--wcs-primitive-color-critical-500);
    --wcs-semantic-color-foreground-action-neutral-hover: var(--wcs-primitive-color-critical-500);
    --wcs-semantic-color-foreground-action-neutral-press: var(--wcs-primitive-color-critical-600);

    --wcs-semantic-color-foreground-action-primary-default: var(--wcs-primitive-color-neutral-0);
    --wcs-semantic-color-foreground-action-secondary-default: var(--wcs-primitive-color-rouge-400);
    --wcs-semantic-color-foreground-action-tertiary-default: var(--wcs-primitive-color-rouge-400);

    --wcs-semantic-color-border-action-secondary-default: var(--wcs-primitive-color-rouge-400);

    --wcs-semantic-color-ripple-action-primary: var(--wcs-primitive-color-neutral-0);
    --wcs-semantic-color-ripple-action-secondary: var(--wcs-primitive-color-rouge-400);
    --wcs-semantic-color-ripple-action-tertiary: var(--wcs-primitive-color-rouge-400);
}

/* wcs-danger is deprecated, use wcs-critical instead */
.sncf-groupe .wcs-danger {
    --wcs-semantic-color-background-action-primary-default: var(--wcs-primitive-color-rouge-400);
    --wcs-semantic-color-background-surface-brand: var(--wcs-primitive-color-rouge-400);

    --wcs-semantic-color-foreground-action-primary-default: var(--wcs-primitive-color-neutral-0);
    --wcs-semantic-color-foreground-action-secondary-default: var(--wcs-primitive-color-rouge-400);
    --wcs-semantic-color-foreground-action-tertiary-default: var(--wcs-primitive-color-rouge-400);

    --wcs-semantic-color-border-action-secondary-default: var(--wcs-primitive-color-rouge-400);

    --wcs-semantic-color-ripple-action-primary: var(--wcs-primitive-color-neutral-0);
    --wcs-semantic-color-ripple-action-secondary: var(--wcs-primitive-color-rouge-400);
    --wcs-semantic-color-ripple-action-tertiary: var(--wcs-primitive-color-rouge-400);
}

.sncf-groupe .wcs-dark {
    --wcs-semantic-color-background-action-primary-default: var(--wcs-primitive-color-neutral-700);
    --wcs-semantic-color-background-surface-brand: var(--wcs-primitive-color-neutral-700);

    --wcs-semantic-color-foreground-action-primary-default: var(--wcs-primitive-color-neutral-0);
    --wcs-semantic-color-foreground-action-secondary-default: var(--wcs-primitive-color-neutral-700);
    --wcs-semantic-color-foreground-action-tertiary-default: var(--wcs-primitive-color-neutral-700);

    --wcs-semantic-color-border-action-secondary-default: var(--wcs-primitive-color-neutral-700);

    --wcs-semantic-color-ripple-action-primary: var(--wcs-primitive-color-neutral-0);
    --wcs-semantic-color-ripple-action-secondary: var(--wcs-primitive-color-neutral-700);
    --wcs-semantic-color-ripple-action-tertiary: var(--wcs-primitive-color-neutral-700);
}

.sncf-groupe .wcs-light {
    --wcs-semantic-color-background-action-primary-default: var(--wcs-primitive-color-neutral-200);
    --wcs-semantic-color-background-surface-brand: var(--wcs-primitive-color-neutral-200);
    --wcs-semantic-color-foreground-primary: var(--wcs-primitive-color-neutral-900);

    --wcs-semantic-color-foreground-action-primary-default: var(--wcs-primitive-color-neutral-800);
    --wcs-semantic-color-foreground-action-secondary-default: var(--wcs-primitive-color-neutral-200);
    --wcs-semantic-color-foreground-action-tertiary-default: var(--wcs-primitive-color-neutral-200);

    --wcs-semantic-color-border-action-secondary-default: var(--wcs-primitive-color-neutral-200);

    --wcs-semantic-color-ripple-action-primary: var(--wcs-primitive-color-neutral-800);
    --wcs-semantic-color-ripple-action-secondary: var(--wcs-primitive-color-neutral-200);
    --wcs-semantic-color-ripple-action-tertiary: var(--wcs-primitive-color-neutral-200);
}