progress {
  /* Revert all styles */
  all: revert;
  --progress-width: 100%;
  --progress-height: 1rem;
  --progress-bg: var(--color-neutral-300);
  --progress-color: var(--color-primary);
  --progress-accent-color: var(--progress-color);

  /* This code changes the color of the progress bar. */
  /* The variable names indicate the colors that are used. */
  /* The colors are used in the progress bar. */
  &[value] {

    width: var(--progress-width);
    height: var(--progress-height);
    background-color: var(--progress-bg);
    accent-color: var(--progress-accent-color);


    &::-webkit-progress-value {
      /* Color for Chrome, Safari, and newer Opera */
      background-color: var(--progress-accent-color);
      accent-color: var(--progress-accent-color);

    }

    &::-moz-progress-bar {
      /* Color for Firefox */
      background-color: var(--progress-accent-color);
      accent-color: var(--progress-accent-color)
    }

    /* Styling for the remaining part of the& bar */
    &::-webkit-progress-bar {
      /* Background for Chrome, Safari, and newer Opera */
      background-color: var(--progress-background-color);
      accent-color: var(--progress-accent-color)
    }
  }

  /* If the progress element is busy, remove the revert styles */
  &[aria-busy] {
    // all: revert;
    width: var(--progress-width);
    height: var(--progress-height);
    // height: calc(var(--progress-height) + var(--progress-height));
    accent-color: var(--progress-accent-color);

    &::-webkit-progress-value {
      /* Color for Chrome, Safari, and newer Opera */
      // background-color: var(--progress-accent-color);
      accent-color: var(--progress-accent-color)
    }

    &::-moz-progress-bar {
      // /* Color for Firefox */
      // background-color: var(--progress-bg);
      accent-color: var(--progress-accent-color)
    }

    /* Styling for the remaining part of the& bar */
    &::-webkit-progress-bar {
      /* Background for Chrome, Safari, and newer Opera */
      // background-color: var(--progress-bg);
      accent-color: var(--progress-accent-color)
    }
  }

}
