[data-element="progress"] .wtps-progress {
  display: flex;
  flex-direction: var(--progressdirection, column);
  gap: var(--progressgap, 12px);
  justify-content: var(--progressjustify, flex-start);
  align-items: var(--progressalign, stretch);
}

[data-element="progress"] .wtps-progress-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  width: 100%;
}

[data-element="progress"] .wtps-progress-title,
[data-element="progress"] .wtps-progress-meta {
  color: var(--progresstextcolor, var(--bodycolortext));
  font-size: var(--progressfontsize, 16px);
  font-weight: var(--progressfontweight, 600);
  line-height: 1.2;
}

[data-element="progress"] .wtps-progress-track {
  position: relative;
  overflow: hidden;
  width: 100%;
  height: var(--progresstrackheight, 16px);
  background: var(--progresstrackbgcolor, rgba(0, 0, 0, 0.12));
  border-radius: var(--progresstrackborderradius, 999px);
}

[data-element="progress"] .wtps-progress-fill {
  position: absolute;
  inset: 0 auto 0 0;
  width: var(--progressvalue, 45%);
  background: var(--progressfillbgcolor, var(--bodycolorprimary));
  border-radius: inherit;
}