/* http://meyerweb.com/eric/tools/css/reset/
v2.0 | 20110126
License: none (public domain)
*/
:host {
  --digi--progressbar--margin: 0 0 var(--digi--margin--medium);
  --digi--progressbar--label--font-size: var(--digi--typography--label--font-size--desktop);
  --digi--progressbar--label--margin: var(--digi--gutter--medium) 0;
  --digi--progressbar--border-color: var(--digi--color--divider--primary);
  --digi--progressbar--border-color--active: var(--digi--color--border--sentiment--success);
  --digi--progressbar--border-color--secondary--active: var(--digi--color--border--accent--primary);
  --digi--progressbar--border-width: var(--digi--border-width--primary);
  --digi--progressbar--gap: var(--digi--padding--largest);
  --digi--progressbar--gap--medium: var(--digi--padding--largest);
  --digi--progressbar--gap--large: var(--digi--padding--largest-2);
  --digi--progressbar--gap--x-large: var(--digi--padding--largest-2);
  --digi--progressbar--step--background: var(--digi--color--background--primary);
  --digi--progressbar--step--background--active: var(--digi--color--background--sentiment--success--primary);
  --digi--progressbar--step--background--secondary--active: var(--digi--color--background--interactive--default--primary);
  --digi--progressbar--step--size: var(--digi--global--spacing--base);
  --digi--progressbar--step--size--large: var(--digi--global--spacing--large);
  --digi--progressbar--step--size--active: var(--digi--global--spacing--larger);
  --digi--progressbar--step--size--active--large: var(--digi--global--spacing--largest);
  --digi--progressbar--step--line--width: var(--digi--border-width--primary);
  --digi--progressbar--step--line--color: var(--digi--grayscale--200);
  --digi--progressbar--step--line--color--current: var(--digi--grayscale--200);
  --digi--progressbar--step--line--color--active: var(--digi--color--border--interactive--validation--success);
  --digi--progressbar--step--line--color--secondary--active: var(--digi--color--border--accent--primary);
}
@media (min-width: 61.9375rem) {
  :host {
    --digi--progressbar--step--size: var(--digi--progressbar--step--size--large);
    --digi--progressbar--step--size--active: var(--digi--progressbar--step--size--active--large);
  }
}
:host .digi-progressbar {
  font-size: var(--digi--progressbar--label--font-size);
  margin: var(--digi--progressbar--margin);
}
:host .digi-progressbar--secondary {
  --digi--progressbar--step--background--active: var(--digi--progressbar--step--background--secondary--active);
  --digi--progressbar--border-color--active: var(--digi--progressbar--border-color--secondary--active);
  --digi--progressbar--step--line--color--active: var(--digi--progressbar--step--line--color--secondary--active);
}
:host .digi-progressbar:not(.digi-progressbar--linear) {
  --digi--progressbar--step--line--color--active: var(--digi--progressbar--step--line--color);
}
:host .digi-progressbar__label {
  font-family: var(--digi--global--typography--font-family--default);
  font-size: var(--digi--progressbar--label--font-size);
  line-height: var(--digi--typography--body--line-height--desktop);
  color: var(--digi--color--text--primary);
  margin: var(--digi--progressbar--label--margin);
}
:host .digi-progressbar__list {
  position: relative;
  display: inline-flex;
  list-style: none;
  padding: 0;
  margin: 0;
  display: grid;
  grid-template-columns: repeat(auto-fit, calc(var(--digi--progressbar--step--size) + var(--digi--progressbar--gap)));
}
@media (min-width: 48rem) {
  :host .digi-progressbar__list {
    --digi--progressbar--gap: var(--digi--progressbar--gap--medium);
  }
}
@media (min-width: 61.9375rem) {
  :host .digi-progressbar__list {
    --digi--progressbar--gap: var(--digi--progressbar--gap--large);
  }
}
@media (min-width: 75rem) {
  :host .digi-progressbar__list {
    --digi--progressbar--gap: var(--digi--progressbar--gap--x-large);
  }
}
:host .digi-progressbar__step {
  position: relative;
  height: var(--digi--progressbar--step--size--active);
}
:host .digi-progressbar__step:last-child {
  width: var(--digi--progressbar--step--size--active);
}
:host .digi-progressbar__step:last-child::before {
  display: none;
}
:host .digi-progressbar__step::before {
  content: "";
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  display: inline-block;
  width: 100%;
  border-top: solid var(--digi--progressbar--step--line--width) var(--digi--progressbar--step--line--color);
}
:host .digi-progressbar__step--active {
  --digi--progressbar--border-color: var(--digi--progressbar--border-color--active);
  --digi--progressbar--step--background: var(--digi--progressbar--step--background--active);
  --digi--progressbar--step--size: var(--digi--progressbar--step--size--active);
  --digi--progressbar--step--line--color: var(--digi--progressbar--step--line--color--active);
}
:host .digi-progressbar__step--active .digi-progressbar__step-indicator {
  margin-left: calc((var(--digi--progressbar--step--size--large) - var(--digi--progressbar--step--size--active--large)) / 2);
}
:host .digi-progressbar__step--current {
  --digi--progressbar--step--line--color: var(--digi--progressbar--step--line--color--current);
}
:host .digi-progressbar__step-indicator {
  content: "";
  position: absolute;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  top: 50%;
  transform: translateY(-50%);
  width: var(--digi--progressbar--step--size);
  height: var(--digi--progressbar--step--size);
  border-radius: 50%;
  border: solid var(--digi--progressbar--border-width) var(--digi--progressbar--border-color);
  background: var(--digi--progressbar--step--background);
}
:host .digi-progressbar__step-number {
  border: 0;
  clip: rect(1px, 1px, 1px, 1px);
  -webkit-clip-path: inset(50%);
  clip-path: inset(50%);
  height: 1px;
  margin: -1px;
  overflow: hidden;
  padding: 0;
  position: absolute;
  width: 1px;
  white-space: nowrap;
}