.wsf-form ul.wsf-group-tabs {
  border-bottom: var(--wsf-group-ul-border-width) var(--wsf-group-ul-border-style) var(--wsf-group-ul-border-color);
  display: flex;
  flex-direction: row;
  flex-wrap: wrap;
  -webkit-column-gap: var(--wsf-group-li-gap);
          column-gap: var(--wsf-group-li-gap);
  list-style: none;
  margin: 0 0 var(--wsf-form-grid-gap) 0;
  padding: 0;
  position: relative;
}

.wsf-form ul.wsf-group-tabs > li {
  box-sizing: border-box;
  margin-bottom: calc(-1 * var(--wsf-group-ul-border-width));
  outline: none;
  position: relative;
  --wsf-group-li-border: var(--wsf-group-li-border-width) var(--wsf-group-li-border-style) var(--wsf-group-li-border-color);
  --wsf-group-li-border-active: var(--wsf-group-li-border-width) var(--wsf-group-li-border-style) var(--wsf-group-li-border-color-active);
  --wsf-group-li-border-focus: var(--wsf-group-li-border-width) var(--wsf-group-li-border-style) var(--wsf-group-li-border-color-focus);
  --wsf-group-li-border-transparent: var(--wsf-group-li-border-width) var(--wsf-group-li-border-style) transparent;
}

.wsf-form ul.wsf-group-tabs > li > a {
  background-color: var(--wsf-group-li-color-background);
  border-top: var(--wsf-group-li-border);
  border-left: var(--wsf-group-li-border);
  border-right: var(--wsf-group-li-border);
  border-bottom: var(--wsf-group-li-border-transparent);
  border-top-left-radius: var(--wsf-group-li-border-radius);
  border-top-right-radius: var(--wsf-group-li-border-radius);
  box-shadow: none;
  color: var(--wsf-group-li-color);
  cursor: pointer;
  display: block;
  font-family: var(--wsf-group-li-font-family);
  font-size: var(--wsf-group-li-font-size);
  font-style: var(--wsf-group-li-font-style);
  font-weight: var(--wsf-group-li-font-weight);
  letter-spacing: var(--wsf-group-li-letter-spacing);
  line-height: var(--wsf-group-li-line-height);
  padding: var(--wsf-group-li-padding);
  text-align: center;
  -webkit-text-decoration: var(--wsf-group-li-text-decoration);
          text-decoration: var(--wsf-group-li-text-decoration);
  text-transform: var(--wsf-group-li-text-transform);
  white-space: nowrap;
}

.wsf-form ul.wsf-group-tabs > li > a:focus {
  background-color: var(--wsf-group-li-color-background-focus);
  border-top: var(--wsf-group-li-border-focus);
  border-left: var(--wsf-group-li-border-focus);
  border-right: var(--wsf-group-li-border-focus);
  border-bottom: var(--wsf-group-li-border-transparent);
  color: var(--wsf-group-li-color-focus);
  outline: 0;
}

.wsf-form ul.wsf-group-tabs > li > a.wsf-tab-disabled {
  background-color: var(--wsf-group-ul-color-background-disabled);
  border: var(--wsf-group-li-border-width-disabled) var(--wsf-group-li-border-style-disabled) var(--wsf-group-li-border-color-disabled);
  color: var(--wsf-group-li-color-disabled);
  cursor: not-allowed;
  pointer-events: none;
}

.wsf-form ul.wsf-group-tabs > li.wsf-tab-active {
  z-index: 1;
}

.wsf-form ul.wsf-group-tabs > li.wsf-tab-active > a {
  background-color: var(--wsf-group-li-color-background-active);
  border-top: var(--wsf-group-li-border-active);
  border-left: var(--wsf-group-li-border-active);
  border-right: var(--wsf-group-li-border-active);
  border-bottom: var(--wsf-group-li-border-transparent);
  color: var(--wsf-group-li-color-active);
  cursor: default;
}

.wsf-form ul.wsf-group-tabs.wsf-steps {
  border-bottom: none;
  counter-reset: step;
  justify-content: space-between;
  flex-wrap: nowrap;
  z-index: 0;
}

.wsf-form ul.wsf-group-tabs.wsf-steps > li {
  margin-bottom: 0;
  width: 100%;
}

.wsf-form ul.wsf-group-tabs.wsf-steps > li > a {
  border: none !important;
  padding: 0;
}

.wsf-form ul.wsf-group-tabs.wsf-steps > li > a::before {
  background-color: var(--wsf-group-li-steps-color-background-complete);
  border: var(--wsf-group-li-border-width) var(--wsf-group-li-border-style) var(--wsf-group-li-steps-border-color-complete);
  border-radius: 50%;
  content: counter(step);
  counter-increment: step;
  color: var(--wsf-group-li-steps-color-complete);
  display: block;
  font-family: var(--wsf-group-li-steps-font-family);
  font-size: var(--wsf-group-li-steps-font-size);
  font-style: var(--wsf-group-li-steps-font-style);
  font-weight: var(--wsf-group-li-steps-font-weight);
  height: var(--wsf-group-li-steps-size);
  letter-spacing: var(--wsf-group-li-steps-letter-spacing);
  line-height: var(--wsf-group-li-steps-size);
  margin: 0 auto var(--wsf-field-padding-horizontal);
  text-align: center;
  -webkit-text-decoration: var(--wsf-group-li-steps-text-decoration);
          text-decoration: var(--wsf-group-li-steps-text-decoration);
  -webkit-text-size-adjust: 100%;
     -moz-text-size-adjust: 100%;
      -ms-text-size-adjust: 100%;
          text-size-adjust: 100%;
  text-transform: var(--wsf-group-li-steps-text-transform);
  width: var(--wsf-group-li-steps-size);
}

.wsf-form ul.wsf-group-tabs.wsf-steps > li > a::after {
  background-color: var(--wsf-group-li-steps-border-color-complete);
  content: '';
  height: var(--wsf-group-li-border-width);
  left: -50%;
  position: absolute;
  top: calc(var(--wsf-group-li-steps-size) / 2);
  width: 100%;
  z-index: -2;
}

.wsf-form ul.wsf-group-tabs.wsf-steps > li > a:not(.wsf-tab-disabled):focus::before {
  border-color: var(--wsf-field-border-color-focus);
  box-shadow: var(--wsf-field-box-shadow);
}

.wsf-form ul.wsf-group-tabs.wsf-steps > li:first-child > a::after {
  content: none;
}

.wsf-form ul.wsf-group-tabs.wsf-steps > li > a.wsf-tab-disabled:before,
.wsf-form ul.wsf-group-tabs.wsf-steps > li.wsf-tab-active ~ li > a.wsf-tab-disabled::before {
  color: var(--wsf-group-li-color-disabled);
  cursor: not-allowed;
  pointer-events: none;
}

.wsf-form ul.wsf-group-tabs.wsf-steps > li.wsf-tab-active {
  z-index: -1;
}

.wsf-form ul.wsf-group-tabs.wsf-steps > li.wsf-tab-active > a {
  background-color: transparent;
}

.wsf-form ul.wsf-group-tabs.wsf-steps > li.wsf-tab-active > a::before {
  background-color: var(--wsf-group-li-steps-color-background-active);
  border: var(--wsf-group-li-border-width) var(--wsf-group-li-border-style) var(--wsf-group-li-steps-border-color-active);
  color: var(--wsf-group-li-steps-color-active);
}

.wsf-form ul.wsf-group-tabs.wsf-steps > li.wsf-tab-active ~ li > a::before {
  background-color: var(--wsf-group-li-steps-color-background);
  border: var(--wsf-group-li-border-width) var(--wsf-group-li-border-style) var(--wsf-group-li-steps-border-color);
  color: var(--wsf-group-li-steps-color);
}

.wsf-form ul.wsf-group-tabs.wsf-steps > li.wsf-tab-active ~ li > a::after {
  background-color: var(--wsf-group-li-steps-border-color);
}

.wsf-form ul.wsf-group-tabs.wsf-steps.wsf-steps-success > li > a::before {
  background-color: var(--wsf-form-color-success);
  border: var(--wsf-group-li-border-width) var(--wsf-group-li-border-style) var(--wsf-form-color-succecss);
  color: #fff;
}

.wsf-form ul.wsf-group-tabs.wsf-steps.wsf-steps-success > li > a::after {
  background-color: var(--wsf-form-color-success);
}

.wsf-form ul.wsf-group-tabs.wsf-steps.wsf-steps-success > li > a:not(.wsf-tab-disabled):focus:before {
  border-color: var(--wsf-form-color-success);
  box-shadow: var(--wsf-field-box-shadow);
}

.wsf-form ul.wsf-group-tabs.wsf-steps.wsf-steps-success > li > a > li.wsf-tab-active > a::before {
  color: var(--wsf-form-color-success);
}

.wsf-form ul.wsf-group-tabs.wsf-steps.wsf-steps-no-label > li > a > span {
  display: none;
}

.wsf-form ul.wsf-group-tabs.wsf-steps.wsf-steps-checks > li > a::before {
  content: '\2713';
}

.wsf-form ul.wsf-group-tabs.wsf-steps.wsf-steps-checks > li.wsf-tab-active > a::before {
  content: counter(step);
}

.wsf-form ul.wsf-group-tabs.wsf-steps.wsf-steps-checks > li.wsf-tab-active ~ li > a::before {
  content: counter(step);
}

.wsf-form ul.wsf-group-tabs.wsf-sticky {
  align-self: flex-start;
  background-color: var(--wsf-form-color-background);
  height: auto;
  margin-top: calc(-1 * var(--wsf-form-grid-gap));
  padding-top: var(--wsf-form-grid-gap);
  position: -webkit-sticky;
  position: sticky;
  top: 0;
  z-index: 2;
}

.wsf-form ul.wsf-group-tabs.wsf-sticky.wsf-steps {
  margin-bottom: 0;
  padding-bottom: var(--wsf-form-grid-gap);
}

.wsf-form.wsf-vertical {
  display: flex;
}

.wsf-form.wsf-vertical ul.wsf-group-tabs {
  border-bottom: none;
  -webkit-border-end: var(--wsf-group-li-border-width) var(--wsf-group-li-border-style) var(--wsf-group-li-border-color);
  border-inline-end: var(--wsf-group-li-border-width) var(--wsf-group-li-border-style) var(--wsf-group-li-border-color);
  flex-direction: column;
  -webkit-margin-end: var(--wsf-form-grid-gap);
  margin-inline-end: var(--wsf-form-grid-gap);
}

.wsf-form.wsf-vertical ul.wsf-group-tabs.wsf-steps {
  -webkit-border-end: none;
  border-inline-end: none;
  justify-content: flex-start;
}

.wsf-form.wsf-vertical ul.wsf-group-tabs.wsf-steps > li {
  margin-bottom: var(--wsf-form-grid-gap);
  -webkit-margin-end: 0;
  margin-inline-end: 0;
}

.wsf-form.wsf-vertical ul.wsf-group-tabs.wsf-steps > li > a {
  border: none;
  text-align: left;
}

.wsf-form.wsf-vertical ul.wsf-group-tabs.wsf-steps > li > a::before {
  display: inline-block;
  margin-bottom: 0;
  -webkit-margin-end: var(--wsf-field-padding-horizontal);
  margin-inline-end: var(--wsf-field-padding-horizontal);
}

.wsf-form.wsf-vertical ul.wsf-group-tabs.wsf-steps > li > a::after {
  height: 100%;
  left: calc(var(--wsf-group-li-steps-size) / 2);
  top: -50%;
  width: var(--wsf-group-li-border-width);
}

.wsf-form.wsf-vertical ul.wsf-group-tabs.wsf-steps > li.wsf-tab-active > a {
  border: none;
}

.wsf-form.wsf-vertical ul.wsf-group-tabs > li {
  margin-bottom: 0;
  -webkit-margin-end: calc(-1 * var(--wsf-group-li-border-width));
  margin-inline-end: calc(-1 * var(--wsf-group-li-border-width));
}

.wsf-form.wsf-vertical ul.wsf-group-tabs > li > a {
  border: var(--wsf-group-li-border-width) var(--wsf-group-li-border-style) var(--wsf-group-li-border-color);
  border-top-left-radius: var(--wsf-group-li-border-radius);
  border-top-right-radius: 0;
  border-bottom-left-radius: var(--wsf-group-li-border-radius);
}

.wsf-form.wsf-vertical ul.wsf-group-tabs > li > a:focus {
  border: var(--wsf-group-li-border-width) var(--wsf-group-li-border-style) var(--wsf-group-li-border-color-focus);
  outline: 0;
}

.wsf-form.wsf-vertical ul.wsf-group-tabs > li > a::after {
  background-color: var(--wsf-group-li-border-color);
  content: '';
  height: var(--wsf-group-step-width);
  left: -50%;
  position: absolute;
  top: var(--wsf-group-step-gap);
  width: 100%;
  z-index: -2;
}

.wsf-form.wsf-vertical ul.wsf-group-tabs > li.wsf-tab-active > a {
  border: var(--wsf-group-li-border-width) var(--wsf-group-li-border-style) var(--wsf-group-li-border-color-active);
  -webkit-border-end-color: transparent;
  border-inline-end-color: transparent;
}

.wsf-form.wsf-vertical .wsf-groups {
  width: 100%;
}

.wsf-form.wsf-vertical.wsf-sticky {
  margin-top: 0;
  padding-top: 0;
}

.wsf-form.wsf-vertical.wsf-sticky.wsf-steps {
  margin-top: calc(-1 * var(--wsf-form-grid-gap));
  padding-top: var(--wsf-form-grid-gap);
}

.wsf-form.wsf-vertical.wsf-sticky.wsf-steps > li > a:last-child {
  margin-bottom: 0;
}

.wsf-form ul.wsf-group-tabs > li > a {
  transition: background-color var(--wsf-form-transition), border-color var(--wsf-form-transition);
}

.wsf-form ul.wsf-group-tabs.wsf-steps > li > a::before {
  transition: background-color var(--wsf-form-transition), border-color var(--wsf-form-transition), box-shadow var(--wsf-form-transition), color var(--wsf-form-transition);
}

.wsf-form ul.wsf-group-tabs.wsf-steps > li > a::after {
  transition: background-color var(--wsf-form-transition);
}

.wsf-form.wsf-rtl.wsf-vertical ul.wsf-group-tabs > li > a {
  border-top-left-radius: 0;
  border-top-right-radius: var(--wsf-field-border-radius);
  border-bottom-left-radius: 0;
  border-bottom-right-radius: var(--wsf-field-border-radius);
}

.wsf-form.wsf-rtl.wsf-vertical ul.wsf-group-tabs .wsf-steps > li > a {
  text-align: right;
}

.wsf-form.wsf-rtl.wsf-vertical ul.wsf-group-tabs .wsf-steps > li > a :after {
  left: auto;
  right: calc(var(--wsf-group-step-gap) / 2);
}

.wsf-form.wsf-rtl ul.wsf-group-tabs.wsf-steps > li > a::after {
  left: auto;
  right: -50%;
}

html.wsf-styler-scheme-alt .wsf-form[data-wsf-style-has-alt] ul.wsf-group-tabs {
  border-bottom: var(--wsf-group-ul-border-width) var(--wsf-group-ul-border-style) var(--wsf-group-ul-border-color-alt);
}

html.wsf-styler-scheme-alt .wsf-form[data-wsf-style-has-alt] ul.wsf-group-tabs > li {
  --wsf-group-li-border-alt: var(--wsf-group-li-border-width) var(--wsf-group-li-border-style) var(--wsf-group-li-border-color-alt);
  --wsf-group-li-border-focus-alt: var(--wsf-group-li-border-width) var(--wsf-group-li-border-style) var(--wsf-group-li-border-color-focus-alt);
  --wsf-group-li-border-active-alt: var(--wsf-group-li-border-width) var(--wsf-group-li-border-style) var(--wsf-group-li-border-color-active-alt);
}

html.wsf-styler-scheme-alt .wsf-form[data-wsf-style-has-alt] ul.wsf-group-tabs > li > a {
  background-color: var(--wsf-group-li-color-background-alt);
  border-top: var(--wsf-group-li-border-alt);
  border-left: var(--wsf-group-li-border-alt);
  border-right: var(--wsf-group-li-border-alt);
  color: var(--wsf-group-li-color-alt);
}

html.wsf-styler-scheme-alt .wsf-form[data-wsf-style-has-alt] ul.wsf-group-tabs > li > a:focus {
  background-color: var(--wsf-group-li-color-background-focus-alt);
  border-top: var(--wsf-group-li-border-focus-alt);
  border-left: var(--wsf-group-li-border-focus-alt);
  border-right: var(--wsf-group-li-border-focus-alt);
  color: var(--wsf-group-li-color-focus-alt);
}

html.wsf-styler-scheme-alt .wsf-form[data-wsf-style-has-alt] ul.wsf-group-tabs > li > a.wsf-tab-disabled {
  background-color: var(--wsf-group-ul-color-background-disabled-alt);
  border: var(--wsf-group-li-border-width-disabled) var(--wsf-group-li-border-style-disabled) var(--wsf-group-li-border-color-disabled-alt);
  color: var(--wsf-group-li-color-disabled-alt);
}

html.wsf-styler-scheme-alt .wsf-form[data-wsf-style-has-alt] ul.wsf-group-tabs > li.wsf-tab-active > a {
  background-color: var(--wsf-group-li-color-background-active-alt);
  border-top: var(--wsf-group-li-border-active-alt);
  border-left: var(--wsf-group-li-border-active-alt);
  border-right: var(--wsf-group-li-border-active-alt);
  color: var(--wsf-group-li-color-active-alt);
}

html.wsf-styler-scheme-alt .wsf-form[data-wsf-style-has-alt] ul.wsf-group-tabs.wsf-steps > li > a::before {
  background-color: var(--wsf-group-li-steps-color-background-complete-alt);
  border: var(--wsf-group-li-border-width) var(--wsf-group-li-border-style) var(--wsf-group-li-steps-border-color-complete-alt);
  color: var(--wsf-group-li-steps-color-complete-alt);
}

html.wsf-styler-scheme-alt .wsf-form[data-wsf-style-has-alt] ul.wsf-group-tabs.wsf-steps > li > a::after {
  background-color: var(--wsf-group-li-steps-border-color-complete-alt);
}

html.wsf-styler-scheme-alt .wsf-form[data-wsf-style-has-alt] ul.wsf-group-tabs.wsf-steps > li > a:not(.wsf-tab-disabled):focus::before {
  border-color: var(--wsf-field-border-color-focus-alt);
}

html.wsf-styler-scheme-alt .wsf-form[data-wsf-style-has-alt] ul.wsf-group-tabs.wsf-steps > li:first-child > a::after {
  content: none;
}

html.wsf-styler-scheme-alt .wsf-form[data-wsf-style-has-alt] ul.wsf-group-tabs.wsf-steps > li > a.wsf-tab-disabled:before,
html.wsf-styler-scheme-alt .wsf-form[data-wsf-style-has-alt] ul.wsf-group-tabs.wsf-steps > li.wsf-tab-active ~ li > a.wsf-tab-disabled::before {
  color: var(--wsf-group-li-color-disabled-alt);
}

html.wsf-styler-scheme-alt .wsf-form[data-wsf-style-has-alt] ul.wsf-group-tabs.wsf-steps > li.wsf-tab-active {
  z-index: -1;
}

html.wsf-styler-scheme-alt .wsf-form[data-wsf-style-has-alt] ul.wsf-group-tabs.wsf-steps > li.wsf-tab-active > a {
  background-color: transparent;
}

html.wsf-styler-scheme-alt .wsf-form[data-wsf-style-has-alt] ul.wsf-group-tabs.wsf-steps > li.wsf-tab-active > a::before {
  background-color: var(--wsf-group-li-steps-color-background-active-alt);
  border: var(--wsf-group-li-border-width) var(--wsf-group-li-border-style) var(--wsf-group-li-steps-border-color-active-alt);
  color: var(--wsf-group-li-steps-color-active-alt);
}

html.wsf-styler-scheme-alt .wsf-form[data-wsf-style-has-alt] ul.wsf-group-tabs.wsf-steps > li.wsf-tab-active ~ li > a::before {
  background-color: var(--wsf-group-li-steps-color-background-alt);
  border: var(--wsf-group-li-border-width) var(--wsf-group-li-border-style) var(--wsf-group-li-steps-border-color-alt);
  color: var(--wsf-group-li-steps-color-alt);
}

html.wsf-styler-scheme-alt .wsf-form[data-wsf-style-has-alt] ul.wsf-group-tabs.wsf-steps > li.wsf-tab-active ~ li > a::after {
  background-color: var(--wsf-group-li-steps-border-color-alt);
}

html.wsf-styler-scheme-alt .wsf-form[data-wsf-style-has-alt] ul.wsf-group-tabs.wsf-steps.wsf-steps-success > li > a::before {
  background-color: var(--wsf-form-color-success-alt);
  border: var(--wsf-group-li-border-width) var(--wsf-group-li-border-style) var(--wsf-form-color-succecss-alt);
  color: #fff;
}

html.wsf-styler-scheme-alt .wsf-form[data-wsf-style-has-alt] ul.wsf-group-tabs.wsf-steps.wsf-steps-success > li > a::after {
  background-color: var(--wsf-form-color-success-alt);
}

html.wsf-styler-scheme-alt .wsf-form[data-wsf-style-has-alt] ul.wsf-group-tabs.wsf-steps.wsf-steps-success > li > a:not(.wsf-tab-disabled):focus:before {
  border-color: var(--wsf-form-color-success-alt);
}

html.wsf-styler-scheme-alt .wsf-form[data-wsf-style-has-alt] ul.wsf-group-tabs.wsf-steps.wsf-steps-success > li > a > li.wsf-tab-active > a::before {
  color: var(--wsf-form-color-success-alt);
}

html.wsf-styler-scheme-alt .wsf-form[data-wsf-style-has-alt] ul.wsf-group-tabs.wsf-sticky {
  background-color: var(--wsf-form-color-background-alt);
}

html.wsf-styler-scheme-alt .wsf-form[data-wsf-style-has-alt].wsf-vertical ul.wsf-group-tabs {
  -webkit-border-end: var(--wsf-group-li-border-width) var(--wsf-group-li-border-style) var(--wsf-group-li-border-color-alt);
  border-inline-end: var(--wsf-group-li-border-width) var(--wsf-group-li-border-style) var(--wsf-group-li-border-color-alt);
}

html.wsf-styler-scheme-alt .wsf-form[data-wsf-style-has-alt].wsf-vertical ul.wsf-group-tabs > li > a {
  border: var(--wsf-group-li-border-width) var(--wsf-group-li-border-style) var(--wsf-group-li-border-color-alt);
}

html.wsf-styler-scheme-alt .wsf-form[data-wsf-style-has-alt].wsf-vertical ul.wsf-group-tabs > li > a:focus {
  border: var(--wsf-group-li-border-width) var(--wsf-group-li-border-style) var(--wsf-group-li-border-color-focus-alt);
}

html.wsf-styler-scheme-alt .wsf-form[data-wsf-style-has-alt].wsf-vertical ul.wsf-group-tabs > li > a::after {
  background-color: var(--wsf-group-li-border-color-alt);
}

html.wsf-styler-scheme-alt .wsf-form[data-wsf-style-has-alt].wsf-vertical ul.wsf-group-tabs > li.wsf-tab-active > a {
  border: var(--wsf-group-li-border-width) var(--wsf-group-li-border-style) var(--wsf-group-li-border-color-active-alt);
}
