@import "app/styles/variables";

bl-job-progress-status {
    display: block;
    padding-top: 5px;

    .running-task-status {
        display: flex;
    }

    .running {
        height: 130px;
    }

    .queued, .completed {
        text-align: center;
        .value {
            font-size: 16px;
        }

        .label {
            color: $secondary-text;
        }
    }

    .queued {
        margin: 66px 10px 0;
    }

    .completed {
        margin: 32px 10px 0;

        > .succeeded {
            color: $success-color;
            margin-bottom: 20px;
        }

        > .failed {
            color: $danger-color;
        }
    }

    bl-gauge {
        margin: 0 10px;
    }

    .toggle-job-pool-tasks {
        margin: 0 10px;
        display: flex;
        font-size: 12px;
        justify-content: space-between;

        > .option {
            cursor: pointer;

            &.active {
                color: $primary-color;
                font-weight: bold;
            }
        }
    }

    .progress-container {
        height: 18px;

        > .progress {
            margin: 0 10px;
            display: flex;
            align-items: center;

            > .progress-bar {
                flex: 1;
            }

            > .progress-label {
                margin-left: 10px;
                color: $primary-text;
            }
        }
    }
    .warning-container {
        height: 10px;
        .unaccurate-data {
            color: $warn-color;
            text-align: center;
            .fa {
                color: $warn-color;
                margin-right: 5px;
            }
        }
    }
}
