.ce-step-by-step-plan {
    --font-size: var(--root-font-size); /* Reset: use REM */
}

.ce-step-by-step-plan__heading {
    --color: var(--root-heading-3-color);
    --font-family: var(--root-heading-3-family);
    --font-size: var(--root-heading-3-size);
    --font-weight: var(--root-heading-3-weight);
    --font-style: var(--root-heading-3-style);
    --line-height: var(--root-heading-3-line-height);
}

.ce-step-by-step-plan__step-header,
.ce-step-by-step-plan__step-body {
    --border-color: #757575;
}

.ce-step-by-step-plan__step-heading {
    --color: var(--root-heading-4-color);
    --font-family: var(--root-heading-4-family);
    --font-size: var(--root-heading-4-size);
    --font-weight: var(--root-heading-4-weight);
    --font-style: var(--root-heading-4-style);
    --line-height: var(--root-heading-4-line-height);
}

.ce-step-by-step-plan__step-marker {
    --color-background: var(--root-color--white);
    --border-color: #757575;
    --color: #757575;
    --font-size: 0.889em;
    --font-family: var(--root-heading-4-family);
    --font-weight: var(--root-heading-4-weight);
    --font-style: var(--root-heading-4-style);
}

.ce-step-by-step-plan__step-marker .icon {
    --color: #757575;
}

.ce-step-by-step-plan__description {
    /*--color: var(--root-color-text);*/
    /*--font-family: inherit;*/
    /*--font-size: 1em;
    /*--font-style: normal;*/
    /*--font-weight: var(--root-font-weight--normal);*/
    /*--line-height: inherit;*/
}

.ce-step-by-step-plan__description a {
    /*--color: var(--root-color-text-link);*/
    /*--font-family: inherit;*/
    /*--font-size: 1em;
    /*--font-style: normal;*/
    /*--font-weight: var(--root-font-weight--normal);*/
    /*--line-height: inherit;*/
}

.ce-step-by-step-plan__description a:active,
.ce-step-by-step-plan__description a:focus,
.ce-step-by-step-plan__description a:hover {
    /*--color: var(--root-color-text-link--hover);*/
}

.ce-step-by-step-plan__text {
    /*--color: var(--root-color-text);*/
    /*--font-family: inherit;*/
    /*--font-size: 1em;
    /*--font-style: normal;*/
    /*--font-weight: var(--root-font-weight--normal);*/
    /*--line-height: inherit;*/
}

.ce-step-by-step-plan__text a {
    /*--color: var(--root-color-text);*/
    /*--font-family: inherit;*/
    /*--font-size: 1em;
    /*--font-style: normal;*/
    /*--font-weight: var(--root-font-weight--normal);*/
    /*--line-height: inherit;*/
}

.ce-step-by-step-plan__text a:active,
.ce-step-by-step-plan__text a:focus,
.ce-step-by-step-plan__text a:hover {
    /*--color: var(--root-color-text-link--hover);*/
}

/* Status next step: active */
.ce-step-by-step-plan__step-next--active .ce-step-by-step-plan__step-header,
.ce-step-by-step-plan__step-next--active .ce-step-by-step-plan__step-body {
    --border-color: var(--root-color--primary);
}

/* Status next step: completed */
.ce-step-by-step-plan__step-next--completed .ce-step-by-step-plan__step-header,
.ce-step-by-step-plan__step-next--completed .ce-step-by-step-plan__step-body {
    --border-color: var(--root-color--primary);
}

/* Appearance: empty */
.ce-step-by-step-plan__step-marker--empty.ce-step-by-step-plan__step-marker {
    --color-background: var(--root-color--white);
}

/* Appearance: number */
.ce-step-by-step-plan__step-marker--number.ce-step-by-step-plan__step-marker {
    --color-background: var(--root-color--white);
}

/* Status: active / Appearance: empty */
.ce-step-by-step-plan__step--active .ce-step-by-step-plan__step-marker--empty.ce-step-by-step-plan__step-marker {
    --color-background: var(--root-color--primary);
    --border-color: var(--root-color--primary);
    --color-inset: var(--root-color--white);
}

/* Status: completed / Appearance: empty */
.ce-step-by-step-plan__step--completed .ce-step-by-step-plan__step-marker--empty.ce-step-by-step-plan__step-marker {
    --color-background: var(--root-color--primary);
    --border-color: var(--root-color--primary);
}

/* Status: active / Appearance: number */
.ce-step-by-step-plan__step--active .ce-step-by-step-plan__step-marker--number.ce-step-by-step-plan__step-marker {
    --color-background: var(--root-color--primary);
    --border-color: var(--root-color--primary);
    --color: var(--root-color--white);
}

/* Status: completed / Appearance: number */
.ce-step-by-step-plan__step--completed .ce-step-by-step-plan__step-marker--number.ce-step-by-step-plan__step-marker {
    --color-background: var(--root-color--green);
    --border-color: var(--root-color--green);
    --color: var(--root-color--white);
}

/* Appearance: error */
.ce-step-by-step-plan__step:not(.ce-step-by-step-plan__step--upcoming) .ce-step-by-step-plan__step-marker--error.ce-step-by-step-plan__step-marker {
    --color-background: var(--root-color--red);
    --border-color: var(--root-color--red);
}

/* Appearance: warning */
.ce-step-by-step-plan__step:not(.ce-step-by-step-plan__step--upcoming) .ce-step-by-step-plan__step-marker--warning.ce-step-by-step-plan__step-marker {
    --color-background: var(--root-color--orange);
    --border-color: var(--root-color--orange);
}

/* Appearance: information */
.ce-step-by-step-plan__step:not(.ce-step-by-step-plan__step--upcoming) .ce-step-by-step-plan__step-marker--information.ce-step-by-step-plan__step-marker {
    --color-background: var(--root-color--blue);
    --border-color: var(--root-color--blue);
}

/* Status: active / Appearance: success */
.ce-step-by-step-plan__step--active .ce-step-by-step-plan__step-marker--success.ce-step-by-step-plan__step-marker {
    --color-background: var(--root-color--primary);
    --border-color: var(--root-color--primary);
}

/* Status: completed / Appearance: success */
.ce-step-by-step-plan__step--completed .ce-step-by-step-plan__step-marker--success.ce-step-by-step-plan__step-marker {
    --color-background: var(--root-color--green);
    --border-color: var(--root-color--green);
}

/* Appearance icon markers */
.ce-step-by-step-plan__step:not(.ce-step-by-step-plan__step--upcoming) .ce-step-by-step-plan__step-marker--error.ce-step-by-step-plan__step-marker .icon,
.ce-step-by-step-plan__step:not(.ce-step-by-step-plan__step--upcoming) .ce-step-by-step-plan__step-marker--warning.ce-step-by-step-plan__step-marker .icon,
.ce-step-by-step-plan__step:not(.ce-step-by-step-plan__step--upcoming) .ce-step-by-step-plan__step-marker--information.ce-step-by-step-plan__step-marker .icon,
.ce-step-by-step-plan__step:not(.ce-step-by-step-plan__step--upcoming) .ce-step-by-step-plan__step-marker--success.ce-step-by-step-plan__step-marker .icon {
    --color: var(--root-color--white);
}

.ce-step-by-step-plan {
}

.ce-step-by-step-plan__list {
    list-style: none;
    padding: 0;
    margin: 1rem 0 0;
}

.ce-step-by-step-plan__step-header,
.ce-step-by-step-plan__step-body {
    margin-left: calc(1rem - (0.125rem / 2));
    padding-left: 2rem;
    border-left-style: solid;
    border-left-width: .125rem;
}

.ce-step-by-step-plan__step-next--upcoming .ce-step-by-step-plan__step-header,
.ce-step-by-step-plan__step-next--upcoming .ce-step-by-step-plan__step-body {
    border-left-style: dashed;
}

.ce-step-by-step-plan__step:last-of-type .ce-step-by-step-plan__step-header,
.ce-step-by-step-plan__step:last-of-type .ce-step-by-step-plan__step-body {
    border-left-color: transparent;
}

.ce-step-by-step-plan__step-header {
    position: relative;
}

.ce-step-by-step-plan__step-marker {
    align-items: center;
    aspect-ratio: 1 / 1;
    border-radius: 999em;
    border-style: solid;
    border-width: 0.125rem;
    box-sizing: border-box;
    display: inline-flex;
    justify-content: center;
    left: calc(-1rem - (0.125rem / 2));
    line-height: 0;
    position: absolute;
    top: 0;
    width: 2rem;
}

.ce-step-by-step-plan__step-marker .icon {
    aspect-ratio: 1 / 1;
    width: 100%;
}

.ce-step-by-step-plan__step-marker--error.ce-step-by-step-plan__step-marker .icon,
.ce-step-by-step-plan__step-marker--information.ce-step-by-step-plan__step-marker .icon {
    width: 80%;
}

.ce-step-by-step-plan__step-marker--success.ce-step-by-step-plan__step-marker .icon {
    width: 60%;
}

.ce-step-by-step-plan__step-marker--warning.ce-step-by-step-plan__step-marker .icon {
    width: 72%;
    margin-top: -0.1875rem;
}

.ce-step-by-step-plan__step-heading {
    margin-top: 0;
}

.ce-step-by-step-plan__step-body {
    padding-bottom: 1rem;
}

.ce-step-by-step-plan__step-description *:first-child {
    margin-top: 0;
}

.ce-step-by-step-plan {
    font-size: var(--font-size, 1rem);
}

.ce-step-by-step-plan__heading {
    color: var(--color, black);
    font-family: var(--font-family, inherit);
    font-size: var(--font-size, 1.3em);
    font-weight: var(--font-weight, bold);
    font-style: var(--font-style, normal);
    line-height: var(--line-height, inherit);
}

.ce-step-by-step-plan__step-header,
.ce-step-by-step-plan__step-body {
    border-color: var(--border-color, #757575);
}

.ce-step-by-step-plan__step-heading {
    color: var(--color, black);
    font-family: var(--font-family, inherit);
    font-size: var(--font-size, 1.3em);
    font-weight: var(--font-weight, bold);
    font-style: var(--font-style, normal);
    line-height: var(--line-height, inherit);
}

.ce-step-by-step-plan__step-marker {
    background-color: var(--color-background, white);
    border-color: var(--border-color, #757575);
    color: var(--color, white);
    font-size: var(--font-size, 0.889em);
    font-family: var(--font-family, inherit);
    font-weight: var(--font-weight, bold);
    font-style: var(--font-style, normal);
}

.ce-step-by-step-plan__step--active .ce-step-by-step-plan__step-marker--empty.ce-step-by-step-plan__step-marker {
    box-shadow: inset 0 0 0 0.125rem var(--color-inset, #ffffff);
}

.ce-step-by-step-plan__step-marker .icon {
    fill: var(--color, #757575);
}

.ce-step-by-step-plan__description {
    color: var(--color, black);
    font-family: var(--font-family, inherit);
    font-size: var(--font-size, 1em);
    font-weight: var(--font-weight, normal);
    font-style: var(--font-style, normal);
    line-height: var(--line-height, inherit);
}

.ce-step-by-step-plan__description a {
    color: var(--color, #022979);
    font-family: var(--font-family, inherit);
    font-size: var(--font-size, inherit);
    font-weight: var(--font-weight, inherit);
    font-style: var(--font-style, inherit);
    line-height: var(--line-height, inherit);
}

.ce-step-by-step-plan__text {
    color: var(--color, black);
    font-family: var(--font-family, inherit);
    font-size: var(--font-size, 1em);
    font-weight: var(--font-weight, normal);
    font-style: var(--font-style, normal);
    line-height: var(--line-height, inherit);
}