.ydb-circular-progress-bar {
    display: block;

    max-width: 100%;

    transform: rotate(90deg);

    &__wrapper {
        position: relative;
    }
    &__content {
        position: absolute;
        top: 50%;
        left: 50%;

        overflow: hidden;

        max-width: 100%;

        transform: translate(-50%, -50%);
    }

    &__circle-bg {
        stroke: var(--g-color-base-simple-hover);

        fill: none;
    }

    &__circle {
        fill: none;

        &_status_good {
            stroke: var(--ydb-color-status-green);
        }
        &_status_warning {
            stroke: var(--ydb-color-status-yellow);
        }
        &_status_danger {
            stroke: var(--ydb-color-status-red);
        }
    }
}