.chartkit-inspector-sources {
    $class: &;

    &__title {
        font-size: var(--g-text-body-3-font-size);
        line-height: var(--g-text-body-3-line-height);
        font-weight: 500;
    }

    &__body {
        &_centered {
            display: flex;
            justify-content: center;
        }
    }

    &__source {
        display: grid;
        grid-template-columns: auto 70px 70px;
        padding: 10px 0;
        align-items: center;
        min-height: 42px;

        &_collapsible {
            grid-template-columns: auto 70px 70px 15px;
            cursor: pointer;

            #{$class}__metric {
                text-align: left;
            }
        }

        &_error {
            grid-template-columns: auto 70px 15px;
        }

        &_collapsed:not(:last-child) {
            border-bottom: 1px solid var(--g-color-line-generic);
        }
    }

    &__metric {
        color: var(--g-color-text-secondary);
        text-align: right;

        &_warning {
            color: var(--g-color-text-warning);
        }

        &#{&}_danger {
            color: var(--g-color-text-danger);
        }
    }

    &__source-expanded {
        border-bottom: 1px solid var(--g-color-line-generic);
    }

    &__source-meta {
        &_centered {
            display: flex;
            justify-content: center;
        }
    }
}
