/*
*   PROGRESS
*/
.a-progress[data-v-8ddf7380] {
    background: #B3BCCF29 0% 0% no-repeat padding-box;
    max-width:100%;
}
.a-progress .progress-bar[data-v-8ddf7380] {
    border-radius: 0px 8px 8px 0px;
}
.a-progress-lg[data-v-8ddf7380] {
    height: 16px;
}
.a-progress-md[data-v-8ddf7380] {
    height: 12px;
}
.a-progress-smd[data-v-8ddf7380] {
    height: 8px;
}
.a-progress-sm[data-v-8ddf7380] {
    height: 6px;
}
.a-progress-primary[data-v-8ddf7380] {
    background: #6EB4F9 0% 0% no-repeat padding-box;
}
.a-progress-danger[data-v-8ddf7380] {
    background: #f96e6e 0% 0% no-repeat padding-box;
}
.a-progress-success[data-v-8ddf7380] {
    background: #31e89c 0% 0% no-repeat padding-box;
}
.stat-circle[data-v-8ddf7380] {
    position: relative;
}
.stat-circle circle.bg[data-v-8ddf7380] {
    fill: none;
    stroke: #f1f1f1;
    stroke-width: 2;
}
.stat-circle circle.progress[data-v-8ddf7380] {
    fill: none;
    stroke: #2d589d;
    stroke-width: 2;
    stroke-dasharray: 51 51;
    stroke-dashoffset: -51;
    stroke-linecap: round;
}
.stat-circle.completed circle.bg[data-v-8ddf7380] {
    fill: #2d589d;
}
.stat-circle.completed circle.progress[data-v-8ddf7380] {
    fill: #2d589d;
}
.stat-circle.success circle.progress[data-v-8ddf7380] {
    stroke: #2ecc71;
}
.stat-circle.success.completed circle.bg[data-v-8ddf7380] {
    fill: #2ecc71;
}
.stat-circle.success.completed circle.progress[data-v-8ddf7380] {
    fill: #2ecc71;
}
.stat-circle.invalid circle.progress[data-v-8ddf7380] {
    stroke: #e04242;
}
.stat-circle.invalid.completed circle.bg[data-v-8ddf7380] {
    fill: #e04242;
}
.stat-circle.invalid.completed circle.progress[data-v-8ddf7380] {
    fill: #e04242;
}
.stat-circle text[data-v-8ddf7380] {
    font-size: 3px;
    text-anchor: middle;
    fill: #555;
}

/*
*   ADMIN VARIATION
*/
.gui-admin .a-progress[data-v-8ddf7380] {
    background-color: #FFB89C;
    border-radius: 0px 8px 8px 0px;
}
.gui-admin .progress-bar[data-v-8ddf7380] {
    background-color: #C04848;
}

/*
*   End of progress
*/ 


:root {
  --count: 0%;
}
.progress-con {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  margin: 0;
}
.sub-progress-con {
  margin: auto;
  width: 73.25px;
  height: 33.84px;
  border-radius: 20px;
  position: relative;
  border: 1px solid #FFFFFF;
  background-color: white;
  -webkit-transition: 0.3s;
  transition: 0.3s;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-pack: distribute;
      justify-content: space-around;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
}
.sub-progress-con:hover {
  cursor: pointer;
}
.imgClass {
  height: 20px;
  width: 20px;
}
.sub-progress-con::before {
  content: '';
  display: block;
  position: absolute;
  left: -3px;
  top: -3px;
  right: -3px;
  bottom: -3px;
  background-color: #B8D2F1;
  z-index: -100;
  border-radius: 21.5px;
  -webkit-transition: 0.3s;
  transition: 0.3s;
}
.sub-progress-con::after {
  content: '';
  display: block;
  position: absolute;
  left: -3px;
  top: -3px;
  right: -3px;
  bottom: -3px;
  background-color: transparent;
  background-image: conic-gradient(from -60deg, #3E88DA, #3E88DA var(--count), transparent var(--count));
  z-index: -100;
  border-radius: 21.5px;
  -webkit-transition: 0.3s;
  transition: 0.3s;
}


.progress-bar-with-separator {
  position: relative;
  width:200px;
  height: 15px;
  background-color: #f0f0f0;
  /* Add some margin to prevent overflow in case of multiple instances of the component */
  margin-bottom: 10px;
  -webkit-transition: 0.3s;
  transition: 0.3s;
}
.progress-bar-container {
  height: 100%;
  background: #D5E3FC 0% 0% no-repeat padding-box;
}
.progress-bar {
  height: 100%;
  background: transparent linear-gradient(91deg, #7FB0E6 0%, #3E88DA 100%) 0% 0% no-repeat padding-box;
  -webkit-transition: 0.3s;
  transition: 0.3s;
}
.separators {
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  -webkit-transition: 0.3s;
  transition: 0.3s;
}
.separator {
  position: absolute;
  top: 0;
  width: 2px; /* Fixed width for each separator */
  height: 100%;
  background-color: #ffffff;
  -webkit-transition: 0.3s;
  transition: 0.3s;
}


.a-radio label.custom-control-label {
    font-size: 14px;
    font-weight: 400;
    padding-left: 19px;
}