:root{--wf-height:40px;--wf-font-size:14px;--wf-icon-size:20px;--wf-arrow-width:20px;--wf-arrow-border-width:10px;--height-over-two:calc(var(--wf-height) / 2);--wf-step-color-default:#eee;--wf-step-color-default-contrast:#194867;--wf-step-color-complete:green;--wf-step-color-complete-contrast:white;--wf-step-color-active:lightblue;--wf-step-color-active-contrast:black;--wf-step-color-error:#b3374a;--wf-step-complete-icon:"\f023"}ul.esign-wf-steps{position:relative;display:flex;flex-direction:row;margin:0;padding:0;list-style:none}ul.esign-wf-steps>li{display:flex;flex:1;align-items:center;gap:10px;position:relative;height:var(--wf-height);padding-left:calc(var(--wf-arrow-width) + 5px);border-right:10px solid #fff;border-right-width:var(--wf-arrow-border-width);background:var(--wf-step-color-default);color:var(--wf-step-color-default-contrast)}ul.esign-wf-steps>li::after,ul.esign-wf-steps>li::before{content:" ";position:absolute;top:0;border-top:10px solid transparent;border-top-width:var(--height-over-two);border-bottom:10px solid transparent;border-bottom-width:var(--height-over-two);border-left:10px solid #fff;border-left-width:var(--wf-arrow-width)}ul.esign-wf-steps>li::before{z-index:1;left:-3px}ul.esign-wf-steps>li::after{z-index:2;right:calc(calc(var(--wf-arrow-width)*-1) + 1px);border-left-color:var(--wf-step-color-default)}ul.esign-wf-steps>li:first-child{padding-left:5px}ul.esign-wf-steps>li:first-child::before{display:none}ul.esign-wf-steps>li:last-child{border-right-width:0}ul.esign-wf-steps>li:last-child::after{display:none}@media (max-width:639px){ul.esign-wf-steps{flex-direction:column}ul.esign-wf-steps>li{border:0;padding:10px!important}ul.esign-wf-steps>li::after,ul.esign-wf-steps>li::before{display:none}}ul.esign-wf-steps.supervisor>.esign-wf-step.user{background:var(--wf-step-color-complete);color:var(--wf-step-color-complete-contrast)}ul.esign-wf-steps.supervisor>.esign-wf-step.user::after{border-left-color:var(--wf-step-color-complete)}ul.esign-wf-steps.security-manager>.esign-wf-step.supervisor .label::after,ul.esign-wf-steps.security-manager>.esign-wf-step.user .label::after,ul.esign-wf-steps.supervisor>.esign-wf-step.user .label::after{content:var(--wf-step-complete-icon)}ul.esign-wf-steps.supervisor>.esign-wf-step.supervisor{background:var(--wf-step-color-active);color:var(--wf-step-color-active-contrast)}ul.esign-wf-steps.supervisor>.esign-wf-step.supervisor::after{border-left-color:var(--wf-step-color-active)}ul.esign-wf-steps.supervisor>.esign-wf-step.authorized-submitter,ul.esign-wf-steps.supervisor>.esign-wf-step.security-manager{background:var(--wf-step-color-default);color:var(--wf-step-color-default-contrast)}ul.esign-wf-steps.supervisor>.esign-wf-step.authorized-submitter::after,ul.esign-wf-steps.supervisor>.esign-wf-step.security-manager::after{border-left-color:var(--wf-step-color-default)}ul.esign-wf-steps.security-manager>.esign-wf-step.supervisor,ul.esign-wf-steps.security-manager>.esign-wf-step.user{background:var(--wf-step-color-complete);color:var(--wf-step-color-complete-contrast)}ul.esign-wf-steps.security-manager>.esign-wf-step.supervisor::after,ul.esign-wf-steps.security-manager>.esign-wf-step.user::after{border-left-color:var(--wf-step-color-complete)}ul.esign-wf-steps.security-manager>.esign-wf-step.security-manager{background:var(--wf-step-color-active);color:var(--wf-step-color-active-contrast)}ul.esign-wf-steps.security-manager>.esign-wf-step.security-manager::after{border-left-color:var(--wf-step-color-active)}ul.esign-wf-steps.security-manager>.esign-wf-step.authorized-submitter{background:var(--wf-step-color-default);color:var(--wf-step-color-default-contrast)}ul.esign-wf-steps.security-manager>.esign-wf-step.authorized-submitter::after{border-left-color:var(--wf-step-color-default)}ul.esign-wf-steps>li>.wf-step{display:flex;align-items:center;font-size:var(--wf-font-size);line-height:var(--wf-font-size);gap:10px}ul.esign-wf-steps>li>.wf-step .fa{font-size:var(--wf-icon-size)}ul.esign-wf-steps>li>.wf-step .label{font-size:var(--wf-font-size);font-style:italic}ul.esign-wf-steps>li>.wf-step .label:after{font-family:"Font APEX Small"!important;margin-left:4px}ul.esign-wf-steps>li.is-current>.wf-step .fa{font-size:calc(var(--wf-icon-size)*1.5)}ul.esign-wf-steps>li.is-current>.wf-step .label{font-size:calc(var(--wf-font-size)*1.2);font-style:normal;font-weight:700}