.loading-progress {
  position: relative;
  display: block;
  width: 8rem;
  height: 8rem;
  margin: 20vh auto 1rem auto;
}

  .loading-progress circle {
    fill: none;
    stroke: #e0e0e0;
    stroke-width: 0.6rem;
    transform-origin: 50% 50%;
    transform: rotate(-90deg);
  }

    .loading-progress circle:last-child {
      stroke: #1b6ec2;
      stroke-dasharray: calc(3.141 * var(--blazor-load-percentage, 0%) * 0.8), 500%;
      transition: stroke-dasharray 0.05s ease-in-out;
    }

.loading-progress-text {
  position: absolute;
  text-align: center;
  font-weight: bold;
  inset: calc(20vh + 3.25rem) 0 auto 0.2rem;
}

  .loading-progress-text:after {
    content: var(--blazor-load-percentage-text, "Loading");
  }

.debit-card-accepted-label {
    line-height: 40px;
}

.debit-card-image-wrapper {
  height: 40px;
  width: 40px;
  position: relative;
  display: inline-block;
}

  .debit-card-image-wrapper .debit-card-image {
    background-position: center center;
    width: 100%;
    height: 100%;
    position: absolute;
    background-repeat: no-repeat;
    background-size: cover;
  }


/*Over-ridden MudBlazor styles*/
.mud-expand-panel-header {
  font-weight: bold;
  font-size: 1rem;
}

.row-clickable-data-grid .mud-table-root .mud-table-cell {
  cursor: pointer;
}

  .row-clickable-data-grid .mud-table-cell .mud-table .mud-table-cell {
      cursor: default;
  }

.dark-overlay .mud-overlay-scrim.mud-overlay-dark {
  background-color: rgba(0, 0, 0, 0.78039);
}

.dark-overlay .mud-progress-circular-circle.mud-progress-indeterminate {
    color: white;
}

.dark-overlay h5, .dark-overlay h6 {
  color: white;
}

@media (max-width: 600px) {
  .mud-xs-table .mud-table-root .mud-table-foot {
    display: table-footer-group;
  }
  .mud-main-content {
      padding-top: 0;
  }
}

/* Pay wizard overridden styles */
#terms-of-service-wrapper.d-flex.animation {
  display: grid !important;
  grid-template-columns: auto 1fr; /* checkbox + paragraph */
  grid-template-rows: auto; /* first row = checkbox+text, second row = helper */
  column-gap: 0.5rem;
  justify-content: start; /* align left */
}

  /* Make the wrapper transparent to the grid */
  #terms-of-service-wrapper.d-flex.animation > .mud-input-control {
    display: contents;
  }

  /* Checkbox cell - in column 1 */
  #terms-of-service-wrapper.d-flex.animation > .mud-input-control-input-container {
    grid-column: 1;
    grid-row: 1;
    display: flex;
    align-items: center;
  }

  /* Paragraph cell - in column 2*/
  #terms-of-service-wrapper.d-flex.animation > p {
    grid-column: 2;
    grid-row: 1;
    margin: 0;
    align-self: center;
  }

  /* Helper text - full width, on row 2 */
  #terms-of-service-wrapper.d-flex.animation .mud-input-control-helper-container {
    grid-column: 1 / span 2; /* span both columns */
    grid-row: 2;
    margin-top: 0.25rem;
    padding-left: 14px;
  }