/* SPDX-License-Identifier: LGPL-2.1-or-later */
button.progress-wrapper {
  padding: 0;

  /* We need this to ensure the icon will show.
   * This is due to how icons now work in PF6 - should revisit
   * NOTE @Venefilyn: Change CSS behaviour of progress-pie icon to be more like PF6
   */
  .pf-v6-c-button__icon {
    block-size: 100%;
    inline-size: 100%;
  }
}

/* Patternfly doesn't offer a progress pie like feature so we need to create it ourselves
 * NOTE @Venefilyn: This is tracked in PF and should be replaced if they release this as a new feature
 * https://github.com/patternfly/patternfly-design/issues/1390
 */
.progress-pie {
  --progress-fill: var(--pf-t--global--color--brand--default);
  --progress-empty: var(--pf-t--global--color--nonstatus--gray--default);
  /* Width can be set to 100% for a filled circle or to any units, including px */
  --progress-width: 40%;

  aspect-ratio: 1;
  border-radius: 100%;
  block-size: auto;
  /* Set "padding" to xs size (1/2 of sm) */
  inline-size: calc(100% - var(--pf-t--global--spacer--sm));
  line-height: var(--pf-v6-c-button--LineHeight);
  display: inline-block;
  /* FIXME @Venefilyn: Likely can be done better, was middle before but the icon HTML structure
   * changed from PF5 to PF6.
   */
  vertical-align: -1.2em;
  /* Multiply by a float for a bit of anti-aliasing, while preserving 0% and 100% */
  background: conic-gradient(
    var(--progress-fill) var(--progress, 0),
    var(--progress-empty) calc(var(--progress, 0) * 1.005)
  );
  /* Size from the edge, add a px for antialiasing */
  mask-image: radial-gradient(
    circle farthest-side,
    transparent calc(100% - var(--progress-width)),
    black calc(100% - var(--progress-width) + 1px)
  );
}

/* Divider has no margin by default */
.upload-progress {
  margin-block-start: var(--pf-t--global--spacer--md);
  margin-block-end: var(--pf-t--global--spacer--md);
  flex: auto;

  /* Force the progress percentage text to be 4 characters wide so the width
   * doesn't jump when the percentage jumps from 9 => 10
   * TODO: fill PF issue
   */
  .pf-v6-c-progress__measure {
     inline-size: 4ch;
  }
}

.upload-progress-flex {
  .pf-v6-c-progress {
    /* Align % with label and trashcan */
    align-items: start;
  }
}

/* Drop all padding to make the trashcan align with the Popover close button  */
button.cancel-button {
  padding: 0;
}

.conflict-modal-files {
  padding-inline-start: var(--pf-t--global--spacer--md);
  padding-block-start: var(--pf-t--global--spacer--md);
  padding-block-end: var(--pf-t--global--spacer--md);
}

.upload-popover {
  /* Set the max width to 32rem, but have it work on smaller screen sizes too */
  max-inline-size: min(32rem, 100vw - 8rem);

  .pf-v6-c-popover__body {
    /* Set the minimum width to 14rem, but also allow it to work on smaller screen sizes */
    min-inline-size: min(14rem, 33vw);
  }
}

.ct-grey-text {
   color: var(--pf-t--global--text--color--subtle);
}
