@import url("https://fonts.googleapis.com/css2?family=Odibee+Sans&display=swap");

*,
*:after,
*:before {
  box-sizing: border-box;
  /*font-family: "Odibee Sans", cursive;*/
}

#appASPT_AMB, #appASPT_PAT, #appACPT {
  height: 100%;
  display: flex;
  align-items: center;
  justify-content: center; /* Alinha o conteúdo horizontalmente ao centro */
}

.small {
  width: 5rem;
  height: 5rem;
  font-size: 1.2rem;
}

.medium {
  width: 7rem;
  height: 7rem;
  font-size: 1.6rem;
}

.large {
  width: 9rem;
  height: 9rem;
  font-size: 1.8rem;
}

.progress {
  position: relative;
  display: flex;
  align-items: center;
  justify-content: center; /* Centraliza o círculo */
  background-color: #f8f9fa;
}
.progress svg {
  height: inherit;
  width: inherit;
}
.progress .progress__back {
  position: absolute;
  top: 0;
  left: 0;
}
.progress .progress__front {
  position: absolute;
  top: 0;
  left: 0;
  transform: rotate(-90deg);
}
.progress .progress__front circle {
  fill: none;
  stroke-dasharray: 283;
}
.progress .progress__value {
  position: absolute; /* Certifica-se de que o valor esteja centralizado no círculo */
  font-size: inherit;
  pointer-events: none;
  z-index: 2;
  transform: translate(-50%, -50%); /* Centraliza o texto */
  top: 50%;
  left: 50%;
}