.status-container {
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    margin-top: 50%;
}

.progress-bar::-webkit-slider-thumb {
    -webkit-appearance: none;
    appearance: none;
    width: 0;
    height: 0;
    background: transparent;
    cursor: default;
    margin-top: 0; 
}

.progress-bar::-moz-range-thumb {
    width: 0;
    height: 0;
    background: transparent;
    border: none;
}

.progress-bar::-ms-thumb {
    width: 0;
    height: 0;
    background: transparent;
    border: none;
    cursor: default;
}

.progress-bar {
    -webkit-appearance: none;
    width: 70%;
    height: 20px;
    background: #ddd;
    border-radius: 10px;
}


/* circle progress bar */

.progress-ring__bg {
  fill: none;
  stroke: #ddd;
  stroke-width: 14;
}

.progress-ring__progress {
  fill: none;
  stroke: #463b2b;         /* progress color */
  stroke-width: 14;
  stroke-linecap: round;
  transform: rotate(-90deg);
  transform-origin: 50% 50%;
  stroke-dasharray: 503;   /* circumference (2πr) */
  stroke-dashoffset: 503;  /* starts empty */
  transition: stroke-dashoffset 0.5s ease;
}


#progress-text {
    font-size: 24px;
    font-weight: 700;
    fill: #463b2b; /* coffee color */
}


.ok-btn {
    display: block;
    width: 80%;
    margin: 40px auto;
    background: #222;
    color: white;
    padding: 12px;
    border-radius: 10px;
    font-size: 16px;
    font-weight: 600;
    border: none;
    cursor: pointer;
    text-align: center;
    visibility: hidden;
    text-decoration: none;
}