/*
 * Design tokens of the redesign, shared by every redesigned step. Change the look everywhere here.
 *
 * The scope class .wk-sign-v2 sits on the step container, not on body: a multi-signing run can
 * swap a Version 2 waiver's signing step into a page that started as Version 1, so the page cannot
 * decide it once.
 *
 * Accent colors come from the --wk-sign-* custom properties that layouts/print_new.php builds from
 * the waiver's theme color with SigningThemePalette; the fallbacks below apply only without them.
 *
 * Adding a redesigned step:
 * 1. Put wk-sign-v2 on the step container, under the gate the product decided on.
 * 2. Use the shared markup that components.css styles: the .fn-action-container title bar, the
 *    .fn-adult-container card, the .wk-sign-actions buttons, .fn-checkbox.
 * 3. Create web/css/redesign/pages/<step>.css, scoped #<stepId>.wk-sign-v2, with only what that
 *    step alone has.
 * 4. Add a bundle like RedesignSigningAsset (app/assets/) that depends on RedesignAsset, and
 *    register it where the step is rendered.
 * 5. If two steps need a rule, it belongs in components.css.
 */

/* ---------------------------------------------------------------- tokens */

.wk-sign-v2 {
    --ground: #F3F5F4;
    --surface: #FFFFFF;
    --surface-2: #F7F9F8;
    --ink: #20302C;
    --ink-muted: #5B6D67;
    --ink-faint: #8A9994;
    --border: #E1E8E5;
    --border-strong: #CBD6D2;
    --neutral-fill: #E9EEEC;      /* multi-select chips, picked dropdown rows */
    --neutral-fill-hover: #DCE3E0; /* the × buttons' hover */
    --neutral-pick: #F1F4F3;      /* picked dropdown rows (with a check mark) */
    --disabled-bg: #D8DEDC;
    --disabled-ink: #93A19C;
    --danger: #D64545;
    --shadow: 0 1px 2px rgba(32, 48, 44, .04), 0 10px 26px -14px rgba(32, 48, 44, .18);
    --accent: var(--wk-sign-accent, #62c3c2);
    --accent-strong: var(--wk-sign-accent-strong, #2f7c7b);
    --accent-soft: var(--wk-sign-accent-soft, rgba(98, 195, 194, .10));
    --chip-bg: var(--wk-sign-chip-bg, #f0f9f9);
    --chip-border: var(--wk-sign-chip-border, #d8f0f0);
    --on-accent: var(--wk-sign-on-accent, #ffffff);
    --font: 'Public Sans', system-ui, -apple-system, 'Segoe UI', Roboto, sans-serif;
    --mono: 'IBM Plex Mono', ui-monospace, SFMono-Regular, Menlo, monospace;
}